How to create a Lean Design System 🙌🏼

In recent years, Design Systems have become the quintessential tool for bringing product development teams together. Despite this, many teams struggle to make the upfront investment required to reap their rewards.

Freehand by InVision
Inside Design
6 min readAug 3, 2022

--

Written by Mark Boyes-Smith, Director of Product Design at InVision.

Creating a “Lean” Design System — Watch the webinar

With the conversation around Design Systems maturing, I’m interested in understanding how we might adopt a lean mindset when creating design systems.

In this article, I want to share 4 principles and exercises that have helped me and my team create a Lean Design System.

  1. 🔥 Find the fires (exercise: User Experience Audit)
  2. 🎡 Don’t reinvent the wheel (exercise: System Architecture Planning)
  3. 🧱 Best of basics (exercise: Design Token Planning)
  4. 👯 Win friends not battles (exercise: New component template)

More of a watcher than a reader? Recently I ran a webinar on this very topic. Check it out.

The superpowers of Design Systems

As a single source of truth for design intent, Design Systems help creative and technical teams speak a common language and deliver user experiences that feel connected, familiar, and cohesive.

With this shared language, teams can move quickly, onboard new team members, and curate reusable building blocks of UI to support product development at scale. Successful teams can even harness Design Systems to reduce design fragmentation and technical debt across an ecosystem.

Sounds magical, right? 🦄

Well… In order to harness these benefits, there is a price to be paid. Establishing a Design System requires upfront and ongoing investment, both financially and culturally. This represents a luxury many teams can’t afford.

Even for businesses with established Design Systems, I consistently see challenges around low adoption and engagement as Design System teams battle to balance building for scale and experimenting at speed. When speed is a top priority, convincing consumers to invest precious time engaging with an emerging system can be a little difficult to justify. The result is a Design System that doesn’t solve the needs of the business.

If you’re nodding along, fear not — there is a way forward!

Applying a lean mindset to Design Systems

This approach takes inspiration from the Lean Thinking Methodology.

Put simply, to be lean is to put just enough effort in the right activities to unlock the benefits. If you are familiar with Pareto’s principle, the most impactful 20% of jobs to be done will reap 80% of the benefits.

A Lean Design System optimizes activities to maximize impact against the most pressing business challenges, for example:

  1. Establishing a source of truth
  2. Speeding up design and development
  3. Creating a cohesive user experience
  4. Creating a shared language between designers, engineers, and content writers
Pareto’s Principle — The 80/20 Law

Principles of Lean Design Systems

Here are 4 guiding principles to help focus your investment and an exercise you can use to get started.

1. Find the fires

We can’t fix everything, so it’s important to apply Pareto’s principle to our work and select the most impactful 20% of jobs to be done to focus on.

Here is an exercise to help you find the most significant inconsistencies across a platform user experience, and take steps towards consolidation.

Design System — Experience Audit Exercise

Experience audit Let’s find those fires! Bring your teams together to collectively identify areas of the experience landscape that are causing problems. This exercise is fantastic to run with engineers, designers, and product owners! Use this template for free in Freehand.

2. Don’t reinvent the wheel

In the spirit of being lean, let’s capitalize on the work done by larger teams. There are so many excellent Design Systems examples out there, set by industry leaders like Airbnb, Google, Atlassian, and Adobe. Start by cherry picking your favorite aspects of each to create the perfect system.

Here is a great collaborative exercise to help you quickly establish a sensible and scalable architecture for your Design System.

Design System — Architecture planning exercise

Architecture planning Leverage popular Design Systems to understand the structure and architecture of your emerging system. This exercise is another cross-functional one that can help you make sense of the different types of artifacts your system will support. Use this template for free in Freehand.

3. Best of basics

If you’re going to perfect anything, perfect your foundations.

Foundations are like the letters of an alphabet and include rules for fundamental concepts like color, typography, and spacing. With letters we can construct words and phrases. Getting these building blocks right will make it easier for you and your consumers to compose components and patterns later down the line.

A robust set of foundations can help to improve the understanding of the core design language, as consumers become familiar with how letters can be combined to create new words.

For design system teams who struggle to match the speed of their consumers, foundations and design tokens allow the system to prioritize the health of the core language and empower consuming teams to experiment with new experiences that inherit from the system foundations.

The universal language of foundations is design tokens. Here is an exercise to help you create a scalable library of tokens with your team.

Design System — Design Token Exercise

Design token planningTime to pay attention to those foundations. This exercise will show you how to collect and group foundations before transforming them into design tokens. With tokens, consuming teams can create wonderful new experiences that connect to the system at a foundational level. Use this template for free in Freehand.

4. Win friends not battles

When setting up a new Design System, it’s easy to become the gatekeeper or the guardian. I’ve often heard systems teams say they feel like a ‘bottleneck’ and are struggling to support the speed of their consumers while maintaining a level of quality and rigor.

Applying a lean mindset means to have the courage to open the flood gates and take a long term view over how the system progresses. Crowdsource your components from consuming teams and creating partnerships to evolve the language.

The argument is that a design system can move faster and become more relevant through partnerships than it can through processes.

Here is a template you can use to create a collaborative partnership for consumers and design system teams when you need to create something new.

Design System — “New Component” Template

New component templateThis is one to keep in your back pocket. Often, contribution to a Design System can be challenging. In the spirit of supporting teams to experiment with the Design System, this exercise brings teams together to collaborate on solutions. Use this template for free in Freehand.

Further reading

I definitely suggest checking out Lean Design System. This is a comprehensive methodology that will help you take a Design System from start to finish.

--

--