Summary: This is a case study of redesigning the UX for one of the most widely used financial apps in Asia, used by more than 10 million active users every month. During our research, we found that people spoke about our services differently. So we designed an experience to let users use the app in a way that made more sense to them.
When we kicked off the redesign of the mobile app, we were worried about messing things up. We didn’t want to overhaul too much because people were used to the way things worked. And whenever we thought about adding new stuff or changing things, we had to consider that people might not be super eager to switch things up. On top of that, we were growing customers at a record rate during COVID. Despite all our fears, we realized that what had worked so far might not be enough to get us to the next 10 million users we were aiming for.
Another challenge that we faced was that with the rising popularity of the platform, more and more services wanted to integrate with our platform for payment services. The ever-increasing portfolio could potentially pose challenges for people who want to find a specific payment they want to make.
Before we get into the solution, let’s understand how stuff is usually set up in financial and other apps.
Most apps are organized in a step-by-step way. For example, if you want to send money to ABC Bank from a different bank, you’d start by finding the “Send Money” section. Inside that, you’d see options for different ways to send money. Once you pick “Inter Bank Transfer,” you'll choose the specific bank you’re sending to. Only after that would you be able to complete the transfer by giving all the details about the person you’re sending money to.
Here is a visual of the structure:
The same structures apply to other kinds of transactions as well. For example, paying bills, giving donations, etc.
When we interviewed the people from our customer base, we discovered that there was a very particular way they talked about the transactions they did on our platform and on other competitor platforms.
When people want to perform actions, they do not talk in terms of hierarchies or processes. Here is how:
مجھے١٠٠ روپے ایزی پیسا تو کرنا
Translation: Hey, Easypaisa me 100 rupees.
(Easypaisa is a micro-finance bank that offers digital mobile money wallets.)
Problem: This function sits under three levels of hierarchy in the app.
میری ٦ بجے کی لاہور کو ڈائوو تو کروا دے
Translation: Hey, get me Daewoo to Lahore for 6 PM
(Daewoo is an inter-city Bus service.)
Problem: This function sits under two levels of hierarchy in the app.
گاڑی کا ٹوکن ٹیکس تو جمع کروا دو میرا
Translation: Hey, Pay my car’s token tax, please
(Token tax is a recurring tax paid for vehicles in Pakistan.)
Problem: This function sits under four levels of hierarchy in the app.
--
We realized that in order to serve our users best, we needed to give them a way to access services that are more intuitive to how they talk and think, instead of endlessly going through the categories and sub-categories of services.
We kept the old ways of organizing services, but we added a super-useful search feature. This lets users find what they want without going through all the categories and levels.
So now, users can just type in the name of a bank or whatever they need to pay for, and boom, they’ll see what they need. No need to stress about where things are in the app anymore!
The search results are also presented in terms of actionable transactions that the user might want to perform. For example, when searching for the name of a charitable organization, The search results show all the different types of donations that the organization accepts. Similarly, searching for a bank or a financial institute gives all actions possible with that institute, like sending and requesting money.
We also added the ability for users to pin their most used functions on the home screen for repeated transactions. For repeat users, this functionality allowed them to bypass the search and the trouble of navigating through the app altogether.