Skip to main content

https://gds.blog.gov.uk/2017/10/30/building-the-gov-uk-design-system/

Building the GOV.UK Design System

We’ve been developing a new design system for government services.

GOV.UK Design System homepage screenshot

GOV.UK Design System will contain all the styles, components and design patterns that teams in government need to create user-centred digital services.

Some of these things can already be found in the Service Manual, GOV.UK Elements and elsewhere, but we want to bring everything together in one place and make it easy for people to find, use and contribute to.

We want GOV.UK Design System to be a resource that can be used across government. To provide styles, components and patterns that are accessible, high quality and consistent. By doing this, we can make it easier and quicker for teams to design and build services, and enable them to spend more time tackling bigger design challenges.

GOV.UK Design System recently passed its alpha assessment, so we’re now building the platform and planning how to run the service for real.

Here’s what we’ve done so far and what we plan to do next.

Strong foundations

The Design System is the culmination of a lot of work we’ve done to improve and consolidate the patterns and components that are already available.

Last year we built an alpha version of GOV.UK Frontend, which will be a single resource that service teams in government can use to implement frontend code.

We continued to publish new patterns in the Service Manual – such as task list and check before you start.

And we held a cross-government show and tell where departments shared their work on design systems, looked at the different approaches and highlighted common challenges.

It became clear from the show and tell that although different departments were working on their own systems, we were all reaching maturity at the same time and were ready to start working together.

We all saw the benefits of working towards a single, federated design system, where people get to develop their own patterns and contribute them back to the main collection.

This is what we are working towards with GOV.UK Design System.

Testing and prototyping

During the alpha phase of the project we developed a prototype to help us do user research and test our ideas.

We spoke to users from different communities of practice, including designers, developers and user researchers. We spoke to people from a range of government departments, agencies and external suppliers.

Their feedback, in usability research, interviews, workshops and surveys, helped us iterate the prototype, improving its navigation, structure, content and features.

During alpha, we went from 5 categories down to 3, identified the information users need in order to use patterns and components, simplified the navigation and added aliases to our search, so that people can search using terms they are familiar with. We also thought about how we’d support people using the service.

a screenshot demonstrating how aliases built into search help with user experience
Alias means users can search using the terms they’re familiar with.

Building in beta

Now we’re in beta, the first step is to create an initial version of the Design System and populate it with all the existing styles, components and patterns. We’ll use this to test and iterate the platform.

We’re also further developing GOV.UK Frontend and looking at linking between it and the Design System, integrating frontend components into the Design System.

We’re looking for service teams to work with as part of our private (invite-only) beta. We want to understand what’s working well and what we can improve. If you’d like to be involved in private beta research, please get in touch.

We’ll also be piloting different models for supporting and assuring contributions to the Design System from around government.

Ultimately, we want GOV.UK Design System to be something that is owned by the people who use it.

Preparing for launch

Once we’re happy that the GOV.UK Design System is good enough we’ll roll it out as a public beta for everyone to try out.

In the meantime, you should continue to use the design patterns, components and styles found in the Service Manual and GOV.UK Elements.

If you’d like to know more, or would like to talk to us about getting involved in private beta research, please get in touch.

Sharing and comments

Share this page