Top 8 Design Systems

Here is a dozen examples of what you can do with a design system in your organisation.

A design system maintains the visual and functional elements of your organisation in one place, in order to fulfill your brand principles through the design, realisation, and development of products and services. It may include a sketch library, style guide, pattern library, organisation principles, best practices, templates, codes, and more.

There are many thoughts and ideas about design systems out there, and nearly as many iterations. To help you navigate the design system waters more easily, we have gathered a list of 10 examples, which can serve to inspire you in your own endeavours.

Polaris by Shopify

 

Shopify is a Canadian e-commerce company with a namesake proprietary platform for online stores and retail point-of-sale systems. The company is also behind a design system called Polaris, aimed at helping both Shopify and the Shopify merchants building better user experiences.

In addition to having sections for design, components, and patterns, Polaris also offers a section for content, with guidelines for tone of voice, grammar, and copywriting tips.

Material Design by Google

 

First introduced as a design language by Google in 2014, Material Design has since evolved into an adaptable system of guidelines, components, and tools that support the best practices of user interface design. Material Design is based on open-source code, facilitates collaboration between designers and developers, and helps teams quickly build products.

Atlassian Design

Atlassian is an Australian enterprise software company, best known for the issue tracking application Jira and its team collaboration tool and wiki Confluence. Atlassian also sports a design system, first released as the Atlassian Design Guidelines (ADG) in 2012.

The system is very detailed and is composed of design patterns, code components, and a library of UI assets in Sketch. You can also find the reasoning behind each choice made.

IBM Design Language

IBM’s design system might not be as flashy or stylish as others, but it’s rather sleek, functional, and straight-to-point, which serves just as well. Several examples of use with their design system is present, together with a logical and neat overview of animations, iconography, colours, reusable code, and more.

Airbnb Design

Airbnb not only offers affordable hospitality services around the globe. The company also shares insights about their own design system, featuring cutting edge techniques.

Airbnb Design consists of components that are “like elements of a living organism,” where a set of properties defines each component, with its own personality and function. A component can work with others or evolve on its own, while still being a part of a larger, evolving ecosystem.

Fluent by Microsoft

The Fluent Design System was developed by Microsoft in 2017 and includes guidelines for the designs and interactions used within software designed for all Windows 10 devices and platforms.

The sensory elements are based on five key components: light, depth, motion, material, and scale, with the increasing intent to be applied beyond flat screens.

Apple

Similar to Microsoft’s Fluent, Apple’s design system is meant to enhance the experience of the suite of Apple products and services. In this design system, you can watch video sessions and tutorials for building user-friendly and future-proof experiences, as well as how to optimise the experiences for iPhone X-e.g. designing for sound and writing for push notifications.

Apple

Salesforce is a behemoth within cloud-based software, including CRM, customer service, marketing automation, analytics, and application development. The American company sports a thorough and well-documented design system called Lightning, which is an open-source project focused on building business apps. The design system provides a professional and comprehensive guide to accessibility, components, patterns, utilities, design tokens, and more.

Creating and maintaining a design system is certainly no short-term project or a bed of roses, but all the effort you will put into it will eventually pay off in the terms of reusable codes and elements in any organisation that scales

Stay up to date on offers and news!

    * Read Privacy Policy here.