2014で、Googleは 材料設計 "。 彼らの当初の目標は、Androidデバイス用のアプリの設計に関する問題に対処することでした。 議論は、「 フラットデザイン 「小さな画面ではうまく表示されません。 彼らは、デザインには明確な視覚的手がかりがなく、モバイルユーザーの使いやすさを妨げると感じました。

Google Designの副社長MatíasDuarteは次のように説明しました。

「本物の紙とは異なり、私たちの「マテリアルデザイン」は、インテリジェントに成長し、適応することができます。 マテリアルは、物理的で平らな表面を提供し、触れることができるものに意味を与える影が付いています。

そして、それが基本的に現在のハードウェア設計です。アプリケーションの要素をタッチ可能に見せるための方法です。

Material Designの新しい言語とガイドラインをリリースすることにより、GoogleはUXの問題を解決したいと考えています(ユーザー体験)およびAndroidアプリケーションのユーザー間の混乱。 XNUMX年後、彼らのフレームワークはモバイルアプリケーションの分野を超え、現在はWebデザインで定期的に使用されている原則です。

以下では、あなたが見つけることができるいくつかのソースを提供します ressources マテリアル デザインを WordPressのブログ.

1-Behance

behance

ダウンロード

「」でアプリケーションの設計を学ぶサイトの完璧な例 材料設計 "。 Behanceには、インスピレーションとして使用できる無数のヒントと例があります。 Behanceもたまたま「 材料設計 独自のサイトでは、グリッドから微妙にぶら下がっているボックス、注意を引くための中央の影、クリック可能なアクションのためのクリアマーカーがあります。

2-CodePen

codepen

ダウンロード

自己割り当ての「開発者の遊び場」であるCodePenは、「開発者の金鉱」です。 材料設計 」。 いくつかの本当にクールな例があるだけでなく、開発者がさまざまなWebサイトを構築するために使用するCSS、HTML、およびJavaScriptを見ることができます。

3-ドリブル

ドリブル・リソース・材料設計

ダウンロード

後者に慣れていない場合、Dribbleは、デザイナー、開発者、アーティスト、および「」に関心のあるその他の人々のためのソーシャルネットワークです。 設計 」。 「の検索 材料設計 彼らのサイト内では、どのように技術が 材料設計 遍在しています。 ここでは、完全なWebサイトを設計するためのアイコンのような単純なもののインスピレーションを見つけることができます。

4-Googleデザインのマテリアルデザインアワード

グーグル・デザイン賞・リソース・材料設計

ダウンロード

Googleがマテリアルデザインを開始して1年後、彼らは「マテリアルデザイン賞 」。 この名誉あるリストには多数のサイトがあります。 の可能性を見たいなら 材料設計 」、このリストをご覧になることをお勧めします。 Googleがソースにタグを付けるのに時間がかかる場合は、それだけの価値があります。

5-素材で作られています

メイドと-材料-資源材料設計

ダウンロード

2014年XNUMX月にさかのぼるこのサイトは、「 材料設計 "。 ほとんどのサイトは、「」を使用するWebサイトおよびモバイルアプリの高解像度スクリーンショットを備えています。 材料設計 "。 これらの刺激的な例で迷子になるのは簡単ですが、右上のサイドバーにある開発者向けのドキュメントを確認することを忘れないでください。 このドキュメントは、「」を使用して開発する場合に役立ちます。 材料設計 '。

6-マテリアルデザインブログ

材料・設計・ブログ・資源・素材・デザイン

ダウンロード

このブログは、このトピックに関して興味があるかもしれないツールやトピックのホスト全体をカバーしているだけでなく、あなたに素晴らしい仕事をしているので、たまたま私たちのお気に入りのXNUMXつです。 「マテリアルデザイン」によるデザインテクニック。 彼らのアニメーションが実際に動作しているのを見る機会がなかった場合は、サイトにアクセスして、彼らのブログ投稿のXNUMXつをクリックしてください。

7-MaterialUp

materialupリソース・材料設計

ダウンロード

サイトのファミリーの一部 Uplabs MaterialUp はマテリアル デザインに関するものです。サンプル Web サイト、モバイル アプリのスクリーンショット、ツール、ヒントなどがあります。 今すぐ役に立つものが見つからなくても、ウェブサイトのデザインを見てみましょう。 レイアウトや見た目はGoogleドライブを彷彿とさせますよね? あなたが探しているなら リソース 信頼できますか、このウェブサイトにアクセスできますか?

8-Pinterest

Pinterestのリソース・材料設計

ダウンロード

サイトが「デザイナー」の主なインスピレーションの源として名付けられた場合、Pinterestはこの栄誉をBehanceと共有します。 「」という用語をすばやく検索すると材料設計 このフレームワークを使用するWebサイトやアプリケーションのビデオや画像にすぐにアクセスできます。

このリストは以上です ressources のために " 材料設計 」。 お気に入りのソーシャルネットワークで友人と自由に共有してください。