Trends

15 Subtly Animated Examples of Material Design in Action

The design community has been inspired by Material Design and some designers have even began to create some beautiful and subtly animated UI examples.

At their I/O conference in 2016, Google announced their exciting new visual language Material Design, a concept based on great visual design combined with cutting-edge technology in order to create a unified experience on both mobile and desktop. I’m not going to analyze Material Design in this post, for that you should check out Jake’s post. Instead, I want to share some design community examples of the gorgeous and subtle animation ideology it advocates.

VentureBeat recently asked some top designers for their thoughts and reactions to Material Design. Bjango lead designer Marc Edwards said that he loves ‘the animation and use of depth’ and that Material Design ‘seems very cohesive and thoughtful.’ And Telescope creator Sacha Grief commented that the ‘new design philosophy seems based on adding movement, animations, and colors.’ Both designers clearly love Material Design. Both also mentioned the motion design aspect, which plays a huge part of Material Design’s philosophy.

This is what Google has said on the official Material Design specs:

“Motion in the world of material design is not only beautiful, it builds meaning about the spatial relationships, functionality, and intention of the system.”

The design community as a whole has embraced and been inspired by Material Design. Some designers have even begun to create some beautiful Material Design UI examples and combined them with subtle and thoughtful animation. Have a look for yourself:

Material Design Animation by Balraj Chana

Material Design Animation

Alarm Material UI by Ehsan Rahimi

Alarm Material UI

Material Drawer by Jovie Brett

Material Drawer

Android Wear by George Otsubo

Android Wear

Material Calculator by Jovie Brett

Material Calculator

Contact List by Eric Azares

Contact List

Material Animation by Jovie Brett

Material Animation

User Profile Widget by Mattia Astorino

User Profile Widget

L for Love by Serge Jouqier

L for Love

Evernote Material Redesign by Jiangping Hsu

Evernote Material Redesign

Material Design Search by Jovie Brett

Material Design Search

Material Design Countdown App UI by Adrian Gabor

Material Design Countdown App UI

Instagram Concept with Material Design by Emmanuel Pacamalan

A Dribbble Material Design Concept by Chris Basha

Material Design Overscroll Concept by Daniel Zeller

Google News Redesign Concept by George Kvasnikov

Concluding

What are your thoughts on Material Design? Let us know in the comments below. Also, if know of any other animated examples of Material Design, please do share them as well.


Paul Andrew

About the Author Paul Andrew

Paul is the founder of Speckyboy Design Magazine and writes web stuff for Envato. You can follow him on Twitter.