Google I/O: Cross-Platform Design

by Luke Wroblewski June 25, 2014

In their Cross-platform design presentation at Google I/O 2014 members of the Google design team walked through the principles behind their new design language for native and Web apps fro mobile, TV, and more. Here are my notes from their talk:

  • The material design language aims to unify software with the fundamental physics of how things work.
  • Material is the metaphor. Metaphors are like short stories, they communicate quickly and more deeply then just words. Metaphor is a back-story for the design -it unifies things for the audience and for developers.
  • Dimensionality afford interaction. The metaphor design language is a form of paper indistinguishable from magic. This is the metaphor carried through the interface. Surfaces are tangible, they can accelerate understanding of a UI. They are often easier and more understandable then language.
  • Surfaces are intuitive: they organize space and rationalize interactions. Familiar tactile attributes help people understand affordances.
  • Content is bold, graphic, and intentional. Embrace classic design principles to make content as clear as possible. Google's Material UI has new font families, and color palettes.
  • Color, surface, and icons define icons. Primary actions need to emphasize the core functionality in apps.
  • Users initiate change. Provide immediate feedback with appropriate physics. Use motion that cascades from touch.
  • Animation is choreographed on a shared stage. We don't move, the material does to move things closer to us.
  • Motion provides meaning. The way things move provide queues about how things work and their properties. Transitions allow people to keep their bearings across transitions.
  • One adaptive design. Every device is a window into the same content. Adaptive design keeps things integrated through type, color, and iconography. But each view is custom tailored to the size and interaction appropriate for each device.