UFinance

Student Budgeting App

UFinance aims to empower students with the tools they need to manage their personal finances efficiently, reduce financial stress, and build better spending habits for the future.

UFinance interface

Institution University of Michigan, School of Information
Course SI 582: Interaction Design
Timeline Fall 2024
Team 4 Members

Students often lack clear visibility into their spending.

Without intuitive tools, they fall into habits of overspending, forgetting due payments, and mismanaging money across multiple platforms (e.g., Venmo, Cash App, credit cards).

How might we help students easily track daily spending across categories like food, transportation, and entertainment to plan expenses and identify areas to save?

User Interviews

We interviewed 10 college students (ages 18โ€“26) with varied financial habits and tools (Excel, Mint, pen & paper).

01

Familiarity Wins Trust ๐Ÿ”จ

"I've been using Excel for years. I trust it more than apps because I can see exactly what's happening."

02

Privacy is Paramount ๐Ÿ”’

"Privacy is always a concern when handling sensitive financial information."

03

Need for Visual Clarity ๐Ÿ“Š

"It would be great if apps categorized Venmo payments automatically."

04

Peer Pressure = Overspending ๐Ÿ›๏ธ

"Living in NYC, it's hard not to overspend โ€” especially with my friends."

Personas

Based on our interviews, we developed two personas to represent the core student archetypes using UFinance.

Persona 1 Persona 2

User Flows and Information Architecture

We first created an Information Architecture of the entire app after a lengthy brainstorming session. We then created certain user flows, including our goals feature displayed below the IA.

Information Architecture

UFinance Information Architecture

Goals User Flow

UFinance Goals User Flow

Wireframes

Then we sketched wireframes for every single screen across the application.

Wireframe summary overview
Quick Entry ๐Ÿ’ฒ Quick Entry wireframe
Transactions ๐Ÿ’ฐ Transactions wireframe
Goals ๐ŸŽฏ Goals wireframe
Notifications ๐Ÿ”” Notifications wireframe
Profile ๐Ÿ‘ค Profile wireframe
Summaries ๐Ÿ“Š Summaries wireframe
Groups ๐Ÿ‘ฅ Groups wireframe

Usability Testing

10 college students tested our prototype through structured, scenario-based tasks. Scenarios included adding a new expense, creating a group and splitting a bill, connecting a bank account, viewing a spending breakdown, and setting savings goals.

01

Goals Page

Confusing savings progress visuals made it difficult for users to understand their progress at a glance.

02

Transactions

Unclear pie charts and terminology left users uncertain about what their spending data meant.

03

Bank Integration

Poor button placement and navigation flow made connecting a bank account frustrating.

04

Group Splits

Limited split options and vague language created confusion when dividing expenses between friends.

Based on testing feedback, we made major improvements.

โœ… Updated Transaction summary charts to make them more readable

โœ… Got rid of confusing transaction home screen and made a dedicated home screen

โœ… Improved groups functionality with better split options

โœ… Redesigned Goals Page with clear progress bars and simplified terms
โœ… Updated Transaction Summaries with intuitive, accessible charts
โœ… Streamlined Bank Integration for better navigation
โœ… Introduced a Homepage with personalized financial overview
โœ… Improved Group Features with better split options and confirmation screens

Task Analysis

Usability testing task analysis

Design Iteration & High Fidelity

With usability insights in hand, we moved from low-fidelity wireframes into high-fidelity mockups. Each iteration was driven by real user feedback โ€” refining layouts, clarifying visuals, and building toward a polished final product. The progression below shows how each screen evolved from rough sketches to the refined designs that made it into the prototype.

Design iteration from low to high fidelity

Design System

UFinance Design System

Live Prototype

Interact with the final UFinance prototype below, or open it in Figma โ†—.

Outcome & Impact

80%

Increase in confidence

Refined prototypes through three testing cycles, leading to higher usability scores and increased confidence among student participants managing financial budgets.

10/10

User satisfaction

All users were satisfied by the final product and said they would recommend UFinance to other students.

40%

Easier to use

Improvement in perceived ease of use, as measured by post-launch user testing.

Key Learnings

Iteration is Impactful:

Testing, refining, and retesting showed how incremental tweaks (not just big features) can meaningfully boost usability and confidence.

Design for Students, with Students:

Direct collaboration with peers uncovered real budgeting struggles and guided solutions that felt practical, approachable, and empowering.

Clarity Over Complexity:

Even small interface improvements, like visual summaries and clear progress indicators, helped students feel more in control of their finances.