Most effective designers (and developers alike) dream of a robust design system. A design system that would include many components that can be used across many products. To achieve that, some companies rush to add new components to their design system even before testing them in live production.

It happened to us at Lighting Beetle* too. A client was developing multiple products and designers came up with the idea of implementing a new component to the design system that could be used in various applications.

Project first approach allows building a design system in sustainable way even with small teams.

And so we did. We designed the component, developed it and documented it in the design system. But during implementation we encountered technical requirements that were not compatible with our previous idea. While fixing the problem, design requirements on the products evolved, as is tradition in agile development. The end result was inefficiency. Neither the products, nor design system, nor developers, managers or team benefitted from this effort.

While building a design system, we recommend the “project first” approach. Let me explain it with the help of an analogy with cogs.

Design system like swiss watch


Similarly to swiss watches, a design system also relies on a perfectly functioning mechanism with cogs of different sizes.

The design system itself represents the center wheel. It’s the biggest, most stable cog, therefore turning slowly. Design system too should be a steady part of an organization that is only iterated, not rapidly changed. For a design system to work, it also requires detailed documentation that is understood by everyone involved.

Smaller cogs around the center wheel (design system) represent individual products (or projects) that are influenced by the design system. These cogs rotate at a faster pace, meaning they are more agile, and need to react to technology changes and users’ needs quicker.

Benefits of project first approach

Validation

When testing new design changes, we use the smaller cogs – projects. It allows us to promptly collect user feedback without worrying about affecting the whole ecosystem. Designers can experiment safely and only the components validated by real customers get implemented in the design system.

Efficiency

Once new components are validated and we can use them in multiple projects, it’s time to implement them into a design system. By doing this, we continually improve the robustness and usefulness of the system. Now, whenever we build a new project, we can use existing resources thus saving time it would otherwise take to design and develop new components.

Standardization is a lengthy and laborious process. The end result though is a consistent design across the portfolio that is not affected by constant changes. This can increase customer satisfaction as well as satisfaction of people involved in the project.