Mobile App and Website Design
Elevate
Elevate is a financial management tool available as both an app and a responsive website. It helps users save and budget their funds through interactive tools and educational resources. The design ensures accessibility across devices with an intuitive interface, making it easy for users to manage their finances and track their progress.
| Solo Project
| My Role
User Experience Designer - User Research, Visual Design
| Timeline
July 2024 - August 2024
| Tools
Figma
Context
As part of Google’s UX Design Certificate program, I undertook a solo project.
Problem
Many individuals struggle with effectively managing their personal finances, including tracking expenses, setting savings goals, and creating realistic budgets.
Solution
To address this problem by offering a user-friendly app and responsive website that provide tools and resources for budgeting and saving, helping users gain control over their finances and improve their financial health.
Understanding the User
Research
The User Research for this app focused on understanding common financial management challenges and preferences. By comparing popular websites and apps that offer similar benefits, I looked into what they lack on and what this app could potentially benefit from. This would include key pain points such as difficulties with budgeting, tracking expenses, and setting savings goals. The use feedback was also beneficial as it allowed for an intuitive, cross platform tool that offers clear guidance and interactive features.
User Pain Points
-
Complexity and usability. Users often find budgeting tools complicated or overwhelming, with unclear navigation and too many features that make it hard to understand how to use them effectively
-
Generic advice and templates that don’t account for individual financial situations or goals can make it challenging for users ot create budgets that are truly relevant to their needs.
-
Poor mobile and web responsiveness or inadequate accessibility features can hinder usability for users on different devices or those with disabilities
-
Some budgeting apps may have expensive subscription fees or hidden charges, which can deter users from fully utilizing the app or lead to dissatisfaction
Personas
Sarah Lopez
Age: 35
Education: Bachelor’s Degree in Business Administration
Hometown: Chicago, Illinois
Family: Upper Middle Class
Occupation: Marketing Manager at a Medium-Sized tech company
“Balancing our family's needs with our financial goals requires careful planning and smart budgeting”
Goals
Sarah aims to effectively manage her family’s finances, including saving for her children’s education and planning for retirement. She also wants to use a financial management app to simplify budgeting and track expenses efficiently
Frustrations
Difficulty in finding time to manage finances amidst a busy work and family schedule. She also have challenges in sticking to a budget due to unexpected expenses and varying monthly income
Problem Statement
Sarah Lopez, encapsulates the challenges and aspirations of a middle-aged professional balancing career, family, and financial responsibilities.
Javier Tan
Age: 24
Education: Currently Pursuing a Bachelor’s Degree in Engineering
Hometown: Miami, Florida
Family: Lower Class
Occupation: Part-time retail associate and freelance web designer
“I want to learn how to manage my money better so i can save up for travel and eventually start investing”
Goals
Javier aims to improve his budgeting skills and establish savings habits despite his variable income. He also wants to use a financial app to track expenses, set achievable savings goals and gain financial independence
Frustrations
He struggles with sticking to a budget due to irregular income from freelance work and fluctuating expenses. As well as limited knowledge of financial planning and investing, unsure where to start
Problem Statement
Javier Martinez, reflects the challenges and aspirations of a young adult navigating through education, part-time work, and freelance gigs while striving to achieve financial stability and pursue long-term financial goals.
Emma Thompson
Age: 42
Education: Associate’s Degree in Nursing
Hometown: Austin, Texas
Family: Middle Class
Occupation: Registered Nurse at a local hospital
“As a single parent, managing finances and preparing for unexpected expenses are my top priorities”
Goals
Emma wants to effectively manage her household finances, including budgeting for her children’s education and saving for emergencies. She also seeks a financial app that simplifies budget tracking and helps her make informed financial decisions.
Frustrations
Balancing work shifts with parenting responsibilities leaves little time for detailed financial planning. Concerns about not having enough savings for her children’s future needs and unexpected expenses.
Problem Statement
Emma Thompson, represents the challenges and priorities of a single parent balancing a demanding career in healthcare with the financial responsibilities of raising teenagers.
William Johnson
Age: 68
Education: High School Diploma
Hometown: Denver, Colorado
Family: Lower Middle Class
Occupation: Stay at home parent
“I want to make sure my retirement savings last and manage my expenses without the hassle of complicated technology”
Goals
He aims to effectively manage his retirement savings and living expenses on a fixed income. He seeks a financial app that is easy to use, helps him track spending and ensures he can live comfortably within his means
Frustrations
Difficulty in understanding and using complex technology, preferes simplicity in financial tools. As well and his concerns about managing healthcare costs and unexpected home repairs on a limited budget
Problem Statement
William Johnson, highlights the challenges and preferences of an older adult who values simplicity and ease of use in financial tools.
Starting the Design
This feature allows users to keep track of their financial progress, providing them with a detailed view of their achievements and advancements over time.
Wireframes
By integrating the most compelling elements from the 8 different designs I developed, I crafted a detailed sketch of the home screen. This refined sketch represents the culmination of my design process and will serve as the final version for the home screen.
Crazy 8
This exercise allowed me to sketch 8 distinct ideas in just 8 minutes. By using this method, I was able to generate 8 unique home screens, from which I can choose elements to incorporate into my final design.
Digital Wireframes
Given the need for user-friendliness and the provision of tools and resources, each design element was carefully considered to ensure a comprehensive and intuitive experience for all users.
In addition to the mobile design, I also developed a digital wireframe for the website. This wireframe seamlessly incorporates the elements of the mobile app into the website, ensuring a cohesive user experience across platforms.
This feature provides users with a detailed overview of their income alongside their anticipated take-home pay, offering a more personalized perspective on their financial situation.
Low-Fidelity Prototype
This prototype was utilized in my usability study, which enabled me to gather findings that could be applied to make revisions later in the design process.
Findings
Unclear on how to navigate the home page at first
Most users figure out how to get started within a few seconds
Enjoyed how each feature is organized into its own section
Instinctively tapped the plus icon when ensure when unsure of the next steps
Usability Study
Refining the Design
Revamping the Solutions After User Feedback
Before the usability study
After usability study
The usability study highlighted that the prominently centered big button might have caused some confusion. By positioning it away from the main notch, users have the flexibility to use the button for adding items, allowing for quick access to primary actions, significantly improving user engagement and interaction
Hi-Fidelity Prototypes
Mobile
Website
Going Forward
Impact
The project emphasizes the need for a financial management app that improves usability and user satisfaction through accessible, user-friendly design. This enhances confidence and control, leading to better budgeting and financial decisions.
Takeaways
What I Learned
Designing for accessibility ensures the app is usable by all, including those with visual impairments or limited tech skills. Customizable features improve user experience by allowing personalization for financial goals. Clear instructions, accessible help resources, and responsive support are essential for effective user guidance and issue resolution.