Laying the Foundations: How to Design Websites and Products Systematically

by Andrew Couldwell

A comprehensive guide to creating, documenting, and maintaining design systems, and how to design systematically. An ideal book for web and product designers (of all levels) and especially in-house design teams.

Available to purchase at: https://designsystemfoundations.com

This is real talk about creating design systems and digital brand guidelines. No jargon, no glossing over the hard realities, and no company hat. Just good advice, experience, and practical tips. System design is not a scary thing — this book aims to dispel that myth. It covers what design systems are, why they are important, and how to get stakeholder buy-in to create one. It introduces you to a simple model, and two very different approaches to creating a design system. What's unique about this book is its focus on the importance of brand in design systems and creating documentation. It’s a comprehensive, practical guide that’s simple to follow and easy on the eye.

Genres: Design, Website Design, Nonfiction

281 pages, Kindle Edition

First published October 1, 2019

About the author

Andrew Couldwell is a designer who codes, with over 15 years of experience. In recent years he’s led the design and creative direction of digital brands, products, and design systems at Adobe and WeWork, and has worked on digital design projects for the likes of Red Bull and NASA. He’s now a freelance web designer and developer. He’s also the founder and curator of Club of the Waves. Andrew is a British expat, now living and working in the United States. He loves what he does, and is excited to share what he’s learned with you in this book.

Reviews

[Milos Mirkovic · Rating 5 out of 5]

A great read!

I follow Andrew's work for years now and I can say he is an expert in the field of systematic design. His articles on medium helped a lot building my first design system last year, and now, with this book on my side, I can't wait to see what I'll do next.

It's more than a book. It's a manual. The one you want to keep on your desk all the time.

[Jan-paul · Rating 5 out of 5]

Forget all those random blogposts about design systems, just read this book and you'll learn everything you need to know.

[Erin Weigel · Rating 5 out of 5]

Great as a high-level primer for anyone new to Design Systems. Love the fact that he doesn’t suggest specific technical solutions in the book itself but has an up-to-date web resource instead.
The organizational and communication aspects of the system are also super important, which he does a good job explaining.

If you’re new to Design Systems, definitely has everything you need to get a decent grasp of what they are and how to start one.

[Matt Wilson · Rating 4 out of 5]

Great read if you’re building a design system for the first time or the tenth. Couldwell goes over all the parts of building, communicating, and maintaining a proper system and provides real-life examples of how he brought systemized thinking to the handful of organizations.

[Aleksey Polukeyev · Rating 5 out of 5]

Agree with the other reviewers, the book is useful and well written. It blends high level with specificity that many other books lack and organizes ideas and bits of information that were previously scattered amongst articles, blog posts and podcasts into a coherent whole. Using this as a reference guide for our team as we organize and build out a robust design system for a wealth management firm.

[David · Rating 5 out of 5]

Plain language approach to leading cross functional DS initiatives. Great place to start

[Siniša · Rating 3 out of 5]

I am still reading the book, but I must say that I’m very disappointed with the quality of print. For a book of this subject I would expect it to look way less cheaper inside. I advise buying the e-book only.

[Alexandre Gomes · Rating 4 out of 5]

This book parallels many of the core ideas of “Atomic Design” - major new concepts are the introduction of a new design system model for digital products (the original Atomic Design book examples were focused around website development).

Atomic Design (Website oriented)

* Pages
* Templates
* Organisms
* Molecules
* Atoms

Laying the Foundations (Digital Product oriented)

* User Journeys
* Screens
* Features
* Patterns
* Components
* Foundation

Foundations in this model are an extension of the style guide concept.

Components will map to the atoms and molecules described in Atomic Design.

Patterns, recurrent solutions to design problems, will be related to organisms.

Unlike the website template described in the Atomic Design model, dynamic screens mays have dozens of outcomes and resulting feature sets.

Finally, user journeys will map out how a feature is used.

The book also talks about the major problems emerging while maintaining a design system which everyone working on such a project should be careful about.

Would recommend this book a quick look after having read Atomic Design.

Hope this was helpful for someone - thanks!

[Kia Storm · Rating 4 out of 5]

This is a great book with fantastic, clear information. This book has all the information you need to start the process of building a design system.

I'm a developer that has been heavily involved in building and implementing a design system at my employer for the past year. For context, we use React, Styled-System (I highly recommend for anyone building a React component library) and Styled Components to get the job done.

I picked up this book to see if I could gather any useful insights to bring to our project. Unfortunately, I didn't find much in this book that hasn't already been solved within my team. That being said, I don't believe the author wrote this book for me.

If you are a designer with little-to-no experience with design systems, this should be the only book you need to get started.

Although if you're already working with a fairly solid design system, this book probably won't do much for you (I should have gathered from the name, Laying the Foundations, lol).

[Amy · Rating 3 out of 5]

The book was quite repetitive, and my role straddles design and development, so it was a bit simplistic for setting a foundation. Perhaps for someone in web design purely in design (very little actual coding), and completely new the the concept of design systems, this book would be useful. I did find some use, but I've already started on a system and put a bit of thought into it. At this point I need more practical and substantive guidance, for writing documentation and developing workflows. That isn't in this book.

[Murkrage · Rating 4 out of 5]

Comprehensive outline of laying the foundations for a design system. Goes a little too fast for some parts and a little too slow for others, but this may be entirely subjective. Details about the foundation and possible implementations of a design system are very comprehensive and could absolutely be used as a guide for your own implementation.

[Khue Dinh · Rating 2 out of 5]

The book is Ok but I don't think I learn so many things from it.

[Jason · Rating 3 out of 5]

Good overview of design systems, straightforward and uses plain language to give an honest accounting of the work and use cases.

[Mohamad Azizi]

The best booook

[Mykyta Ischenko · Rating 5 out of 5]

Good knowledge received 🫡