Colors Change

Ambient music plays as cursors click on shapes. The soft colors of the shapes change with each click.

“When we started designing Material You,” a voice says, “we all wanted to pick that perfect new set of colors.”

There are names attached to the cursors. Each cursor is a different person.

“Depending on who you ask,” says the voice, “the right palette might be vibrant,” as Nora selects two vibrant colors, “or calm,” as Ando selects four calm colors, “or high contrast,” as Rong selects two high-contrast colors, “or something else entirely. When it came time to pick one, of course, none of us agreed. Because color is personal.”

More cursors hover over their own colors. Together, the swatches spell out the word Personal. More letters spell out Making Material You and Google Design.

The voice continues.

“That’s when we started asking, why design as if everyone sees color the same way?”

A variety of flowers come in and out of focus. Estelle’s cursor selects colors from the blurry flowers for different shapes.

“When we’re designing new screens,” the voice says, “we hand-pick tones and play with each shade, nudging the values until everything feels right. Maybe it’s cheating a little. Really, designers do it all the time. It’s a way to make everything come together so that it’s just right for that screen.”

Estelle’s cursor continues to change colors and shapes until the weather forecast of sixty-two degrees appears behind partly cloudy skies. An analog clock tells the time for Tuesday the nineteenth. A vacation packing list includes sunglasses, War and Peace, and sunscreen. The colors change.

Someone cuts through a piece of fabric.

“It’s kind of like tailoring,” the voice says.

They fix the fabric as a garment onto a model.

“But we can’t ship a designer with every phone . . . or can we?”

Someone gently buffs the surface of a clay sculpture.

“We start with an image that you love. The kind you choose for your home screen. From the image, one color gets picked,” the voice explains.

Someone holds a bouquet of flowers until they are pixelated. Only the color of the flowers remains.

“And from that color, four more are generated.”

The flower color is joined by four others selected from a color wheel.

“The first color becomes the basis for a full palette of complementary and contrasting tones—sixty in total,” explains the voice.

A gradient of light to dark tones extends from each hue.

“Those can be used anywhere because the two tones that get aired together ensure accessible color and contrast no matter what color you start from.”

Two tones are selected at a time until the right pair shows an accessible contrast. The input color changes the tones but shows that the same selected tones are still accessible.

“We also had to figure out how to keep certain colors consistent,” the voice says.

More flowers come in and out of focus.

“Colors a designer might apply because they’re associated with specific ideas, like red to mean record,” the voice continues as someone presses a record button on an old tape recorder, “or green for answering a call,” the voice says as someone talks on their cell phone on a crowded city street.

“Those get a small nudge so designers can preserve the functional values of color.”

A digital control for lighting appears in a warm color. A digital control for air conditioning appears in a cool color.

“So that problem of picking one perfect color . . . turns out it was the start of a new kind of challenge.”

Someone stands out in a shaft of light within a darkened crowd. Someone with purple freckles holds a bouquet of purple daisies. Someone sits in blue light in a dark room. Someone with short green hair wears a green sweater. Someone holds a bouquet of yellow flowers. Someone poses wearing a beige jacket and someone else poses in blue and red.

“A challenge to give everyone the colors they want, not just the colors our design team likes.”

They all become home screen wallpapers with matching interfaces.

“And to do that,” continues the voice, “colors had to be designed as a set of relationships. So that everyone’s colors and preferences and style start to feel personally tailored.”

“Tailored to you, because it’s made by you.”

The Google G logo appears in different colors and design.google appears beneath it.

The music fades.