Thoughts on Design (Systems)

Sam Jayne
Medium.design
Published in
3 min readOct 20, 2021

--

The product design team at Medium has been working on updating our design system, our guide for how we build Medium. I’ve been thinking about different approaches to design systems, specifically how to balance consistency with flexibility. There’s a certain beauty to a rigid system like Are.na — a seldom changing, expected design that feels familiar and utilitarian. There’s room for expressiveness or excitement but no real need for it. The lack of iteration within the system has become a part of the brand’s charm and identity.

On the other end of the spectrum you have Material.io — Google’s impressive and sprawling design system — which feels more like a neatly evolving organism that never rests. So comprehensive that any mutation can be accommodated or has likely already been considered. And then there’s Material You, the latest evolution of Material.io which is probably the most extreme example of flexibility, as it supports user customization.

I think Medium naturally falls somewhere in between — rigid fundamentals at the atomic level, with some flexibility to introduce unique gestures within the system. Those gestures can contrast with the structure and capture the user’s attention. We’ve been focusing on the most basic building blocks: Color, type, icons as the “atoms” that are consistent across all surfaces, while modals, alerts, and first-use instances are examples of surfaces that allow for the flexibility to bring in brand elements as well as design more expressive experiences for users. Flexibility and expressiveness feel especially pertinent when announcing new features and added functionality. We want to make sure we grab the user’s attention and communicate clearly without creating a jarring experience or designing something that feels out of place.

As we continue to refine the product, iteration is inevitable. The questions I’m asking myself are: Should the addition of new features and new surfaces force changes to the system? How can the system be structured in a way that iteration is expected, accounted for, and accommodated? Should every possible instance and permutation be considered? Can it even be considered a system if it contains all? I don’t have the answers but in asking them I think I get closer to the goal: move quickly, make it feel honest, and honor the user.

While thinking about systems in the context of product design, I started to wonder about the history of design systems and how they have influenced how people design, consume information, and communicate with each other. When did system thinking start? Is the merging of systems thinking and art a threshold where graphic design begins?

I stumbled across “A History of Design Systems” by Rune Madsen, which is an interesting and expansive history of design systems dating back to the Early Renaissance. A few select images from the piece below. Captions by Rune Madsen.

Original logo for the De Stijl publication is very interesting, as it looks algorithmic and computational. The styles points towards the later works of Sol Lewitt, and even the early experiments in computational art.
Josef Albers, who was a student of Itten, also wrote about color theory. He is famous for these rectangular paintings, which he produced hundreds of in different color combinations.
The Swiss Style is a term used to describe the new approach to graphic design that came from Switzerland in the 1960’s. This approach was centered around 2 books: Josef Müller-Brockmann’s “Grid Systems” and Karl Gerstner’s “Designing Programmes”.
The MIT logo by E. Roon Kang and the Green Eyle was created with a Processing program.

Note from Rune:

“This is a somewhat western-centric view of graphic design as a response to the industrial revolution in Europe and the United States. Unfortunately, this history is also heavily male. We will look at more diverse examples over the course of the semester, but this history is important as a shared reference of how technology influences design.”

Below are a few other books and articles I’ve been reading as I work through these questions:

How to See : A Guide to Reading Our Man-Made Environment ←Buy the book

The First Things First Manifesto ←Read online

Typographic Systems ←Buy book

Modes of Criticism 5: Design Systems ←Read online

Systems, Mistakes, and the Sea ←Read online

The Shape of Design ←Buy the book

--

--

Design @ Medium — sjayne@medium.com Previously the creative director at Cove & Seed. Former art director at Axios and MIT Technology Review.