This project's focus is discovery research in order to gain insight on what users' main pain points and blockages are when it comes to saving money. The focus of this project is on young married couples and the added struggles of navigating a frustrating process alongside another person.
People usually know that they should be saving money for the future. Although people know about the need for saving for the future, it seems to be a struggle for people to achieve. The bills, incomes, wants and needs create limited options at times, and sometimes people just don’t want to deal with it. People lead busy lives which can make saving money feel like an impossible chore. Alongside that, in our day and age where prices only seem to rise and bills are sky high, saving money seems all the more unattainable. The "now", and the things people want, feel more important than what may come later.
Saving money is a hot topic conversation. There are many books, podcasts, speakers, tips and tricks to try and solve the "saving money problem". There have been some applications for web and mobile devices that try and assist users on their savings journey. Many of these are geared toward keeping track of spending.
UX & UI designer
Time constraint – this project timeline is limited to a month.
For the user interviews I wanted to learn about young couples' current experiences when wanting to be save money. This was exploratory research in order to find out where couples were struggling so that I could provide a solution tailored to their needs. Although this app could be used by many I learned from my previous projects that tackling a more specific target audience is helpful in focusing the work and the solution.
We want to know what roadblocks and pain points stop young married couples from saving money so that we can create a solution that helps them with this need.
In this research I really delved into the world of savings and the experiences of doing so as a couple.
Creating the affinity map, I learned about many important pains and needs on the user's side.
The main learnings were:
1. Planning, seeing the bigger picture and being on the same page as their spouse is very important in the savings process.
2. These young married couples have many goals they are saving for. They want to do what is necessary in order to ensure their future. They also want to do what is needed to accomplish their goals.
For original quality click hereAfter compiling the empathy map, I was able to create a persona based on that information. I later used this persona to create a solution based on the users' needs, motivations and pain points.
During my research the two main pain points were:
1. Frustration at limiting oneself now, for a hypothetical future need.
2. Users have many goals, and the bigger picture can be hard to see.
These two pain points were my focus on this project.
For original quality click hereThe user has two main tasks they want to accomplish:
1. Allocate the money they have to different goals.
2. Create goals to help them plan for their future.
I created a user flow that provided the users with the process of creating a goal and then allocating money to it in order to see what their bigger picture is.
For original quality click hereI created a sitemap to illustrate the overall navigation of the site. This allows a better understanding of what the site can do and offer the users.
For original quality click hereI started by building the wireframes. These wireframes are focused on layout without the design decisions, which allows us to discover issues we may not have seen in the sketching phase.
For original quality click hereFor original quality click hereFor original quality click hereFor original quality click hereI started with brainstorming name ideas, I was looking for something memorable and related to money saving. "MoGo" is a combination of "Money" and "Go", to help users getting started in a field that can be frustrating to begin. I then sketched some logo ideas. I digitized a few and selected one. I decided to go with a logo that was clear and simple, the arrow showing progress going up and reminding users of stocks. I then created variations of the logo for different use cases.
For original quality click hereBased on my research, I was able to create a brand UI kit. I decided the color style based on blue, which represents security and tranquility. I continued by choosing typography that is clear, calming and straightforward so that users wouldn't need to work hard to navigate. I continued by making the rest of the components fit the design decisions.
For original quality click hereNow that I had my wireframes and UI kit done, I proceeded to build the high-fidelity screens. These screens helped me visualize all the decisions coming together.
For original quality click hereFor original quality click hereFor original quality click hereFor original quality click hereI then proceeded to build the high-fidelity responsive screens. These screens showed how the site functions on a mobile device.
For original quality click hereFor original quality click hereFor original quality click hereI asked users to complete two tasks. One being finding a way to start a savings plan and the other to allocate money they made into a goal.
The goals of this usability test were:
1. Explore if app creates a good experience for users.
2. Improve user experience based on results.
3. Identify pain points throughout the process.
The usability tests proved successful. A few elements were noted that needed modifications.
A few of the insights were:
1. Users really loved seeing the bigger picture of what is saved, what is being saved and what they are working towards. Liked that this is focused on the future and practical things they need to do.
2. Users liked seeing the percentage saved monthly and overall progress.
3. The overall experience was intuitive and simple.
For original quality click hereAfter conducting usability tests, I discovered the design and layout issues users faced when completing the task of navigating the site. This led me to correct those issues in order to create a better user experience. Below are some of the main iterations made.
PROBLEM 1
Percentages not noticeable enough.
SOLUTION 1
Added color to percentages based on how far along in the process the user is.
PROBLEM 2
Hierarchy confusing, too many repeating buttons.
SOLUTION 2
Added tertiary button option and decided where to use each button.
PROBLEM 3
Arrows not noticeable enough.
SOLUTION 3
Designed arrows in more obvious style without being distracting.
PROBLEM 1
Table hierarchy unclear.
SOLUTION 1
Changed design into cards and highlighted titles to help with clarity.
PROBLEM 2
Sections in page not separated enough.
SOLUTION 2
Enhanced shadows to help separate sections.
PROBLEM 1
Too much happening on page, which confused users.
SOLUTION 1
Removed all elements from the page that weren't necessary.
PROBLEM 2
Radio buttons confused with progress bar in form.
SOLUTION 2
Changed design of progress bar.
PROBLEM 1
Titles confusing for some users.
SOLUTION 2
Renamed titles and added explanation "?" option to help users.
PROBLEM 1
Hierarchy confusing.
SOLUTION 2
Reorganized buttons in order of importance and grouped items to make sense next to each other.
For original quality click images
