Expense Tracker on PhonePe — A UI/UX Case Study Targeting Overspending Among 85% of UPI Users
Designing an intuitive Expense Tracker feature on PhonePe to help users manage and limit overspending effectively and effortlessly
Ideation🧠
When I was browsing through YouTube, I came across a post from the Finance Boosan channel, managed by Boosan Babu M, who talks about personal finance. In the post, it is mentioned that 85% of UPI users are overspending. The post also had an article from The Economic Times describing overspending among UPI users.
This led me to think about the lack of money management or tracker features on the UPI apps.
Problem Statement 👁🗨
Design a new feature on PhonePe to keep track of expenses and make money management easier.
Heads up: If you are in a hurry, check the prototype here.
Research📚
During my research, I found a research publication from Harshal Dev and Raj Gupta from IIT Delhi. The publication stated that 72.4% of users were overspending due to UPI apps. Additionally, 81.1% of users were using UPI apps daily with an average of ₹ 200.
To learn more about the UPI apps and their user base in India, I visited the NPCI (National Payments Corporation of India) website. Among all the UPI apps that are available in India, PhonePe and Google Pay top the charts with 6716.09 cr and 5103.99 cr transactions in Jun 2024. This information shows that PhonePe is the most used UPI app in India among individuals. So, I decided to go with the PhonePe app.
Necessity❓
Though the UPI apps offer the utmost convenience and satisfaction in digital payments, they lack the human sentiment towards money. With UPI apps, we emphasize money as just numbers on a screen.
Let's roll back the time a little. Before the rise of UPI, we used credit and debit cards to make payments. Those cards have the fancy name Plastic Money. As those cards are issued directly from the banks, they have certain limits and the account holder (user) can opt for certain limitations like minimum balance, withdrawal limit, online spending limit, and so on. However, the UPI apps do not offer options to set limits and we can’t see the real money. This leads to overspending.
In the YONO SBI app, you can use the Spend Analysis feature to quickly view your monthly expenses in the pie chart view. In the chart, all your UPI payments will be categorized into one single category — Fund Transfer.
On the other hand, most money management apps need manual entry to keep track of our expenses. Some apps offer a feature to link our bank account to keep our expenses organized. However, those apps can’t categorize our UPI transactions. For instance, in the INDmoney app, all of my UPI transactions are categorized as Others.
This creates an inevitable situation where the UPI apps need an Expense Tracker.
User Flow🔁
To add an Expense Tracker feature on PhonePe, I went ahead with categorizing the UPI payments. Then, display those categorized payments in a Pie Chart view.
When designing the user flow, I ensured the modified user flow was not entirely different from the existing one. Without making any major changes in the user flow, I made an option to choose the category of the payment.
Wireframes✏️
After constructing the user flow, I got into the wireframes. Before sketching the wireframes, I listed the elements for the screens. Based on that, I sketched the wireframes.
Design & Prototype📱
My first part of the design was to decide the categories of the payment. To do that, I installed, used, and tested money management apps like Budget, Buddy, Spendee, Money Manager, Account Book, INDmoney, Wallet, MoneyPocket, and MoneyCoach. Most of the apps offer too many categories and sub-categories. After analyzing those apps and to satisfy Hick’s Law, I have decided to introduce 8 categories.
- Utility
- Transport
- Food
- Entertainment
- Shopping
- Education
- Others
Once the categories were finalized, I started to incorporate those into the payment flow. After a handful of iterations, I finally designed five new screens. Then, I had a call with two of my senior designer friends over Google Meet and got valuable feedback for my design.
Noting down all the feedback and inheriting them into my designs took a while. To achieve the desired results, I iterated many times with minor changes.
User Testing
Once the designs were finalized, I started with the prototype and tested with 5 of my non-designer friends (PhonePe users) to get the user feedback.
While making the prototype, I made category selection a compulsory step. With this, the user has to choose the category after entering the amount and then proceed to the payment steps. It created an extra cognitive load and all five of them struggled with the new payment flow.
Then, I went back to the drawing board and wireframed additional screens to allow category selection after making the payment. And in the prototype, I made the category selection an optional one.
Business Need 🏢
By introducing the Expense Tracker, users will be more aware of their spending habits and can make more informed decisions while making the payment. The ability to see and organize the UPI spending in the monthly view will impart financial literacy and empower users to manage their spending.
From a business perspective, the Expense Tracker feature will reduce the usage of PhonePe. Most of the UPI apps, including PhonePe, generate revenue from vouchers, mobile recharges, and merchants. Also, PhonePe has other services like Mutual Funds, Loans, Insurance, and Stocks. At the end of the payment screen, PhonePe displays ads (6 carousels). With this categorization of UPI payments, it can leverage data and analyze user’s spending habits to offer more personalized recommendations. This can encourage users to spend strategically within the app.
This reminds me of the famous Steve Jobs saying about the user’s needs.
Key Learnings🧾
During this entire process, right from ideation to user testing, I have learned a lot, both in the technical aspects. Some of my learnings are,
- The job of a UI UX designer is not to design visually appealing screens, but to find solutions for the user’s problems.
- Designing is not a linear process. One needs to iterate, iterate, iterate, and iterate to get the best result.
- Don’t make any assumptions while structuring the user flow. Make informed decisions with the user data and feedback.
You can interact with the prototype here: Expense Tracker on PhonePe.
A special thanks to Jeganathan C and Yakneshwaran Mani for guiding me on this case study.
You can find me on LinkedIn and Twitter. I am currently looking for opportunities. Do reach out if you’d like to work with me or collaborate on some projects. Share your thoughts on this new feature on PhonePe in the comments below.
