ゲーム作りに微妙に役立つ色彩の話を。
色彩の基礎と、ゲーム作りに役立ちそうな応用を同時進行で。
マイペースで更新していきます。
※これを読めば色彩がわかる!という記事ではありません。ご了承をお願いします。



色彩の基礎の基礎

色の三属性

色を言葉や数値で表すための基準として、色の三属性が定義されています。
以下の三属性を用いて、ほとんど全ての色を表現することができます。
(金・ルビーなどの光沢・透明感をもつ色を除く)
色相
青・赤・黄といった色味を表す
明度
色の明るさを表す
彩度
色の鮮やかさを表す

色相

色相環


坂本邦夫の「基礎からわかるホームページの配色」さまより転載させて頂きました。


青、赤、緑、黄などの色味のことを、色相と呼びます。
色相どうしの関係は環状になっていて(色相環)、
近接する色ほど色相が近く、
輪の反対の色が最も色相の離れた色(補色)となります。

明度


明度とは明るさの違いのことで、最も明るい色は白、最も暗い色は黒となっております。

通常明度を表す場合は明るい色のことを「明るい」「明度が高い」というような表現をします。


坂本邦夫の「基礎からわかるホームページの配色」さまより転載させて頂きました。

彩度


彩度とは色の鮮やかさを表す属性です。彩度も明度と同じように「高い」「低い」でその度合いを表します。
彩度が最も高い色は鮮やかな原色となり、彩度が低くなるにつれてくすんだ色みを感じない色に変化し、最後には無彩色になります。

彩度が高い色は派手な印象を受け、彩度の低い色は地味に感じます。


坂本邦夫の「基礎からわかるホームページの配色」さまより転載させて頂きました。

トーン(重要!)


坂本邦夫の「基礎からわかるホームページの配色」さまより転載させて頂きました。


トーンとは、明度と彩度の組み合わせです。上の図にあるように、15のブロックに分かれています。
配色においては、明度と彩度を単独で考えることは少なく、トーンで考えることが多いです。

ちなみに、同じトーン・隣接したトーンのみを用いて配色を行なうと、
ちょっと洒落たゲーム画面が簡単に作れます。

また、各々のトーンはそれぞれ違ったイメージをもっています(隣り合うトーンはイメージも似ている)。
ゲームのイメージにあったトーンを中心にして配色すると、いい感じになると思います。
トーン番号 トーン名称 イメージワード
1 ビビット あざやかな、派手な
2 ブライト 明るい、陽気な
3 ストロング 強い、情熱的な
4 ディープ 深い、伝統的な
5 ライト 楽しい、軽い、さわやかな
6 ソフト 柔らかい、穏やかな
7 ダル 鈍い、くすんだ
8 ダーク 暗い、大人っぽい
9 ペール 柔らかい、やさしい
10 ライトグレイッシュ 落ち着いた、おとなしい
11 グレイッシュ 地味な、にごった
12 ダークグレイッシュ 重い、固い
13 ホワイト 清潔な、冷たい
14 グレイ 寂しい、しゃれた
15 ブラック 高級な、フォーマルな

坂本邦夫の「基礎からわかるホームページの配色」さまより転載させて頂きました。


色彩の基礎

色の寒暖

黄や赤系の色は暖かい印象。
緑や紫系の色はどちらでもない感じ。
青系の色は寒い印象。

色の遠近感

明るい色、暖かい色は近くに見え、
暗い色、寒い色は遠くに見える。
左右の図を見比べてみると、
左の図の方が微妙に長く見えるはず。

色の重さ

明るい色は、軽い。
暗い色は、重い。
軽い色が土台だと、動きがあって軽やか。


重い色が土台だと、安定感があってどっしり。

色の硬さ

明るい色は、軟らかい。


暗い色は、硬い。


ただし硬軟感は、後述の素材感に特に左右されます。

応用編

浮いた色をなじませる

青や緑の色の中で、赤だけが浮いてしまっている。
こういうときは、浮いてしまった色の同系色をごく狭い面積に置いてみると、
色がなじんで落ち着きます。



枠を赤色にしたり。



端の方にオレンジを置いてみたり。

注意すること

ディスプレイの設定

ディスプレイの設定は個人個人で違うため、
製作者が意図したとおりの色をプレイヤーが見てくれるとは限りません。
特に、標準よりも暗めの設定にする場合が多いため、
暗めの配色の場合製作者の予想以上に見づらく、あるいは目立たなくなる可能性があります。

素材感

視覚に大きな心理的効果をもたらすものとして、色彩の他に素材感があり、
場合によっては色彩よりも強く働きます。
例えば、ウールのセーターは、色に関わらず暖かい印象になりますし、
ダイアモンドはとても明るいけど非常に硬く見えます。

参考になる本

 色彩のことを全く知らなくても理解できる、優れた入門書です。一読を薦めます。



つっこみ・感想などあればどうぞ
名前:
コメント: