A unified command center for operators who were juggling seven tools just to read their numbers.
VaultPay's early customers — founders, finance leads, and fractional CFOs — were piecing their financial picture together out of Stripe, QuickBooks, Brex, a payroll tool, two spreadsheets, and a hope. I led the design of a single dashboard that replaced the Monday-morning scramble with a 30-second glance.
Every finance team we interviewed followed the same ritual: open Stripe for revenue, QuickBooks for expenses, Brex for card activity, a Google Sheet for cash runway, and stitch it together in their head. The problem wasn't missing data — it was the cognitive tax of assembling it.
VaultPay needed a dashboard that could earn the first click of the day. That meant the hierarchy had to match how operators actually think: cash position first, inflow and outflow second, anomalies third, everything else on demand.
Approach
Diary studies with 12 finance leadsI shadowed founders and CFOs through their Monday morning review. Tracked every tab switch, every copy-paste, every moment of friction. The pattern was unmistakable — 80% of the review was spent reconciling, not analyzing.
Data-model-first designBefore wireframes, I mapped every widget to its source of truth: balance from ACH, revenue from Stripe, spend categories from card transactions. No decorative charts — every pixel had to trace back to a query.
Dark-first for screen-all-day useFinance teams live in their dashboards. Dark theme reduces eye strain in long sessions, and a carefully tuned accent palette keeps categorical data legible without vibrating.
Widget system with density modesDesigned a 12-column grid with three density settings: cozy for monitors, compact for laptop screens, glance for TV dashboards. One dashboard, three contexts.
Prototype, then test with real numbersBuilt the final design as a working HTML prototype seeded with anonymized VaultPay data. Customers could interact with their own numbers during the validation round — it closed a dozen usability gaps we'd have missed in Figma.
Key Features
Real-Time Balance
Live balance card with daily delta, currency switcher, and one-tap reveal of the underlying account breakdown.
Revenue Pulse Chart
Interactive revenue chart with weekly/monthly toggle, hover tooltips, and YoY overlay so growth is always in context.
Spend Breakdown Donut
Category-level spending visualized as a donut with legend, drill-down to transactions, and vendor dedup.
Card Manager
Tokenized card UI with spend limits, freeze/unfreeze toggle, and per-card authorization rules.
Transaction Ledger
Virtualized transaction table with status chips, inline categorization, and saved views for recurring reviews.
Anomaly Timeline
Surfaces outliers — duplicate charges, spike vendors, failed payouts — in a dismissable side rail.
"The first version we shipped cut our Monday finance review from 90 minutes to under 15. That's the one metric I care about."
— VaultPay CFO, pilot customer
Results
40% faster daily review. Time-on-task in moderated tests dropped from 12.4 min to 7.4 min.
92% task-success rate across the five primary jobs — up from 71% in the legacy multi-tool baseline.
NPS +61 among pilot cohort after 30 days of use.
Design system shipped with 120+ components now used across VaultPay web and mobile surfaces.
Closed a Series A with the dashboard as the lead demo asset.
