Whisper Bank
A UX approach to the mobile app design
Project background
This is a design challenge that I completed for a job interview in 2019. The design requirement is as follows:
Whisper Bank is a (fictional) new retail bank. Its business plan is focused on Millennials, who are not afraid to completely rethink how banking is presented or what banking services are offered to customers. They believe a technology-based, rather than branch-based, offering is the future. This task was to create some initial ideas for the mobile banking app that Millennials would like to have in their pocket.
I adopt an UX design process to identify user needs and evaluate designs. The deliverables include a number of wireframes to demonstrate the major user flow in the app and high-fidelity UI mockups to create the brand image.
Design process
Empathise with millennials
To design a mobile app that can effectively engage the intended audience, I asked myself some questions about the intended user. For instance, what are millennial users’ app usage tendencies? What banking needs do they have? I did some research online to help me better understand millennials’ banking needs and the way they use a mobile app.
According to several studies, millennials are a mobile-first generation (see reports by Nielsen Norman Group1 and PayKey2). They desire greater efficiency and enjoy using social media. They use their phones for most of their daily activities, including financial management (see statistics from Statista3 and comScore4). Furthermore, they rely on mobile apps to make transactions and keep track of their expenses.
After learning what millennials anticipate in the use of a mobile app, I generated two lightweight personas (see below) to represent my findings of identified characteristics and expectations of the millennial generation in their mobile banking experience.
Charlie
22 years old, jobseeker
Charlie has recently finished his undergraduate studies in performing arts and intends to develop a career in the creative industry. As he is currently looking for a job, he has to maintain a strict budget. Sometimes, when he fails at keeping it, he borrows money from friends. He uses a mobile banking app and likes an app with easy and fast access. As a person on a tight budget, he often uses his bank app to check the account and send borrowed money back to his friends.
Anna
28 years old, with a stable income
Anna is a digital marketing specialist and likes to go out with her friends on weekends. She also enjoys photographing new places and often shares photos to Instagram showcasing what she discovers. She is now planning to buy a used car next year and has started saving money for her next summer holiday. Furthermore, she is willing to save money by finding great deals and participating in loyalty programs. She wants to enjoy life, but needs options that don’t break the bank.
Research
To better understand industrial standards and existing solutions, I reviewed my banking apps and a number of financial management apps on Google Play. I identified patterns and features in those apps, and read their app reviews.
List of common mobile banking app design features
- 5Account overview, management, and transaction history
- 5Pay to an account
- 5Get cash from nearby ATMs
- 5Fingerprint or passcode log in
- 5Products and service information
- 5Help and support
- 5Alerts and notifications
- 5Setting
Ideation
To design an experience that Charlie and Anna would benefit from using Whisper Bank app, I came up with some possible features and ideas for the app.
Ideas for Charlie
- 5Keep track of his expenses
- 5Give a personalised recommendation on spending
- 5Set a reminder for sending back the cash he borrowed from friends
- 5Make repeat payments easily and quickly
- 5Share the payment information when giving money back to friends
- 5Express his gratitude by sending a message or emoticons
- 5Budget planning
Ideas for Anna
- 5Keep track of her expenses and incomes
- 5Setup and track a savings goal
- 5Provide tips on spending and saving
- 5Provide brand loyalty card management
- 5Make unique offers and personalised rewards
- 5Make quick and easy payments to friends for sharing bills
Sketching, brainstorming, and design concept development
Based on the personas’ needs and the mobile banking trend, I proposed that the design for a mobile banking app should be more connected to a person’s life while being simple and effective to use daily. For Charlie, the app could be designed to help him budget his expenditures as well as maintain some aspects of his relationship with friends when dealing with financial issues. The bank can also provide personalised information that can help him in gaining more financial independence. For Anna, the app could be designed to meet her lifestyle and help her reach financial goals in life. Therefore, my design for millennials’ daily mobile banking experience is centred around three main concepts:
- 5Simplicity
- 5Personalisation
- 5Sociability
The app is designed towards the experience that
- 5Users can easily use the app for frequent tasks (e.g., making payments and checking his/her account balance)
- 5Users can be provided with unique offers and tips based on personal user data
- 5Users can extend their existing social media habits into using the banking app (e.g., adding a more personal touch while sending, receiving, or sharing payments with family or friends)
Wireframing and validation
During this stage, I outlined some possible features and content on paper. I tried to find solutions that can effectively lay out the required functions and information. I started with some low-fidelity wireframes and used them to do some informal tests with friends to get feedback and learn if anything needs to improve. Then I moved on to creating high-fidelity wireframes to present the design of key screens in Miro.
Design
After becoming more certain with the layout and user flow, I made some high-fidelity mockups in Photoshop to create the look and feel of the Whisper Bank app. Followed by the existing branding guidelines and idea for simplicity, the user interface is a lightweight design and intends to use micro-interaction and subtle animations to add delights to the user. The high-fidelity mockups can be further turned into interactive prototypes and tested with users.
Deliverables
Wireframes
The wireframes below are used to highlight figures that are designed for millennials to make their daily banking experience simple, personalised, and sociable.
Mockups
Based on the wireframes, the images below show a design for the look and feel of the app user interface. The design idea is from the brand name – Whisper. The act of speaking to someone in a whisper is to speak quietly, softly, especially for the sake of secrecy. Therefore, the connotation of the brand name “whisper” suggests closeness, intimacy, and secrecy. My UI is designed in a way that aims to touch users in an intimate way. By following the existing design guidelines, I choose a lightweight style to further evoke this feeling of intimacy and bridges the gap between the user’s private life and the brand’s banking service.
Final thoughts
This is my first time designing a mobile banking app. While it was challenging, the experience was invaluable because I learned and discovered so much along the way. Of course, there is still room for improvement, such as persona creation and user testing. Given the limited time and resources, the persona was created based on secondary research and usability testing was informal. Nevertheless, the process attempts to design from the perspective of millennials. Hopefully, there will be more opportunities in the future to design and validate ideas in greater depth.