MENU

NIC BLOG

Voice of the Staff

デザインの一歩:色について

デザインの一歩:色について

こんにちは、NEXT事業部のM.Sです。

早速ですが、あなたが検索するホームページやBlogの色は何色ですか?
なぜその色を使っているのでしょうか?
好きな色という理由で、色を選んでいるのでしょうか?

色は私たちの身近に存在し、日々の生活や行動に大きな影響を与えています。
例えば、業務で資料等を作成するとき、誰もが色を用いるでしょう。
今回は、日頃みなさんが日常やお仕事で目にする「色」について、
日頃私が基準にしている、色を選ぶ際の考え方を書いていこうと思います。

色の持つ印象とは

色はどうやって選んだらよいか?
色が人に与える印象というのはとても大きいものです。資料などを作成する時に
使う色をやみくもに選択すると、
時としてビジネスにそぐわないイメージを与えてしまうことがあります。

よくありがちなパターンとして、自分の好きな色を使ってしまうケースがありますが
業種やターゲットなどにマッチしていないと、イメージがわかないモノになりがちです。

そうならないために、各色が持つ意味や与えるイメージを知っておきましょう。
色を選ぶ時の参考になれば幸いです。

赤【Red】 生命力みなぎる情熱の色

赤はエネルギーやパワーを感じさせる色です。
赤色が連想させるものとして、太陽、火、血液などがあり、これらは人間が「生きる」生命の強さを表す色です。
その他、神社などにある鳥居など魔除けといった恐ろしいものへの抵抗の意味合いもあります。

色のイメージ:情熱/強さ/派手/積極的/攻撃的/怒り/危険
企業ロゴ:ユニクロ、TOYOTA、コカコーラ、Adobe、Canon、AJINOMOTOなど

青【Blue】 知性と冷静さを感じさせる信頼の色

海や空などの自然を連想させる色であり、気持ちや感情を落ち着かせてくれ、知性、理性、信頼感などを感じさせる色です。
青は、企業などのロゴやWebサイトでもよく使われている鉄板の色ですね。

色のイメージ:知的/信頼/誠実/冷静/清潔/爽やか/悲しさ/寂しさ/冷たい
企業ロゴ:日本インフォメーション、KDDI、NTT、LAWSON STATION、Asahi、DELL、Facebookなど

緑【Green】 自然の持つ癒しと生命の色

そもそも緑という言葉自体が色を表すとともに、木や草などの自然を指す言葉でもありますよね。このことからも自然を連想させる色が緑と言えます。
自然界に多く存在する緑色は、気分を落ち着かせてくれる、癒しの効果がある色です。

色のイメージ:安心/癒やし/平和/生命/新鮮/若い/未熟
企業ロゴ:スターバックスコーヒー、LINE、JT 、JRA、三井住友銀行、LAND ROVERなど

黄【Yellow】 豊かさと希望に満ちたまばゆい色

黄色は太陽などの光を表す色で、農作物が育つためにも必要なことから、黄色は実りや豊かさを表す色でもあります。
希望、幸福、ポジティブな気持ちにさせてくれる色です。
黄色は非常に明るく目立つ色であることから、注意を促すための色としてもよく使われます。

色のイメージ:希望/明るさ/幸福感/豊かさ/賑やかさ/警告/注意/騒がしい
企業ロゴ:Nikon、マツモトキヨシ、Loft、Post-it、ヤマト運輸など

橙【Orange】 元気で明るく親しみやすい色

明るくて健康的、元気なイメージのある橙は、どこか庶民的で親しみやすい色です。赤と同様、太陽を連想させ、照明などに使うことでくつろぎを感じられます。

色のイメージ:温かい/明るい/親しみ/健康的/元気/活発/幼稚
企業ロゴ:吉野家、HERMES、BEAMS、au、キッコーマン、Fantaなど

紫【Purple】 高貴で神秘的、二面性のある色

紫は古い時代から、希少価値の高い色でした。
それは染料として紫を作るのに、材料が取りづらく手間がかかることなどが由来しているそうです。
一部の位の高い人だけが身につけられる衣装の色が紫だったそうで、紫は謎めいていて、神秘的で高貴なイメージがあります。

色のイメージ:高貴/神秘的/古典的/大人っぽい/高級感/不安
企業ロゴ:イオン、Wacoal、Welch's、ガンホー、YAMAHA、Pioneerなど

白【White】 清廉潔白で濁りのない色

白は、何にも染まっていないクリーンで清潔なイメージです。医師の白衣など、清潔さの象徴でもあります。
また、白は他の色を際立たせる色でもあります。何にも染まっておらず、全てを明らかにしてくれるイメージのある色です。

色のイメージ:清潔/純粋/無垢/潔白/神聖/新しい/真実
企業ロゴ:該当なし

黒と対極にある、もっとも明度が高い無彩色です。プロダクトでは色の一種になりますが、
紙やスクリーンにおいては、白=無色透明と認識され、他と組み合わせなければ存在しえない色になります。
※ここで注意したい白の使い方として、白の多い配色は、味気なさを感じさせることがあります。

特にデザインのリテラシーが低い利用者をターゲットにすると
白が多い=何もしていない、手抜き、デザインされていないという印象を与える可能性があります。
生きた白の使い方で、より伝えたいことが目立つことを覚えておきましょう。

黒【Black】 全てをのみこむ力を持つ孤高の色

黒は、白の正反対にある色で、白が持つイメージとは真逆のイメージを持つ色です。
黒は恐怖を感じる色の一方で、何にも屈せず全てに打ち勝つ黒は、絶対的な強さを感じさせる色でもあります。他、黒は洗練されていてスタイリッシュな色として扱われ、高級なもの、ブランドものなど、黒をベースにしたものも多く、自信やステータスを感じる色です。

色のイメージ:強さ/自信/洗練さ/高級感/恐怖/威圧的/孤立
企業ロゴ:LOUIS VUITTON、PRADA、SEIKO、SONY、虎屋など

灰【Grey】 控えめ故に調和しやすい色

白と黒の中間の色が灰色です。
「グレーゾーン」という言葉があるように、どっちつかずで曖昧な色が灰色です。この曖昧で主張しすぎないグレーは、他の色との調和が取りやすく、デザインにおいてはとても扱いやすい色です。

色のイメージ:控えめ/上品/渋い/都会的/曖昧/不正/ごまかし
企業ロゴ:Apple、メルセデス・ベンツ、SoftBank、NISSAN、Nintendoなど

制作する時に自分が考えること

色の使い方や選び方に、苦手意識がある人は多いかもしれませんし、色について知ろうとすると、多くの知識が必要になります。ただ、いくつかルールを決め守りながら配色していけば、
知識がなくても格段とまとまってみせることができるので、ポイントを少しご紹介します。

使用する色は2色だけ

→色が多いと色同士がケンカしてしまい、見ていて疲れた印象になります。
メインカラー、アクセントカラーをそれぞれ1色だけ選び、シンプルに2色だけ使うようにしましょう。

  • メインカラー: 印象を決定する大切な色です。一番多く、メインとして使う色です。
  • アクセントカラー: 強調したい箇所や、目立たせたい部分で使う色です。

メインカラーはイメージしやすい色を、アクセントカラーはメインと対極の色を選ぶ

→自社ロゴの色や、一般的にイメージしやすい色を選択し、原色をさけ、色に少し「くすみ」をつけましょう。少しくすんだ色を使うようにすると、全体の色が落ち着いて見やすくつくることができます。
アクセントカラーはできるだけ、メインカラーと離れた色を選びましょう。その他、2色の濃淡色、黒色を選ぶと色数が増えずにまとまりが出ます。

例えば、エクセルなどにあるカラーパレットで「標準の色」に指定されている色はビビットカラーになります。
※ビビッドカラーとは、鮮やかで冴えた色のこと。
絵の具の赤、黄、緑、青のような原色のことを指します。

迷ったら黒の濃淡色を使う

→灰色は調和する色なので、迷った場合は灰色の濃淡に助けてもらいましょう。

最後に

色はデザインの中でも重要な要素なので「どんな印象を与えたいか?」ということを考えた上で色を選ぶことが重要です。
色の持つ意味やイメージを知っておけば、理由をもって色を選ぶことができるようになりますね。

「どんな色を使ってどんな印象を与えたいのか?」
資料を作成する時に、提案する・依頼するどちらの立場であってもきっと役立つ知識となりますので、ぜひ覚えておいていただければ幸いです。

前の投稿 >

カテゴリ

このブログはNIC社員が定期的な(?)更新を行っています。
各担当者は普段の業務の合間をぬってブログの記事を作成していますので、日付順で表示した場合にはいろいろなカテゴリがごちゃまぜで表示されます。
カテゴリ別の表示をしていただくと、ひとつの流れとして読みやすくなると思います。

月別アーカイブ