PROJECT TYPE
ACADEMIC
TOOLS
FIGMA, INVISION
TIMELINE
8 WEEKS
ROLE
UX / UI DESIGNER
PROBLEM SPACE
Why another finance app?
After entering my twenties, I found that a common conversation topic amongst friends became money. Unfortunately, it wasn’t necessarily a positive conversation; in fact, it usually entailed complaining about how our lack of knowledge, time, resources, combined with the pressure to become financially independent, caused stress and anxiety.
Our conversations and worries made me wonder whether other young adults in my generation felt similarly about their position of wealth and how their future looked to them in their eyes. I began my research to discover some staggering statistics about Millennials/Gen Zs and their relationship with money.
SECONDARY RESEARCH
What the statistics show
Through my research, I learned that Millennials and Gen Zs are evidently struggling with managing their money.
Among 1000 young adults from ages 20-30, financial concerns/debt was their third biggest concern (racism/discrimination and COVID-19 being first and second respectively) in a survey taken in May 2021.
Moreover, the primary emotions that young adults feel when thinking about the current state of their personal finances are anxiousness (41%), nervousness/confusion (40%), frustration (32%), and self-consciousness (30%).
The following are some more specific statistics regarding Millennials (born between 1981-1996) and their relationship with money:
Only 24% of millennials show signs of at least basic financial literacy.
22% of Millennials state that the reason they aren’t saving more money is because they “haven’t gotten to it”.
Millennials worry they will not be able to meet key financial goals, such as buying a house, paying off student loan debt, or saving for retirement.
56% of Millennials say they do not have a retirement savings account.
I also looked into more specific statistics regarding Gen Zs (born between 1997-2012) and their relationship with money:
46% of Gen Z have not been inside a bank in the past month.
56% of Gen Z discussed saving money with their parents in the last 6 months.
38.8% of Gen Z responded that they learned about personal finance from TikTok, YouTube or other social media outlets, like Twitter or Instagram.
33.70% of Gen Z indicated that they were not invested in anything.
INTERVIEWS
What people are saying
After learning these statistics, I wanted to know more specifically what Millennials and Gen Zs were currently doing to manage their finances and what they found to be the most challenging in that process.
To learn more about young adults' experiences with money management, I interviewed four Gen Zs and organized the feedback I gathered into shared struggles and insights.
Finding Resources
People find researching financial information to be a tedious and intimidating task.
Lack of Time
People find researching for financial information to be too time consuming.
Saving + Investing
Young adults feel that they don’t know enough about saving and investing, even though it’s a significant area of interest for them.
Seeking Advice
People want to be advised on how they should go about their saving/investment.
PERSONA
Meet Sara
From my interviewees, I was able to better understand the pain points, behaviours, and motivations of Millennials and Gen Zs when it came to money management. I then developed a persona that represented the shared insights from the interviews and extracted the persona’s experience map to better capture an optimal opportunity where I could help alleviate the pain point through my digital solution.
OPPORTUNITY SELECTION
Sara's experience map
After learning these statistics, I wanted to know more specifically what Millennials and Gen Zs were currently doing to manage their finances and what they found to be the most challenging in that process.
Examining Sara's experience map, I could see several opportunities where I could help alleviate her pain points. As I pondered about her motivations and pain points, I asked myself the following question:
How might we help young adults (Millennials to Gen Z) gain financial literacy in simple, engaging ways so they can feel more confident and proactive about their financial plans?
TASK SELECTION
Creating epics and writing stories
With the How Might We question in mind, I wrote out 25 user stories that would best meet the persona’s needs, as well as alleviate their stress points in their experience map.
Based on my Core Value Proposition, I selected the core epic of “Customize Personal Plan” and chose 2 user stories from that epic that could be developed into my primary and secondary tasks.
Core Value Proposition
Customize personal plan
Core Epic
Customize personal plan
User Stories
As a user, I want to set specific saving goals so that I can have a tangible goal to work towards.
As a user, I want to set my own limits for my budget so that I can maintain flexibility while limiting wasteful spending.
As a user, I want to invest in companies that I think have great potential so that my portfolio is reflective of my interests, passions, and values.
As a user, I want to prioritize certain financial goals so that I can focus on what is important to me.
As a user, I want to receive a custom plan on managing my finances so that I know what I should do to meet my financial goals.
As a user, I want to edit plans that are in place so that I am not restricted and can be flexible with my finances when unforeseen events occur.
As a user, I want to see all my finances in one platform so that I can keep my financial information organized and easily accessible.
As a user, I want to set multiple saving/financial goals so that I can reach a state of financial wellness quicker.
As a user, I want to see how my realistic my goals are so that I can set goals that are achievable.
As a user, I want to see how my custom plan was calculated by the app so that I can be confident it is reflective of my goals.
I then converted the two selected user stories into a task flow.
SKETCHES & WIREFRAMES
Bringing the idea to life
After I had worked out the task flow, I went online to look for inspiration on how I could make the task flow become a tangible product. I looked to existing finance apps such as WealthSimple and Intuit Mint for inspiration, as well as general UI inspiration for Sign Up flows and component inspiration.
Feeling inspired from my research, I began sketching out possible frames for my solution.
I then converted my final solution sketches into greyscale wireframes as shown below and stitched the screens together into my first prototype:
USABILITY TESTING
Is this product usable?
Now that I had my first mid-fidelity prototype ready, I wanted to conduct user testing to see how users would interact with the prototype and to learn how I could make the experience better for users.
I conducted two rounds of user testing, each with five participants. The testers were given 6 different tasks to complete. After the first round, I made iterations to the design before conducting the second round of user testing.
Here's a breakdown of how each round was conducted.
Testers
Number of Testers: 5
Qualifications:
-
Millennials or Gen Zs
-
Manage their own finances and use at least one application to do so
Scenario
The testers were given the scenario of the persona Sara, who feels as though she is lacking in financial literacy and is a first time user of this app.
Tasks
The testers were asked to create a new account as the persona Sara and edit the custom plan they received at the end of the onboarding process.
Testing Round 1 | Summary of Findings
-
The Login button on the top right corner confused users
-
Users found the custom plan and its related graphics difficult to understand
-
Users felt the Next button was out of reach (had to scroll too far down because it was not immediately visible)
-
Users felt that there was too much copy on the loading page and not enough time to read it all
After the iterations based on user testing feedback were complete, I conducted the second round of user testing.
Testing Round 2 | Summary of Findings
-
Users expressed that there was too much scrolling throughout the entire flow
-
Users were able to complete all tasks relatively smoothly
-
Most users thought Step 1 of the Sign Up process was different than what they were used to
-
Users expressed they would not read through the Security and Privacy page, but that they appreciated its inclusion
-
Some users wanted to drag the goals cards in order of importance rather than ranking it
After I completed the second round of iterations based on user testing feedback, I was ready to inject some colour into the prototype and really bring it to life.
Here's the final mid-fidelity wireflow that I converted to high-fidelity.
COLOUR & TYPOGRAPHY
Evoking the right mood
With the mid-fidelity flow iterated and finalized, it was time to add a distinct visual identity to the frames so that they could be converted to the high-fidelity prototype. I first came up with a list of adjectives that would embody the brand of the app.
Clean
Simple, easy to understand, not intimidating
Calming
Relaxed, chill, minimal, relieved
Trustworthy
Professional, reliable
3-Dimensional
Tangible, geometric, responsive, layered
Modern
Relevant, current, trendy
Thoughtful
Planned, organized, calculated
Using these phrases as a baseline, I searched for colours that evoked similar feelings. I also looked for typefaces that resonated the same tone, making sure it had many font variations as well as legibility.
LOGO DEVELOPMENT
A name that embodies the brand
I wanted to give the app a name that would be both memorable and relevant. I thought of a few different options that circulated around the theme of money/wealth/finance and settled on Coin in the end. I liked that its physical form was symbolic yet simple, as was the word itself.
I then went on to develop the logo and the wordmark. For the logo, I designed a simplified image of a coin entering a slot by using lines and a circle object.
ICONOGRAPHY
Intuitive icons that enhance the interactive experience
I knew that because the flow was a multi-step sign up process, the user would be focusing on completing the task at hand and getting to the next step. To prevent the user from feeling distracted or overwhelmed by too many features/options, I knew I wanted to keep icon usage to a minimum. Moreover, I knew most of the icons would be functional ones, so I wanted to ensure that their purpose was clearly illustrated.
Here is the final set of icons that were used in the high-fidelity design.
HIGH-FIDELITY DESIGN
Iterations, iterations, iterations...
Now that I had worked out the visual identity of the app, I began injecting colour into the first couple screens. I wanted to keep the interface clean and simple but still add a pop of colour so that users would feel engaged but not too overwhelmed.
Here are a couple iterations of colour injection.
Initially I tested out a green and pink combination that I had extracted from my mood board. However, I had to change this after I finalized the brand colours.
I was injecting the brand colours, but there wasn't enough variety of colour on the screen. I wanted to make use of the secondary and accent colours as well.
This was the last iteration that I ended up using for the high-fidelity prototype. It had a good balance of the chosen brand UI colours that were injected strategically on components to avoid overwhelming the user with too much colour.
Initially I tested out a green and pink combination that I had extracted from my mood board. However, I had to change this after I finalized the brand colours.
HIGH-FIDELITY PROTOTYPE
Putting the pieces together
After a few iterations of the home screen's high-fidelity design, I was finally ready to inject colour and apply the brand's typography to the rest of the screens.
NEXT STEPS
What's next?
Building an MVP
Although the first iteration of the high-fidelity flow is complete, Coin is far from completion. There is much more testing to do to refine and improve usability, and I'd like to build out other flows within the app as well.
Translating Coin into Other Platforms
If Coin were to be designed for another device, I would design desktop and tablet versions of the app. This is because during research interviews I learned that people also like to view their finances in a comprehensive manner. In one particular interview, the interviewee stated that they like to track their expenses on Google Sheets because it allows them to view the information on both their phone as well as a laptop. They also said that the laptop viewing experience was preferable because of how much data could be shown at once.
Design Impact
Conducting more tests to continue iterations, as well as considering long term design impacts such as how the app would impact the job market or how might the app be used for things other than its intended purpose, would also be part of Coin's next steps.
Moreover, I would also consider how I could make Coin more inclusive and accessible and to all people, and what features might enhance usability for those who experience disabilities.
KEY LEARNINGS
Small steps of progress is progress nonetheless
Over the past 8 weeks, I was challenged again and again to think creatively, problem solve efficiently, and iterate repeatedly. Though there were moments of uncertainty and self-doubt, the challenges grew me significantly as a designer, and I learned important lessons about the design process overall. There were two lessons that were particularly notable.
DON'T BE AFRAID TO ITERATE (AND THEN ITERATE AGAIN)
Even though it seems like backtracking at times, iterations improve your design, and many iterations build into significant progress. Testing and iterating only lead to a better version of your product.
Iterations are also great for testing out multiple options or variations of your product.
LISTEN TO THE USER
Throughout the design process, I had to continuously remind myself of the face that as a designer, I was designing for the user, not for myself. It was tempting to make decisions for my benefit or based on my personal preferences at times, but I quickly realized that doing so only created an aesthetically pleasing but functionally useless product.