01 - Overview
The Challenge
Design an end-to-end personal finance mobile app that helps young Indian professionals (18โ28) track expenses, plan budgets, set savings goals, and receive AI-powered financial guidance - all in a single, beautifully designed experience.
83%
of users abandon finance apps within 2 weeks due to manual effort
โน0
saved monthly by 61% of young professionals despite earning well
4x
more likely to save with a goal + deadline than without one
India's personal finance app market is dominated by either complex banking tools or overly simplified trackers. Neither solves the real problem: young earners don't lack money - they lack visibility and actionable guidance.
Finio was designed from first principles, starting with 24 user interviews and 156 survey responses, to solve this gap with a native mobile app that feels as premium as the products this generation already loves.
02 - Problem Definition
What's Actually Broken
Research revealed that the problem isn't awareness - users know they should track expenses. The problem is the tools they have make it too hard, too ugly, or too useless.
Logging fatigue kills habits
Manual entry of every transaction is unsustainable. Users give up within days, not weeks.
Data without decisions
Current apps show charts and graphs but never tell users what to actually do about the data.
Aesthetics matter for engagement
Young users judge apps on first impression. An ugly, corporate UI signals the product isn't for them.
Goals without a roadmap
Setting a savings target is meaningless without knowing how much to save each month to reach it.
Design question: How might we create a finance app that users actually want to open every day - one that makes tracking effortless, insights actionable, and goals feel achievable?
03 - Design Solution
What Finio Does Differently
Five core design decisions that differentiate Finio from every other finance app in the market.
01
AI Insight Strip - Not Just Data, Decisions
Every dashboard surfaces a single, actionable insight generated by AI. Not "You spent โน8,000 on food" but "Your Swiggy spend is 38% above average. Cutting 3 orders/week saves โน24,000/year." The insight strip is the first thing users see, above the fold, every time they open the app.
02
Color-Coded Financial Health at a Glance
Green / amber / red budget indicators mean users understand their financial health in under 3 seconds - without reading a single number. The system works like a traffic light: build an instinct, not anxiety. This reduces cognitive load and encourages daily check-ins.
03
Goals with Monthly Targets & Milestones
When a user sets a โน30,000 Goa trip goal for June, Finio immediately calculates โน3,000/month as the required saving. Milestone celebrations at 25%, 50%, and 75% create dopamine moments that encourage continued use. Goals feel like a game, not a chore.
04
Conversational AI - Ask Anything About Your Money
The AI Chat screen lets users ask questions in natural language: "Where did I overspend last month?" or "How much can I save by December?" Suggested prompt chips reduce the blank-screen anxiety of starting a conversation and showcase the AI's capabilities.
05
Premium Dark Design That Earns Daily Opens
The dark navy palette, Syne display font, and micro-interaction system make Finio feel like a product from a premium startup - not a banking portal. Design is treated as a core feature because it directly drives the daily engagement that makes financial tracking sustainable.
04 - Prototype
All 7 Screens Designed
From onboarding to AI chat - every screen was designed with a specific user job-to-be-done in mind.
05 - Process
How It Was Built
A 4-week sprint from blank page to polished prototype, following a structured design thinking process.
Week 1
Research & Discovery
Conducted 24 user interviews with professionals aged 18โ28. Ran a 156-person survey on financial habits. Performed competitive analysis of Walnut, CRED, Fi Money, and Jupiter. Synthesized research into 3 personas and 6 key pain points.
Week 2
Information Architecture & Wireframes
Created full app sitemap. Mapped 3 primary user flows. Designed lo-fi wireframes for all 7 screens in Figma. Validated structure with 5 users through quick hallway testing. Iterated on navigation and content hierarchy.
Week 3
Visual Design & Design System
Defined color palette, typography scale, spacing system, and border radius tokens. Built component library: buttons, cards, badges, progress bars, inputs. Designed hi-fi screens using the design system. Focused on micro-interaction documentation for animations.
Week 4
Prototype, Testing & Case Study
Built interactive Figma prototype linking all screens. Ran usability testing with 8 participants. Identified 3 key improvements: simplified onboarding, added empty states, improved budget alert visibility. Wrote case study and published to Behance.
06 - Learnings
What I'd Do Differently
Honest reflections on what worked, what didn't, and what I'd improve with more time.
What worked well
Starting with research before any design decisions. The AI insight strip was the most universally loved feature in testing - it directly addressed the top pain point. Color coding for budget status reduced cognitive load significantly.
What I'd improve
The onboarding flow is too long (5 steps). Users drop off at step 3. I'd compress it to 2 steps: name + monthly income. Budget categories can be set later in the app, not forced upfront.
Missing: Accessibility
I didn't test for color blindness compatibility. The green/red system fails for deuteranopia users. A future version would add pattern/icon differentiation alongside color, not just color alone.
Next steps
Design the notification system (budget alert, goal milestone, weekly summary). Add an analytics screen with monthly trends. Test with freelancer persona - variable income budgeting is still unsolved.