FinWise

Project Overview

FinWise is a conceptual mobile app designed to help userstrack expenses, set savings goals, and visualize spending patternswith minimal friction. The goal was to solve common UX frustrations found in personal finance tools — such as cluttered interfaces, inconsistent UI elements, and lack of guided onboarding — while establishing a robust and reusable design system.

Key UX Problems Tackled

• Overwhelming interfaces in many finance apps discourage users from engaging regularly.
• Lack of visual clarity and hierarchy makes critical information (e.g. remaining budget) hard to spot.
• Onboarding fatigue from lengthy or non-skippable forms hurts user retention.
• Poor input feedback causes confusion and form submission errors.

Design Strategy & Process

The project began with a foundation of a scalable design system, followed by screen-level UX refinements based on typical finance user pain points. The process emphasized clarity, consistency, and quick actions across tasks.

• Design System: A complete component library was created in Figma including colors, typography, buttons, inputs, and category tags with accessibility-focused variants.
• Onboarding Flow: Progressive form steps allow users to skip ahead, reducing friction for those who want to get started quickly.
• Budget Setup: Budget allocation is broken down into editable category cards with plus/minus controls to provide clarity and speed.
• Transaction & Analytics: Easy transaction logging with icons and reports visualized through clean bar and pie charts for spending insights.

Noteworthy Design Decisions

• Real-time input validation for error prevention using color-coded borders and icons.
• Sticky navigation with icons to reinforce pattern recognition and task switching.
• Whitespace and font hierarchy used to guide users without visual noise.
• All layouts aligned to an 8pt grid system to ensure balance and consistency.

Outcomes

Though FinWise is a conceptual project, it demonstrates a mature, scalable design system and thoughtful UX problem-solving in the finance domain. If developed and tested, the design is intended to deliver:

• Improved first-time user engagement through frictionless onboarding.
• Higher task completion rates via intuitive input flows and budget planning.
• Increased retention potential by placing goal tracking front and center.

Reflection

FinWise was an exploration of how design systems can directly influence user experience quality. By approaching the product with both a component-level mindset and a user-centric lens, I was able to design an experience that is visually clean, strategically structured, and highly reusable for future scaling.