Checkout&Co · Web · Brand, system & CRO

A conversion-first insurance rebuild

A breakdown-cover insurer with a dated site wanted to put money into ad campaigns, but they knew the experience needed a facelift first. Timelines were tight and most traffic landed mid-funnel, so we rebuilt it from the ground up: accessible brand colours, a fresh token-driven system, and 200+ screens of flows across mobile and desktop.

My role
Product & UI design, design system, dev handoff
Studio
With Sam Sharara, Checkout&Co
Focus
Conversion-rate optimisation, accessibility
Scale
200+ screens · mobile & desktop
driverguardian.co.uk
Driver Guardian on desktop
Driver Guardian on a tablet
Driver Guardian on a phone
The redesigned Driver Guardian, from desktop to phone.
01 · Brief

Smart with time, careful with quality

Sam Sharara brought me onto this one. He's a former manager and mentor, and one of the most talented UX people I've worked with. Driver Guardian had been running since 2010 on an old, limited site, and they wanted to invest in ad campaigns while finally giving the website the facelift it needed.

The scale and the timelines meant less time at the whiteboard and more time actually making things. We leaned on more than 20 years of combined CRO experience and some solid heuristics, and didn't cut corners on quality. Most traffic arrived through third-party sites and affiliates, so we put our energy into making the funnel itself as good as it could be.

02 · System

Accessible colours, reusable foundations

The site was dated on the front and the back end, so there was a real chance to rebuild how things were put together, keeping everything consistent, reusable and easy to change. After some back and forth on colour and accessibility, we landed in a good place: nudging the brand colours until they were accessible without losing the existing identity.

We put together a simple style guide (new colours, text styles and a fresh icon set) and built components that fed off those tokens. A small cost up front to keep everything consistent and light, both in Figma and on the live site. It went over to their dev team later through Figma Dev Mode.

Components built from design tokens
A component library fed by tokens: consistent, reusable and built for handoff.
Most traffic landed deep in the funnel, so that's where we lived. Every step made as smooth as it could be.
03 · Flows

200+ screens, kept short and sweet

There were over 200 designs across the flows and add-ons, for both mobile and desktop. The big difference between them was on desktop: we split the page so the user could always see the price and the call to action in a sticky right-hand column.

The multi-vehicle journey let companies add a fleet. For fleets over ten vehicles an agent still handles it manually for now, with a clear path to a back-end system (or AI) that reads uploaded documents automatically down the line.

Single-vehicle mobile flow
Desktop quote flow with sticky price column
Mobile single-vehicle flow, and the desktop layout with a persistent price & CTA column.
04 · Homepage

A modular, sales-ready homepage

The homepage carried the new brand and the same modular approach as the funnel, so the team could build future sales pages out of the same blocks. (We pushed to lighten the heavy orange overlay. On that one, we were happily overruled.)

The full Driver Guardian homepage redesign
The redesigned homepage, built from modular, reusable sections.
05 · Beyond the funnel

CRM pages and a new account area

Alongside the core journeys, we built the supporting CRM pages and designed a brand-new "my account" area. It rounded the product out, so the rebuild held together end to end.

CRM
Ancillary CRM pages
My account
New my-account area
Supporting CRM pages and a new account area, all on the same system.
06 · Reflection

Quality at speed

This one was a good reminder that experience and a strong system let you move fast and keep the quality high. Because we invested early in accessible tokens and reusable components, we shipped a big, consistent body of work on a tight timeline, and left the client with foundations they could keep building on long after handoff.