“A Design System is not a project. It is a product, serving products.”
~Nathan Curtis
The Problem to Solve
Determine if a custom design system would prove beneficial to our organization. Like many companies we have a low designer to developer ratio (5 UX Designers and 14 Development teams), and sometimes we have multiple designers assigned to 1 product. We wanted to understand the impact a broadly used design system would have on the digital products we create. My role in the Design System discovery (and ultimately development) was to lead the Design System Team and provide some UX support.
Challenges
There had been a previous experiment in creating a design system for the organization, however it was not fully funded, researched, or implemented. The components created were outdated quickly and there was little support for the system as it was a side project for those involved. This left a perception with some teammates and leadership that a custom design system was unattainable and not valuable.
The Approach
My first task in leading the Design System team was to add teammates that could aid in product discovery and have the skills to deign and create a system. I also sought help from experts to assist in discovery and evaluation, and ultimately selected Nathan Curtis from EightShapes. Our team worked with Nathan about 6-8 weeks in product discovery to understand the business value and user needs as well as the current technical landscape for our products. During this time we interviewed stakeholders and users of the system to learn their needs, vision and concerns of a custom Design System.
Design Audit
We performed a design audit of our most supported applications. We found many inconsistencies of components, language, and design patterns. The audit allowed us to take a look across all our applications and identify templates that would be beneficial to include, as well as an inventory of components to include in our backlog.
Technical Audit
Our technical audit showed us the frameworks that our products were built upon, indicating the biggest lift we could give our developers in the tools they are currently working in.
Roadmap
We identified and prioritized the components to be in the first few releases of the system based on need and impact. We established a release schedule that included an Alpha, Beta and 1.0 release.
Design System Assets
A design system isn’t just an output from UX, It’s a multidisciplinary product that includes design, code and documentation. Our deliverables included design assets in Figma, a code repository and a website with guidance and documentation.
Documentation & Guidance
A system also needs appropriate guidance and documentation as to how to use the components provided.
We created a site with how to get started as a developer or designer, this includes code references, and component guidance, templates, and documentation around the variations of a component and how to use them.
