Pockets: See Your Money Clearly

A capstone UX project designed to turn financial chaos into visual clarity β€” through intention and mobile pay.

The Problem

1 in 3 young adults lack financial literacy.

Traditional banking apps are abstract and passive β€” they don’t show where your money is going or how to manage it in real time.

No budget
No visibility
No system

This leads to stress, avoidance, and financial anxiety. People are guessing their way through money management.

How I Investigated

I launched an open-ended survey and conducted live interviews with young adults to understand their real-world frustrations, habits, and financial anxiety triggers.

πŸ“ Survey & demographic targeting
🎀 Interview sessions with guide
🧠 Affinity & empathy mapping
πŸ‘€ Personas & behavioral insights

Interview Participants

Participant #1

🧍 Age: 21–25

πŸ’Ό Works: 31–40 hrs

😊 Comfortable: 3/5

πŸ’ͺ Confident: 3/5


πŸ’³ Expenses:
car, cell, credit, rent, subs, other

🏦 Loans:
student, auto

πŸ“† Credit Card Use: 3–6Γ—/mo


😰 Stress: a lot
(70% financial)

Participant #2

🧍 Age: 26–31

πŸ’Ό Works: 40+ hrs

😊 Comfortable: 2/5

πŸ’ͺ Confident: 2/5


πŸ’³ Expenses:
rent, cell, utilities, credit, subs, other

🏦 Loans:
student, credit

πŸ“† Credit Card Use: 11+Γ—/mo


😰 Stress: a lot
(80% financial)

Participant #3

🧍 Age: 32+

πŸ’Ό Works: 40+ hrs

😊 Comfortable: 2/5

πŸ’ͺ Confident: 2/5


πŸ’³ Expenses:
rent, car, cell, utilities, credit, subs

🏦 Loans:
auto

πŸ“† Credit Card Use: 1–2Γ—/mo


😰 Stress: always
(80% financial)

Participant #4

🧍 Age: 21–25

πŸ’Ό Works: 31–40 hrs

😊 Comfortable: 4/5

πŸ’ͺ Confident: 3/5


πŸ’³ Expenses:
car, cell, rent, credit card, subs

🏦 Loans:
auto

πŸ“† Credit Card Use: 3–6Γ—/mo


😰 Stress: most of the time
(50% financial)

Participant #5

🧍 Age: 32+

πŸ’Ό Works: 11–20 hrs

😊 Comfortable: 2/5

πŸ’ͺ Confident: 2/5


πŸ’³ Expenses:
rent, car, cell, utilities, credit card, subs

🏦 Loans:
student, auto, credit

πŸ“† Credit Card Use: 11+Γ—/mo


😰 Stress: always
(70% financial)

Participant #6

🧍 Age: 21–25

πŸ’Ό Works: 32–40 hrs

😊 Comfortable: 3/5

πŸ’ͺ Confident: 3/5


πŸ’³ Expenses:
rent, cell, utilities, subs

🚫 No credit card


😰 Stress: often
(30% financial)

User Insight

Most users just want to know:

β€œHow much do I actually have to spend right now?”
β€œBeing able to see visually on a piece of paper what I am spending is everything.”

Meet Mia

A 24-year-old full-time worker who struggles to track spending and wants a more visual way to spend money.

Persona Mia

What Competitors Miss

I evaluated Mint, Simplifi, and EveryDollar β€” three of the most popular budgeting tools on the market β€” through a heuristic lens and live testing.

Each of them offers features like account linking, budgeting tools, and clean interfaces. But all three fall short on one core experience:

β€œHow much money do I actually have to spend right now?”

Budget bars, category breakdowns, and past spending summaries still require users to do the math and interpret what it means for the next purchase.

All three apps fail to show how much money a user actually has to spend in real time. They surface useful data β€” but leave the work of making it usable up to the user.

β€œMost tools treat budgeting like a ledger β€” not a living, breathing process. If we were still managing cash, none of these apps would actually help you handle it day to day.”
Mint UI

Mint

Simplifi UI

Simplifi

EveryDollar UI

EveryDollar

Synthesis & Opportunity

From the research emerged a common emotional thread: people don’t just need budgeting tools β€” they need support, clarity, and control.

β€œBeing able to see visually on a piece of paper what I’m spending is everything.”

How might we help people make confident financial decisions β€” without stress?

How might we provide resources that help people stay aware and prepared?

How might we organize financial information so it’s easy to digest and interact with?

Designing the Experience

The Vision

Pockets is a mobile app that connects to your bank, lets you allocate money to named Pockets (like β€œFood” or β€œRent”), and pay directly from those Pockets β€” so you always know what’s left.

Ideation

I began with a broad brainstorm to explore what a better relationship with money could look like.

Ideation Sticky Notes

MVP Prioritization

I defined the MVP by prioritizing user stories, then mapped out the key steps users would take to achieve their goals β€” forming the foundation for the product’s structure.

Affinity Mapping

Map of early user stories

User Story Mapping

Define MVP scope

How It Works

The core flow: connect your bank, fill your Pockets, spend with intention.

Core Flow Diagram

Red Routes

These are the essential actions a user must be able to complete quickly and reliably.

Paper Prototype

β€œAll inclusive, easy interface. Allocating money that can be used in real time would be ideal.”

Quick sketches helped validate flow, visibility, and emotional trust before jumping into Figma.

View Live Prototype β†—

Wireframes & Flows

Turning sketches into digital wireframes brought clarity to core mechanics and exposed gaps in logic β€” helping refine the product's structure before high-fidelity design.

Wireframe Overview

Core Function: Mobile Pay with a Pocket

A walkthrough of the most critical task: spending directly from a Pocket β€” the moment where clarity and control meet.

Key Wireflows

These flows helped validate how users would initiate, split, and complete payments inside the app.

Flow Step 1

User initiates a payment from a specific Tile or account.

Flow Step 2

Adding new pockets, expenses, accounts, and money

Flow Step 3

Pay expenses right form your pocket

Edge Case Handling

We mapped edge cases like failed bank connections, $0 Pocket spending, and complex split pays β€” making sure users never hit a dead end.

Split Payment

Edge Case: Not enough in a Pocket β€” triggers Split Pay logic

Post Pay

Paying with a Pocket doesn't always happen at the register. For physical card transactions, users can open the app afterward and assign that expense to a Pocket β€” so their visual balance reflects the real-world spend.

Watch how the system resolves this in real time

High-Fidelity Design Flows

These polished screens illustrate how Pockets guides users through their most critical financial actions β€” from allocating funds to real-time mobile payments.

Main Hi-Fi Screen Flow

Pockets home, calendar, bank view, and core mobile pay logic.

Pay Flow Step-by-Step

Selecting a Pocket, handling split pay, and assigning transactions retroactively.

Add new content

Adding pockets, expenses, and accounts.

Testing & Iteration

I conducted usability testing with participants from the target demographic: young adults managing full-time or part-time finances. The goal was to assess how well key flows worked and whether users could navigate core features intuitively.

Key Tasks Tested

  • Use Mobile Pay at checkout
  • Complete a Split Pay when a Pocket lacks funds
  • Cover a debit card transaction using a Pocket
  • Add an expense or Pocket
  • Pay a recurring bill (ex. Storage)

Notable Frictions

  • πŸ’‘ Split Pay was the most difficult interaction
  • πŸ” Users didn’t clearly understand payment types
  • πŸ“± Mobile Pay UI confused users on next steps
  • 🧩 Confirmation screens caused hesitation
  • βž• Add Pocket/Add Expense buttons weren’t intuitive

Feedback led to key revisions across UI language, flow hierarchy, and toggle behaviors β€” especially around split payment logic, categorization, and post-transaction actions.

Test Analysis Chart

Summary of key user pain points across flows

Final Designs

These high-fidelity screens represent the culmination of Pockets’ design β€” focused on clarity, trust, and control. While these flows marked the official end of the capstone, they also laid the groundwork for what's coming next.

Final Device Mockup
Home Screen Activity Screen Calendar Screen Transactions Screen Pay Overview Mobile Pay Pay Expense

Next: I plan to iterate on this system and begin prototyping a real version of Pockets β€” one that links live accounts and makes mobile pay from named buckets a reality.

Snowboarder Cursor