{"id":63,"date":"2023-08-07T18:50:03","date_gmt":"2023-08-07T18:50:03","guid":{"rendered":"https:\/\/amyoukey.com\/blog\/?p=63"},"modified":"2024-01-03T16:16:59","modified_gmt":"2024-01-03T16:16:59","slug":"real-world-examples-of-design-systems","status":"publish","type":"post","link":"https:\/\/amyoukey.com\/blog\/real-world-examples-of-design-systems\/","title":{"rendered":"6 Real-world Examples of Design Systems"},"content":{"rendered":"\n

Design systems are an essential part of modern product and user interface design. They provide a structured approach to design, ensuring consistency, efficiency, and scalability across various projects and platforms. Many organizations and companies have successfully implemented design systems to streamline their design processes and deliver a more cohesive user experience. Here are some real-world examples of design systems:<\/p>\n\n\n\n

Google’s Material Design<\/a><\/p>\n\n\n

\n
\"Material<\/figure>\n<\/div>\n\n\n

One of the most well-known and widely adopted design systems is Google’s Material Design. It provides guidelines and resources for creating visually appealing and consistent interfaces across different platforms, such as Android, iOS, and the web. Material Design uses a set of principles like responsive layouts, consistent typography, vibrant colors, and meaningful animations to create a seamless experience for users.<\/p>\n\n\n\n

Apple’s Human Interface Guidelines<\/a><\/p>\n\n\n

\n
\"Human<\/figure>\n<\/div>\n\n\n

Apple’s design system, known as the Human Interface Guidelines, outlines the principles and best practices for creating user interfaces for iOS, macOS, watchOS, and tvOS. The guidelines cover various aspects, including layout, navigation, iconography, and user interactions, ensuring a consistent and intuitive user experience across Apple devices.<\/p>\n\n\n\n

Carbon Design System<\/a><\/p>\n\n\n

\n
\"Carbon<\/figure>\n<\/div>\n\n\n

IBM’s design system is an extensive library of design resources and guidelines, focusing on creating a unified experience for IBM’s software products and services. It includes a wide range of components, patterns, and design principles to help designers and developers maintain consistency and speed up the design and development process.<\/p>\n\n\n\n

Salesforce’s Lightning Design System<\/a> <\/p>\n\n\n

\n
\"Lightning<\/figure>\n<\/div>\n\n\n

Salesforce’s design system, known as Lightning Design System, is targeted at building enterprise-level applications. It provides a set of CSS frameworks, design patterns, and guidelines to ensure a seamless experience across various Salesforce products and custom applications.<\/p>\n\n\n\n

Atlassian’s Design System<\/a><\/p>\n\n\n

\n
\"Atlassian's<\/figure>\n<\/div>\n\n\n

Atlassian, known for its suite of productivity and collaboration tools like Jira and Confluence, has a design system that helps create a unified experience across all their products. It includes guidelines for various platforms, as well as resources like icon libraries and UI components.<\/p>\n\n\n\n

Shopify’s Polaris<\/a><\/p>\n\n\n

\n
\"Polaris<\/figure>\n<\/div>\n\n\n

Polaris is Shopify’s design system, enabling merchants and developers to create cohesive and delightful user experiences across their e-commerce platform. It offers guidelines, UI components, and design best practices to maintain a consistent brand identity.<\/p>\n\n\n\n

These examples demonstrate the importance and effectiveness of design systems in fostering a unified user experience, streamlining design and development processes, and promoting collaboration among multidisciplinary teams. Each design system is tailored to the specific needs and branding of the organization, making it an essential tool for building successful products and services.<\/p>\n\n\n\n

 <\/p>\n

\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722\u2722<\/p>\n

Comment below to share your thoughts. \ud83d\ude42<\/p>\n

Learn more about design systems<\/a><\/p>\n

I’m a designer with 20 years of experience in web, eLearning and visual design. Follow me:<\/p>\n\n\"Anne<\/a>\n\"Anne<\/a>\n\"Anne<\/a>\n\"Anne<\/a>\n\"Anne<\/a>\n\"Anne<\/a>\n","protected":false},"excerpt":{"rendered":"

Design systems are an essential part of modern product and user interface design. They provide a structured approach to design, ensuring consistency, efficiency, and scalability across various projects and platforms. Many organizations and companies have successfully implemented design systems to streamline their design processes and deliver a more cohesive user experience. Here are some real-world […]<\/p>\n","protected":false},"author":1,"featured_media":74,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[22],"tags":[],"class_list":["post-63","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-popular-design-systems"],"_links":{"self":[{"href":"https:\/\/amyoukey.com\/blog\/wp-json\/wp\/v2\/posts\/63","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/amyoukey.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/amyoukey.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/amyoukey.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/amyoukey.com\/blog\/wp-json\/wp\/v2\/comments?post=63"}],"version-history":[{"count":6,"href":"https:\/\/amyoukey.com\/blog\/wp-json\/wp\/v2\/posts\/63\/revisions"}],"predecessor-version":[{"id":617,"href":"https:\/\/amyoukey.com\/blog\/wp-json\/wp\/v2\/posts\/63\/revisions\/617"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/amyoukey.com\/blog\/wp-json\/wp\/v2\/media\/74"}],"wp:attachment":[{"href":"https:\/\/amyoukey.com\/blog\/wp-json\/wp\/v2\/media?parent=63"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/amyoukey.com\/blog\/wp-json\/wp\/v2\/categories?post=63"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/amyoukey.com\/blog\/wp-json\/wp\/v2\/tags?post=63"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}