A new dynamic and adaptive visual design language that brings the Motorola brand together with Android and Material Design 3.
 

Company

Motorola Mobility, Inc.

DEsigned

2022

Role

Creative director
Principal designer

 

As Design Director for Motorola's Consumer & Experience Design team, I led the visual strategy and design of a new digital design system that launched on Motorola’s 100 million active devices.

Codenamed Adapt Design, the new system works with Google’s “Material You” color system to bring the rich, premium feel of the Motorola brand to Android 12 and beyond.

 

Color

 

Brand palette

The Adapt Design color system optimized our brand colors for digital interfaces by translating them into a set of color ranges with standardized saturation and brightness to ensure consistent contrast when used as dynamic colors.

 

Dynamic color

Android 12’s Material You color system relies on Google's Monet algorithm to create five unique tonal ranges based on a single input color.

Because our design work needed to begin before Google had completed documentation, I worked with our development team to reverse-engineer it through extensive analysis and testing, allowing our teams to hit our launch target.

 

Icons

 

Colorful, cohesive, on-brand

Our icons make finding an app easy and can evoke the Motorola brand when it’s most important.

 

Typography

 

A new typeface

Previous versions of Android used Roboto as the default font. With Android 12, the Pixel moved to its proprietary Google Sans font as the default. In keeping with the goal of bridging the gap between the Motorola brand and Pure Android, I designed a custom typeface just for Motorola UI, called Rookery, that straddles the line between Google Sans and Motorola’s licensed brand font Gotham.

Creating Rookery

Rookery is a modification of open source typeface Montserrat, a modern geometric sans serif that shares many common features of Gotham. However, Montserrat has a few distinctive quirks that are not optimal for UI application and don’t align as well with the Motorola brand aesthetic. The G, J, Q, 3, 4, and 7 were modified, kerning pairs were adjusted, and the entire character set was condensed slightly to account for density of information and to ensure that localized strings didn’t break unexpectedly.

 

The result

 

With the launch of Android 12, users could now personalize their device’s colors, fonts, and icons like never before. Adapt Design allowed us to support and encourage these customizations while still maintaining a strong brand presence across the device.

Research showed that users loved the new visual updates with the consensus being that experiences looked modern, premium, and youthful.