Material Designのデザイン思想を読み解く ― 第1回

Material Designが解決するAndroidのデザイン的課題 (2/2)

“パラメーター”があるガイドライン

　Material Designのもう1つの特徴は、言葉で表すととても抽象的でとらえどころのないガイドラインに、対応するパラメーターを用意しているところです。

　色について規定した部分が象徴的です。プライマリカラーとアクセントカラーを3色の色相に限定して選ぶよう指南しています。さらに選んだ色に対し、決まった値の明度差をつけることでUIの色味を決めるのです。

決まった値の明度差をつけてUIの色味を決める例

　アニメーションにも同様の考え方が採用されています。UIの目的に応じて対応する値が決められていて、その値をプログラムでも設定し、実装できるようになっているのです。

　つまり、Googleのデザイン原則は、自然言語で書かれたバージョン（哲学）と、コードで書かれたバージョン（実装）の2つが存在していて、必要に応じてすぐ利用できる、と説明できます。言葉のやりとりでは感性の差によって解釈に差が生じるデザインに、確固たる実現手法を与えたところが、従来のガイドラインとは異なるのです。

「color」について説明されている「Introduction - Material Design」のStyleページ

「Introduction - Material Design」のStyleページからダウンロードできるIllustrator/Photoshop用カラースウォッチ「Material Palette」（左）、「Material Expanded Palette」（右）

Material Designが解決する課題

　グーグルがこのようなデザイン原則を発表したのは、Android Lを複数のデバイスにまたがって活用する計画があるからです。グーグルは今後、スマートウォッチやスマートTVといった携帯電話やタブレット以外のデバイスにもAndroidの利用を広げようとしています。さまざまなハードウエアが包括的なサービスの提供手段として連携することを、統一されたデザイン原則によってユーザーに伝えようとしているわけです。

　従来の感覚で「デザインの統一」を理解しようとすると、同じフォントを使う、余白を揃える、色を統一するといった見た目の工夫に縛られがちです。しかし、画面サイズや利用環境の違いといった「見た目の印象に起こるであろう、どうしようもない差」は、結局のところ、余白の割合や色味の統一では埋められません。

　それよりも、画面切り替えの速度やインタラクションの法則性といった操作感をいかに数値的に統一するか。言葉にすればあいまいな「情報に触れているときの感覚」も、コードを駆使すれば、容易にかつ確実に統一できるはずです。これこそ、Material Designのもたらす恩恵でしょう。

　次回は、「Material Design」の使い道や使い方について、背景にある思想やWebデザインへの影響を紹介します