The Cardless Cash feature for the Citibank mobile app
Roles: User Research, UX Strategy, UI Design, Testing, Prototyping
Note: I do not work for nor am affiliated with Citibank. This is a passion project!
In order to identify what kind of feature I had to come up with and design, I performed:
to understand what were the most in-demand features customers use in mobile banking apps
to better apply the findings
to design ideas and validate them via users' feedback
where the high-fidelity design was fleshed out
I conducted an online survey in which 11 individuals participated and five 1:1 interviews. These research methods were crucial in understanding what was important to customers when using banking mobile apps.
Amongst the questions I asked, were the followings:
Since all the mobile banking apps provide similar products and services, there was a lot in common in the interviewee answers. Basically, participants were happy with their mobile apps because they were convenient, fast and easy to use.
My bank is always at hand if I need it.
I can deposit my check easily if I am not close to a bank.
However, there were some features the mobile apps, including Citibank app, were not doing, such as:
My banking app does not give me the same visibility as its desktop version.
There is neither Citibank office nor ATM in my area. So it's tricky for me to get cash if I want to tip a pizza guy, for instance.
Research findings helped me create an empathy map to group users’ feelings, pain points, and motivations. It was the first step on my way of finding a solution for the established problem.
Based on the empathy map I synthesized the following persona to help guide my designs. Sean is a young professional. He uses the Citibank mobile app to make transfers, check the balance, and deposit his checks. Now he doesn't need to go to a branch at all. But he would like to have a more effective and simple multifunctional app to use on-the-go.
It was time to generate ideas to find the right solution for the problem. Keeping in mind Sean's pain points and needs, I formulated the challenges as "How Might We" statements. I chose two from the 14 statements I made:
I moved onto the Crazy Eights exercise and came up with eight different ideas for each “How Might We” statement. It helped me think out-of-the-box and ultimately define the optimal design solution.
After analyzing this exercise, I decided to focus on the idea of how Sean can get cash when he has forgotten his wallet. This is particularly interesting because Citibank doesn't provide this service to the clients yet.
In developing the idea, I came up with three scenarios:
I created storyboards to visualize these scenarios.
task flow to outline key steps in the flow
I sketched key wireframes and used Marvel app to transform them into an interactive prototype.
Then I conducted a usability test with four tech-savvy participants. It was more like an exciting conversation than a test in its pure state. Participants discussed each screen in detail and gave me recommendations which I put together in an affinity map.
At this stage, my goal was to create high-fidelity wireframes so that they were embedded well and seamlessly with the rest of the application. I followed the Citibank brand style to create the mobile app UI Kit.
I created a Hi-Fi prototype and tested it with Citibank customers to get feedback.
All the participants successfully completed tasks by following the scenarios:
The feedback helped me iterate the initial design and ultimately create a more user-friendly experience.
The idea of sending cash would be of interest to parents who often forget to give money to their kids.
I like the idea of using public and private keys for the code encrypting to send to a recipient.
I think a drone delivery is a completely unreal thing, but it's a cool and creative idea.
Citibank mobile app has been a very inspirational project which I learned a lot from. When I started working on it I had no idea what feature I need to come up in order to improve the Citibank mobile app. When doing the ideation exercises I was able to generate ideas and it really helped me find the solution. Thanks to testings and iterations, I improved and polished the design.
As the next step, I would explore the solutions to the other "How might we..." and design a user experience that could allow users to manage all their financial world in one place using, for instance, Google Glass or Blockchain technology.
Based on storyboards, I constructed a task flow to outline key steps in the flow.
There was a minor issue. The main menu had two very similar menu items - “Withdraw Cardless Cash” and “Send Cardless Cash”, which were confusing to participants. They suggested unifying these menu items under one "Cardless Cash" menu item. When tapped on it a new tab with these menu items opened.