コントラストと偏重【v13】

こんにちは。よろしくお願いします。今日は、デザインにおけるコントラストと偏重についてお話ししたいと思います。

そうですね。しかし、その注目したものは、実は売り手側によって意図的に仕組まれたものかもしれません。どうしてそこに注目してしまったのか、どうやって注目させることができたのか。その要因はコントラストにあります。

コントラストとは、あるものを他のものと比較したときに生じるギャップのことです。二つ以上のものがあるとき、私たちは意識せずにそれらを比較してしまいます。どれが大きいのか、どれが赤いのか、どれが最も価値がありそうなのか。

見せ方の上手いデザインでは、意図的に偏りが付けられています。全てを均一にすることが見やすさにつながる一方で、大事なものに敢えて偏りを付けることにもデザイン上の価値があります。

二つ以上の要素があるとき、それらに生じている認知の大きさの違いを「コントラスト（対比）」と言います。ユーザーの意識を誘導したり、要素同士に意図的な構造を作り出すための効果的な手段となります。

例えば、大きなフォントと小さなフォント、太い線と細い線、大きな画像と小さな画像、無地の背景色とベタ色の背景色など、様々な方法でコントラストを作り出すことができます。

そうです。上手く使うことで、分かりやすさと認知負荷の低減につなげることができます。

人間が認知のために使えるリソースの総量には限界があります。つまり、一度に意識できる範囲は無限ではなく、どこかに上限があるわけです。例えば、強く注意を喚起するものが一つだけある場合と、それが同時に多数ある場合とでは、前者のほうがより強く注意が喚起されます。

「もっと目立つようにしてほしい」という要望はよくありますが、ある対象を目立たせる（強くする）ということは、相対的に他の対象が目立たなくなる（弱くなる）ということです。

その通りです。ですから、デザインでは重点を置くものを絞り込むことが重要です。

コントラストを付けるための第一のポイントは、大事なものにだけ重みを付けることです。これは「シンプル（明快）にする」にも通じる考えですが、物事に軽重を付けて、重要なものとそうでないものを差別化することです。別の言い方をすれば「敢えて偏りを付ける」とも言えます。

一般的に、売り手側（サービスの提供者）は、買い手側（サービスの利用者）に対して、できるだけ多くの情報を提供しようとします。主にマーケティング的な観点から、そのほうが売り手側にとって都合が良いことが多いからです。

その通りです。画面に表示できる情報量や、ユーザーがコンテンツに注意を向けるために使える認知的なリソースには限界があります。

そこで、本当に重要なものを際立たせてコントラストの効果を高めるには、不要なものを削除することが最も効果的です。これが第二のポイントです。「大事なものは強くする」「そうでないものは省いてみる」。この二つを実現できるだけで、世の中の全てのサービスはぐっと分かりやすくなるはずです。

見せたい要点が絞られているのであれば、それにふさわしい見せ方を考えることができます。例えば、あるWebサイトでは、ポルシェ911の年代ごとの変遷に焦点を当てており、縦スクロールだけの操作に絞って、パララックスによる画像の切り替えで表現しています。

建築家であり、ハーマンミラー社のインダストリアル・デザイナーであるジョージ・ネルソンは、「doing much more with much less（より少なくすることで、より多くのことをする）」という、現在でも通じる概念を提唱しました。

そうです。このスタンスは、UIデザインの目指している方向性にも通じるものがあります。多くの操作を集約した「Androidのジェスチャーナビゲーション」が本当に使いやすいかどうかはまだ疑問の余地がありますが、各社はしのぎを削って、より少ない操作でより多くのことができるよう、常に工夫を凝らし続けています。

インターフェースにおけるボタンというものは、全てがフラット（等価）なものではなく、重要なものとそれほど重要ではないものが混在しています。ボタンにも優先度に従った重み付けが必要です。

ボタンの配置（レイアウト）と装飾に配慮します。重要なボタンやトリガーとなるボタンは、画面の下や右に配置し、多数並べるときには右側に重要なボタンを置きます。

強く目立つ装飾は、重要度の高いボタンに用います。強い順に「色付きベタ塗り ＞ 色付き枠囲い ＞ 無彩色の枠囲い ＞ 色付きテキストのみ ＞ 無彩色テキストのみ」です。

複数の色を使ってボタンを装飾したいところですが、それはあまりおすすめできません。少なくとも初見のユーザーにとって、細かく色分けされた優先度を見た目だけから判断することは難しいからです。

ですから、ボタンに使う有彩色は、できるだけ一つに抑えましょう。