◆Home Improvement Ideas Journal

When to Create: Building a Robust Design System

By

Every product that's designed with scale and consistency in mind eventually encounters a question: When is the right time to create a design system? This isn't a trivial decision, as it involves substantial investment of time and resources. However, when executed correctly, a design system can bring about immense benefits, including improved design quality, faster production, and lower costs in the long run.

Before we delve into when to create a design system, it's crucial to understand what it is. A design system is a single source of truth that includes guidelines, components, and tools that ensure consistency and scalability across an organization's products and platforms. It's essentially a blueprint for a product's design and user experience.

Your Product Portfolio Has Grown

One of the most common reasons for creating a design system is when a company's product portfolio has expanded. As the number of products and features grow, so does the complexity of managing their design. A design system provides a single, cohesive standard to ensure a unified feel across all products.

the cover of how to build a design system
the cover of how to build a design system
the book cover for what how and why of design systems by andrew hock, with black ink on brown paper
the book cover for what how and why of design systems by andrew hock, with black ink on brown paper
an image of a large screen with many different types of information on the screen and in it
an image of a large screen with many different types of information on the screen and in it

At this stage, maintaining a design consistency manually becomes impractical. Inconsistencies creep in, and designers find themselves re-inventing the wheel with each new project. A design system can help prevent this, promoting consistency, efficiency, and speed.

When Your Products Start to Differ

Initially, your products may share a similar design language. But as they evolve individually, their designs may start to diverge. While this lets each product cater to its specific user needs, it can lead to a fragmented user experience across your product suite. A design system can help re-align your products' designs, preserving their unique characteristics while maintaining a common core.

How To Make Your Design System AI-Ready
How To Make Your Design System AI-Ready
Process of Design Systems - Infographic
Process of Design Systems - Infographic
a man holding up a white sign with the words design system checklist written on it
a man holding up a white sign with the words design system checklist written on it

For instance, Airbnb's design system, called AirKit, helped harmonize the designs of their various products and services. By maintaining a core set of consistent design elements, they were able to create a seamless user experience across their platforms.

When Design Decisionsâte Overwhelming

As a company grows, so does the number of design decisions that need to be made. These can range from the mundane (like the exact shade of blue for a button) to the strategic (like the new layout for a dashboard). A design system centralizes these decisions, making them easily accessible and ensuring they're made in accordance with a consistent vision.

Google's Material Design is a perfect example. It provides a comprehensive design guide that standardized numerous design decisions across Google's many products, leading to a unified, intuitive user experience.

The Ultimate Design System Blueprint
The Ultimate Design System Blueprint
the style guide for design system
the style guide for design system
the design system is designed to help you learn how to use it
the design system is designed to help you learn how to use it
The Benefits of Creating a Design System — Speckyboy
The Benefits of Creating a Design System — Speckyboy
EOS Design System & UI-kit Library - Fiona Bui
EOS Design System & UI-kit Library - Fiona Bui
System Design fundamentals can be challenging to adapt. | Pooja Jain
System Design fundamentals can be challenging to adapt. | Pooja Jain

Your Product Is Made by Multiple Teams

When a product's design is handled by multiple teams - whether they're in-house or external - maintaining consistency can be challenging. Each team may have its own interpretation of the product's design language, leading to inconsistencies. A design system helps promote a single, unified understanding of the product's design.

Spotify's Compose, for instance, serves as a single source of truth for Spotify's designers and developers, ensuring that their product maintains a consistent aesthetic regardless of who's working on it.

When Handoffs Between Teams Are Inefficient

Inconsistent design language isn't the only issue that arises when multiple teams work on a product. Inefficient handoffs between teams can also lead to delays and mistakes. A design system can facilitate smoother handoffs by providing clear, detailed specifications that can be easily understood and implemented by any team, regardless of their level of expertise.

System Design Basics Roadmap For Software Engineers 💻
System Design Basics Roadmap For Software Engineers 💻
What is System Design?
What is System Design?
Vitaly Friedman on LinkedIn: #ux #design #designsystems | 87 comments
Vitaly Friedman on LinkedIn: #ux #design #designsystems | 87 comments
Design System | Atomic Design | Light&Dark Modes :: Behance Typography Design System, Condensed Font, Barlow Condensed Font, Typography Style Guide Reference, Unique Names, Figma Style Guide Example, Text Types, Figma Design System, Personal Website
Design System | Atomic Design | Light&Dark Modes :: Behance Typography Design System, Condensed Font, Barlow Condensed Font, Typography Style Guide Reference, Unique Names, Figma Style Guide Example, Text Types, Figma Design System, Personal Website
8 Basic Steps to Create a Design System - UX Design World
8 Basic Steps to Create a Design System - UX Design World
the design system is shown in red and black, with white text that reads what is a
the design system is shown in red and black, with white text that reads what is a
System Design Basics: 7 Building Blocks Every Software Engineer Should Know
System Design Basics: 7 Building Blocks Every Software Engineer Should Know
The Power of Creating Systems for Your Businesses • Grace + Vine Studios
The Power of Creating Systems for Your Businesses • Grace + Vine Studios
Design system CSS workflow
Design system CSS workflow
Beginner Guide to Systems That Turn Designers Into Scalable Teams
Beginner Guide to Systems That Turn Designers Into Scalable Teams
If You’re Creating a Design System, Read These 6 Books
If You’re Creating a Design System, Read These 6 Books
the cover of grid systems every designer should know
the cover of grid systems every designer should know
AI Design Systems Are Changing How Brands Scale
AI Design Systems Are Changing How Brands Scale
HOW I LEARNED SYSTEM DESIGN
HOW I LEARNED SYSTEM DESIGN

For example, IBM's Carbon Design System includes a design language guide, a collection of reusable components, and a toolkit for developers. This ensures that IBM's designers and developers can work together efficiently and effectively.

When Your Designs Aren't Scalable

As your product grows, its design may become unsustainable. Your designers may find themselves constantly recreating basic elements like buttons or icons because they weren't designed with scalability and reusability in mind. A design system can encourage a more modular, scalable approach to design right from the start.

At IBM, this was one of the driving forces behind the creation of the Carbon Design System. They realized that as their portfolio expanded, their designs needed to be more flexible and scalable. The result was a system that could adapt and grow with their products.

Ultimately, the decision to create a design system is complex and depends on many factors. It's about more than just sheer bulk of products or teams - it's about company culture, strategy, and disposition for growth. But remember, a design system doesn't exist merely to preserve consistency; it's a strategic investment in your product's future. It's about preparing for growth, embracing it, and using it to create a user experience that's not just consistent, but exceptional.