UnFold is a mobile app and website that serves as a resource for teenagers who are interested in learning about financial planning.
My Role: UX/UI Design, Graphic Design
Scope: User Research, Competitive Analysis, Wireframing, Prototyping, User Testing, Visual Identity
Project Duration: April – June 2023
Goal
Over 50% of U.S. Teens feel unprepared to finance their futures, due to their lack of financial literacy. The cost of higher education, food, and transportation has risen significantly after the pandemic. As a result, the interest in learning about budgeting and saving has increased.
To address this problem, I created a digital tool with intuitive budgeting features, educational resources, and video tutorials. My goal was to provide an engaging and informative way to improve youth individuals’ financial knowledge.
User Research
I conducted user interviews with both parents and teenagers to find out how important it would be to learn about budgeting, what challenges they currently have with money, and how likely they would use a financial app on a regular basis.
I discovered that teenagers often wanted to achieve financial goals, but struggled to limit their reckless spending habits. According to a UX research study by Nielsen Norman Group, teenagers have lower reading abilities and prefer interactive features such as quizzes and games, rather than reading.
I used a mobile-first approach to cater to a younger target user between the ages of 13-19. This way, they could use the app both on and offline, allowing them to access the app in many areas geographically.
User Personas
Problem Statement:
Maria is a working high school student often spending on activities with her friends, who needs features that will help her decrease her spending habits.
Problem Statement:
Jacob is a barista and dependable caregiver who needs an easy yet engaging way for him to track his savings and expenses so that he can continue supporting his mother.
Competitive Analysis
Step helps teenagers open their first bank account and set up their credit cards.
Their website features interactive animations, consistent branding, compelling testimonials, and easy-to-follow web pages, making them my strongest direct competitor.
FamZoo targets both kids and teens, teaching them about finance.
I found their website layout difficult to follow, their images outdated, and their overall branding style not appealing to teenagers
Toshl Finance helps individuals aged 12 and above in creating budgets and savings plans, primarily targeting an older audience.
The tool is excellent for budgeting, offering a range of charts to effectively track your income.
Ideation
I used ideation exercises like crazy eights to come up with potential layouts for the screens. I included a task list for financial goals, large images, text, and illustrations to keep my user engaged.
Ideation Exercises
Digital Wireframes
Test
I ran moderated usability tests with 5 participants, lasting 5-15 minutes. I categorized my findings in an affinity diagram, and found 3 themes:
- Some of the back buttons on the screens were not working, causing frustration.
- Users found that the home page could be easier to navigate, and they felt that the learning resources were ‘hidden.’
- After exploring the current features, users expressed a desire to see more ways to save money, such as offering deals and discounts.
High-fidelity prototype
After fixing bugs, changing the layout, and adding features based on my user’s feedback, I created the prototype with the new visual identity.
Components & icons
Sitemap for responsive website
Responsive website
My responsive website followed a similar layout to the dedicated mobile app. I designed mobile, tablet, and desktop screens for different users. By following the UX process, I developed a digital tool that will be helpful for youth individuals who want to prepare for their financial future.
Challenge
My main challenge was to create a personalized score and plan for the user when they complete the questionnaire. I was able to create one potential score that a user could get from their answers.
Next Steps
- Create a personalized score screen and recommendation for teens based on their answers on the questionnaire
- Run more usability tests to see the effectiveness of the personalized score
Takeaways
- Never stop iterating: After countless screen changes and layouts, I learned to keep learning and improving my designs. You never arrive at the final solution right away.
- Listen to users: Throughout this project, I understood the importance of empathizing with teen users pain points