PayMate
An Overview
Challenge
With a multitude of finance apps available, it’s difficult to keep track of our spending and saving in one secure place.
Now that our information is accessible right at our fingertips, there comes a need for an all-encompassing finance tool to assist users of all levels of financial literacy.
Solution
PayMate is a digital wallet app that provides a convenient and secure way for anyone to shop, transfer money, and monitor their spending and savings in one place. I aimed to design an app that people would feel comfortable using to fulfill their financial needs, while also prioritizing security and learnability.
Easy money transfers
Have the ability to send and request money to friends, or transfer money between bank accounts
Set goals
Keep yourself accountable by setting multiple savings goals
Conducting research
Competitor Analysis
To start off this project, I conducted a competitive analysis of digital wallet apps Apple Pay and Venmo, which are popular for their simplicity and convenience.
By identifying their strengths, weaknesses, opportunities, and threats (SWOT analysis), I was better prepared to conduct my user interviews and surveys.
Key takeaways from the analysis:
User Surveys & Interviews
I surveyed 11 people between the ages 21-31 who handle their own finances, focusing on my target audiences' values, motivations, and financial habits.
After the survey, I conducted 3 user interviews with participants within the targeted age range of 21-35 to understand their thought processes and opinions on certain finance app features.
Key takeaways were that users want:
To feel secure with features such as multi-factor authentication.
To allocate money into their savings account rather than budget their spending.
To see a holistic review of their spending that’s easy to navigate.
Understanding the target audience
User Personas
Using the information gathered from my user surveys and interviews, I created 2 diverse personas focusing on their specific behaviors, motivations, needs & goals, and frustrations.
Creating personas helped me to understand the frustrations my potential users could experience before or while they use the app. Figuring out the reasons why they wanted certain features allowed me to design with intention.
User Journey Maps
To continue keeping user needs and goals in mind, I created created scenarios for my personas, showcasing each step they would take to accomplish their goals within the app.
Through this step, I was able to define key pain points and conceptualize specific features, such as:
Confirming who users are transferring money to/from
Making the process of reviewing expenses less intimidating
Card Sorting
My goal was to confirm that the app's information architecture aligned with user expectations and find smaller, intuitive groupings for the 5 existing categories.
The results of this exercise led me to organize the following sitemap below, based off of common categorization patterns.
Designing the product
Sketches
I began the design process with low-fidelity sketches and wireframes to accelerate decision-making through visualization. My sketches were based on the initial user interviews, the business goal, and the heuristic evaluation.
I focused on my app's 3 key features to design the following sketches:
Login / Signup
Send money
Create a savings goal
Wireframing & Prototyping
Using Figma, I translated my first sketches into mid-fidelity wireframes and prototypes, adding relevant icons and text for a more complete look.
By wireframing, I could identify what was learnable and familiar, finding the most optimal ways to perform a task and avoiding confusion.
By prototyping, I discovered the best use for transitions to guide users in the right direction.
Usability Testing
I conducted 6 usability tests with my functional, mid-fidelity prototype and made revisions to my screens based on the following discoveries:
Revision #1
Problem:
Users were unable to locate the goal-setting feature, instinctively navigating to the homepage instead
Solution:
Moved the goal-setting feature from the Reports page to the Dashboard for easier access
Transaction History was condensed into a “View transaction history” button
Revision #2
Problem:
Users were confused by the purpose of Reports page, which was similar to the Dashboard’s spending overview
“Manage Goals” button was vague
Solution:
Dedicated the Reports page to Monthly Reports and a detailed view of Goal progress
Remove the “Manage Goals” button
High-Fidelity & Visual Design
Once the usability issues were resolved and preference tests were completed, I designed the final screens in Figma and finalized my UI decisions.
By establishing color palettes, font choices, and creating components, I could define the overall look and feel of the app.
The Prototype
Learnings & Reflections
Usability tests are crucial to the design process and decision making.
When my test subjects had trouble finding the goal-setting feature, I was prompted to relocate not only that feature, but reconsider the entire homepage to be more comprehensive, creating a smoother user experience.
Everyone navigates an app differently.
Just because my app’s information architecture made sense to me, did not mean it made sense to everyone else. I learned to be prepared for my users to click the wrong button or navigate to a different page when completing a task.
Take a step beck.
Working to keep an open mind and detach myself from my existing designs would improve my design choices.