Budgeting app for young freelancers
Case Study
UX|UI Design
Domino is a financial budgeting solution for freelancing young professionals who want to develop savings habits.

This study was done as part of BrainStation UX bootcamp.
View prototype
Project Overview
Mexicans aged 18-34 struggle developing savings habits due to their variable income structure.
How might we help FYPs feel optimistic about their financial future by addressing their unconventional income flows?
A budgeting app that sets savings goals and comes up with a custom budget to meet them.
The main constraint was time; we had 10 weeks to build this product, as well as weekly submissions and daily classes.
My Role
Designed for
Other prototypes
Lead Product Designer
Oct- Dec 2023
Figma, FigJam
iOS 15 & 14 Pro
Desk & User Research, Wireframing, Prototyping, and User Testing
Methodology Used
For this capstone project, I worked in weekly agile sprints, using Design Thinking's Double Diamond methodology. which consists in developing a product throughout phases of inputs (research at the beginning and testing after ideation processes) and outputs (ideation and prototype design).
I was drawn to finances and how it was a heavy topic for freelancers around me. So, I started asking questions.
1) Research and discovery
of Mexican young adults want to save, but don't think they have the means to do so.
of Mexicans find financial information confusing
of Mexicans don't have a 3 month reserve fund
of Mexicans don't have a register of their expenses
of Mexican young adults don't have saving habits
Hypothesis statement:
After this research, I generated a hypothesis statement focused on Freelancing Young Professionals’ emotional relationship with finances, since I saw it was an area of finances that most existing solutions aren’t tackling and could have impact in my target user’s financial management.
I believe freelancing young professionals have a poor financial health because they have developed psychological barriers that make them feel unfit or incapable. I will know I’m right when 3/4 of interview respondents confirm that they replicate learned financial habits and think financial health is out of their reach.
Once I had a clear hypothesis, I proceeded to run 4 user interviews. I called for individuals who were or had been freelancers, are Gen Z or Millennials, live and work in Mexico City, and are concerned about improving their financial health.
Age: 34
Age: 34
Age: 34
Age: 34
“It’s become a vital habit for me to build a reserve fund to use in months of no income.“
“I use excel to have a general view of my expenses, otherwise I feel lost financially.“
Has savings: Yes
Has savings: No
Has savings: No
Has savings: No
“I don’t save because I can’t see far ahead having an unpredictable income.“
“Somehow I always make ends meet, but I improvise a lot; no room for planning.“
From the user interview, I drew pain points, motivations, behaviors. I found a key theme to guide the ideation process.
2) Analysis and Synthesis
I was wrong about the emotional factor.
Although the answers showed that financial struggles do represent an emotional weight, the main theme was about cashflow management. This could be found in the Affinity Map I used to synthesize the interview answers.
I don’t realize when I’ve spent too much and I’m forced to be austere.
Pain points
My biggest problem is the lack of stability of freelancing incomes.
Most financial opportunities don’t understand the income flows of freelancers.
I have too many things on the table to even consider a debt payment plan.
I like saving sections in my bank app because they prevent using that money.
What I would really want now is to start building my retirement fund.
I’d like to know the max amount I can spend with my credit card and stick to it.
I like being out of debt so that I can put more money in my retirement fund.
I’m always looking for business opportunities, like renting my equipment.
I budget my income in saving sections as soon as I get paid.
I avoid debt by not getting a credit card and use excel to have control over finances.
When I’m out of cash, I have to borrow money from family and friends.
Main theme: Cashflow Management
Because of the changing nature of their income flow, FYPs are constantly juggling with their finances and can’t always make scalable plans for the future of their money.
User Persona
I created a user persona using the pain points, motivations and frustrations I drew from the interviews, so that my user group would be represented. Although savings goals may differ, FYP are generally looking to either develop a savings habit or strengthen an existing one. They also share the paint point of low visibility over their finances, as well as an income structure that doesn’t fit into conventional methods or tools.
Experience Map
Now that I had my persona, I needed to understand their journey. I created Julio’s Experience Map based on his process of looking for a financial growth method. This process would give me a general idea of what kind of kind of solution my target user needs, using the opportunities in each phase of the experience.

I chose an Experience Map over other artifacts, such as a storyboard, because it’s more detailed and may also provide a context and a use case.
32 | Visual artist looking to grow financially
Julio Espinoza
Goal: Julio wants to save up in order to grow his capital and set up his own agency, making a name for himself within his industry.
Pain points: Financial that tools don’t consider freelancing incomes. Low visibility of financial movements throughout time.
Quote: “I love freelancing freedom, but it comes with the cost of low financial planning. I want a tool that helps me plan ahead, considering my variable income structure.”
Competitive Analysis
In order to understand what sort of solution I was going to design for my user group, I needed to know what solutions are already out there. The topic was broad, so I needed to narrow down my solution.

My first consideration was to build a bank app just so that I could include an automated investment option. After the second round of user testing, I decided to pivot in order to narrow down my value proposition. My competitive analysis gave me the references I needed to understand what solution my target user needed in order to overcome their pain points and achieve their goals.
The time came to start ideating a solution. This was the part where I encountered my biggest learning; the art of reduction for a broad-viewer.
3) Ideation
Note: This is an updated version of the core epic, user stories and task flow based on required pivoting. Due to time constraints, I was not able to include the entire process for both versions. However, the process, the versions and the pivoting is presented in the following steps, 04) Wireframes and 05) User Testing.
Epic: Budget Builder
The user stories in this epic cover the process of adding savings goals because the budget is based on the these goals. It also covers the login because the app connects to the user’s bank to automatically add their incomes and expenses information to generate the budget.
create a savings plan that is customized to my situation
As a Freelancing Young Professional, I want to…
So that...
I will be able to follow the plan.
see a breakdown of my expenses
I know where my money is being spent.
set a limit to my expenses
so that I don’t go over-budget.
separate my income in categories
my money is organized in a budget.
connect my savings plan to my bank history
my savings plan is realistic in relation to my financial behavior.
connect my savings plan to my bank history
my budget is made based on my history and my savings plan.
control the timeframe of my savings plan
foresee the future of my financial state.
In this task flow, the user starts by setting savings goals, followed by a login method that allows them to connect the app to their bank history so that it’s not necessary to enter expenses manually -although it can still be an option. Once the user makes that connection, their budget is generated based on their spending history and their savings goals.

Now it was time to make that solution come to life. I didn’t know it yet, but it would be a long ride.

4) Low Fidelity Wireframes
Paper Sketches
Version 1 (low fidelity)
After the carcass was done, it was time to test the flow. It wasn’t until after the 2nd round that I realized I would have to pivot in order to narrow down.

05) User Testing - Round 1 & 2

First Round of Tests
Version 2 (low fidelity)
After each round of user testing, I used a Design Prioritization Matrix to identify the most important issues based on design effort and user experience impact.

I found that there were many things that needed attention. Many were UI elements that had a lot of impact on the experience and ranged from high to low effort.
In the second iteration, I included the changes that resulted from solving the issues that appeared in the first round of user tests. This is where it started to become evident that my target user was more interested in a budgeting tool than an automated financial tool.
Second Round of Tests
After the second round of tests, it became clear that my solution required a bigger change than only UI elements. The issues that came up were more about the concept of the app than about usability.
Based on the opportunities found in the Experience Map and some potential areas of development from the Competitive Analysis, I ideated an all-in-one automated tool that would take care of every financial responsibility of my users. This idea was not effective. It implied that users would basically not do anything in the app except check the dashboard to see how the app was handling their finances and users did not entirely buy into the idea.

After the 2nd round, I narrowed down. Instead of being an automated investment bank app, my design became a custom budgeting app. Due to tighter time constraints, I was not able to test this new task flow, but I did update the necessary artifacts; user stories and task flow shown in step 3) ideation.
Version 3 (low fidelity)
In this 3rd iteration, I came up with what would be the low-fidelity wireframe of the final solution. I extracted a saving method called the Snowball Method from the comparative analysis. I found this method as an excel sheet and realized that other apps, such as YNAB or Goodbudget offered different types of saving methods. And so I designed the app for this specific one.
The app had a logical flow, now it was time to establish a strong brand that would represent the users and transmit the message they were looking for.

6) Branding

Based on the user interviews and secondary research from the first stages of the project, I could understand that users wanted to feel safe around the topic of finances. I defined key words that translated into moods for the user experience through my app. These key words were: Relatable, Reliable, Friendly, Easy, Orderly, and Practical.
Wordmark & colors
Domino was the chosen name because the domino effect represents the behavior and result of accumulated efforts of saving to reach goals.

For the wordmark, I made a falling domino, which represents each savings goal. When one goal is complete, this jumpstarts the next in a cumulative behavior until all goals are completed.

The colors were extracted from the moodboard. Shadow Blue was chosen as the brand color for its soothing effect, while Dark Olive was chosen as primary CTA color and Blood as accent colors that would indicate a warning throughout the app. American Bronze and Bright Gray were chosen as the neutrals.
Karla is a Google Fonts sans serif typeface designed to convey a sense of warmth and approachability, which was important for a financial app for GenZ and Millennials. Its rounded shapes and friendly letterforms evoke a feeling of familiarity and comfort. It is highly legible and versatile, making it suitable for a wide range of applications.

Grid System
The layout grid was chosen based on native mobile app best practices. Since the information displayed were in large amount numbers, it was important to have a hard grid that would serve as a guide for an organized design.
I chose a light background in most of the app to allow higher visibility of elements that would stand out, such as numbers or graphs. I chose to have a universal design, for the largest amount of people, without the need for adaptation or specialized design.
4 Column Grid
20 pt Gutter
20 pt Margin
8 pt Soft Grid
8 pt Hard Grid

After the branding was done, it was time to inject color into the mid-fidelity wireframes and turn it into a high-fidelity prototype.

7) High Fidelity

Version 4 (high fidelity)
After the branding was done, it was time inject color in the app. What can be seen is mostly light, and this is because I thought it would be important for a financial tool to convey transparency. I also added a few animations to make the experience interactive, and bring the design as close as possible to the actual product once it’s built.
Now that I had a product, I had to create a marketing website to start spreading the word.

8) Marketing Website

The marketing website should transmit the value proposition not only to target users, but anyone who might stumble upon it. I included a step-by-step animated design to communicate ease of use. I also included statistics of how it helps users save and other social proof in the form of reviews. I added bank logos to convey trustworthiness.

I got to the final version of the marketing website through peer feedback. Since a website should be seen on both desktop and mobile, I designed a mobile version as well. In the future, this design will be fully responsive and I’ll make a design for tablets.
Version 1
Looking back and going forward; what happened and what can else can be done?

9) Design Impact & Future Thinking

Design Impact
Domino brings freelancing young professionals an effective savings method that is variable-income-proof. It solves the pain point of low visibility of financial future state by giving users projected completion dates for their savings goals and visibility over their expenses. Its added value is that it calculates an ideal budget that allows them to reach their savings goals in the estimated date without affecting their lifestyle.
Next Steps
The next steps for Domino would be continuous improvements to usability and data visualization in order to make the flow clearer and easier to understand. The app also needs to follow iOS guidelines more strictly. Improvements can also be made to the marketing website, in order for it to accurately communicate the value proposition of the app and its benefits to the general public.

Using the Tarot Cards of Tech, by the Artefact Group, I was able to imagine future scenarios that would require new features and special attention to specific aspects of infrastructure. These would the next steps for Domino if it were to continue its design and development.
I would add a goal feature that allows multiple users to share the same goal. This would allow people to achieve goals together.
The necessary step to ensure user information safety is to have bank-level security. This would prevent an undesirable security breach.
I would add a donations feature in which users can choose a charity to donate to in the frequency of their choosing.
Made on