Design system team weeknotes: Issue 4

Matt Tyas
3 min readOct 23, 2020

The design system team is part of one web and contributes to the overarching vision of:

Coherent and cost-effective user experiences for Co-op.

The design system team provide the solid foundational tools, resources and standards to enable other teams to work fast — with quality baked in from the start.

Accessibility in our user journeys

With Dave Cunningham’s help we’ve been looking at how we scale accessibility testing into product teams.

We want to make it part of everyone’s routine to test accessibility as well as making it easy to understand common issues that can arise.

What we did

We began by collating everything we would test in a user journey within a spreadsheet. This gave us a sense of the scale of the challenge and quickly realised it would need breaking down.

We tried a quick spike on an automated tool to test websites. Inspired by a piece of work by the BBC this tool could automate some tests and guide a user through manual tests — producing a report at the end. Although it seems very powerful, we ultimately decided it’s too much of a risk to work on further until we have learnt more about how teams will want to test — and have the skills in the team to deliver it.

Automated testing running on coop.co.uk
On the left: Terminal output of the automated tests. On the right the guided manual tests (question and answer at the bottom).

After a regroup Dave did some thinking and started to help us break the tests down by severity to the user. For example. If a website is not navigable via the keyboard it will be totally unusable to a section of our audience.

Minor to critical accessibility issues on an online whiteboard

On the other hand using justified text might not be a design decision we’d favour since it can make text harder to read for some users — it won’t stop anyone using our products.

What’s next

We need to flesh out these severity levels further and decide how we group and test them with a product team to see how it works in practice.

Our roadmap

We’ve also done some work fleshing out our roadmap. At a high level this now looks like:

Now:

Accessibility. Goals:

  1. 100% pass rate for components in the design system.
  2. A first pass accessibility framework being used by a product team.
  3. New accessibility documentation in the design system.

Developer experience. Goals:

  1. Making working with our components and front-end easier by creating better documentation.
  2. Making development of new components easier.

Next:

Design system website. Research goals:

  1. Understand users, content and direction for the main design system website
  2. Understand the tech approach for the future
  3. Understand adoption of the current design system with 3rd parties/agencies to identify potential pain points we can fix in future versions
  4. Understand the contribution model of the design system and how we can simplify it in the future, whilst still upholding our high standards

Ongoing:

Maintenance and community. Goals:

  1. Fix accessibility test fails.
  2. Maintain community input and create backlog of future work.

Onward and upward.

The design system team

--

--

Matt Tyas

Service and interaction design. Product, team management and front-end engineering. matt.tyas.fyi