The Unix philosophy for designing software, “Make each program do one thing well”, is a piece of wisdom that goes beyond just programming. For instance, it also applies to non-fiction writing. When learning, I find that I gravitate towards small focused resources, rather than monolithic books or websites that aim to teach everything about a specific topic.
Atomic Design by Brad Frost is a book that does one thing really well: it explains what a design system is, and how you can implement one in your organization. It doesn’t try to be a book about CSS, design styles or any of the other myriad topics that touch against design systems. That focus serves it well, and I found it to be well worth my time.
Design Systems are an organized toolkit for creating digital products. They’re a set of elements, widgets, patterns, and layouts (atoms, molecules, organisms and templates in the language of the book) that can be combined to build complex sites and applications. The idea is pretty simple. But there are some real challenges in implementing one.
- What content belongs in a design system? Where do we draw the boundary as to what belongs and what doesn’t?
- How do you build a tool for your design system so that patterns are easily findable, usable, and understandable?
- How do you keep a design system relevant over time as the product(s) change?
- How do you convince budget-conscious organizations that maintaining a design system is a good use of time and money?
After a brief introduction to the ideas behind design systems and pattern libraries, these are the challenges that Atomic design tackles. It discusses a hierarchy for patterns, and methods for pulling them out of existing applications, then moves on to talking about tools for implementing a pattern library, and techniques for navigating organizational politics when starting and maintaining a design system.
So this book will be helpful for you if you are
- Struggling to deal with inconsistencies in your interfaces, or constantly doing custom UI work for each new feature
- Considering implementing a design system/pattern library for your organization
- Hoping to learn more about design systems because somebody else in your organization is pushing for one
- Having trouble maintaining an existing pattern library
It won’t be helpful for you if you are
- Looking for tips on how to make your interface beautiful
- Seeking hands on information about specific design, CSS or JavaScript techniques
I enjoyed Atomic Design a lot, and hope that I’ll get to use what I’ve learned in the near future. As far as I can tell, Atomic design is only available on Brad Frost’s site. You can read the book online there, or buy the paperback version. If you fall into one of the 4 categories I listed above, I’d highly recommend checking it out.