{"id":3117,"date":"2022-03-04T16:25:18","date_gmt":"2022-03-05T00:25:18","guid":{"rendered":"http:\/\/seanalsobrooks.com\/?p=3117"},"modified":"2022-03-04T16:45:50","modified_gmt":"2022-03-05T00:45:50","slug":"design-system-danger","status":"publish","type":"post","link":"http:\/\/seanalsobrooks.com\/design-system-danger\/","title":{"rendered":"Design System Danger"},"content":{"rendered":"\n<p>What is a design system and how could it possibly be dangerous? Let&#8217;s start with a definition:&nbsp;<\/p>\n\n\n<p class=\"p1\" style=\"padding-left: 40px;\"><span class=\"s1\">\u201cA Design System is the single source of truth which groups all the elements that will allow the teams to design, realize and develop a product.\u201d<\/span><\/p>\n<p class=\"p2\" style=\"padding-left: 40px;\"><span class=\"s2\">~ <a href=\"https:\/\/uxdesign.cc\/everything-you-need-to-know-about-design-systems-54b109851969\" target=\"_blank\" rel=\"noopener\"><span class=\"s3\">Everything you need to know about Design Systems<\/span><\/a><\/span><\/p>\n\n\n<p>A design system is a useful and much needed tool for product and design teams. It helps to ensure consistency across design patterns and elements as the product scales and the team grows. It serves as a home base and a single source of truth for design components. Some examples of components in a design system include:<\/p>\n\n\n\n<ul><li>Typography<\/li><li>Color Palette<\/li><li>Layout Grid<\/li><li>Form Elements<\/li><li>Spacing + Padding<\/li><li>Navigation<\/li><li>Pagination<\/li><li>Buttons<\/li><li>CTAs<\/li><\/ul>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>For all the upside a good design system provides, there are few inherent dangers in the very idea of a design system.&nbsp;<\/p>\n\n\n\n<div style=\"height:40px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">1. Let\u2019s start with the word \u2018system\u2019.<\/h3>\n\n\n\n<p>System: a set of principles or procedures according to which something is done; an organized framework or method.<\/p>\n\n\n\n<p>On the surface, this sounds like a good thing, but it can easily become a rule book that is over prescriptive to the point of killing creativity. The design system becomes so sacred that no one dares to explore new solutions that may live outside of the those already contained within the system.<\/p>\n\n\n\n<p>There is a popular movement over the last several years to elevate the design system to a position of worship in the product organization. As if it is canonical truth handed down from on high. Do not question it, for it is \u2018The Truth\u2019.<\/p>\n\n\n\n<p>However, we need flexibility. The best design system is alive and ever evolving. It is never carved in stone. It is less system or rulebook and more guide and framework upon which designers can solve customer problems. A design system is never finished. It is never complete. It is never shelved and then only accessed as reference tool. It is a living artifact. It should grow and adapt and change and move and breath.<\/p>\n\n\n\n<div style=\"height:40px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">2. The Silver Bullet Fallacy<\/h3>\n\n\n\n<p>Consistency in design is huge. It is a key factor in what makes a design \u201cgood\u201d and cohesive and scalable. But it is not king of all &#8211; that is a BIG statement for me to make &#8211; I pride myself on consistency in product design. The use of a visual language that people can learn to interpret and respond to helps them gain confidence and know what to expect as they use our software.&nbsp;<\/p>\n\n\n\n<p>And a design system is a great tool to help maintain consistency across your software product.<\/p>\n\n\n\n<p>But\u2026<\/p>\n\n\n\n<p>Sometimes, the design system is treated as the silver bullet solution for design teams. Upon it\u2019s establishment, we now have a clear flow chart of decision making for every potential problem we might ever have to solve for in the future.&nbsp;<\/p>\n\n\n\n<p>We can get so focused on the atoms of designs (components, buttons, typography, etc) that we miss the forest from the trees. The people using our software do not care if our layout grid is based on 8 pixels or if our corner radius on our buttons are exactly the same.&nbsp;<\/p>\n\n\n\n<p>They are using our software to solve their problem. They want to get in, get their task completed and move on with their day.\u00a0<\/p>\n\n\n\n<div style=\"height:40px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">3. Creativity Killer<\/h3>\n\n\n\n<p>Finally, when used incorrectly, design systems can hinder creativity in designers and relegate them to mere manufacturers or constructors. No need for the designer to think outside the box, to be inspired, to explore potential solutions. No, no, no\u2026.the design system is your predetermined box of legos from which all problems can and will be solved.<\/p>\n\n\n\n<p>This is dangerous.<\/p>\n\n\n<p style=\"padding-left: 40px;\"><a href=\"https:\/\/uxplanet.org\/design-systems-are-bullsh-t-7ecdb795cc62\" target=\"_blank\" rel=\"noopener\">Pascal Berry<\/a> writes,\u00a0<\/p>\n\n<p style=\"padding-left: 40px;\">\u201cDesign systems choose consistency and convenience over creativity and craft. When you overvalue consistency in the pursuit of uniformity, you create too many unnecessary rules that straitjackets creative thinking before it can even get going\u2026 you kill the holistic working process necessary to develop a designer\u2019s craft.<\/p>\n<p style=\"padding-left: 40px;\">Design systems are well meaning, and no one can fault their ambition. But by dismembering the design process with prescriptive step-by-step rules, it restricts a designer\u2019s freedom to work creatively.\u201d<\/p>\n\n\n<p>Not only does this hinder good solutions from being born, I also don\u2019t know of a single talented product designer who would find this type of \u2018constraint\u2019 inspiring or life-giving. Designers want to design. We want to explore and try new things and solve difficult problems and a design system should never stand in the way of creative thinking.<\/p>\n\n\n\n<div style=\"height:40px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Balance is the Key<\/h3>\n\n\n\n<p>The challenge for design teams is to find the balance between consistency and flexibility when creating and using a design system. It\u2019s certainly necessary and fruitful to establish and organize design patterns and components but be cautious about outlawing the creative process in favor of the system.&nbsp;<\/p>\n\n\n\n<p>Designers need the space to dream, play, explore, feel and craft new ideas and solutions. The design system should serve as a launching pad for this creative process, never a prison cell.&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>What is a design system and how could it possibly be dangerous? Let&#8217;s start with a definition:&nbsp; \u201cA Design System is the single source of truth which groups all the elements that will allow the teams to design, realize and develop a product.\u201d ~ Everything you need to know about Design Systems A design system [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":3124,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[14,56,54,52],"_links":{"self":[{"href":"http:\/\/seanalsobrooks.com\/wp-json\/wp\/v2\/posts\/3117"}],"collection":[{"href":"http:\/\/seanalsobrooks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/seanalsobrooks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/seanalsobrooks.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/seanalsobrooks.com\/wp-json\/wp\/v2\/comments?post=3117"}],"version-history":[{"count":10,"href":"http:\/\/seanalsobrooks.com\/wp-json\/wp\/v2\/posts\/3117\/revisions"}],"predecessor-version":[{"id":3128,"href":"http:\/\/seanalsobrooks.com\/wp-json\/wp\/v2\/posts\/3117\/revisions\/3128"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/seanalsobrooks.com\/wp-json\/wp\/v2\/media\/3124"}],"wp:attachment":[{"href":"http:\/\/seanalsobrooks.com\/wp-json\/wp\/v2\/media?parent=3117"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/seanalsobrooks.com\/wp-json\/wp\/v2\/categories?post=3117"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/seanalsobrooks.com\/wp-json\/wp\/v2\/tags?post=3117"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}