Close-up of a smartphone screen showing a banking app interface with account balances and options for saving and account management.
Fifth Third Bank logo featuring a blue shield with white numerals '5/3' and a green outline.

An Elevated Savings Experience

ROLE

UX DESIGNER | RESEARCHER

TIMELINE

80 HOURS

ESTIMATED READ

7 MINUTES

Smartphone screen displaying a banking app with greeting "Hi, Jane Doe!" and options for simulating savings.

Problem

Users (ages 27-37) who primarily rely on mobile banking and have diverse savings habits, are lacking an easy and intuitive way to save within the 5/3 mobile banking app

Goal

Develop a feature that simulates potential savings growth over projected time frames and implements a process that enables users to create automatic drafts from accounts into their existing savings accounts based on these projections.

Business Opportunity

Customer Retention
Selling Opportunities – Will allow the bank to offer additional services like credit cards, investment products, and loans.

Stable, Low-Cost Funding
Savings accounts provide a relatively stable and low-cost source of funds compared to other forms of borrowing, such as issuing bonds.

Regulatory Benefits
Having a strong deposit base improves financial health and regulatory standing, making it more stable and attractive to investors.

Boosts Liquidity & Financial Stability
A large number of savings deposits will improve liquidity, ensuring it can meet withdrawal demands while still maintaining lending operations.

Source of Funds for Lending
Deposits in savings accounts will fund loans (e.g., mortgages, business loans, and personal loans). 

User Insights

Digital avatar with a beard and glasses against a blue background with the text "I would like to get better at saving more money into a regular savings account."
Digital avatar of a person with blonde hair and glasses, showing a quote: “Receiving less money has made it hard to save” on a blue background.
Emoji face with quote about saving money on a blue background

Initial Ideas

Reviewing other fintech apps like Credit Karma that have simulator options and merging it with fifth third banks current savings options helped me originite low fidelity screens

Screenshot of the Credit Karma app's credit score simulator page, showing options to adjust credit card balance with a slider. It prompts users to log in to view current and estimated scores. Additional text informs about credit card utilization impact on credit scores. Website address is creditkarma.com.
Mobile banking app transfer screen showing options to transfer money from a checking to a savings account, with fields for transfer amount, date, and frequency. Available balances displayed.

Initial Sketches

Hand-drawn wireframe of a finance app, featuring layouts for Account Balance, Savings, Savings Simulator, and Creation pages with boxes for logos, titles, and buttons. Includes placeholders for balances, sliders, and buttons for navigation and confirmation.

The initial screens featured low-fidelity wireframes of 53rd’s existing account pages, incorporating a savings simulator banner to enhance user guidance. This insert helped users navigate the simulation process, illustrating potential savings based on various input variables.

Three pointing down hand emojis in different skin tones.

User Flow

User flow was the natural next step after initial sketches to see the progresssion of screens

Flowchart diagram showing steps for setting up a savings account, including screens for savings simulation, selecting contributions, frequency, duration, starting savings, creating autodraft, setting up transfer, reviewing, and confirmation.
Mobile banking app interface with pages for account balance, savings simulator, and creation page. Includes greetings to the user, sliders for setting savings amounts and intervals, and options to create automatic transfers from an account.

Lo-Fi Screens

By combining the user flow and initial sketches together the low fidelity screens were created to show an elevated but still rough version of the simulator process.

After creating Lo-Fi screens, a prototype was created for user testing. The goal was to understand how easy it is to find and navigate the simulator and how to complete the process.

Three pointing down hand emojis with different skin tones.

Users Feedback

“Dark Mode may be hard for some users, is there a light mode option to toggle?”


“Get Started/click me button is too small”

After User Feedback

Iterations

Mobile banking app interface showing a welcome message for "Jane Doe." Features include a savings simulator, account balances, dark/light mode toggle, and emphasis on saving goals and actions. Account balances display $1,234 in checking and $98.17 in savings. Navigation menu at bottom.

Final Screens

Click me to view full prototype

User testing


Cartoon character with glasses, beard, and blue background, text reads: 'Would save more with the simulator'
3D avatar with blonde hair and glasses above text "Process is seamless" on blue background
A 3D emoji face with a short beard and mustache, above the text "Easy to use" on a blue background.

Design Impact

Users would like a section to name what they are saving for. I would love to explore this option more after more user research. In the end all users were able to successfully create an auto-draft, and 75% of users said this feature would help them save more.

Two smartphones showing a banking app interface, featuring a savings simulator and account details for Fifth Third Momentum Savings, with options for transfer funds and checking account numbers.

View Similar Work

Sollievo app user interface displayed on multiple smartphones with artistic backgrounds.
Mobile app interface featuring "fitfare" branding, images of strawberries and citrus, fitness photos, and app navigation icons like dashboard and food log.

Fitfare: Rethinking Nutrition Tracking

Learn More