Creating Meaningful Design Systems: Embracing the Box and Reaping the Benefits

January 26, 2023 in Design system

Soon I will be working on, not one, but two different design systems consultations. It’s a bit of a new venture for me. I’m used to helping build design systems, but in these two cases I’m helping the design teams plan and re-build a better design system.

In getting ready to kick these two projects off, I’ve found myself wondering - and like any sane designer with imposter syndrome; questioning - if I am qualified to say what makes a design system good… or not. I’ve worked on a dozen different design systems pver the years - big and small, good and bad - so maybe what I’ve learned from these past encounters would help guide me? It wasn’t until I found Amy Hupe’s excellent post on Building Conscious Design Systems that I was able to formulate a better point of view.

The baseline

A couple of years ago, design systems were these shiny new thing that would solve all the problems we used to encounter when designing and building products. Commonly, the advantages that were promised with a design system were (thank you Amy!):

  • Efficiency: it will allow designers to move forward faster because they would not have to spend time on redesigning the same components over and over.
  • Consistency: and because all designers would use the same components, we’d automatically achieve consistency across everything.
  • Scale: and with consistency, we would be able to scale design decisions more easily.

You’ve all heard this before. If you are or have been a designer or product manager, chances are that you’ve argued these exact points to someone skeptical of the value of a design system.

But here’s the thing we rarely ever say: None of this has any inherent value.

Efficiency is only valuable if it helps us move faster towards meaningful outcomes for the people using our products and services.

Consistency is only valuable if we standardise things to a good level of quality.

And scaling things is only valuable if they’re actually worth reproducing.Amy Hupe: Building Conscious Design Systems

Playing the devil’s advocate

When talking to companies about their design philosophy, or design principles, a recurring theme is always to make things ‘simple’. As a designer, I’m a fan of making things ‘simple’. I also know that making things ‘simple’ is extremely difficult. I also feel like that it’s important to highlight that we’re making things ‘simple’ for the user. So if your design principle is ‘simple’, what is the process to make it simple for your customer to cancel their account or pick what communication they want to receive from you? Simple is not just about a frictionless checkout experience, simple is removing any type of friction from any process regardless if it’s one that is in your favor or not.

So back to design systems.

If we can use our design systems to speed up meaningful work, standardise things to a high quality, and scale the things we actually want to reproduce - then the reverse is also true.

It means that, if not built correctly (we’ll come back to this in a sec), our design systems can also:

  • speed up problematic work
  • make things consistently poor quality
  • scale patterns that we don’t want to reproduce

Ouch.

Think of this way; using a calendar is great for organising your schedule and a tool like Notion can provide wonders for both structure and access to information. But none of these tools will make you organised unless the input is organised and, the rules and patterns you obey to are consistent. A design system is just like your calendar, it can provide miracles if used correctly. What’s the right way? One that empowers you.

It’s a parallel process

I’ve worked on projects where we’ve tried to define the design system first and, in doing, argue that we know 90% of the components that we’ll need. If that’s true, we should be able to start by designing that design system and then successfully use it to build the product, right? I don’t think this has ever actually worked. Designing components in isolation is a recipe for disaster. Design is not just the individual pieces, but it’s aso when you combine the pieces together.

Not quite as bad, but let me say it loud and clear, the opposite is just as bad - when you design the full product only to afterwards create the design system. It’s good in the sense that you know what components you’re actually going to be using, but it’s terrible in the sense that you’ll end up having to rebuild everything using the new components. Let’s face it, we don’t have time to do that. It also means that you’ve ignored all of the possible benefits of a utilizing a design system (efficiency, consistency and scale) by only working in an old-fashioned, waterfall-y style.

So in terms of process, a design system needs to be designed in parallel with the product. As soon as you have something ready to go, I think it makes sense to start building the design system. Remember, if done right, this living thing is made of components that are allowed to change over time! That is, in fact, one of the benefits of a design system. We can change it and we’ll still have consistency. If I update the radius of a button in the system, it should update everywhere that component is used.

Embrace the box

Almost a decade ago, my friend Pål Katsler and I held a course at Hyper Island. We both argued the notion that true creatives ‘think outside the box’ is not just tiresome, but can be dangerous in some cases. Creatives should embrace the box and make the most out of it. That’s creativity, being able to produce spectacular work with what you’ve got or been given.

Similarly when designing a design system, I believe it’s valuable to define the constraints and requirements early on. If we aim for our design system to make us efficient, doesn’t it make sense for us to build the design system efficiently? This starts with planning and requirements setting. If we aim for our design system to bring us consistency, the design system itself and the component setup needs to be consistent. If we want our design system for scale, we should allow our design system to scale. It’s intentional work.

What this means practically is consideration of the setup for the components. Do you want to build the components using atoms, molecules, and organisms? Do you want to separate out design tokens (colors, type, etc)? Do you want desktop and mobile components to use the same component or separate? What approach do you want to take for variations like different sizes and different states? What about light and dark mode? Seeing how this can get overwhelming? Defining these requirements will make the build more efficient, the design system more consistent, and better allow for better scalability!

Chaos is not good for creativity

Just like a painter needs their colors organized and a chef needs their mis-en-place - all ingredients gathered, prepared, and ready to use - to create a wonderful dish. Designers should have an organized design system to create really great digital experiences. In fact, if you think about nearly any profession, great work comes from order and structure, whether that is a lawyer, a surgeon, a housekeeper, or a pilot. Why would the work of designers be any different?

The philosopher Lewis Mumford said: “Order and creativity are complementary.”

It’s honest, authentic, and accessible.

I love sharing my experiences working in design and what’ve I’ve learned along the way. Join a community of thousands of designers, developers, and product professionals by signing up to my newsletter!

Not quite ready to sign up? I totally understand! Why not start by reading some of my past issues?

Great! Just “one more thing”...

You need to confirm your email to confirm your subscription.

  1. February, 2024

  2. January, 2024

  3. December, 2023

  4. November, 2023

  5. October, 2023

  6. September, 2023

  7. August, 2023

  8. July, 2023

  9. June, 2023

  10. May, 2023

  11. April, 2023

  12. March, 2023

  13. January, 2023

  14. December, 2022

  15. November, 2022

  16. September, 2022

  17. August, 2022

  18. July, 2022

  19. June, 2022

  20. May, 2022

  21. April, 2022

  22. January, 2022

  23. December, 2021

  24. November, 2021

  25. October, 2021

  26. September, 2021

  27. August, 2021

  28. July, 2021

  29. June, 2021

  30. May, 2021

  31. April, 2021

  32. March, 2021

  33. January, 2021

  34. November, 2020

  35. October, 2020

  36. September, 2020

  37. August, 2020

  38. June, 2020

  39. May, 2020

  40. April, 2020

  41. March, 2020

  42. February, 2020

  43. January, 2020

  44. December, 2019

  45. November, 2019

  46. October, 2019

  47. September, 2019

  48. August, 2019

  49. July, 2019

  50. June, 2019

  51. May, 2019

  52. April, 2019

  53. March, 2019

  54. February, 2019

  55. January, 2019

  56. December, 2018

  57. November, 2018

  58. October, 2018

  59. September, 2018

  60. August, 2018

  61. July, 2018

  62. June, 2018

  63. May, 2018

  64. April, 2018

  65. March, 2018

  66. February, 2018

  67. January, 2018

  68. December, 2017

  69. November, 2017

  70. October, 2017

  71. September, 2017

  72. August, 2017

  73. July, 2017

  74. June, 2017

  75. May, 2017

  76. April, 2017

  77. March, 2017

  78. February, 2017

  79. January, 2017

  80. December, 2016

  81. November, 2016

  82. October, 2016

  83. September, 2016

  84. August, 2016

  85. July, 2016

  86. June, 2016

  87. May, 2016

  88. April, 2016

  89. March, 2016

  90. February, 2016

  91. January, 2016

  92. December, 2015

  93. November, 2015

  94. October, 2015

  95. September, 2015

  96. August, 2015

  97. July, 2015

  98. June, 2015

  99. May, 2015

  100. April, 2015

  101. November, 2014

  102. April, 2013