Building and maintaining design systems

Summary

• I have led the creaton and maintenance of Design Systems in two different companies, which resulted in improved development efficiency, design integrity, and lowered development costs.
• I had ownership of the project from 0 to 1: defined goals, got stakeholder buy-in, developed strategies, set up processes and team structures.
• With hands-on work, I have been creating system components in Figma UI libraries, described patterns and code components in collaboration with engineers.
• I have addressed the challenges of Design System governance and maintnance, seting up relevant processes processes and promoting Design System impact and value.

Many companies can benefit from having a design system, but each company and product is unique. From my experience, a famous “Gall’s Law” of Systemantics is very true when applied to building design systems:

“A complex system that works is invariably found to have evolved from a simple system that worked. A complex system designed from scratch never works and cannot be patched up to make it work. You have to start over with a working simple system.”

Artefacts and guidelines of a Design System only make sense as far as people are using them and following them. A strategy of adopting new processes step-by-step has a much higher chances of succeeding, compared to starting fresh into a whole new set of assets guidelines and processes.

The design system is an internal product with a distributed ownership, and my first steps as a project leader were to build trust and cooperation around it.

Steps I took to enable Design System creation:

• Initiated a conversation about the role of design within the company, established design principles and vision.
• With a designer/developer task force: definined sussecss metrics, roadmaps and delivery phases.
• With business, leadership, and other non-designer/developer roles: getting strategic buy-ins, feedback, and insights.

Steps I took to adopt a Design System:

• Performed audit of existing libraries and patterns, documented them, setting the baseline for future changes.
• Created blueprints for element definitions (both in Figma and in a coded component/pattern library).
• Discovered and documented rules and workflows relevant to each team (Example rule: first create a component in a library, then reuse it in a product. )
• Partially created and described system elements and guidelines.
• Aligned the process to match success metrics, collected feedback and performed optimisations during building and maintenance.