How do you make the process of managing and tracking your monthly finances as easy as clicking a button? This project was created to solve this problem.

Behance

GitHub

Role

Product Designer

Team

Solo

Skills

App Design
App Development

Timeline

15 Sep, 2024 5 Oct, 2024

Defining the Problem and Vision

Finding the problem was my first step on this project. The people at my place were using physical registers to reocrd their expenses of the day, which made me think of what if I, as a Designer, make it simple?.

The inital problem statement:

"How do I track my daily,weekly,and monthly expenses without manually calculating and without contiuously filling registers and note books?"

Solution

Design and develop a Home expenses tracker app to automate:
- Reports and analysis
- Tracking daily expenses and savings
- Organizing the expenses and incomes in the best way possible

Planning time

To start this journey, I created a complete project timeline on Notion for a more productive workflow.

This timeline helped me:

— Work more productively one task at a time.
— Stay updated with all the tasks and focus on the goal.
— Organize the project modules in such a way that I got a clear direction to reach the goal.
— Stay motivated to see the growing progress while going ahead.

Research and Analysis

The research process for this project intailed user research, online surveys, in-person interviews, and competitor analysis.

As a sole designer on the project, I developed a research approach that combined new and known approaches to practice and learn new skills. I reached out to some of my classmates for usability tests.

Goals:

Leverage findings to inform strategy and design decisions.
Research best practices within our domain and discover how we can differentiate ourselves from others.
Assess the current expense tracking apps to identify usability issues that conflict with known best practices.
Capture the user's voice so that it can be used to inform the design process and strategy.
Discover hidden issues or complexities and determine the stakeholders' view of success.

Competitor analysis

During competitor analysis, I evaluated the strengths, weaknesses, content design, UX design, and potential opportunities for improvement in each of the apps. I also walked through the flow of each app, step-by-step, to understand the user journey.

Feature	Spendee	Expense manager	Money manager
Expense tracking	✓	✓	✓
Goal setting	✗	✗	✗
Budgeting	✓	✓	✓
Reports & Analysis	✓	✓	✓
Alert for expense/budget exceeding	✓	✗	✓
Due & Reminders	✗	✓	✓
Budget categorize	✓	✓	✓
Dual budget account	✓	✗	✗
Export in a document	✓	✗	✓

Personas and Ideation

After completing the research work and analysing the outcomes, I created a user persona for demonstrating the target audience. Personas really helped me create the right product.

Sarah 35 years old Pakistani BBA Graduate

About

Sarah is a new Principal at a renowned school managing the primary section. She has a little know-how of computers and is feeling overwhelmed by managing the school expenses, teachers' incomes,and students' fees.

Motivations

Keep track of her savings goals and avoid overspending by efficient budgeting features. Be able to make better financial decisions by having a clear overview of her spending habits. Track her expenses easily through simplified household budgeting ways.

Goals

She wants a user-friendly interface to use it intuitively, she thinks she is not tech-savvy. She would like to see all of her monthly/annual expenses at a glance to track her spending habits and saving progress. She loves customization and wants to see her expenses/incomes the way she wants.

Pain points

She is not tech-savvy so she finds difficulties to navigate to find certain features. She forgets to check her phone so sometimes she feels the need of a reminder. She loves customization and wants to see her expenses/incomes the way she wants.

Empathy Map

After defining the persona, I researched on their strengths and weaknesses to ensure how the user says, thinks, does and feels about the product.

Says

I want to save my money by spending less.
I'm having trouble remembring my expenses.
I wish there could be any safe place to save my expenses.

Thinks

Needs to control her expenses.
Tries to remember her expenses to write them down
Tries to infer a suitable expense recording style

Does

Opens up a note book and creates a table manually
Aims to make informed decisions
Manually analyzes the overall financial status

Feels

Unsure about how to start tracking
Frustrated by correcting mistakenly written words
Overwhelmed when analyzing the weekly expenses and income

Initial Wireframes

Wireframes are the first visual drafts of our solution. After defining all the things for the product, I started creating rough sketches to visualize the product.

Wireframes helped me:

Creating the base layout of my app.
Focusing more on the usability and UX than on visuals and UI.
Understanding the flow of app and its pages.

Usability Testing

User research is critical to UX design and there is no substitute to talking to real users. In addition, user testing is contextual observational research conducted to understand users' needs and behaviors.

After performing the heuristic evaluation I decided to conduct a series of contextual usability testing sessions to better understand the needs, pain points, and insights from task-based and contextual probes.

The Testing Process:

Objective:
To identify any usability issues or points of confusion in the initial design.
Method:
Users were given specific tasks to complete within the prototype.
Findings:
The testing revealed a key insight — users wanted a faster way to add transactions.

The Final Product

With a validated structure in place, I moved on to the high-fidelity visual design. The final screens are clean, modern, and visually appealing. The use of blue color is intentional, with green signifying income and red for expenses, providing users with immediate visual cues. Data visualizations, like graphs and charts, are used to present complex financial information in a simple, digestible format.