Design System Adoption Insights | Knapsack

Design System Adoption Insights

Introduction

If there’s one thing we’ve learned about design systems at Knapsack, it’s that adoption is everything. You could argue it’s the only thing.

Without adoption, there is no return on investment - we never break even. And the earlier we gain adoption, the sooner we see that return.

Teams that find success early and sustainably are those that prioritize the adoption of behaviors focused on reuse and iteration more than creation of a perfect v1 or MVP.

As one product leader told us:

I’d rather have everyone using the same imperfect button than have a perfect button no one uses.

To learn more about the challenges and opportunities when driving adoption, we surveyed over 100 design system managers and contributors on their experience.

Dedicated design system teams are growing

Many companies are building dedicated design system teams to support the adoption and growth of their system, but when is the right time to carve out designated resources?

We found that the majority (60%) of respondents who have had a design system for a year or more have headcount dedicated to contributing to it (partially or fully).

Dedicated design system teams are growing - Infogram

You have entered page 1

262422201816141210864201-6 Months6-12 Months1-2 Years2-4 Years4+ Years

Fully dedicated person/group

Partially dedicated person/group

Rotating person/group

Anyone who wants to

made with %22%20fill%3D%22%23fff%22%20d%3D%22m.111%2C7.583%20c0%2C0%20.887%2C0%20.887%2C0%200%2C0%200%2C-5.338%200%2C-5.338%200%2C0%20-.887%2C0%20-.887%2C0%200%2C0%200%2C5.338%200%2C5.338%20M1.12%2C1.08%20C%201.12%2C1.401%20.843%2C1.634%20.544%2C1.634%20.256%2C1.634%200%2C1.401%200%2C1.08%200%2C.736%20.256%2C.514%20.544%2C.514%20c.299%2C0%20.576%2C.222%20.576%2C.566%20m1.785%2C2.863%20c0%2C0%200%2C3.64%200%2C3.64%200%2C0%20-.899%2C0%20-.899%2C0%200%2C0%200%2C-5.35%200%2C-5.35%200%2C0%20.709%2C0%20.709%2C0%200%2C0%20.123%2C.545%20.123%2C.545%20.199%2C-.467%20.63%2C-.577%20.93%2C-.6%20.964%2C-.055%201.763%2C.845%201.763%2C1.765%200%2C0%200%2C3.64%200%2C3.64%200%2C0%20-.899%2C0%20-.899%2C0%200%2C0%200%2C-3.64%200%2C-3.64%200%2C-.466%20-.397%2C-.866%20-.874%2C-.866%20-.466%2C0%20-.853%2C.4%20-.853%2C.866%20m4.449%2C3.648%20c0%2C0%20-.886%2C0%20-.886%2C0%200%2C0%200%2C-5.804%200%2C-5.804%20C%206.468%2C.754%207.454%2C0%208.573%2C0%20c0%2C0%200%2C.888%200%2C.888%20-.652%2C0%20-1.219%2C.411%20-1.219%2C.899%200%2C0%200%2C1.642%200%2C1.642%200%2C0%201.098%2C0%201.098%2C0%200%2C0%200%2C.888%200%2C.888%200%2C0%20-1.098%2C0%20-1.098%2C0%200%2C0%200%2C3.274%200%2C3.274%20M12.082%2C3.94%20c0%2C-.566%20-.454%2C-.866%20-.908%2C-.866%20-.444%2C0%20-.909%2C.3%20-.909%2C.866%200%2C0%200%2C1.941%200%2C1.941%200%2C.567%20.465%2C.855%20.909%2C.855%20.454%2C0%20.908%2C-.288%20.908%2C-.855%200%2C0%200%2C-1.941%200%2C-1.941%20m.898%2C1.941%20c0%2C1.188%20-.909%2C1.766%20-1.806%2C1.766%20-.909%2C0%20-1.796%2C-.578%20-1.796%2C-1.766%200%2C0%200%2C-1.941%200%2C-1.941%200%2C-1.199%20.898%2C-1.754%201.796%2C-1.754%20.908%2C0%201.806%2C.555%201.806%2C1.754%200%2C0%200%2C1.941%200%2C1.941%20m1.84%2C.09%20c-.032%2C.521%20.444%2C.754%20.909%2C.754%20.421%2C0%20.842%2C-.289%20.842%2C-.743%200%2C0%200%2C-2.175%200%2C-2.175%200%2C-.4%20-.465%2C-.71%20-.864%2C-.722%20-.455%2C0%20-.887%2C.311%20-.887%2C.755%200%2C0%200%2C2.131%200%2C2.131%20m.864%2C3.806%20c-.386%2C0%20-.974%2C-.211%20-1.407%2C-.6%200%2C0%20.511%2C-.71%20.511%2C-.71%20.32%2C.266%20.686%2C.4%20.896%2C.4%20.488%2C0%20.887%2C-.378%20.887%2C-.844%200%2C0%200%2C-.943%200%2C-.943%20-.154%2C.433%20-.598%2C.544%20-.864%2C.544%20-.931%2C0%20-1.785%2C-.611%20-1.785%2C-1.653%200%2C0%200%2C-2.131%200%2C-2.131%200%2C-.888%20.866%2C-1.732%201.785%2C-1.654%20.354%2C.034%20.798%2C.167%20.942%2C.678%200%2C0%20.088%2C-.622%20.088%2C-.622%200%2C0%20.732%2C0%20.732%2C0%200%2C0%200%2C5.781%200%2C5.781%200%2C1.01%20-.832%2C1.754%20-1.785%2C1.754%20m2.775%2C-2.18%20c0%2C0%200%2C-5.316%200%2C-5.316%200%2C0%20.743%2C0%20.743%2C0%200%2C0%20.1%2C.544%20.1%2C.544%20.31%2C-.788%201.163%2C-.799%201.762%2C-.321%200%2C0%20-.31%2C.809%20-.31%2C.809%20-.522%2C-.366%20-1.319%2C-.276%20-1.408%2C.455%200%2C0%200%2C3.829%200%2C3.829%200%2C0%20-.887%2C0%20-.887%2C0%20m4.679%2C-.843%20c.421%2C0%20.864%2C-.344%20.864%2C-.743%200%2C0%200%2C-.543%200%2C-.543%200%2C-.445%20-.387%2C-.755%20-.864%2C-.755%20-.465%2C0%20-.854%2C.378%20-.854%2C.854%200%2C0%200%2C.31%200%2C.31%200%2C.479%20.389%2C.877%20.854%2C.877%20M21.387%2C5.877%20c0%2C0%200%2C-.31%200%2C-.31%200%2C-.932%20.709%2C-1.731%201.729%2C-1.731%20.355%2C0%20.787%2C.233%20.909%2C.589%200%2C0%20-.023%2C-.467%20-.023%2C-.467%200%2C-.466%20-.387%2C-.855%20-.864%2C-.855%20-.221%2C0%20-.542%2C.134%20-.843%2C.422%200%2C0%20-.486%2C-.743%20-.486%2C-.743%20.376%2C-.344%20.897%2C-.588%201.329%2C-.588%20.942%2C0%201.762%2C.787%201.762%2C1.764%200%2C0%200%2C3.629%200%2C3.629%200%2C0%20-.719%2C0%20-.719%2C0%200%2C0%20-.09%2C-.567%20-.09%2C-.567%20-.111%2C.468%20-.676%2C.633%20-.953%2C.633%20-.953%2C0%20-1.751%2C-.821%20-1.751%2C-1.776%20m5.382%2C1.71%20c0%2C0%20-.886%2C0%20-.886%2C0%200%2C0%200%2C-5.338%200%2C-5.338%200%2C0%20.697%2C0%20.697%2C0%200%2C0%20.112%2C.522%20.112%2C.522%20.222%2C-.433%20.631%2C-.577%20.952%2C-.589%20.444%2C-.011%201.031%2C.2%201.307%2C.888%20.267%2C-.688%20.809%2C-.888%201.32%2C-.888%20.953%2C0%201.729%2C.777%201.729%2C1.765%200%2C0%200%2C3.64%200%2C3.64%200%2C0%20-.887%2C0%20-.887%2C0%200%2C0%200%2C-3.64%200%2C-3.64%20.012%2C-1.21%20-1.729%2C-1.154%20-1.729%2C0%200%2C0%200%2C3.64%200%2C3.64%200%2C0%20-.887%2C0%20-.887%2C0%200%2C0%200%2C-3.64%200%2C-3.64%200%2C-.466%20-.387%2C-.866%20-.875%2C-.866%20-.477%2C0%20-.853%2C.4%20-.853%2C.866%200%2C0%200%2C3.64%200%2C3.64%22%2F%3E%3C%2Fsvg%3E)](https://infogram.com/?utm_source=infogram&utm_campaign=logo_flex&utm_medium=webview&utm_content=infogram_3b0523e2-931a-4d2c-aa3d-9d65818b79e6)

Click to access available viewer actions.

Dedicated design system teams are growing

Infogram

Teams are spending the most effort on documentation and managing design components and processes

Respondents were asked which activities require the most effort to manage their design system.

Survey results indicated that documentation and design components require the most effort and time. Designer documentation had the highest percentage of respondents, followed by design library (components and styles), coded components, and developer documentation.

Level of Effort - Infogram

You have entered page 1

Designer documentationDesign library (components andstyles in Figma, XD, Sketch)Coded componentsDeveloper documentationDesign tokens (coded variablesthat define color, spacing,…Work planning info (tickets,status, stubs, etc)Version controlProcess definitions andworkflowsBrand guidelinesGovernance model (processes fordecision-making, contribution,…TestingData about use or analytics0246810121416182022242628

Click to access available viewer actions.

Level of Effort

Infogram

Education is essential to design system adoption

With regards to the challenges they faced around design system adoption, knowledge of design systems was at the top of the list. Respondents chose the following three challenges as those that require the most effort:

  1. Lack of knowledge and experience using design systems (31%)
  2. Internal politics (21%)
  3. Lack of documented workflows and guidelines (21%)

Percentage of respondents that answered that this challenge required high effort when implementing a design system.

Education is essential to design system adoption - Infogram

You have entered page 1

35302520151050Lack of knowledg…Internal politicsLack of documen…Associating adopt…Getting support fr…Adoption as a prio…Lack of proper too…Lack of interest fr…Lack of trust in the…Getting support fr…Lack of interest fr…Count of 3G.12 - …

Click to access available viewer actions.

Education is essential to design system adoption

Infogram

Teams are measuring adoption using code

Of the respondents that are measuring design system adoption, the most prominent means of doing so is through their codebase.

How are respondents measuring adoption?

About 6% of respondents were not measuring adoption at all.

How do teams measure design system. - Infogram

You have entered page 1

We don't measure adoption 6.12%Tracking design system use in design tools 26.53%Tracking design system use in codebase 34.69%Surveying users 28.57%Other 4.08%

Click to access available viewer actions.

How do teams measure design system.

Infogram

Self-service and educational resources are the best driver of adoption

Respondents were asked what resources are most effective at driving design system adoption at their company.

Self-service documents and videos had the highest percentage of responses (29.4%). Following that was advocacy and training (workshops, events, speakers) (26.5%) and live support (25%)

Self-service resources (29.4%) and advocacy and training (26.5%) had the highest percentage of responses, signaling a need for ongoing education and educational resources. 25% of respondents also marked both live support (help desk, office hours) and leadership mandates as driving factors of adoption.

How do teams drive adoption - Infogram

You have entered page 1

302520151050Self-service resources (…Advocacy and training (…Live support (help desk, …Adoption mandate from …Associating adoption wi…Internal communications…Other

Click to access available viewer actions.

How do teams drive adoption

Infogram

Are you trying to improve adoption of your system? Or just starting on your system journey? Knapsack helps teams accelerate adoption by providing the end-to-end needed to operate a design system at scale.

Reach out today at hello@knapsack.cloud or @KnapsackCloud to start a conversation.

Get started

See how Knapsack helps you reach your design system goals.

Explore Case Studies