Member-only story

10 Key Takeaways from Google’s Material Design Guidelines

UI & UX best practices from Google’s design system documentation.

Danny Sapio
UX Collective
12 min readSep 21, 2020

Google is one of the biggest and most influential players in the tech space, so it’s no mystery why their design system has a tremendous impact on how digital products are designed. The company’s Material design guidelines outline worthwhile principles for every designer to follow — regardless of whether they’re designing for iOS or Android.

In this piece, I’ll share key takeaways that I found while reviewing Material’s guidelines and provide my take on how best to execute their rules and methods. I’ll review best practices as laid out in the Material guidelines and share my own experience and tips for best practices when applying them to your products.

1. Signifiers & animation to communicate gestures

Example from Material

In The Design of Everyday Things, Don Norman, known as the father of human-centered design, defines…

Create an account to read the full story.

The author made this story available to Medium members only.
If you’re new to Medium, create a new account to read this story on us.

Or, continue in mobile web

Already have an account? Sign in

Published in UX Collective

We believe designers are thinkers as much as they are makers. Curated stories on UX, Visual & Product Design. https://linktr.ee/uxc

Responses (2)

What are your thoughts?

Animation reflects the action an icon performs in a way that adds polish and delight. Transitions connect animated icons between two visual states. Transitioning between two icons signi...

Any tips on how to animate icons and hand it off to devs for multi purpose (web, app …)?

--

Animation reflects the action an icon performs in a way that adds polish and delight.

This also relates Nielsen's Heuristics - animation provides the users feedback on the system status.

--