Andy Charlton
ContactAll work

British Heart Foundation

Role
UX/UI Design Consultant
Years
2018
Length
9 months
Live site
bhf.org.uk

In 2018 the British Heart Foundation refreshed its whole brand. I was brought in to roll the new identity out across its digital estate.

First its campaign microsites, then the forms in its main design system.

The Face A Fear fundraising site on three phones

Campaign microsites

I’d done this for NHS campaigns, so I started there. Taking the Face A Fear fundraising campaign as the first, I designed a modular template that any campaign could be built from.

A campaign site’s homepage
A campaign site’s inner page
Pages from the campaign template.

Signing up

Sign-up was where people dropped out. I studied competitors’ forms, then sketched and tested low-fi wireframes before we built the template.

Ideas and sketches on a whiteboardWireframes pinned to a wall
Sign-up form flows, screen by screen
The sign-up flows.

Accessible forms

Then I designed the form elements for the main site’s design system, drawing on my time alongside GDS. They’re still on bhf.org.uk today.

The form elements in the design system
Form error states
Date pickers
Error states and date pickers.

Outcome

The form elements are still in use across bhf.org.uk.

To writeWhat the template did for the campaigns: sign-ups, or how many were built on it.

Visit bhf.org.uk ↗

More Work

All work