How to Unlock the Power of Design Systems
Good design systems can help you create digital products with efficiency and consistency. But great design systems will support and strengthen your team’s creativity at the same time.
Being a relatively new concept, there’s no one true way to implement design systems yet, but several major companies have started creating systems for their teams and are already reaping the benefits.
What Is a Design System?
Good design systems can help you create digital products with efficiency and consistency. But great design systems will support and strengthen your team’s creativity at the same time.
Being a relatively new concept, there’s no one true way to implement design systems yet, but several major companies have started creating systems for their teams and are already reaping the benefits.
A design system ensures any new products you're developing are in line with your brand identity.
Style Guide vs. Design System
Is a design system equal to a pattern library, or a sketch file, or a style guide? The answer is no.
A design system is all of those and more. As Emmet Connolly, the Director of Product Design at Intercom explains:
... most design systems are really just pattern libraries, a big box of UI Lego pieces that can be assembled in near-infinite ways. All the pieces may be consistent but that doesn't mean the assembled results will be. Your product is more than just a pile of reusable UI elements. It has structure and meaning. It's not a generic web page, it's the embodiment of a system of concepts.
A design system is a collection of assets and a set of standards and documentation that accompanies that collection.
A pattern library is a collection of components and guidelines for using them. A style guide is a set of guidelines for the graphic styles, typefaces, colours, images and so on.
In a design system, you'll find examples of how to use each component or graphic style along with accessibility information, best practices and guidelines. That's the difference between a style guide, or pattern library, and a complete design system.