Centrica: British Gas

Nucleus Design System.

The problem.

This project focused on creating a system of components, thinking and assets for the British Gas (BG) Digital Team. The BG Brand team created a new look and feel. This needed to be understood and re-purposed for all BG digital products.

Below are some examples of the workshops, sessions and discussions that we had to understand and execute as a team.

My role.

The Nucleus project started out with an audit of the site. Over a number of workshops we broke down the site into smaller parts. Following Atomic Design principles, we ended up with our foundational elements and started to build back up. This process, from the outset included design, engineering and QA.

We ran regular usability sessions and fed components into other teams to test. This made sure our components were fit for purpose for our users. We also had sessions with external accessibility specialists to ensure everything worked for users with special requirements. This included users who are keyboard only, blind and low-vision or use screen reader based technology.

We got into a habit of writing detailed content early to document our process. This ensured the reasons we had made certain decisions were captured. I still look at this regularly for the current design system I’m working on. It’s still regularly updated by the Nucleus team here.

Lastly, to ensure buy in from other teams. We held regular workshops and a regular show and tell. This way our other designers came on the creative journey with us. This also helped to build excitement around the system we were creating. Which had an added bonus, that people were eager to help out testing the components in the lab.