intro.PNG

Group 12800.png

Project Overview

We had to create a develop an individual project from scratch and apply
everything we have learned about the UX process during UX Design Master's Program at
Talent Garden SchoolBudget Me! was my individual project for the final presentation.

Objective

The main objective of Budget Me! was to create an app that allowed people to start having a better control over their expenses, budgeting and to set and achieve goals while being motivated at the same time.

Problem

Keeping an eye on your finances is not something that people generally enjoy. Most people don’t spend a lot of time organizing and tracking their profits and expenses. It's hard to track where all the money is spent. Hence, making it harder to have a fixed amount of savings per month.

The Solution

 

Since "being broke a'int cute", the idea was to have an app that is super easy to sync with the users' banks and motivates the user to insert easily all expenses either automatically via card payments or manually via receipt scanning or voice input. A segment that will give tips about maintaining budgets and to set them easily. The goal segment will allow users to save for the future. And the app will show various statistics to motivate the users by showing, for example, how much one saves at retirement.  

Responsibilities

 
  • User research and Interviews 

  • Competitive Analysis

  • Value Proposition Canvas

  • Sitemaps and User flow

  • Low fidelity Wireframes

  • Creating a design system

  • Hi-Fidelity Wireframes & Prototyping

  • Usability Testing

  • Iterations

Tools

 

Miro         

 
 
 

Figma

 
 
 

Photoshop

 
 
 

Indesign

 
 
 

Aftereffects

 
 
 

Project Timeline

 

It was a 12 days intensive design thinking process.

 
 
Group 12800.png

The Process

The Design Thinking Approach

 


I developed the Budget Me! app using the design thinking process, focusing on users' needs and pain points on each step of the design process. Starting from an in depth research from interviews to creating value proposition to sitemaps, user flows, wireframes, prototypes and user testing. Then repeating the cycle, when and where needed.

Empathize

 

It began by carrying out a detailed user research and Interviews in order to understand the users better and to have a better idea about their goals and pain points, when it comes to how they manage their expenses. I made a list of interview questions based on the target group. Below is a summary of findings from the interviews conducted along with the desk research.

Interview Takeaways

 

I conducted a moderated remote interview with 6 people belonging to the target Group. A set of interview questions were prepared, where the goal was mainly to understand how the users control their budgets, where they spend most of their income, if they can track their expenses and whether or not they use an app for budgeting.

User Goals & User Pain Points 

Define

 

In order to come up with a list of features for the app, we had to first define the best practices based on market research and competitive analysis by studying a 5 successful budgeting and banking apps websites. We then proceeded with creating a project value proposition, Site map and User Flow.

Competitive Analysis Summary

 
 

I looked into 5 budgeting apps where which included 4 direct competitors and 1 indirect competitor. I found that, although most apps allowed to sync with banks and display charts and graphs, they lacked the most important thing 'flexibility'. They don't allow personalization and complicated data input.

Value Proposition Canvas

 
 
 

To make sure that the product is designed with the user in the center by making sure that the service provided meets the user needs and relieves the user pain points.

List of Main Features

 

After the interviews, research, market analysis and value proposition it was time to define the main key features of the Budget Me! app based on user expectations and needs.
 

  • A dash boad with a clear overview of the income and expenses

  • budgeting setting option

  • long term and short-term goal settings

  • A wallet segment displays all the available cards

  • Receipt scanner and voice input features

  • simple and secure syncing

User Flow

 

Studying the user flow based on our persona Alice who wants to check the budgeting, goal setting and the  transaction features after arriving to her home page.

Ideate

 

I make hand drawn wire frames to come up with features that are easy to understand and use and most importantly clear to show the user where they are at with each income and expenses made.

How Might we?

 

How might we create an app that helps users manage their expenses and keep them motivated to stay hooked at the same time?

The answer...

 

Designing an app that makes budgeting and tracking expenses super easy and allows them to personalize any way they want. Also having a goals feature that would inspire them to reach their target with small amounts saved every month.

Iterations of the homepage & main pages 

 
 

clear view of the available funds on the homepage dashboard

View of budget allotted as per category

Bottom nav for easy and fast access to main features

Polished version  of the various dashboards ready for hi-fidelity prototypes and testing

Prototyping

 

After the paper sketches and paper prototype testing ( which helped to make minor adjustments ) , I created a style guide to prepare the hi-fidelity prototype. 

Visual Style and a Design System

 

After having a better understanding from the competitive analysis and user interviews. I created a style guide to create an app that would communicate with the users in a friendly manner and influence people from the younger generation to start using the app and at the same time an app that keeps the users coming back.

Typography

 

CTA & forms

 

Icons

Nav Bar

Graphs & charts

Cards

Hi-Fidelity Mockups

 
 

Here are some of the hi-fi mock-up screens showing the main dashboards, sign up with phone number and the signup error screens.

Contact me for a link to the clickable prototype

 

Hi-Fidelity Mockups for Apple Watch

 
 

To ensure that the app is really responsive and adaptive also for people who are tech savvy, I created an apple watch version to facilitate the voice input features. 

The watch.png

User Testing

 

I did out both remote and in person user testing with 8 participants. The users were asked to sign up using their preferred process and sync with ING bank. Next task was to add a takeout budget, followed by checking the goals and wallet features.

After the usability testing I found out which features really works and made modification to enhance the user experience for the features that confused the users.

Group 12800.png

Main Takeaways

Things I have learnt from this project

 
 

Understanding the pain points


Carrying out desk research and initial interviews really helped me to understand how little things can make a big change. Defining the MVP was challenging as at the end the users had to be able to perform a task quick and easy. Interviews helped me to clarify and cancel out some of the features that were unnecessary, which most apps use just for aesthetics.

User Testing...and a lot of it!


Without testing with the users, it would have been impossible to see the flaws that made easy tasks complicated. 


Disclaimer:


I did this project as my final personal project for the UX Masters at the Talent Garden innovation school. I really want to thank all my mentors for giving me all the great insights which helped make this project a true success.