Novapay · Fintech · London
Rebuilding trust in digital banking with a cinematic web experience
Novapay's legacy site felt corporate and cold. We rebuilt it around a living WebGL hero, a modular design system, and a narrative structure that walks users from doubt to sign-up.
+0%
Sign-up conversion
−0%
Bounce rate
0 wks
Concept to launch
Performance at a glance
Before vs After
Key metrics at launch vs. post-launch
Conversions by device
Share of measured outcomes
- Mobile62%
- Desktop28%
- Tablet10%
Growth trajectory
Sign-up rate (%) post-launch
The Challenge
Novapay had grown quickly in the UK fintech market, but their digital presence hadn't evolved with the product. The legacy website read like a compliance document — dense text blocks, stock photography, and a sign-up flow buried three clicks deep. Prospective customers arriving from paid campaigns bounced within seconds, and internal teams couldn't update landing pages without engineering support.
Brand perception was the deeper issue. In user interviews, prospects described Novapay as "safe but forgettable." Competitors with polished, motion-rich sites were winning mindshare even when Novapay's product was objectively stronger on fees and security.
Pain points severity (pre-project)
User research & stakeholder interviews
Our Approach
Discover
We started with a narrative audit: mapping every moment a visitor might feel doubt — about security, fees, or switching banks — and designing content beats that address each concern before asking for commitment.
Design
Rather than a typical redesign sprint, we ran parallel tracks: a WebGL hero prototype to validate performance on mobile, a modular design system built in Figma and Storybook, and a CMS architecture that let marketing ship new landing variants without developer handoffs.
Build
Every animation was purposeful. The generative hero responds to cursor movement with subtle particle drift — fast enough to feel alive, restrained enough to signal stability rather than gimmickry.
Launch
Every animation was purposeful. The generative hero responds to cursor movement with subtle particle drift — fast enough to feel alive, restrained enough to signal stability rather than gimmickry.
What We Built
A cinematic homepage with a real-time WebGL hero, scroll-linked product storytelling, and a three-step sign-up flow that surfaces trust signals (FCA registration, encryption badges, customer quotes) at each decision point.
A full design system — typography scale, color tokens, motion primitives, and 40+ React components — documented in Storybook and shipped as an npm package for Novapay's internal product team.
A headless CMS integration (Sanity) with preview mode, A/B testable hero variants, and localized content blocks for UK and EU markets. Engineering handoff included performance budgets (LCP under 2.1s on 4G) and accessibility audits at WCAG AA.
Results & Impact
Sign-up conversion rose 212% in the first quarter post-launch. Bounce rate dropped 40%, with the largest improvement on mobile — where the previous site lost most of its paid traffic.
Marketing shipped 12 landing page variants in the first month without engineering tickets. Novapay's product team adopted the design system for their dashboard onboarding flow within six weeks.
The project shipped in 9 weeks from concept to production, including CMS training and a full analytics instrumentation layer (GA4 + custom conversion events).