Introduction
Parliament Digital Service are in the process of creating a new website for UK Parliament, whilst implementing our new digital brand (https://www.brandcloudlines.com/uk-parliament) across our digital touchpoints.
Digital brand rollout across the UK Parliament website so far...
There are currently 15 public facing products and services with our new UK Parliament digital brand associated to them, designed and built by multiple different teams internally and externally. 11 sit under parliament.uk, 5 of those sit under beta.parliament.uk (as of Feb 2019).
With the rush to get things delivered quickly, we risk being faced with the possibility of having to rework all our outputs to ensure we deliver a usable, coherent and accessible website for our users. We also risk creating significant problems that will need to be unpicked and reworked in the future, in particular around an information architecture that is fit for purpose, plus navigation and wayfinding cues that enable users to find what they're looking for quickly and easily across Parliament’s digital offer. It also risks building up a significant debt of effort across PDS including development, UCD and product teams. This will slow us down in the long term.
There are also too many things to do in too little time, with not enough people. There are currently over 70 products and services on the latest backlog of things for the Parliament Digital Service to deliver.
So how do we design, build and maintain this work in a scalable way?
Our aim
Is to create a public facing Design System for UK Parliament’s digital touchpoints (e.g. website/mobile apps/voice). This will -
Show people how to make things, how we do things and why we do them
Help teams at UK Parliament create user centred digital services in a consistent way
Ensure that the quality of our digital outputs are optimised for search and are both usable and accessible to all, meeting the needs of our standard service assessment, alongside legal requirements from September 2019
Build a clear and consistent digital brand for UK Parliament that strengthens our reputation and authority online
What is a Design System?
A unified collection of reusable styles, components, patterns, pages and shared practices that work together to build digital products and services.
They can help collaboration across teams to improve the user experience and efficiency of our digital products.
They cover design principles, front-end development standards, accessibility principles, user interface patterns, brand guidelines and content style guides.
Why?
Designing smarter, and faster
A design system allows design teams to focus on strategic design challenges vs tactical one-off design solutions. A design system can help streamline the design process and produce more work with less people.
Reduce design and technical debt
As our digital outputs go through iterations, they acquire debt. Technical debt with larger and more bloated code bases – and design debt. When strategic design decisions are deferred, it can lead to one off creative solutions and design for the short term.
This debt manifests itself in inconsistent styles and interactions, interfaces disconnected from design principles, and scope creep, among many others.
Design systems help keep design and technical debt in check by eliminating short term design decisions and decreasing design and development overhead, allowing teams to focus on innovation instead of maintenance.
Reduce confusion and inconsistency
Inconsistent user experiences lead to confused users. By creating standardised components and workflows, we can create more predictable and comprehensible experiences for users as they move from one space to another across UK Parliament. This consistency leads to increased user success and satisfaction.
Prototype faster
Instead of creating new features and experiences from scratch, designers can pull components from a design system and more rapidly create and test new features. Having all the ‘lego bricks' available doesn’t make you less creative. It allows you to quickly build many things. We'll be able to build pages, products, and services for Parliament that are clear improvements on what's come before. Investing in work to make a design system full of these 'lego bricks' now, will allow us to deliver faster and at consistently high quality in future.
Iterate faster
Teams can move faster when they have the code already available and the design components easily accessible with a few lines of code. This makes iteration and experimentation simple and pain-free.
Improve usability
Digital products and services using design systems benefit from improved usability because they have a consistent experience throughout. This consistency leads to decreased problems, friction points and cognitive overload when using complex websites.
The consistency of experience driven by using a set of tested and validated components means less complexity and fewer problems further down the development process.
Saves time and money
Reducing repetitive work by reusing established components allows teams to focus on solving real problems. Imagine having to try and guess what’s the most appropriate version of search – out of a dozen variants available – plus we should no longer be having teams creating 3 different versions of ‘search’.