良い感じの見た目にしたい、けれど色がどうしても上手に使えない...ノンデザイナーにとって色にまつわる悩みは深く、苦手意識を持っている人も多いと思います。今回の記事では、ノンデザイナーが悩まずに意図を持って色を使うための、基本的な考え方をご紹介します。そもそも色とはなにか普段意識することなく使っている色ですが、そもそもこの色とはなんでしょうか。色とは端的に言えば対比=違いのことです。例えばすべてが緑一色に塗られた世界のことを想像してみてください。この世界では色は緑しかないため、そもそも「色」という概念が存在しません。ではこの世界にオレンジ色を足すとどうなるでしょうか。オレンジという違う色との対比が生まれるため「緑」という色を識別できるようになります。つまり色とは「違い=対比」であり、違うからこそ識別できる存在と言えます。そしてこの色を考えるというのは、「違い=対比」をどのように作るのかを考えることにほかなりません。どのような違いを作るのかを考える作業=色を考える作業なのです。色を設計するということ人は違いを見つけた時に無意識にその違いの意味を探します。例えば正方形のマス目に並んだ9つの円の内、中央の1つ円だけ色が違うとします。この9つの点を見た人は自然と「どうして中央だけ色が違うのだろう」と考える=意味を求めます。そして、この違いに意味がない時に人は混乱します。また、意味があったとしても違いが多すぎると人は意味を処理しきれません。つまり色=違い=対比を考えるという作業は意味のある違いを適切な量で設計するということになります。色の設計の基本使う色の数資料など伝わりやすさを重視するビジネス現場でのデザインでは、使う色数の基本は4色です。4色の内訳ですが、まずベースカラーと呼ばれる背景色と文字色があります。この2色に関しては、基本的には白黒が選択されるためあまり考える必要のない2色になります。よく背景色、文字色を色にカウントしていない人がいますが、これも立派な色なので4色の中にカウントするようにしてください。続いてメインカラーとアクセントカラーの2色があります。これは自由に選ぶことができる色なため、考えて配色する必要があります。ただ逆に言えばこの2色さえ考えてしまえば色の設計は終わります。色はなんか難しい...と苦手意識を持っている方は、メインカラーとアクセントカラーの2色だけを考える作業なんだとシンプルにとらえてもらえると、大分苦手意識が和らぐのではないでしょうか。配色の黄金比と各色の役割ベースカラー、メインカラー、アクセントカラーからなる4色ですが、配色するにあたっては綺麗に見える比率=黄金比があります。70%をベースカラー：背景色/文字色25%をメインカラー：色を使いたい場所でまず使う色(文字の強調など)5%をアクセントカラー：目立たせたい/意味の違いを表す色(申し込みボタンなど)上記の比率で各色を配色するようにすると美しくまとまりやすくなります。私の感覚では基本的にはベースカラー(70%)で作り、目立たせたい時にはメインカラー(25%)を使い、ここぞという時にだけアクセントカラー(5%)を使うイメージです。スライド資料ではアクセントカラーを使わないスライドを作ることも多々あり、ベースカラー+メインカラーでも十分に成り立ちます。色を考える順番ここまで使い色の数、種類、そして割合まで解説してきました。ここからは色を考える順番について解説します。色を考える際には基本的には下記の順番で考えます。まず、メインカラーを決める次に、ベースカラー(背景色・文字色)を決める最後に、アクセントカラーを決める5色目以降は必要なタイミングで検討するメインカラーはそのデザインの印象を作る重要な色になるため、初めに決めます。ベースカラーは特に悩みたくなければ白黒を選択するようにしてください。3番目のアクセントカラーは、メインカラーとの対比を考える必要があるため一番むずかしいフェーズになります。こちらの配色のテクニックはこちらの記事で解説します。5色目以降の色が必要になるケースでは、必要になったタイミングで考えるようにします。使うかどうか分からない色で悩んでいる時間は無駄になってしまうこともあるからです。メインカラーの決め方メインカラーはそのデザインの印象を決めるとても重要な色になります。そのため最も検討が必要な1色です。ただし、その決め方に関してはとてもシンプルです。会社の資料を作る場合、メインカラーは基本的にブランドカラーを採用します。企業の資料の場合はその企業の印象をデザインで伝えることが重要であり、そのためメインカラーとブランドカラーが一致していることが望ましいからです。企業外の資料などブランドカラーが無い場合は、伝えたいメッセージに合うカラーイメージを調べて選択するようにしましょう。カラーイメージとは例えば「赤=情熱」のように、その色を見た人がどういったイメージを持つのかを表したものになります。それぞれの色にたくさんのカラーイメージがあるため、調べた上でもっともイメージに近いカラーを選ぶようにしてください。ベースカラーの決め方ベースカラーは何度か書いている通り、基本的には白黒を選択します。特に文字色は黒以外を選択することが基本的にはありません。ただし背景色を白以外にした場合は読みやすさを担保するために、例外的に黒以外を選択することもあります。背景色も基本は白ですが、文字色ほど強い制約はないため色を使うことも可能です。背景色を白以外にする場合は以下に気をつけるとまとまりやすくなります。強い色を選ばないメインカラーと同系色にすると馴染む(メインカラーの不透明度を上げて薄くした色など）アクセントカラーの決め方アクセントカラーはメインカラーとの対比を考える必要があるため、一番配色に悩む色になります。基本的な考え方としては、最も目立たせたいここぞという時に使う色になるため、違いを際立たせる目的でメインカラーと対比が強い色を選ぶことが重要です。アクセントカラーの配色に関する詳細なテクニックに関しては次の記事で詳細に解説するので、そちらを参考にしてください。まとめ今回は色の使い方の基本を解説しました。重要な点を下記にまとめます。色の設計=意味のある違いを適切な量で設計する使う色は4色考える色はメインカラーとアクセントカラーの2色色を考える際はまずこの3点を意識するようにすると、悩まずにシンプルに考えることができるので、ぜひ覚えておいてください。次の記事で配色のテクニックに関してご紹介するので、もっと色を使いこなせるようになりたい、という方はぜひそちらを参考にしてみてください。