Design Systems Digest

No spam. Ever.

← Home

Issue 01

You're reading the very first issue of Design Systems Digest 🎉

I’ll be keeping an ear to the ground on what is happening in the colliding worlds of design systems, styleguides and front-end architecture and sharing a few links per week that I believe are worth your time. The surface area of these topics blurs the lines between design and engineering, and the content of this newsletter will reflect this.

Without further ado:

Integrating Animation into a Design System [Article]

Motion is often introduced to a project in an ad hoc fashion. This article provides a solid foundation for the process of transitioning your menagerie of animations into a cohesive system. It’s packed with practical tips and examples from some of the most robust design systems in the wild.

Introducing Design Systems Into Chaos [Talk]

Diana Mounter leads GitHub’s design systems team, who are responsible for building and maintaining the Primer CSS framework. She gives a detailed and insightful run-down of how GitHub began introducing some order back into their system after accumulating almost 10 years of diverging styles and approaches.

One of the key takeaways from her experience is that it’s never too early to get started on this process — I’m sure many designers and engineers working on less mature products will have gleamed some encouragement from this.

Thinking in Symbols for Universal Design [Talk]

Ben Wilkinson is Design Systems Lead at Airbnb. In this talk he takes us through the approach taken by Airbnb’s Design Language System (DLS); a flat component structure where each component is specific and named accordingly. The worked examples are especially valuable to those working with React or other component-based frameworks.

Our components are the vocabulary of our design system.

Building a Design System for [Article]

Focusing on the technical side of the design system project, this piece takes a look at the decisions made regarding architecture, documentation, developer workflow, audits, and distribution.

Design Tools are Running Out of Track [Article]

Colm Tuite dissects a number of problems with the current state of mainstream design tooling - primarily, the fact that our tools export to images, instead of resembling the fluid and interactive context of our products. Jon Gold’s piece Dragging Rectangles is another great read on the topic.

What’s really exciting is the next generation of tooling focused on solving this fundamental problem — the most interesting projects in this space are teased at the end of the piece.

Writing Scalable React Apps with the Component Folder Pattern [Tutorial]

Breaking down complex pieces of a UI into bite sized and logical units of work is always a challenge. The component folder pattern is a handy approach to have up your sleeve to help organise your directory structure and make your components easier to understand and maintain.

That's all for this week. Thanks for reading!

Curated by
Jack Lo Russo

Runs on