Google UX Design Certificate Project 2
Money management and budgeting with Simple Budget responsive website and app
Building an easy way of managing finances
Empathize
Define
Ideate
Prototype
Test
Overview
Managing money does not come easy to everyone. National surveys show that young adults have amongst the lowest levels of financial literacy. They need more support and some education in the field of personal money management, planning, budgeting and saving to prevent them getting in debt, or constantly worrying about their finances.
High levels of financial stress manifest through physical symptoms like sleep loss, anxiety, headaches, compromised immune systems, digestive issues, high blood pressure, muscle tension, heart arrhythmia, depression, and a feeling of being overwhelmed.
Project goal:
Develop a prototype of the budgeting responsive website and app that will teach young adults and adults how to manage their money.
This product will help people to keep their life in balance preventing them from getting in debt, and insuring them that they have enough money for things they like and for things that are important for them.
Role
UX/UI designer, UX researcher
Project Duration
June 2022- Aug 2022
Responsibilities
User research, ideating, wireframing, prototyping, usability testing
Understanding the User:
- User research
- Personas
- Problem statements
- User journey maps
User research summary
The results of the user research revealed the information about different types of users, and their needs. And confirmed initial assumptions about main users needs:
- Users want to get some education about money management process and personal finances
- Users need a digital money management tool which is easy to use for people who are not financially educated
- Financial adviser to help them with reaching their goals, budgeting and saving, or getting out of debt.
User Pain Points
Lock of financial education
Some people never managed their finances and don’t now how to do this.
Apps are too complex
People that don’t have financial education struggle to use some money management apps because of its complexity and specific terminology
manual money management
It requires a lot of time and organization to track finances and expenses manually
lack of financial advice
People need for some expert advice on their specific financial situation
Personas
Julia
Problem statement
Julia is a full time working doctor and mom of two children
who needs time saving and easy way to manage her expenses because she does not have time and self-organization to manage it manually.
Peter
Problem statement
Peter is a full time working young adult who landed his first job and needs to learn how to manage his spendings because he does not want to get in debt.
User journey map
Mapping user journey for Julia and Peter revealed how helpful for the busy people would be creating money management and budgeting app.
.
Competitive audit
Starting the design
Paper wireframes
Crazy 8 technique was used to come up with ideas for the home page. Later, based on the most interesting ideas from this technique, paper wireframes were created.
Digital wireframes
The goal for the website was to create an easy way for young adults and adults to learn about saving, budgeting and money management.
The homepage consists of the information about the product, explains product’s functionality, provides educational posts for those who needs to get better understanding of the finances and money management.
Besides the homepage registered users can login to their personal dashboard where they can start budgeting and saving.
Low-Fidelity Prototype
The low-fidelity prototype connected user flows for returning users and new people who are discovering the product.
Usability study findings
Refining the design
After two rounds of usability studies, in order to address user pain points, some additional pages were created, the color scheme was refined to create functional and usable product.
The design of the dashboard was modified based on the usability study finding – it was difficult and time consuming for users to scroll down to find the information they needed. All blocks of information have been organized in the form of drop-down buttons for quick and easy access to the necessary information.
Based on the usability study finding about color similarity on the chart, that makes the chart very hard to view not only for color blinded people, the color scheme has been refined to create more contrast ,and to make the design easy to perceive for wider group of users.
High-fidelity Prototype
Responsive Design
Sitemap
The goal for the website was to provide clear and straightforward user flows for existing and new users.
Based on the users needs discovered during the research phase, a website provides all the important information for new users including learning resources, and easy and fast access to the personal dashboard for existing users.
Responsive designs
With responsive designs my website can be easily accessed from different screen sizes. While designing responsive screen designs, my main goal was to arrange all the important information in the way that is easy to perceive for wide groups of users and to make the website focused on the users needs discovered during the research.
My takeaways
This project helped me to gain practical knowledge in creating multi device user experience using mobile first approach.
I learned how to create responsive website using Progressive Advancement concept. It was a bit challenging to me to design first a simple version of the website that focuses only on the most important things. That was a great lesson in synthesizing information.
From user research I learned that users are different, with different needs, abilities, and situations when they access the website, and successful product design is based on the inclusiveness of the variety of human factors, needs and situations.