Source: Medium.design - Medium | Read More
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.
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.”
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