Design system - distinguishing components & patterns - research

[Indu-Kaila]

What The recent research found re the Design system section/pages that the relationship between components and patterns is not obvious on looking at the left-hand menu listing. Future research is needed to investigate this and to provide examples of relevant/useful patterns.

Text changes/additions. Include examples of patterns. Could the Design system be more relevant/directed in an introductory way (needs a hypothesis to be written re what is to be achieved, the details ascertained from future research). Would be useful to research further asking more questions i.e. to delve deeper into this re the components/patterns. Note: Not for doing in the immediate future.

Why The recent research found re the Design system section/pages that the relationship between components and patterns is not obvious on looking at the left-hand menu listing. Future research is needed to investigate this and to provide examples of relevant/useful patterns.

Done when We have carried out future research that delves into:

• [ ] Making the relationship between components and patterns obvious.

• [ ] What examples of patterns are to be included.

• [ ] What would make a more relevant/directed design system.

• [ ] The text changes/additions that are needed.

[Indu-Kaila]

Related to

EPIC: Improve service manual contribution guidance #993

[henocookie]

Following a session with @PeteKowalczykNHS, @sarawilcox and me, we have some questions and ideas.

One of these ideas is to revisit the lede text on the patterns and components landing pages.

We think it may be useful to better explain what components and patterns are, as well as how they differ from each other.

One idea is to combine the "best bits" of the current lede text in the NHS digital service manual with the explanation of patterns on the patterns page in the GOV.UK Design System.

It could work something like this:

Patterns are best practice design solutions and page types to meet specific user needs, which are common for health and care services. You can reuse them across NHS services to make them more consistent. Patterns often use one or more components and explain how to adapt them to the context.

---

We also discussed adding a link to patterns from the components landing page.

[sarawilcox]

There are perhaps 3 areas of work here. We could leave this issue for potential future research, and open 2 new tasks:

• discuss the relationship between components and patterns at design huddle
• make content changes to distinguish patterns from components

The existing breakdown of components and patterns was based on card sorting and tree testing exercises. We know that many of our users are familiar with the GOV.UK design system and that may have affected the groupings, which are largely in line with the GOV.UK system.

Some things to explore further - in research and in conversation with other teams:

• Do users understand the distinction between task and page type patterns?
• When is a use case specific enough to make it into a pattern?
• Should we be reworking other components as patterns, e.g. table (to display data so users can compare), warning callout etc.

One option might be to tag components, linking them to patterns and vice versa.