Skip to content
Rating Design

Deep dives into real results.

Deep dives into real results.

Explore five client stories where design, engineering, and strategy came together to deliver measurable impact.

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

Generative artwork representing Novapay case study
Impact dashboard

Performance at a glance

Before vs After

Key metrics at launch vs. post-launch

Sign-up conversion2.1%6.5%
Before
After
Bounce rate58%35%
Before
After
LCP load time4.2s2.1s
Before
After

Conversions by device

Share of measured outcomes

100%Total
  • 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

Brand trust88%
Mobile UX76%
Sign-up flow82%
Content updates65%

Our Approach

1

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.

2

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.

3

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.

4

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

+212%
Sign-up conversion
−40%
Bounce rate
9 wks
Concept to launch

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).