ウェブ、アプリの画面デザインを「言語」として考える「Material Design」
プログラミング言語のようにオブジェクトの形や色や動きでユーザーにこちらの意図を理解させる。たぶんそんな考え方。
UML(Unified Modeling Language)の考え方に似ている気がする。
機械と違って人はそれぞれ見え方・捉え方が異なるので、一つの表現で意図したことを伝えるのは難しい。その共通項を精査する作業は大変。
Google先生はそれらを学問として捉え、体系的に考えて、分かりやすくまとめて公開までしちゃっているのが凄い。尊敬する。
目次と自分用リンク。読んだら追記予定。
- Material Design
- アニメーション (Animation)
- スタイル (Style)
- 色 (Color)
ダウンロード：「Color Swatches」
ダウンロード：「Light」「 Dark」テーマ - 読みやすい文章 (Typography)
ダウンロード： 「Roboto font」 - アイコン (Icons)
- 画像 (Imagery)
- 色 (Color)
- レイアウト (Layout)
- 原則 (Principles)
ダウンロード：サンプル集「Desktop Template」 - 方眼紙と軸になる線 (Metrics and Keylines)
ダウンロード：「Mobile Layout Template」
ダウンロード：「Tablet Layout Template」
ダウンロード：「Desktop Layout Template」 - 構造 (Structure)
ダウンロード：ワイヤーフレーム集「Whiteframes」
- 原則 (Principles)
- コンポーネント (Components)
これ学校の授業で1年以上かけて学んだ方がいいくらいの内容。
まだベータ版らしいので変更、追加される可能性大。
下記サイトも分かりやすくまとめてある。
< Related Posts >