6 Best Examples of Good Design Systems

Constant industry innovation is critical to distinguishing a brand from the competition and improving the user experience, especially for brands that operate on a global scale.

A design system collects all UI resources available to a design firm. All code snippets and development resources containing necessary code, documentation, page screenshots, image examples, design guidelines, relevant tools, documents and articles, style guides, reusable components and philosophies, and all other digital assets useful for the overall web design workflow are included.

What You Can Learn From Design Systems

Instead of discussing how to create a design system, we will look at design systems from a different perspective and show you how you can use them as a study guide to understanding UI/UX and product design practices and implementation.

Most design systems are set up similarly; top-level navigation shows the system's main categories, typically something like Branding, Design, Components, Code, etc. Within each category, there is usually a sub-navigation or side-bar navigation that further subdivides the categories into areas such as Color, Typography, Components, Forms, Guidelines, and so on. It's like a design master class!

Atlassian Design System

Atlassian, one of my favorite design systems, creates project management and collaboration tools such as Jira and Trello, which thousands of teams use worldwide. Their focus is on agile tools that assist agile teams in staying on track as they plan, develop, and deliver products.

The Atlassian design system aims to improve team collaboration by making it more scalable, agile, and open. This design system includes a wealth of resources, such as tools, plugins, and guides to assist users in creating designs with ease. Templates include posters and letterheads, logos and lockups for all programs, presentation kit and graphic assets, Figma components and patterns, and a font library.

Shopify Design System

Shopify believes that commerce can be improved and made more accessible to all. They aim to empower people by making starting, running, and growing a business easier. The shared values of Shopify are at the heart of the experiences they create:

1. Considerate - Above all, we are concerned about the people who use our tools and products.

2. We want people to feel like they can accomplish whatever they want.

3. Crafted - Shopify experiences should appear to have been handcrafted with the utmost care.

Uber Design System

Uber is a ride-hailing service in the Gig-Economy, providing services such as peer-to-peer ridesharing, ride service hailing, food delivery, and a micro-mobility system that includes electric bikes and scooters.

Their design approach

Uber is about getting people where they want to go, from sub-brands to internal teams, products to programs. They believe that movement creates opportunity in their day, lives, and moments.

Mailchimp Design System

Mailchimp has been a long-time leader in user-friendly email marketing. It has grown beyond email into an all-in-one marketing platform for small businesses, recently updating its branding and identity system.

Mailchimp's design philosophy allows businesses to grow while remaining true to themselves. Their brand embodies what the Mailchimp team values: a dedication to craft, a love of creative expression, and an obsession with quality.

Helpscout Design System

Help Scout is the pinnacle of online support ticketing. It is a self-contained design ecosystem that spans both design and front-end, which all engineers can use to build our UI. There are no typical help desk impediments because it has been carefully designed for a great customer experience. All of their efforts are directed toward developing software that provides teams with the scale and efficiency of a help desk while providing a seamless customer experience.

Salesforce Lightning Design System

Salesforce pioneered cloud-based CRM software and has assisted over 150,000 businesses in running more efficiently. They deliver personalized experiences to your customers through integrated CRM that improves marketing, sales, commerce, service, IT, and more.

Their design approach

1. Ohana is the Hawaiian word for intentional family and is what drives their company culture. Their four core values, which guide their decisions, actions, and communication, are as follows:

2. Customer Satisfaction Innovation Equality