— Jina Anne, Asana / Source (Playbook)

— Jina Anne, Asana / Source (Playbook)

The goal of your design system should be the basis for your analytics. Regardless of this, here is an overview of what is actually measurable in a design system.

Goal

What you can measure

Page performance

Use webpagetest.org:

— Una Kravets, Digital Ocean / Souce (YouTube)

— Una Kravets, Digital Ocean / Souce (YouTube)

Accessibility bugs

Use aXe accessibility engine for automated web UI testing. It’s also part of the chrome web developer tools (see the audit option). Only ~30% of issues can be picked up by automation.

— Nick Colley, GOV.UK / Source (YouTube)

Accessibility

Use webaim.org or setup a pa11y dashboard:

— Una Kravets, Digital Ocean / Souce (YouTube)

— Una Kravets, Digital Ocean / Souce (YouTube)

Codebase size

Use cssstats.com:

— Una Kravets, Digital Ocean / Souce (YouTube)

— Una Kravets, Digital Ocean / Souce (YouTube)

UI related changes

Count the UI related changes (→ the changes on CSS files) of an application’s codebase and represent them on a time scale (see how). If the changes become less after implementing a design system, you can prove the reduced amount of work for the teams.

— Cristiano Rastelli, Badoo / Source (Medium)

— Cristiano Rastelli, Badoo / Source (Medium)

Adaption

Are they using the design system in the way that’s intended? Or are there a lot of overrides or is there a component that is only used once?

— Diana Mounter, GitHub / Source (UXPin)

Sketch library adaption