sprout
Budgeting Has Never Been Easier.
Problem
Sprout is a mobile budgeting application for young adults who are looking to manage their finances for long term stability and success.
Role
UX Designer
UI Designer
Tools
Sketch
Invision
Success Metric
Application Downloads
Featured in: best luxury app design
A P P R O A C H
Design Process
D I S C O V E R
Competitive Analysis
I performed a competitive analysis to gain insight on how other applications are tackling similar problems. This helped me to understand what worked well for existing budgeting products and what could be improved.
D I S C O V E R Y
User Persona
Mark Smith
Mark is a young adult a couple years into his career as an engineer. After graduating from college, Mark moved to Tampa Florida for a change of scenery. Mark enjoys spending time with family & friends, going to the beach, and exploring the city! He is passionate about innovation and wants to make a difference in the world. Being so busy, he doesn’t have a lot of time to plan out his finances and track his money. That is why Mark turned to Sprout to do it for him! While using Sprout he is also able to quickly and efficiently learn how to set himself up for financial success.
Frustrations
Not knowing where to start with his finances
Manually tracking his expenses
Wasting time
Inefficiencies
Goals
Stress less
Drive innovation
Explore new places
Spend time with loved ones
I D E A T E
User Stories
I D E A T E
User Flow
Based on the defined users and user stories, I combined the tasks into a user flow to understand how a user would navigate through the application.
I D E A T E
Low-Fidelity Wireframes
After determining the user flows and jobs to be done for my MVP, I went to the sketch pad and preformed the crazy 8’s method of rapid sketching for my initial design ideas.
P R O T O T Y P E
Mid-Fidelity Wireframes
Once I had a solid foundation for my low-fidelity wireframes above, I created my mid-fidelity screens in Sketch. In order to be compliant with iOS and Material design requirements I reviewed the “Human Interface” and “Material Design” guidelines and designed my screens accordingly.
D E S I G N
Style Guide
The visual direction of Sprout is simple, fresh and clean. With the look and feel of the brand defined, I created a style guide to maintain a consistent UI throughout the application.
U I D E S I G N
Final Screens
Onboarding
A smooth and easy onboarding which explains the apps key features.
Home
View all your spending and earning in one place.
A complete look at all your accounts from a birds eye view.
Set Budgets And Goals
Set budgets in specific categories. Build budgets and goals based off of Sprout’s financial recommendations and your spending history.
Connect All Your Accounts
Sync all your bank accounts to Sprout and get a glimpse of all your finances in one place.
Learn Financial Success
Sprout helps young professionals manage their money wisely. Get started learning with Sprout’s educational content and videos.
Android Screens
P O S T P R O J E C T
Reflection
What went well?
It was challenging to balance the serious nature of budgeting/ finances with a look and feel that would resonate with to a fun, young, and modern audience. Ultimately I think my end result created a friendly look and feel that will attract users less familiar with finances and make budgeting less intimidating.
What were the challenges?
The hardest challenge of this project was understanding and applying both the Material and Human Design Interface guidelines. It was interesting to distinguish how and when each guideline should be applied in order to provide familiarity to the user, while also maintaining consistency and working with Sprout’s branding.
What would you do differently?
In my first design round I used the colors blue and purple for the sprout app. After getting feedback and testing the colors in an accessibility checker, I realized that they were too similar and users with visual impairments could have trouble telling the colors apart. After this I revised my colors to be green and aqua; improving the contrast and accessibility for users.