00 Project

Pigbud

Designing an MVP AI budget app to help users easily manage their finances.

I've always been interested in emerging technology. As a way to improve my skills, I decided to learn AI and design by taking on a personal project. Managing a budget is a huge task, especially when you're in your 20's and not sure how to make good financial decisions. So i decided to explore more.

When I asked parents and seniors, they suggested using Excel sheets, but manually adding expenses and making decisions based on those sheets is really tedious. Then my friends suggested to download a budget app but again the features are available on my banking app. Nothing is different and useful

Then I thought, what if there was a way to connect my expenses and data to machine learning so it could intelligently make relevant financial decisions for me?

Overview

Role

Product Designer

User Researcher

UX designer

Time line

5 months, March'23

Tools

Figma

Figjam

UserTesting

01 Context

Problem statement

How might we leverage AI to improve budgeting skills for young people and reduce their financial hardship?

Many students, especially those from poor backgrounds and unsupportive circumstances, are struggling to pay their tuition fees and cover daily expenses. This financial hardship makes it extremely difficult for them to focus on their studies.

Goals

1.Create a system that is more personalized and helps users make wise decisions.

2. Understand AI and integrate it intelligently within the app.

3. Explore how I could scale this in the future as a company offering something different from competitors.

03 End result

Final flow

Over 5 months, I designed a simple yet powerful app to help users easily create and manage their financial budgets. By focusing on a clean, intuitive interface and essential features, the app provides a straightforward solution for streamlining personal finance management.

02 Process

Detailed process

I used the double diamond approach this project. This iterative process allowed me to understand user needs and continuously improve the app's design. Through multiple rounds of prototyping and user feedback, the app evolved into an intuitive financial management solution.

03 Principles

Building Principles

From my experience as a product designer, I have learned that establishing guiding principles can help me create value. I have adopted the Google AI Principles as a framework. These principles are quite insightful.

Google AI princples

Be accountable to people

The app will prioritize the needs, well-being, and success of the individuals it serves.

Be socially beneficial

Focus individual user preferences and financial goals, leveraging AI to provide personalized insights.

Ensure transparency

Ensure transparency in financial tracking and recommendations, empowering users to make informed decisions about their finances.

Context

01

Problem statement

Many young professionals and students are facing financial hardship due to limited knowledge and poor implementation skills in budgeting. This is severely affecting their daily lives and future prospects given the current economic conditions.

Qualitative & Quantitative research

After understanding the problem, my journey began with extensive user research to understand the pain points and challenges faced by the target audience. To understand the depth of this problem, I tried to connect with people and see how it impacts so I conducted interviews with 6 people from 3 major countries - the United Kingdom, the United States, and India. So i can make data driven decisions in my research.

Qualitative & Quantitative research

Image 1.0 - Interviewing participants

Competitor review

To differentiate my product, I analyzed key market players. Surprisingly, none of them utilize AI, but I can't claim my product lacks direct competitors. All the apps are decent budgeting tool. So that is a fundamental vision to sustain. More details

Competitor review

Image 2.0 - Competitor review document

Key takeaways from research

From my secondary research, user research, and competitor analysis, I collected different insights. These insights helped me create different 'How Might We' questions, user stories, and decide on features based on that. Some of the influential insights were:

Key takeaways from research

3/6

Users divide or distribute costs with their friends and families.

22%

Gen Z adopts budgeting tools at lower rates, compared to 42% of Millennials (survey).

4/6

Users uses AI's like chatGPT for their finances but they often find had to ask right questions.

Grasp the essence

Using the insights then I prioritized relevant features for the Minimum Viable Product (MVP) using the Moscow method.

Grasp the essence

Using the insights then I prioritized relevant features for the Minimum Viable Product (MVP) using the Moscow method.

Image 4.0 - Information Architecture

Information Architecture

With the prioritized features in hand, I designed an intuitive information architecture that organized and interconnected the elements, aligning with user needs and research insights to create a good structure for the MVP.

Information Architecture

Image 4.0 - Information Architecture

Vision to Life

I spent countless hours sketching wireframes, tweaking designs, and testing prototypes. I wanted every tap and swipe to feel effortless, so I obsessed over the details — like the color of a button or the placement of a menu.

Vision to Life

Branding & Components

When designing the brand logo, I aimed to encapsulate the brand's core values. I opted for a bold purple color that represents creativity, innovation, and prestige while meeting accessibility standards for inclusivity. For the typeface, I chose the Inter font, which prioritizes simplicity and legibility.

Branding & Components

Testing

For testing, I integrated AI algorithms of perplexity to power features like expense tracking. I tested with 6 participants. I took a different approach for each flow to overall test the usability. For the AI, I designed two directions and developed two hypotheses to see which had more usability and whether it satisfied the metrics. I took the System Usability Scale (SUS) as the metric score here.

Testing

Hypothesis 1 - Customized Focus Areas):

Users exposed to customized focus areas will have more effective budgeting conversations with AI compared to those without.

Hypothesis 2 - Predefined Prompts):

Users utilizing predefined prompts will have more effective budgeting conversations with AI compared to those without.

Iteration changes

Finally Hypothesis 2 was selected. The revised prototype reflected these iteration changes, showcasing a refined version of the app that took into account the valuable insights gathered during the feedback process. The UI enhancements aimed to improve the overall user experience and address any concerns raised earlier.

Iteration changes

Before

The button "settle up all" was confusing to some testers. They had no idea how that works even though the button was for settling.

After

To address this I have changed the wording to just “settle” to settle the group participants individually.

Before

Here the intent was to add the bill photo but the copy was really confusing to users. Testers thought it was some kind of expense they wanted to add.

After

To address this issue I have changed the copy to “Add bill” to make it more clear.

Before

The evaluators regularly perceived the homepage as overly cluttered and the symbols did not accurately convey the operations.

After

The primary display has been simplified for improved intuition, diminishing sensations of clutter.

Final prototype

With the design finalize, it was time to bring the app to life. I rolled up my sleeves and got to work, I made a final prototype using Figma. I utilized Figma's variables concept.

Final prototype

With the design finalize, it was time to bring the app to life. I rolled up my sleeves and got to work, I made a final prototype using Figma. I utilized Figma's variables concept.

Final prototype

With the design finalize, it was time to bring the app to life. I rolled up my sleeves and got to work, I made a final prototype using Figma. I utilized Figma's variables concept.

Impact

I have put everything together, iterated the flows, and arranged the design file. Ideally, I will hand off the design to developers along with detailed documentation.

Impact

I have put everything together, iterated the flows, and arranged the design file. Ideally, I will hand off the design to developers along with detailed documentation.

Impact

I have put everything together, iterated the flows, and arranged the design file. Ideally, I will hand off the design to developers along with detailed documentation.

What have I learned?

As a result of my process, I designed a seamless interactive experience that assisted users in searching for relevant prompts and insights tailored to their specific situations. This user-centric design achieved a high system usability score of 79 from testing, validating the efficacy of the approach taken.

01

Focus on simple things and get good feedback

Initially the scope was too broad, making it hard to focus. I loved exploring ambitious ideas, though reluctant at first to gather feedback.

02

Artificial Intelligence can simplify our life, by lessening complexities

The most meaningful AI provides simple solutions. Though AI evolves rapidly, proven technologies that simplify daily life have the greatest impact.

More projects

Ditto Design System

Case study • Product & Branding

Onboarding Portal

Presentation • Web • DItto

Back