サイトのロゴができたので世の中の色とロゴについて考察してみる

科学

サイトのロゴが出来たぞーーー!!!

やったね。

〜完〜

 

 

 

(これで終わると思うなよ?)

まえがき 色と色といろいろと

というのは、視覚の中でも特に重要となる情報です。

上の文章や、学生のノートや教科書のように、重要な部分に印をつけたり、マークをして視覚的わかりやすくするというのも一つ学習法として知られています。

まあ、上の文のようなマークの付け過ぎは逆にわかりづらくなる気もしますが。(※個人の主観です)

その他にも、色はさまざまな情報を与えてくれます。例えば黄色の二色は警告色と呼ばれているように、ハチの体色や立ち入り禁止の看板などに見られ、見るとちょっとビビります。

また、パステルカラーでは色に対して受け取る印象も大きく変わってきます。

これらのように、色の組み合わせ次第で、人に与える印象は大きく変わってくるものです。

というわけで今回は、世にはびこるロゴと色彩について話していきたいと思います。

第1章 RGB

この記事、見ての通りめちゃくちゃいろんなをつけて作ってますがコンピューターwebサイトにおいて色情報を示す方法、意外と知られていないと思うので、ここで軽く解説しておきます。

コンピューターでを表す時は、

(R,G,B)=(255,255,255)  (これで黒を表します)

(R,G,B)=(230,120,40)  (だいぶ赤が強めですね。色で言えばオレンジ色と言ったところでしょうか。)

のように記される、光の三原色として知られている(Red)(Green)(Blue)の三色をそれぞれ256段階に分けて、その組み合わせで約1億6千万通りの色を表すことができるRGB方式と呼ばれる方式が主に用いられています。

(おすすめ記事→なぜ3原色は赤緑青なの?(現在執筆中))

このRGB方式を別の表し方で表したものとして、

#1f35ad

のように、赤青緑それぞれを16進法(1,2,3…8,9,a(11),b(12)…f(16)のように表された数字)の数字2桁で表すことで、赤青緑それぞれ256段階を表現し、その組み合わせで同じく約1億6千万通りの色を表すこともできます。

このように、全ての色は3原色の濃さの組み合わせで表現されているのです。

この辺りで一旦小難しい話は置いておいて、社会で実際に使われている色とその組み合わせについて見ていきましょう。

第2章 色相環と、いろくらべ

色相環
(24等分した色相。WikipediaCommonsより。)

色の組み合わせを考える上で、上の図のような色相環を用いた見方をすると、よりわかりやすく良い組み合わせを見つけることができます。

(SDGsのピンバッチに似てますね…)

ちなみに、このサイトの上部にもある驚異部屋」現行ロゴ(2023年春時点)ですが、を基調とした、扉のデザインを用いたロゴになっています。

ですね。

他にも、以下のような企業・ブランドロゴは、いずれも対照的な色を使うことで、目を引くロゴデザインを作っています。


先日、移転のため閉店になったマクドナルド自由が丘店の閉店告知ポスターとそのロゴ。赤、黄色、白を基調としたデザインですね。
(思い出の詰まった場所でした。。。)

黄色を基調としたマクドナルドのロゴ

黄色を基調としたTポイントカードのロゴ

を基調としたサイゼリヤのロゴ

などなど…

身の回りを探してみるとさまざまな色の組み合わせのロゴが存在しているはずです。

対照的な色を組み合わせることで、コントラスト(色と色の差のこと)を高めることで視認性を高めて、目を引こうという作戦ですね。

先ほどのTポイントカードのロゴのような対照的な色は、補色と呼ばれ、先ほどの色相環でみると、互いに向かい合う位置にあります。


補色の一例。上の図のように、黄色は補色の関係にある。

トライアド配色とは、色相環上で三角形を描く関係にある色同士のことで、こちらも相性がいい色同士の一例として挙げられます。


トライアド配色の一例。は相性の良い色とされることも多い。

 

第3章 薄いも濃いも世の情け

色を決めるために必要なのは、赤や黄色、青などの色の種類だけではありません。もう一つ重要になってくるのは、色の濃さです。

例えばこの記事の冒頭にもあったこの画像。

ロゴのドアの部分の色と背景の色では、同じ赤と青の系統の色を使っているにも関わらず、受ける印象が変わってきます。

これには、色の濃さが関係しています。

例えば、パステルカラーでは受ける印象が大きく印象が異なってきます。

原色は色が一番濃くなり飽和した状態で、主張の強い印象を受け、パステルカラーは一般には白味がつよく優しい印象を受ける色とされています。

ここまでに紹介してきたように、色から受ける印象はその色の種類強さによって決まります。2種類以上の色を組み合わせる時も、同じ系統の色を組み合わせてなじみやすいデザインを作るか、補色などのように大きく違う色を組み合わせてデザインを強調させるか、ブランドや商品、製作物の意図するものや方向性によって変わってきそうですね。

それでは、散歩がてら街に溢れるデザインやロゴを見ていきましょう。

というわけで、次回「デザイン散歩のすゝめ」編もお楽しみに。

おすすめ記事→「デザイン散歩のすゝめ」(現在執筆中)
この記事を書いた人
H.N.

「驚異の部屋」編集長(仮)。都内の理系大学生(生物専攻)。音楽と写真とモノづくりが趣味。ちょうどいい自己紹介画像を探してさまよってます。

科学
シェアする
驚異の部屋

コメント

タイトルとURLをコピーしました