Googleのデザインガイドライン、マテリアルデザイン（英: Material Design）を採用したウェブサイト制作や、モバイルアプリのリニューアルなどが増えてきています。特徴のひとつ、動きやアニメーションを駆使した新しいブラウザ体験は、ユーザーの注目を集めるのに最適な手法といえるでしょう。

今回はマテリアルデザインのアニメーション、動きを使った素敵なUIデザインをまとめてご紹介します。ルールに沿って制作をすすめることで、首尾一貫したデザインを作ることができ、インスピレーションの参考にいかがでしょう。

これまでにご紹介した、マテリアルデザイン関連のエントリーは以下です。

• Googleマテリアル・デザインをはじめよう！参考にしたい無料素材やアイデアまとめ
• Googleマテリアル・デザインから学ぶ４つの重要ポイント + 参考UIデザイン、無料素材まとめ
• 【マテリアルデザイン採用】リニューアルで気をつけた4つの大事なポイント -feedly編-

詳細は以下から。

マテリアルデザインの参考にしたい、動きのあるUIデザインまとめ

Android Lollipop Phone and Tablet

Material Components

Playing with After Effects & Material

Sort Animation Intro

Petcube for Android L

Material Design Gallery Animation

Google’s Material Design Animation

Photo Application

Inbox + Calendar Integration Animation

Open Chat Animation

L for Love

News@Mail.ru Material Concept

Queue

Product Purchase Transition

Material Transition

Secret Project

Navigation Menu Animation

Floating Action Button

Material Design Menu Animation

Share Results

New Message Animation

White Material Effect

Domain App – Error Notifications

マテリアル限定ギャラリーサイト

MaterialUp

マテリアルデザインを使ったサイト制作で困ったときに覗きたい、UIデザインをあつめたギャラリーサイト。定期的に更新されていて、数も豊富に揃います。

サムネイル@ : Travel Club App – Mobile App by Alla – Material App

参照元リンク : Material Design Motion Explorations – Abduzeedo Design Inspiration