Wells Fargo Budget Envelope Savings Account
A tool system helps users set aside what they need for bills while maintaining a personal budget.
Research | Definition | Ideation | Prototype | Testing
Background
A Bankers Life
I’ve worked in the banking industry for almost 5 years and during this time, I realized that many people, all ages, don’t take time to budget their money. This causes them to been in a hole financially.
Problem
Money Hole
Wells Fargo offers a savings plan and budget watch that tracks spending but does not help them stay on track with their financial needs.
Objective
Save Time, Save Money
Create a budget envelope savings account that helps users set aside what they need for their bills while maintaining a personal budget.
Money Dive
Research Methods
User Survey
Market Research Anaylsis
May the best man win!
To gain an understanding of the budgeting tools banks offer for their customers I conducted a Competitive Analysis on three well known competitors.
Core Customer Needs
I also started brainstorming the elements of someone with successful budgeting habits and decided to get users input on their habits. I wanted to know how they save? Do you use budgeting tools? Are you prepared for emergencies? Why would you use a budgeting tool.
User wants when budgeting
User needs when budgeting
Data was sampled from 5 people
“It’s important for me to stick to a budget since I have a child but it is also complex because I am in my late 20’s and still like to go out and enjoy life. I need a tool that will help me stay on track with the needs of my child while also ensuring I have enough funds to live my life as well.”- Quote from user survey
User persona
Meet Blaze, A recent graduate stepping out into the ‘real world’. Blaze was so excited about graduating with his Masters that he forgot how hard it may be balancing work, bills, and his free time on a salary budget.
Definition
Sitemap
Diving deeper into users budgeting behavior, it has become clear that many users created bad budgeting behaviors young, which can stick to a person for a long time. Below, I created a sitemap and flows that users can navigate efficiently.
User Flow
Open Budget Account: Blaze is a single 27 year old male who just received his first full time job. He also just moved into an apartment for the first time and needs help with budgeting his monthly bills. His primary bank is Wells Fargo, so he sets up his direct deposit to his account. Since he will have more responsibilities, he decides to open a Budget Envelope account with Wells Fargo to help assist with his saving goals.
Task Flow
Open Budget Account: Opening a Budget Envelope account for the first time.
Ideation
Creating the sitemap and user/task flow made the process of creating the final mockup easier. I wanted to replicate the original Wells Fargo app while also making users aware of the new feature.
Low/Mid Fi Wireframes
I created screens that Wells Fargo already had and created but they would reflect the Budget Envelop account. I created the Budget Envelope, Account and Congrats pages.
UI Kit and Hi Fi Mockup
A few Hi Fi Mockup screens and UI Kit created from mockups. UI kit consisted of Typography, color palette, components, and buttons that I created for the site.
Prototype Before Usability Test
Testing
Testing Goals:
Test discoverability of the added budget feature.
Test efficiency and memorability.
Learn about users behavior when interacting with the product, especially when they are in the process of opening an account.
Priority Revisions
Below are high priority screens based on feedback from testing.
Link Accounts
Key Finding: In the initial mockup, the linked account was not added to the verify information.
Solution: This account has been added to ensure accuracy.
Before
After
Congrats
Key Finding: During testing, The ‘Congratulations’ screen didn’t grab the users attention and users weren’t reading information provided.
Solution: Added a layover page to the confirmation page.
Before
After
Verify Your Identity (New!)
Key Finding: During testing, it was noted to add a security feature to the app. A few users have had their accounts hacked and wanted to be sure their account was safe when they logged in.
Solution: Added Dual Authentication
Next Steps And Reflection
Possible Next Steps
If given more time to work on this project, I would add a tool to the Wells Fargo app where users could manually breakdown their monthly expenses. They would be able to give themselves a spending/savings goal, and if they a close to going over the goal or if they do go over that goal they will receive a notification reminding them that they are close/ met their goal and that they are about to over spend for the month.
I would also create more screens and conduct another usability test to enhance the user experience. Once the screens are completed I would get the site ready for handoff.
Reflection
I was excited to start this project because I have been in the banking industry going on 5 years and during my experience I have realized how important it is to have money saved. You never know what may happen so it is crucial to stay prepared for emergencies.
Since I bank with Wells Fargo, I was excited to recreate their site to the best of my ability. Making sure the font, text size, and color palettes were as close to their website as possible was probably my biggest challenge. I really took my time analyzing their website to make sure there was a resemblance. Although I had challenges, seeing the product come to life was the most exciting part!
View Other Projects
Zo’s Doggy Trail
Vinson Landscaping
The Radical Chef