デザイン配色で気をつけておきたい3つのルールを解説

あなた

何だかごちゃごちゃした印象になってしまう。。。本当はスッキリした印象にしたかったんだけど。。。

この色いいな!と思って使っていったらダメなんですか?

デザインでよく悩むのが「配色」。どういう基準で色を組み合わせれば良いのか分からなくなりますよね。

自分で組み合わせを作っているうちに、色んなパターンが良く思えてしまうので、ある意味、沼です。

簡単に3つのことを意識してみましょう。

ポイント

  • 配色したものに意味を持たせる
  • 落ち着いた配色を意識する
  • 色数は増やさない

この3つのことを意識するだけで、ちぐはぐな配色になったり、ごちゃごちゃした印象にもならず、オシャレな配色になります。

この記事を書いた人

【主なWebメディアの実績は以下です】
>HOUSTO-おウチの収納.com
>売場の安全.net

そして私はデザイン学校に通わずに、営業マンから独学でデザインを習得して、独立しました。

「プロ感」を出すための配色ルール

色の使い方に一貫性を持たせることが絶対的なルールです。

ポイント

整理されている =迷わせない = つまり、安心

とつながり、マイナス要素のない状態を作ることがオシャレ感へ繋がっていきます。

自分の好きな色や、その時々のノリで使いたい色をどんどん使うと印象がバラバラになって、ごちゃごちゃしたオシャレ感のない配色になってしまいます。

配色で最も大切なことは、「一貫性を持たせる」ことです。

一貫性を作るため、しっかりと以下のことを意識しましょう。

ルール1.配色したものに意味を持たせる

好きな色、好きな配色を使うだけではどうしても偏りが出て印象バラバラになります。

そのため、以下のように考えてみると良いです。

「プロ感」を出すための配色ルール

色の使い方に一貫性を持たせることが絶対的なルールです。

ポイント

整理されている =迷わせない = つまり、安心

とつながり、マイナス要素のない状態を作ることがオシャレ感へ繋がっていきます。

自分の好きな色や、その時々のノリで使いたい色をどんどん使うと印象がバラバラになって、ごちゃごちゃしたオシャレ感のない配色になってしまいます。

配色で最も大切なことは、「一貫性を持たせる」ことです。

一貫性を作るため、しっかりと以下のことを意識しましょう。

ルール1.配色したものに意味を持たせる

好きな色、好きな配色を使うだけではどうしても偏りが出て印象バラバラになります。

そのため、以下のように考えてみると良いです。

ポイント

  • 1つの色には一つの意味だけを持たせる
  • イメージにあった色を使う
(クリックで拡大)

それぞれ左の×の例のように、

色に複数の意味を持たせたり、イメージと違う色を使うと、見る人は混乱します。

そのため、それぞれ右の◯のように表現すると混乱せずに自然と受け入れられます。

ルール2.落ち着いた配色を意識する

高い彩度の配色は避けてみましょう。

なぜなら、色同士が主張しあって見る側を疲れさせてしまうからです。また、彩度の高い標準色を選ぶと、安易に色を選んでいると思われがちにもなります。

以下の点を意識してみましょう。

(クリックで拡大)

比べればわかると思いますが、

ポイント

  • 高い彩度の標準色を使うよりトーン(彩度・明度)を抑えた色の方が受け入れやすい

と思います。

とはいえ、派手に演出したい場合のデザインや、効果的に使う場合には、イメージを印象付ける良い味方にもなります。

パッと見で、高い彩度の色は斬新な感じを受け、目に入りやすいのでぜひ使っていきたいところですが、最初は少し落ち着いた色から配色するのがベターです。

まずは、トーンを抑えた落ち着いた色で配色するようにしましょう。

ルール3.色数は増やさない

色数は多くても4色までに抑えましょう。

色数が多いと、それだけで見づらくごちゃごちゃした印象になり、オシャレ感からどんどん遠くなっていってしまいます。

以下のことをやってみましょう。

ポイント

  • すでに使っている色と同じ色か同系色を使う
  • 灰色(無彩色)を使う

では、色数が多いものから同系色や灰色に変えた例を見てみましょう。

(クリックで拡大)

このように、違う色を使わずに同系色や灰色を使うと、色数が多い印象になりませんので見やすくなります。

灰色は無彩色で色数が増えた印象を与えないので、もし同系色を使って色数を減らしてもまだ派手な印象が残る時は、灰色を上手に使ってみましょう。

まとめ

オシャレ感を出すためのルール。

何だか覚えるのが大変そう、と思えても、実はシンプルなことがルールであるということがお分かりいただけましたか?

実践するのは以下の3つのことです。

ポイント

  • 配色したものに意味を持たせる
  • 落ち着いた配色を意識する
  • 色数は増やさない

1つずつポイントをまとめると以下になります。

1.配色したものに意味を持たせる

  • 1つの色には一つの意味だけを持たせる
  • イメージにあった色を使う

2.落ち着いた配色を意識する

  • 高い彩度の標準色を使うよりトーン(彩度・明度)を抑えた色の方が受け入れやすい

3.色数は増やさない

  • すでに使っている色と同じ色か同系色を使う
  • 灰色(無彩色)を使う

この3つのルールを守るだけで、十分にオシャレな配色となり、全体のビジュアルも整います。

ぜひこのルールに沿って配色を考えてみてください。