GoogleのMaterial Designはとてもプログラマー得なデザインガイド

Pocket

Googleからスマートフォン(Android)やWebでのデザイン指針を示したMaterial Designというガイドが出ましたね。

僕も早速見てみましたが、とてもプログラマー得なデザインガイドになっていると思います。

デザイン指針が具体的!

AppleのHuman Interface GuidelineなんかはiOSアプリ開発者の方はご覧になったことがあると思いますが、なんというか、モヤっとする感じですよね。「色は情報を効果的に伝える」とか「一般に、『本物らしさ』を重視したアニメーションを心がける」とか、モヤっとした感じで書いてあります。プログラマー的には「で?」って感じですよね。

その点GoogleのMaterial Designはとっても具体的です。

例えばアニメーションだったら「こんな動きをするんだよ」と時間軸にあわせた移動量を動画で解説してくれています。

Authentic_Motion_-_Animation_-_Google_design_guidelines

色に関しても「こういうのを使いな」と実際のカラーパレットを紹介してくれていますし、フォトショやイラレ向けにスウォッチも用意してくれています。

Color_-_Style_-_Google_design_guidelines

ドロップシャドウの具合なんかも、実際の数値が示してあります。極めて具体的です。

Principles_-_Layout_-_Google_design_guidelines

ここまで具体的だと、ある意味コーディング規約にも通じるものがあると思います。以前最初はよくあるコーディング規約に従ってみるのも良いのではという記事を書きましたが、良いデザインガイドに沿ってデザインをしてみるというのも、デザイン力を高める一つの方法なのかも知れませんね。

Material Design