Goalpot

UX/UI Design

Overview

Goalpot is a money-saving and money management tool that allows users to set goals for future events or purchases, or to simply stash money away for a rainy day. Users also have an overview of their weekly spending, as well as an overview of their net worth and liabilities.

Tools Used

Pen and Paper
Sketch
Invision
Balsamiq
Photoshop

Goal

To create a cohesive money saving tool that differentiates itself from other competitors on the app store.

My Role

UX/UI Designer

The Problem

Saving money these days can be extremely tough. Expenses seem to come out of nowhere and leave many with little to no disposable income. However, many people are unaware of how much money they're actually spending and where exactly this money is going. Goalpot strives to resolve this by showing users comprehensive overviews of their spending, net worth, and even allows them to stash away money either routinely or periodically.
‍
Problem Statement: "Saving money and keeping track of my finances can be very difficult."

Competitor Research

In order to get a better understanding of the wifi app landscape, I conducted a competitor analysis featuring similar products. I analyzed competitors such as Mint and Personal Capital to get an idea of what features they offer. After taking an in-depth look at each competitor, I knew my MVP needed to have features such as giving users different savings goals and the ability to link their bank accounts to the app in order to get a more in-depth overview.

User Stories & User Flow

After determining user end goals, I created a flowchart to illustrate the journey a user would partake in based on the problems the wish to solve on this app.

Low Fidelity Wireframes

Mid Fidelity Wireframes

The Brand

Goalpot emphasizes the importance of stashing away money and being savvy with spending for the sake of reaching financial goals faster. Goalpot's interface should reflect something sleek and modern. The app should be described as:
‍
- Sleek
- Modern
- Visual
- Straightforward
- Catering

I created a color scheme and chose a typeface I felt best described these adjectives.

Usability Testing

After completing the original set of screens, I conducted a usability test and asked a few peers about their initial thoughts on the app:

User 1:
“I was expecting to be asked finance related questions after making an account. Questions such as what goals do you have? Questions inquiring about my financial competency. Another example: ‘Tell us about your expenses’.”
‍
Solution:
Added Another Screen asking users introductory questions to get a sense of their financial stances and their goals.

User 2:
“As someone who uses finance apps all the time, I would like to see more visuals/charts.”

Solution:
Added a graph to the overview page where users can see a visual of their assets/liabilities. Chart can also be collapsed/hidden.

User 3:
“I think your current screens are great but maybe you should create the spending screen so people have an idea of what else the app offers.”
‍
Solution:
Created a new screen displaying user spending per card.

Final Screens

Key Takeaways

What went well:
Overall, I am very pleased with the final results. I think the interface is intuitive enough for users who are new to money saving apps. Getting input from colleagues also gave me insight on what exactly matters most to users.

What didn't go well:
‍I initially had issues with opacity and making sure there was a proper balance between the transparent elements and the text in front of it. I was able to resolve this issue after mentor feedback.

What can be improved:
‍Certain visual elements could've been improved such as the savings goal graphics. As far as testing goes, I wish I had more opportunities to conduct user testing in order to improve upon the existing user flow.
‍

Check out my other projects!