色と距離
2014-12-22 by Beige Shiba Inu
後退色と進出色。色の違い・変化によって画面に奥行きを出すことができる。
「寒色と暖色」の項でも解説しましたが、色には「後退色」「進出色」というものがあります。
その性質をうまく利用すれば画面に奥行きをもたせることができます。
（１）後退色・進出色
「後退色」である「青」は、奥行きと見やすさを提供してくれます。
人物画の背景色のほか、ウェブサイトや、ゲームソフトなどのメニュー画面の背景イメージなどなど、
さまざまな場で見かけることができますね。
「進出色」については、その色が原色に近ければ近いほど、
つまり目立つ色ほど手前側に見えます。
そして原色から徐々に明度が上がって白っぽくなるほど、
奥へと移動していくように感じられます。
晴れた日の外の風景を想像してみると分かりやすいと思います。
近いものほど色がはっきりと濃く、遠くにあるものほどぼんやりと白くぼやけて見えるはずです。
「後退色」「進出色」は、私たちが普段から親しんでいる自然な印象がそのまま適応されます。
（２）グラデーション
「グラデーション」は、上下左右など自由な方向で遠近がつけられる技法です。
Webデザインでは、平面的なエレメントに対して
薄っすらとしたグラデーションがかけられることが多いです。
一見ベタ塗りに見えても、よくよく比べてみると色の変化があります。
そうすることで奥行きや遠近をつけ、より自然な物質感を出すことができるのです。
たとえば、皆さんが今ちょうど目にしているウェブブラウザのデザインも、
よく見てみるとそこかしこにグラデーションがかかっていることが分かると思います。
オブジェクトに強めのグラデーションをかけることで、
それがボタンとしてクリックできるものだということを表していたり。
ドロップシャドウがつけられて、それが手前にあることを分かりやすくしていたり。
以上、色と距離・奥行きの関係のお話でした。
特にWebでは、日々当たり前のように触れているデザインにも、これらの技法が使われています。
あらためてよく観察してみると、面白い発見があったりしますよ。