Back to Portfolio
FinTech / Expense Management

PettyCash Manager

Corporate Expense Ledger

Live Demo
Entry Accuracy100%
Manual Data Entry95% Cut
Audit Resolution58% Faster
Page Load Time<750ms

Visual System & Style

Design System Accent: Financial glassmorphism with emerald green accents (#10b981) indicating growth and financial accuracy.

Typography & Baseline: JetBrains Mono for currency and amount displays, improving visual precision during balance audits.

Interactive Micro-Animations

  • ✦Framer Motion numbers roll when account balances recalculate.
  • ✦Expense elements slide up into place upon ledger additions.
  • ✦Hover glows appear behind the active category charts.

User Personas & Pain Points

Sarah (34, Finance Coordinator)

Reconciles hundreds of small transactions; hates dense database grids.

Thomas (41, Chief Operations Officer)

Needs a clear view of operational budgets and team spending habits.

Solving User Friction

01

Clean, visual balance cards highlighting deposited vs spent ratios.

Clean, visual balance cards highlighting deposited vs spent ratios.

02

Interactive category rings that filter the transaction log with a single tap.

Interactive category rings that filter the transaction log with a single tap.

Accessibility & Contrast Compliance

Fully keyboard-accessible balance dashboards.
Zod-backed error messages displayed in high-contrast red.
Screen reader tags for balance summaries and transaction details.