Anyone can save money
Context
Banks are old institutions, that need to adapt to new ways of saving money.
Saving money is not an easy task if you struggle with discipline or don’t have much time to spend. It’s a commitment.
Summit is designed to help balance your savings goals with priorities.
It is a financial mobile app and web app created during a UI student project, that helps non-tech people to save money quickly for a particular reason.
Challenge
Understanding the functionalities of a money saving app.
Design a positive experience for users that aren’t into tech and finance.
Create smooth and intuitive navigation.
Role
UX & UI
Tools
Figma
Duration
1 month (Part-time)
Saving time
Make your experience quick and smooth, especially if you are not a tech person.
Convenience
Provides an intuitive journey that keeps track of your expenses and incomes.
Safety
Includes secure login process and data protection system.
Approach
Research
Gathering design solutions from competitors and understanding how money-saving apps are working.
Branding
Defining a consistent and cohesive brand for the target user, representing :
Optimism
Freedom
Professionalism
User flow
Defining a meaningful user flow rythm. Generating a smooth, frustration-free navigation process, linking user’s bank account and creating their first saving goal.
Wireframe design
Creating UI and visual design.
Going back and forth between sketching, low to mid fidelity wireframes and user tests.
Feedbacks
Running several user tests using protoypes of grayscale wireframes.
Incorporating feedbacks and developing high-fidelity wireframes.
High-fidelity wireframe
Creating a pixel-sharp product design.
Summit interface
The educational and refreshing interface helps users to navigate smoothly and visualize their spending habits.
Users can shape their goals
According to their expenses and incomes, thanks to an auto-calculator.
Link a bank
This app feature helps users to receive accurate information about their balance, and calculate automatically the right amount and duration for their saving goals without stress and knowledge about finance & tech apps.
Create a goal screen
The saving recurrence, will calculate how long it’s going to take to get to your goal.
Duration will influence the recurrence; so that saving amount is calculated automatically from the user’s spending habits.
There are a lot of reasons to save money.
Presenting a list of common goals, easily accessible; as well as a search function for the user to type directly for more suited choices. This would have also for effect to limit cognitive overload.
Goal screens
The user can adjust goals at anytime and is also able to change their trajectory if needed.
To deliver a tailored goal-saving strategy plan, this extra feature helps and encourages the user through the saving money process.
Gathering design solutions
The research phase allowed me to gather significant design ideas and features from competitors. Also it helped me to get visual inspirations to create a corporate brand guideline.
User flow
Signing up process
An important point was to simplify the signing up process and avoiding the user to click “next” caused from confusions.
Therefore 2 options are possible:
Option 1
Avoiding to many steps to accomplish the signing task and encouraging the user to link their bank account in order to be able to have an accurate representation of their actual balance.
Option 2
In order to create a saving plan right a way, allowing the user to understand the aim of the app, and develop a taste for it. After setting a goal, the user will have the possibility to “link to their bank”
Brand guideline
Typography
Colors
Reflection
The main challenges was time, I had very little time to understand how a saving-money works.
Thankfully, I could remember my past studies in Business management and excel spreadsheet; on how to calculate the sum of different sources of revenues with percentages. I also asked people from my surrounding that are into tech and ask them to be part of feedback sessions.
This research became a very instructive project from the UI and UX perspective.
It allowed me to structure better component systems and my thinking process more effectivly.
There are many ways to achieve a great design experience, and I had to analyze many other existing apps, to understand what problem they were trying to solve.
I got lost into the different visual possibilities but I found a way to minimalize the visual design by bringing back the famous design approach “less is more”.
I also established a consistent component and color system to bring homogenity and coherency all along the design process.
Keys to take away
Involving early stage testing & user feedback proved me again how necessary this process is. It also helps to find design solutions more rapidly and to take better visual direction.
Keeping my visual design as simple and clear as possible to develop a consistent and structured design process
