{"id":69848,"date":"2016-06-03T02:36:00","date_gmt":"2016-06-02T16:36:00","guid":{"rendered":"https:\/\/elements.blog-cms.envato.net\/?p=4000"},"modified":"2025-11-11T17:23:32","modified_gmt":"2025-11-11T06:23:32","slug":"subtly-animated-material-design","status":"publish","type":"post","link":"https:\/\/elements.envato.com\/learn\/subtly-animated-material-design","title":{"rendered":"10 Subtly Animated Material Design Examples"},"content":{"rendered":"\n

At their I\/O conference in 2016, Google announced their exciting new visual language Material Design<\/a>, 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\u2019m not going to analyze Material Design<\/a> in this post, for that you should check out Jake\u2019s post. Instead, I want to share some design community examples of the gorgeous and subtle animation ideology it advocates.<\/p>\n\n\n\n

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

This is what Google has said on the official Material Design specs<\/a>:<\/p>\n\n\n\n

Motion in the world of material design is not only beautiful, it builds meaning about the spatial relationships, functionality, and intention of the system. <\/p>Google<\/cite><\/blockquote><\/figure>\n\n\n\n

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: <\/p>\n\n\n\n

Material Design on Dribbble<\/h3>\n\n\n\n

1. Material Design Animation<\/a> by Balraj Chana<\/h4>\n\n\n\n
\"Material<\/figure>\n\n\n\n

2. Alarm Material UI<\/a> by Ehsan Rahimi<\/h4>\n\n\n\n
\"Alarm<\/figure>\n\n\n\n

3. Material Drawer<\/a> by Jovie Brett<\/h4>\n\n\n\n
\"Material<\/figure>\n\n\n\n

4. Android Wear<\/a> by George Otsubo<\/h4>\n\n\n\n
\"Android<\/figure>\n\n\n\n

5. Material Calculator<\/a> by Jovie Brett<\/h4>\n\n\n\n
\"Material<\/figure>\n\n\n\n

5. Contact List<\/a> by Eric Azares<\/h4>\n\n\n\n
\"Contact<\/figure>\n\n\n\n

6. Material Animation<\/a> by Jovie Brett<\/h4>\n\n\n\n
\"Material<\/figure>\n\n\n\n

7. User Profile Widget<\/a> by Mattia Astorino<\/h4>\n\n\n\n
\"User<\/figure>\n\n\n\n

8. L for Love<\/a> by Serge Jouqier<\/h4>\n\n\n\n
\"L<\/figure>\n\n\n\n

9. Evernote Material Redesign<\/a> by Jiangping Hsu<\/h4>\n\n\n\n
\"Evernote<\/figure>\n\n\n\n

10. Material Design Search<\/a> by Jovie Brett<\/h4>\n\n\n\n
\"Material<\/figure>\n\n\n\n

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.<\/p>\n\n\n\n

Here are a few blogs you’d want to check out:<\/p>\n\n\n\n