Hopscotch is an all-in-one invoicing, bill pay and cash flow tool for small businesses, with instant payments, fee-free bank transfers and low-rate card payments.
Contribution
Discovery, UX, UI, motion design, design system
Role
Lead Product Designer
Industry
Fintech
Years
2024 – now
Key achievement
I redesigned the core product, from the dashboard to accounting. After the relaunch, month-over-month transaction growth rose 73% and new-account growth 37%. Avalara acquired Hopscotch in August 2024.
A ground-up redesign of the dashboard, built to scale and to get new users to their first payment faster.
My role
As lead product designer, I started with an audit of the product, the business model and support issues. I then owned the redesign of the core views: dashboard, accounting and navigation, working with management, product, compliance, support and marketing.
Challenge
People signed up, but too many stalled before their first payment.
The dashboard and accounting pages were where users either built confidence in the product or left. In a crowded fintech market, that meant clarity, trust and polish mattered as much as the flows themselves.
My approach
1. Audit
I reviewed flows and analytics to find friction in onboarding, the dashboard and accounting, and benchmarked other fintech products.
2. Define
I mapped a new onboarding flow: ask only what each step needs, use trust cues to reduce anxiety, and put activation before data collection.
3. Design
One visual language across every core screen, with motion that makes transitions feel intentional and confirms each input.
4. Test
Prototype walkthroughs with product, compliance and support, refining the flows around edge cases.
Key designs
A welcoming dashboard
A greeting that changes with the time of day, then the account summary. Payable and receivable widgets show the cash forecast at a glance.
Some widgets are new, others redesigned, all part of one consistent set.
The full Balance widget. The dashboard uses a compact version without the graph.
Vertical navigation
Room for new features, and a clearer path to plan upgrades.
On the dashboard, notifications already have their own widget, so clicking the bell there highlights it with the brand’s yellow brush animation.
Accounting
Charts, tables and transaction cards redesigned to be easier to read and more accessible.
Upgrade prompts
Clear reasons to move from Free to Pro, shown at the right moments without being pushy.
Shipped features
Customer-requested features I designed and shipped with the team.
Outcomes
Users got a clearer, calmer path from first click to first payment, and motion made the product feel faster and more polished.
We tracked transaction and account growth for engagement, acquisition cost and adoption for marketing efficiency, and support requests and churn for satisfaction.
Primary metrics
↑73%
Month-over-month transaction growth. New features and the Hopscotch Flow relaunch improved retention and scaled volume.
↑37%
Month-over-month new-account growth.
Secondary metrics
Customer acquisition cost
↓11%
Adoption rate
↑30%
Support requests
↓20%
Churn
↓6%
Data sources
Google Analytics, FullStory, Dovetail, Zendesk