Material Eras

Exploring the evolution of Google’s open-source design system

It’s been a decade since Material made its global debut. Here, five influential Googlers reflect on the ever-evolving design system that has shaped how we interact with our devices — and how they interact with us.

Introduction

The Radical Philosophy of Material Design

By Dieter Bohn

In the 2010s, it was difficult to imagine a world where Google could make Gmail, Chrome, Android, and all the other products across their platforms feel like they existed in the same family. The company had a reputation for designing by algorithm — A/B testing shades of blue — rather than from a human perspective, and the scale just felt too vast.

At the time, the conversation around digital design often fell into two broad categories of thought: epistemological, or how to help users know and do things, and aesthetic, or how to make things look nice. Material moved the conversation to ontology — the philosophy of being — as in how design affects, and is an essential part of, the real world. This allowed for a complete reframing of how to think about design. It wasn’t just about communicating information or appearances, it was about what design is, at a deep existential level.

This showed how design could be guided less by rules and more by properties and behaviors — some freeing, some creatively limiting. Design could have a “presence.” Digital objects in their digital world — like buttons — could be any color or shape, but were still limited by key characteristics, just like physical objects are. They could do some things, but not everything. This pushed products and digital experiences beyond ephemeral pixels, tasks, and results — a genuinely innovative shift relative to the rest of the industry — and took a few years to sink into the general zeitgeist.

Google caring about design didn’t just affect people’s perception of Google, or people’s perceptions of Google products. It also affected Google’s perception of itself and its own products.

I've always felt that gadgets are worthy of cultural analysis and cultural appreciation. By establishing new concepts of how software works, Google created products that felt more harmonized and comprehensible, but also more beautiful.

When Material launched in 2014, Dieter Bohn was a reporter and editor at The Verge who covered Google extensively. He joined Google in 2022, and now runs an internal team called Product Narrative and Strategy, connecting the dots across Google platforms and beyond.

MATERIAL 1: 2014–2017

The Physics and Magic Behind the Screen

By Christian Robertson

In order to build a comprehensive design system and unify the web and Android ecosystems, we had to clean out the cruft — the unnecessary bubbles and bumps that had been part of Google’s UI story for a long time.

Consistency was a big part of the Material 1 story; we leaned into Modernist principles of minimalism, and really rigid, gridded typography. Paper was another.

Material 1 was based on the physicality of paper. Paper grounded us in reality. We first made prototypes out of paper to explore layers and shadows, then wrote those lessons into the code. Nothing was faked for effect.

At the same time, we were in the middle of a revolution around motion and its role in design systems. We had this mantra: Motion carries meaning. Dropping pieces of paper and watching them glide down to rest on a surface helped us establish the physics for how Material objects should move, and the parameters by which things could materialize and dematerialize. This clarified our thinking, but was also valuable for our users. Things behaved the way people expected them to. They understood how things moved.

Paper gave us constraints, but it also gave us creative freedom. Every generation of technology informs a set of imaginative principles. In the Electric Age, lightning bolts animated Frankenstein’s monster. In the Atomic Age, many superheroes got their superpowers from nuclear power. We’re in a Quantum Age, and science fiction is closer than ever before. Before Material was Material, we called it Quantum Paper. (And I'll take credit for that name!) For us, Quantum was the stand-in for this idea of magic: the puff of smoke, the magic wand, the incomprehensible shape-shifting. It gave us the opportunity to operate within these guidelines.

Christian Robertson “might have been the first person assigned to Material” by VP of Design Matías Duarte in 2014. He’s currently the UX Lead for Material Design.

MATERIAL 2: 2018–2020

A Cohesive Collection of Components

By Lynn Jepsen

Material 1 was a stake in the ground: Google cares about UI and UX. It wasn’t theoretical — we were creating tactical, actionable ways to apply good design thinking — but it also showed how much more coverage we needed to build different types of UIs for enterprise, desktop, consumer apps, and more. At the time we had some 20-plus components designed, but had only implemented one or two of them in code. We needed to increase that count.

Material 2 allowed us to go deeper and to develop the system even further. Behind the scenes, we were bringing together two different worlds and skill sets: design and engineering. It was important — and challenging! — to develop a shared language. Our designers were pushing the boundaries of what good design could look like at scale, and that meant asking for a lot from the kick-ass team of engineers I had assembled.

I told our engineers that we can’t do everything the designers bring us, but our job is to make the impossible possible whenever we can. Sometimes, when an element was particularly challenging, we’d think: Can we just skip this? It’s so complicated to implement! But we’d keep at it, and those moments always made for a great user experience.

Accessibility wasn’t an afterthought. We did a lot of testing around navigation and interaction patterns; for instance, using your keyboard instead of your mouse to click on things. If you tab through a form, does every element get the right focus? Does it make sense? We also did a lot with color, to make sure the palettes had high enough contrast across products.

We were also starting to explore how to let external developers use the same Material 2 base, but distinguish themselves by applying their own branding on top. It’s kind of like a box of Legos. Legos come in different shapes and sizes and colors, but they all fit together to build something cohesive yet original. Everything has its place.

Lynn Jepsen served as an engineering manager and design system owner with “a long, storied history with Material,” starting with 2018’s major overhaul of Material Design and launch of coded components. They’re now a product manager, working on tools to optimize design and engineering workflows.

MATERIAL 3: 2021–2024

Curiosity, Flexibility, and Expression

By Noa Dolberg

Material is very unique in the sense that, at its core, it represents a three-way partnership between Google, a community of makers both inside and outside of Google, and end users. As Material evolved, we started hearing from makers that they wanted even more flexibility: everything from increased accessibility features, to — most commonly — the ability to set specific components' sizes.

When we started exploring Material 3, certain patterns began to emerge around this concept of flexibility and how it relates to expression. Eclectic shapes, bold colors, lively motion, and variable type emerged as Material 3’s main creative drivers — the heart of the system — but we realized they could also be used to elicit this kind of elevated expressivity. We played with scale to highlight key actions and hero moments; worked with space across screens to create rhythms that breathed, even in dense layouts; and presented modular components that could adapt to diverse maker and user needs.

Flexibility, however, can lead to uncertainty; we don’t know how people will use our system. By empowering makers more than ever before, we might have, in some cases, even less control over the experience of the end users. After ten years, I see this as vulnerability, which to me is growth — unavoidable, and absolutely necessary to evolve.

Working at Google means that we impact culture. We’re changing with the world — sometimes we’re leading, and sometimes we’re responding. It’s a mix. Let people experiment with Material 3! We can see how they interact with it, and what we might learn from them.

We have a choice in how and why we develop Material. This is a responsibility we take very seriously. The design systems of tomorrow might matter in completely new ways, but they will be built on the flexibility and curiosity that we’re only just starting to unlock.

Noa Dolberg is a UX Manager for Material Design and a “troublemaker.” She writes “briefs filled with tension points that lead to amazing things.” She leads a team of “all-stars” that focuses on developing the Material system for devices such as Pixel phones, foldables, and tablets, and supports other Devices teams at Google.

THE FUTURE

A Bold — but Nuanced — Future for Interface Design

By Wade Convay

Material enabled new creative processes, allowing designers, developers, and engineers to collaborate with a shared vocabulary. With the foundations figured out, everyone could focus on building new features together that just worked.

This consistency and efficiency reset user expectations. People have high standards today; devices should be intuitive and easy to navigate, but also bring them joy. They want to interact with things that reflect an extension of themselves. As a result, we’re on the verge of an era of hyper-customization for software.

The latest incarnation of Material You gives the design system back to users. What is your style? How can it come through in a UI? For example: I might set up my interfaces to be fairly minimal and monotone; someone else might choose something bolder and more vibrant, or higher contrast. In the not-too-distant future, those settings might read your vibe in real time — from chill to high-energy — and generate responses on the fly with assistance from AI. Digital experiences could have the power to change your mood, but also change with your mood.

Form factors and platforms are also evolving. Virtual and augmented reality are becoming more widespread. Gesture and voice commands are facilitating new modes of interaction. It’s all still experimental, but exciting.

As Material becomes more personalized, it’s also becoming more nuanced, more helpful, and more considerate. Perhaps there’s a future in which the system is completely diffuse; discrete applications disappear or start to blend together seamlessly — everything you need is rendered in the moment — just what you need, right when you need it.

Wade Convay was a new hire on Google’s brand marketing team when Material 1 was launched. Today, he’s the UX lead for Google Design, where his work includes Material, Google Fonts, and many other design-focused products. He’s “involved in all the action — and it’s awesome.”

Design by Specht Studio x Google Design. Motion by Yanis Berrewaerts.