Back to Main
02Figma, FigJam, Canva

Money Tracker App

Role
UI/UX Designer
Duration
4 Weeks
Tools
Figma, FigJam, Canva
Money Tracker App

Overview

Project overview.

Money Tracker is a mobile app designed to help people manage their money by tracking income and expenses, setting financial goals, and understanding their spending habits. I wanted to create a simple experience that makes financial tracking easier and less overwhelming.

Problem

The problem.

Many people find it difficult to keep track of their daily spending and often forget small purchases. This makes it harder to understand where their money goes. Some existing apps can also feel complicated, making it difficult for users to stay consistent with their budgeting.

Goals

What success looked like.

  • 01Make recording income and expenses quick and easy.
  • 02Help users clearly compare their monthly income and expenses.
  • 03Allow users to set financial goals and spending limits.
  • 04Make past transactions easy to find and review.
  • 05Create a simple experience that is easy for different types of users to understand.

Research

Listening before designing.

I conducted interviews and research to understand people's spending habits, financial goals, and challenges with tracking their money. I used these findings to create the Information Architecture (IA) and User Flows, which helped me organize the app and plan the main user journeys before designing the screens.

Wireframes

Structure first, polish later.

Low-fidelity wireframes were created to define the app structure, explore screen layouts, organize content, prioritize key information, and validate user flows before moving into high-fidelity designs.

Money Tracker App process

Design Systems

From sketches to system.

I created a design system with colors, typography, buttons, icons, vectors, logos, and reusable components. This helped keep the app consistent and made it easier to apply the same design across different screens.

Decisions

Design decisions that mattered.

  • Quick Add for faster expense entry
  • Clear visual charts for financial insights
  • Goal tracking to encourage saving habits
  • Simple navigation for accessibility

Solution

The final solution.

I designed a simple mobile experience where users can record income and expenses, view their spending through charts, set financial goals and limits, and review their transaction history. The goal was to make everyday money management easier to understand and use.

Money Tracker App process

Outcomes

Design Outcomes.

Clear overview of income and expenses.

Faster transaction recording and management.

Goal setting and spending monitoring.

Reflection

'What I Learned.

"This project taught me how to make complex financial information easier to understand through design. I learned that a finance app doesn't need to feel complicated. Clear information, simple user flows, and thoughtful UI decisions can make managing money feel more approachable."

Next Case Study

GiyaPay Dashboard

03 · Figma, Canva