Design Systems

What are design systems?

According to UX research firm Neilson Norman, "A design system is a complete set of standards intended to manage design at scale using reusable components and patterns." (Fessenden, 2021) To summarize, design systems are style guides, component libraries, color swatches, typography selections, etc., which together form a system of design. As a whole, a design system enables users throughout an organization to create applications, creatives, and other design elements in a way that matches and feels cohesive.

Well-Known Design Systems

Several well-known design systems include:

Fluent:

Developed by Microsoft, Fluent is the design system used by Windows 11 and other Microsoft apps like Word. https://fluent2.microsoft.design/

Material:

Developed by Google, Material is found all across Google products and services, plus used by many Android apps. https://m3.material.io/

Human Interface Guidelines:

Developed by Apple and found across many Mac and iOS devices, apps, and services. https://developer.apple.com/design/human-interface-guidelines/

SDLC Benefits

Design systems are about more than which colors and fonts to use. Design systems enable apps to become a part of an ecosystem. If your organization has a design system or follows another company's design system, it will be easy for users of your system to pick up your app's interface quickly. When components and layouts look the same across systems, users can bring their familiarity with them even when they've never used your new application.

Spillover Benefits

In addition to useability advantages, design systems also simplify the app design process, make building wireframes a breeze, and streamline the development process. Developers following a design system only have to implement components once. They can use your organization's component library across various apps, reducing repeated UI code and speeding up the development process.

Photo by Mario Gogh / Unsplash

References

Fessenden, T. (2021, April 11). Design Systems 101. Nielsen Norman Group. https://www.nngroup.com/articles/design-systems-101/