Co-op design system team weeknotes: Issue 1

Matt Tyas
4 min readOct 5, 2020

--

Welcome to the first official weeknotes from the newly formed design system team!

The design system team is part of one web following our overarching vision of:

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

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

We’ll be working with all of Co-op to make sure we’re doing the right things for our colleagues and customers.

We are a small (but mighty) team made up of:

  • Chris Gibbons (Front-end Engineer)
  • Ciaran Greene (Interaction Design)
  • Matt Tyas (Product and One Web Principal)
  • Molly Whitehead-Jones (Content Design)
  • Alex Hall (Content Design)
  • Gaynor May (QA)
  • Tom Walker (User research)

I’ve added job titles – but we’ll all be pitching in in all areas and helping people upskill where ever possible.

Our first focus: Accessibility and standards

Week 1 began with a planning session and the team unanimously decided to focus on the theme of accessibility and standards.

We know that trust is key to the design system. The design components we distribute must be high quality and help product teams move quickly knowing they are starting with a well tested baseline.

Since accessibility is the cornerstone of usability this is a valuable place to start – but why?

Helping Co-op achieve its vision: Co-operating for a fairer world

Our Co-op vision gives us clear direction that this is a thing we should focus on. If we truly believe in this vision – creating user experiences for everyone is an inherently Co-operative thing to do.

Aside from this – it is the right thing to do.

Dave Cunningham (who has been at the forefront of setting up an accessibility champions network in Co-op) recently refreshed our accessibility policy.

This outlines our commitment to creating accessible products and services and gives clear guidance on how, by:

You can read about the accessibility policy in Dave’s blog post.

The design team have also long held the principle:

We design for everyone

If that weren’t reason enough, it just makes good business sense to have Co-op’s services open and available to the anyone that wants to use them.

What we’ve done

We began by creating a draft accessibility framework based on the outputs of a workshop held the week before on accessibility testing. Roughly we decided we might need 3 levels on which to test our products:

  • Level 1: Component level – the testing the design system team (and anyone else building for the design system) will do to ensure components reach the right standards from a design, front-end and content design perspective
  • Level 2a: CMS level – less defined right now, but is about ensuring when integrated into Contentful the standards are still met and content editors know they need to enter (things like) meaningful alt tags to images
  • Level 2b: Product level testing. Will be a framework and tools to help product teams test their own bespoke products.
  • Level 3: Components and products tested with real people of all abilities and cause them no issues in completing tasks. This is the ultimate aim as we can be most confident we’ve removed any able bodied bias by finding out how people really use our products.

We’ve only begun to define level 1 right now and it takes the form of a spreadsheet.

accessibility framework spreadsheet

In an update I gave recently on the design system I said it was not the ‘cool project’ as it had a very important mission – this spreadsheet proves that I think.

We’ve defined categories to test against as well as begun to test components in the system right now in order to define the best tools and how much can be automated vs how much will be manual.

What’s next

We’ll be continuing with this work both creating the framework and finding issues in the design system that need to be fixed.

Our roadmap

We’ve also spent time on a rough and ready roadmap. There’s more work to be done on the ‘when’ and ‘how’ of the items in it but right now it looks like this:

Post-it notes showing high level design system roadmap

Contribution and support

We are also looking at designing a clear, regular contribution to live process – that will start soon – watch this space.

It has been a great start and we’re excited about the future.

The design system team

--

--

Matt Tyas

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