Design System Maturity Levels

Giving this talk at DesignOps 2022.

This article is based on a talk I gave at the DesignOps 2022 Conference where I discussed 5 levels of design system maturity. I’m here to tell you that building a UI library is a lot like launching and scaling any other product—except this product is internal to your company.

I define a design system as a set of reusable, modular components that enable teams to build better, more consistent products at scale. It’s a common visual and verbal language of UI design shared by a team.

Where are you today?

I know many readers will be at various stages of their design system journey. So here’s a way to gauge where your team’s maturity is today:

Which of the following Design System activities is your org doing?

1. Style & interaction guidelines
   color, typography, spacing, UI elements, etc
2. Other UI best practices
   accessibility, designing for web vs. mobile, voice/tone, etc.
3. Devs & designers collaborate on reusable code components in production
4. Revisiting previously launched work and making continuous improvements
5. A dedicated team to maintain the design system
6. 🤯 What’s a design system?

These activities represent 5 levels of design system maturity as inspired by Invision’s team maturity model from their 2019 report The New Design Frontier. This table found near the end of the report shows the difference in activities performed by greater than 50% of companies at the 5 defined team maturity levels.

Using this model and my experience at my previous employer MX, I’ll break down each of these levels and how to level up between them.

During my time as Head of Product Design at MX, I oversaw the evolution of our design system library, which we called Kyper, from infancy to maturity over a two-and-a-half-year period. I’ve also written before about our learnings from the first year building Kyper here.