Lumi
Personal money. Business planning. A clearer picture.
Lumi is a financial awareness and planning product that brings personal finances and business planning into separate workspaces. It connects income, recurring costs, spending, future commitments, and interactive calculations to help people understand their current position and explore possible next steps.
The design challenge is to make those relationships understandable while keeping recorded financial information distinct from planning assumptions. This case study examines the product’s architecture, key interactions, and opportunities identified through a review of the working experience.
UI/UX & Product Designer
UI Design · UX Design · Interface Design · Interaction Design
Independent · Solo
Web application
Personal finances and business scenarios
Working product with features in development
Understanding the money behind the numbers
A balance shows an amount. Planning requires understanding what affects it: recurring obligations, everyday spending, future commitments, and the costs behind an income target. Lumi brings these relationships into view through records, comparisons, and scenarios.
How can people understand what is available and explore future scenarios while keeping recorded money distinct from planning assumptions?
Overview and detail
A summary needs to be easy to scan, but the records and assumptions behind it must remain accessible.
Shared access & separate contexts
Personal finances and business planning belong in one tool, but involve different records and terminology.
Useful estimates & limits
A calculation can support planning only when people can inspect its inputs, assumptions, and relationships.
Different questions need different views
Lumi’s structure supports three practical situations: planning between paydays, exploring future commitments, and evaluating business income against costs.
“What needs to be covered before my next payment, and how does actual spending compare with my plan?”
Difficulty
Income schedules and bills do not always align neatly with calendar months.
Design response
Payment-cycle workspace combining planning period, obligations, and expenses.
“How would a different repayment horizon change the monthly amount required?”
Difficulty
A debt total alone does not explain the relationship between time and monthly commitment.
Design response
Simulator updates required payment for a selected horizon without changing saved records.
“What remains from revenue after operating costs and selected reserves?”
Difficulty
Revenue, costs, and take-home estimates answer different questions.
Design response
Project-based records and calculation breakdowns expose the inputs behind each scenario.
Note: These situations are design assumptions used to explain the experience. They have not been validated through formal user research.
One product. Two financial contexts. Connected records.
Lumi separates personal finances and business planning into dedicated workspaces with shared navigation, connecting detailed inputs with summaries and scenario models.
Architecture Tree & Scope Hierarchy
Hierarchical relationship between dual workspaces and shared utility services.
Personal Workspace
- Spending Cycle
- Savings Goals
- Wishlist Queue
- Debts & Simulator
- Calendar Reports
Business Workspace
- Project Switcher
- Services & Income
- Cash Flow & Invoices
- What If & Pricing Tools
Shared Floating Utilities
- Profile
- Bank connection
- Learning
- Financial companion
Business groups are sections within the workspace rather than separate pages.
Personal relationships
Business relationships
Personal vs. Business switcher
Two entry points establish clear distinction between personal money and business planning.
Connected system view
Summary cards communicate period, inputs, and meaning without ambiguity.
Business relationships
Four decisions that shape the experience
These decisions explain the rationale of the current design with alternatives and structural tradeoffs. Alternative approaches explain the current design; they are not documented historical concepts tested with users.
Separate financial contexts, shared access
Problem
Personal and business records involve different questions and terminology.
Alternative approach
Combined workspace places all items together, requiring repeated context selection.
Current design
Dedicated Personal and Business workspaces with a shared header switch.
Tradeoff
Switching adds a step, requiring persistent cues for active context.
Plan by payment cycle, review by calendar month
Problem
The period used for planning differs from the period used for monthly reporting.
Alternative approach
Using calendar months everywhere ignores non-standard pay frequencies.
Current design
Spending uses payment-cycle periods; Reports provide calendar-month summaries.
Tradeoff
Requires clear period labeling so totals are not misinterpreted.
Explore a scenario without changing the record
Problem
Trying a repayment horizon must not be confused with committing a repayment.
Alternative approach
Placing scenario controls inside record editing blurs saved reality with what-if ideas.
Current design
Debt simulator displays dynamic payment scenarios without updating logged balance.
Tradeoff
Must explicitly differentiate exploratory slider states from saving actions.
Show the assumptions behind the answer
Problem
A single output figure hides the costs and reserve assumptions that produced it.
Alternative approach
Output-only calculator is cleaner but offers less guidance for decision confidence.
Current design
Business calculators show step-by-step inputs and formulas alongside totals.
Tradeoff
Requires thoughtful progressive disclosure to prevent dense visual clutter.
Record the detail. Understand the position.
Personal planning connects the selected payment period with income, obligations, actual spending, and month-end reflection.
Income & Bills
Recurring income and fixed bills recorded as predictable constraints.
Spending & Budgets
Inline transaction entry paired with planned vs actual category bars.
Monthly Report
Calendar-month aggregation reviewing spending records and period totals.
Keep actual spending distinct
An expense can include a name, amount, optional date, and category. The entry form keeps actual spending separate from the fixed-bill list.
See the commitment. Explore the horizon.
The Debt Tracker presents an obligation alongside its monthly payment and payoff horizon. An inline simulator allows users to model durations without changing saved entries.
Savings Goals
Connects a future target amount with allocated savings funds.
Wishlist Queue
Item capture keeps planned purchases distinct from live spending.
Connect project costs with possible outcomes
Business planning combines active project context with subscription pricing and what-if simulation models.
Subscription Pricing Calculator
Input cost per user and target margin; inspect recommended price options and VAT deduction details.
What If Scenario Simulator
Adjust pricing, customer count, and variable expenses to pinpoint the estimated break-even client count.
Minimum hourly rate
Works backward from desired annual take-home and billable hours.
Runway estimator
Calculates how long a cash reserve sustains selected monthly burn rate.
Salary goal planner
Converts take-home target into gross project revenue requirements.
Planning note: Outputs are estimates based on selected inputs. Calculation consistency and tax assumptions remain part of the product’s ongoing review.
A consistent language for complex information
Lumi uses pale backgrounds, green emphasis panels, grouped cards, and supportive language. Large amounts establish hierarchy, while labels and breakdowns explain the figures.
Product specimens
Visual language
Typography Specimen
Type hierarchy & scales
Colour Palette
Surface & accent tokens
Controls Specimen
Segmented pills, inputs
Financial Labels
Frequencies & cycles
Interaction examples
Empty State
Neutral guidance
Validation Error
Field-level alerts
Save Confirmation
Subtle inline pill
Over-Budget State
Proportional alert
Desktop and mobile views of the same planning task.
What the product review revealed
A review of the logged-in experience examined forms, historical views, project switching, and calculation tools to prioritize concrete refinements.
Financial definitions
Payment-cycle and calendar views use different timeframes; daily allowance needs clearer documentation.
Make summary periods, cost bases, and underlying assumptions explicit across all related views.
Navigation and completion
Some destinations do not strictly match nav labels, and several settings interactions remain incomplete.
Align labels with destinations and visibly badge features currently in active development.
States and accessibility
Over-budget empty copy needs calibrated tone; form fields require persistent labels for screen readers.
Match status messages to financial reality; audit keyboard focus and mobile touch target sizes.
Accessibility note: The product review found semantic controls and visible keyboard focus in inspected states. Persistent labels, contrast, keyboard behaviour, and responsive layouts require further verification.
What remains to validate
- Can a new user immediately identify their active payment cycle period?
- Can they cleanly distinguish a fixed recurring bill from a discretionary expense?
- Can they explain why a calendar-month report differs from a cycle summary?
- Can they explore debt horizon scenarios without fearing their balance was saved?
- Can they identify the costs and reserve assumptions behind a business calculation?
Three ways to understand the money
Payment Cycle Journey
- 1Review income and fixed bills
- 2Compare planned vs actual spending
- 3Record new expenses inline
- 4Review calendar-month report
Future Commitments Journey
- 1Inspect total liability & interest
- 2Adjust target payoff duration slider
- 3Compare recalculated monthly cost
- 4Retain saved balance intact
Business Scenario Journey
- 1Select client project workspace
- 2Inspect service baseline costs
- 3Input client tier & volume assumptions
- 4Inspect break-even take-home breakdown
Current Delivery
A working product with separate Personal and Business workspaces, financial records, monthly reports, debt simulation, and business calculators. Some features remain in development.
Next Steps
Unify definition tooltips, complete in-progress configuration flows, and test core navigation patterns with users across desktop and mobile devices.
Reflection
Clarity in financial tools depends upon consistent labels and assumptions across views. Periods, assumptions, and terminology must align as people move between recording daily facts and exploring speculative future possibilities.