サムネイルの文字や背景色が1パターンになってはいないですか?

あるいは、自分の感性で作ってはいないですか?

パターン化して統一感を持たせるのも良いですが、
テーマが違ったものまでパターン化すると、

余計、動画の内容を区別できずややこしくなります。

また、自分の好みで作ったサムネイルは、たいてい
視聴者さんにとっては、魅力的に写っていないことが多いです。

配色は、人のイメージを与えて行動までも変えてしまうものです。

なので、動画を見てもらえる、もらえない、
あるいは購入してもらえる、もらえないに影響があります。

内容以外のところで判断されたら、たまったもんじゃないですよね?

なので、本記事では、マイナスにならないサムネイルやLP(セールスレター)の
配色とプラスになる押したくなるボタンの配色の考え方を教えます。

サムネイルやLP(セールスレター)における配色(デザイン)とフォントとは?

サムネイルやLP(セールスレター)におけるデザインとファントは、

センスが良い!オシャレと思ってもらうことではありません。

自分が相手に植え付けたいイメージでかつ
望んでいる行動を取らせるためのデザインです。

ファントは、イメージを優先して読みにくくなれば、
意味がないので、

第一優先は言葉として見やすく読みやすいかを考え、
その後にデザインを考えるようにしてください。

サムネイルやLP(セールスレター)で配色を決める考え方

キーワードと親和性が高い色を選ぶ

サムネイルやLP(セールスレター)では、

人に行動してもらうためのデザインになるので、
色と言葉がセットになりますが、

売上の上がる配色の考え方は、キーワードに対して親和性の高い色を
選ぶことです。

文字の色を白にしたいから、背景は、赤がいいかな?
などと、色を基点に選んで、また配色を決めるというのは、

自分の感性になるので、売れません。

そうではなく、キーワードがより訴求される配色は何かを
先に考えることが大事です。

周りの配色を考慮する

赤という色は、人の血の色であり生命を感じさせるものであるため、
視線を注目させますが、

背景が赤色の中で、赤色のボタンを配置したり、
赤文字に赤色の背景では、

見分けつかず、赤色に埋もれて返って目立ちません。

色による心理効果や注目させ行動させるものにしたいなら、
周りの配色も影響を受けることを考えて選ばないといけません。

余白もデザイン

何も配色しない、真っ白であることもデザインの一つです。

複数の色を使いすぎたりすると、余計にごちゃごちゃして、
デザインが活かされなくなります。

余白もデザインになることを覚えてください。

言葉と親和性の高いイメージカラー

楽しい

オレンジ、黄色、水色

清潔

クール

白、青、明るい緑色

モダン

暗い茶色、暗い紺色、暗い灰色

クラシック

暗い黒色、暗いゴールド、暗い茶色

豪華

黒、ゴールド、暗めの朱色

魅惑

紫、ピンク、黒、赤

ポップ

明るい黄色、明るい青色、明るいピンク

サムネイルでオススメな配色の考え方

メインカラー(スペースに一番よく使う色)は、
世界観やビジョンを可視化するのに使います。

サブカラーは、メインが引き立つようにしたり、
サブカラーで当てた箇所を注目させるために使います。

3色まで

3色を超えると、それぞれの色の効果やイメージが
半減されるので3色までに絞って配色するようにしましょう。

同系色と差し色

同系色を使うとまとまりが出るため、
視線誘導しやすくなります。

目立たせたい箇所だけ、色をつけて後は、
黒や灰色などにすると、視線誘導しながら、

色のところを注目させることができます。

画像を作って文字を入れる場合

画像を作って文字を入れる場合、

地色+文字色+ポイント色(差し色/アクセント)で配色を考えましょう。

地色とは、ベースとなる背景色です。
地色が、白であれば、文字色は黒や濃いグレーが最も見やすくなります。

地色は、メインカラーとなるので伝えたい印象を
地色に合うものにすると良いです。

文字色は、地色に合わせて読みやすいものにしつつ、
同じように与えたい印象に近い色にするようにしましょう。

ポイント色は、視線を誘導させるものです。

ポイント色で当てる箇所に注目して欲しい場合は、

地色や文字色を暗めにして、
ポイント色を明るい色のあるものにしましょう。

写真のうえに文字を入れる場合

写真のうえに文字を入れる場合、

5つのパターンでベストなものを考えてください。

文字色+文字の縁取り色+文字のポイント色(相反/アクセント)

写真の場合、地色を変えれないので、
文字色は、地色に合わせて読みやすいものにしつつ、
与えたい印象の色に近いものを選びましょう。

文字の縁取りをして文字色とは違う色を縁取りした場所に
使うと、

文字が立体的に浮かび上がったようになるため、
見やすくります。

文字の縁取り色は、黒、白、赤、黄がオススメです。

白にすると、明るくなります。
黒にすると暗くなります。

文字のポイント色は、注目させたいキーワードに使う色です。

一つの場合は、差し色のように伝えたいイメージに合う色を入れ、
相反するキーワードの場合は、赤と青、黒と白のように、配色を使い分けましょう。

文字色+文字の背面透過+文字のポイント色(相反/アクセント)

前と違いは、文字に背面透過を入れるところです。

文字の背面透過は、縁取りで色を付けることによって
印象を変えたくない時に使うことが多いです。

ロゴだったり、写真の差材を活かしたい時に使います。

写真の地色変更+文字色+文字のポイント色(相反/アクセント)

写真にオーバーレイ(重ねる)効果を使うことで文字の視認性を上げることができます。

クラシックにしたい時にも使えます。

写真ピントぼかし+文字色+文字のポイント色(相反/アクセント)

写真全体の雰囲気だけでイメージが伝わるなら、
写真のピントを少しぼかしにすることで、文字の視認性を上げることができます。

文字色+文字周りのライン+文字のポイント色(相反/アクセント)

文字を囲うようにラインを入れると、背景より文字に視線が行きやすくなり、
文字が見やすくなります。

サムネイルで使える視線誘導のテクニック

三分割構図

三分割構図とは、三分割された線が交差するところを、
視線のポイントに設定する方法です。

文字を読ませながら、写真の中にあるものを自然な印象にして
見せるのに使います。

日の丸構図

被写体を画面のセンターに配置して視線を誘導する構図です。
被写体の世界観や想像力を掻き立てたいなどに使います。

動く先

動いているところを写真として静止画像にした時、
その動きに向かって視線が移動します。

例えば、蛇口から水が出てる画像を使うと、
蛇口の水が下へと落ちる流れで視線が移動します。

男性は、狩猟で生活したDNAが残っているので、
動きのあるものに敏感なので、視線を留めさせるのに
使えます。
(男の子は、おもちゃで遊ぶ時、ヘリコプターや車を押したり、
引いたり遊ぶのが好きだし、動く乗り物やおもちゃが好きなのは、
狩猟で動くものに反応できるように発達したからです。)

人の視線

人物ポスターなどで真っ直ぐ見ている写真は、
何か自分を見られている気がしませんか?

人は人の視線に目がいくようになっています。

なので、写真の人物が向いている方向へ同じように視線がいきます。

視線の先を見せるのに使いましょう。

視線の先のメッセージを読ませたり、何かメッセージ性のあるものを
見せて興味を引かせたりしましょう。

コントラスト

周り暗くて、明るい箇所があると、
暗いところから明るいところへ視線誘導ができます。

色のイメージと心理効果

白色

白色がイメージさせることは、

・正義感が強い、真面目
・理想主義
・潔癖、純粋
・正直、素直
・シンプルなことが好き、無駄なことが許せない

などです。

白色の心理効果としては、

・清潔な印象を与える
・神聖に思わせる
・物を軽く感じさせる
・始まりを感じさせる
・汚してはいけないと思わせる
・広さを感じさせる

黒色

黒色がイメージさせることは、

・無口、打ち解けない、孤独、ポーカーフェイス
・独立心が強い
・完璧主義
・威厳
・粘り強い
・近寄りがたい
・秘密主義
・悪
・高級

などです。

黒色の心理効果としては、

・物を重く感じさせる
・暴力や圧力、権力など悪の力を感じさせる
・高級感を与える
・自己主張を感じさせる
・気分を沈ませる

などです。

灰色

灰色がイメージさせることは、

・温厚、控えめ
・中立を保つ
・用心深い
・地味
・自信がない
・不気味、軽薄を好む
・何を考えているのかわからない
・不潔
・優柔不断、社交性に欠ける
・防御本能が強い

などです。

灰色の心理効果としては、

・上品な印象を与える
・穏やかで控えめな印象を与える
・大人あるいは老けた印象を与える

などです。

赤色

赤色がイメージさせることは、

・リーダー
・誘惑、ドキドキ
・生命
・危険
・情熱、熱狂的、興奮
・元気
・目立ちたがり、派手好き
・気分屋、慎重さに欠ける、持続性がない
・疲れる
・怒りっぽい

などです。

赤色の心理効果としては、

・気分を前向きにさせる
・アドレナリンを分泌し興奮を促す
・熱や暖かさを感じる
・食欲を増進させる
・目を引き関心を集める

などです。

青色

青色がイメージさせることは、

・信用できる、常識人、真面目、遊び心に欠ける
・参謀、知的
・ストイック、
・プライドが高い、
・冷静、慎重、
・相手を尊重する、思いやり、気配り、謙虚、
・サポーター、品性がある、
・控えめ
・冷たい
・正義感が強い
・暗い
・八方美人、陰湿
・リラックス、安定

などです。

青色の心理効果としては、

・集中力を高める
・食欲を落とさせる
・リラックスさせる
・睡眠を促進する

などです。

黄色

黄色がイメージさせることは、

・明るい、フレンドリー、
・ハッピー、幸福
・マイペース、
・ユーモアがある、
・好奇心旺盛、無邪気、お調子者、
・子供っぽい、
・寂しがり屋、

などです。

黄色の心理効果としては、

・集中力を発揮させる
・注意を引き付ける
・気分を明るくさせる

などです。

緑色

緑色がイメージさせることは、

・若々しい
・健康的、
・優しい、
・植物が好き
・穏やかな
・自分の感覚を大事にしている、
・リラックス
・平和主義、
・バランス感覚がいい、
・現実志向、節約
・平凡、色気ない、
・脇役

などです。

緑色の心理効果としては、

・癒し、リラックスさせる
・疲れた目を休ませる

などです。

オレンジ

オレンジがイメージさせることは、

・チャレンジ
・仲間意識が強い、社交性が高い、明るい、
・オールマイティ、
・積極的、
・世話好き、
・目立ちたがり屋で寂しがり屋
・人懐っこい

などです。

オレンジの心理効果としては、

・食欲を増進させる
・賑やかさを感じ陽気な気分にさせる
・エネルギーを与える
・団結力を高める

などです。

ピンク

ピンクがイメージさせることは、

・優しい、思いやりがある
・母性
・甘え上手、媚びる
・ロマンチスト、
・ヒロイン、女性らしさがある、
・損得勘定
・美しいものに関心がある
・可愛いように見せたい、弱いように見せたい
・平和主義
・愛

などです。

ピンクの心理効果としては、

・幸せな気持ちにさせる
・優しい気持ちにさせる
・心も体も若くなる
・愛らしく見える

などです。

茶色

茶色がイメージさせることは、

・中堅、老練
・堅実的、安定志向、信頼がおける
・マイペース、現状維持を好む、変化を嫌う、
・自然志向、
・頑固者、融通が利かない
・泥臭い、
・不満を我慢する、
・目立ちたくない
・田舎、泥臭い
・ダサイ
・古い、時代遅れ
・懐かしい

などです。

茶色の心理効果としては、

・緊張を緩和させる
・堅実さや信頼感を与える
・温もりを感じさせる
・伝統や歴史を感じさせる

などです。

紫色

紫色がイメージさせることは、

・美意識が高い
・スピリチュアル(魂)
・ミステリアス(神秘、謎、不思議)、妄想癖
・中立、中性、
・こだわりが強い、協調性がない、
・優しい
・大人
・芸術
・オシャレ(紳士、淑女)
・怖い、不健康

などです。

紫色の心理効果としては、

・想像力をかき立てる

などです。

ゴールド

ゴールドがイメージさせることは、

・大人、
・お金、富、成功
・お金持ち、権力者、カリスマ
・権力、威厳、
・個人主義、
・豪華、高級、
・結果主義、損得、エゴ
・ブランド志向
・希少

などです。

ゴールドの心理効果としては、

・特別なものと認識させる
・高級感を感じさせる
・豊かな気持ちにさせる
・華やかなにさせる
・自己肯定感をあげる

などです。

シルバー

シルバーがイメージさせることは、

・公平
・理想家
・努力
・優しい
・紳士的、信頼できる人
・秘めたる自信、
・理屈っぽい、批判的
・クール
・頑丈
・永遠

などです。

シルバーの心理効果としては、

・上品な印象を与える
・洗練されたシャープな印象を与える
・都会的なイメージを与える

などです。

LP(セールスレター)のボタンに「オススメな色」と「有効なジャンル」

赤色

Liveや熱狂を売る商品で使いましょう。
情報系商材の販売によく使われた色で、煽りをされた経験がある人は、
印象が良くないので、情報商材は使わない方がいいです。

緑色

癒やしやリラックスさせたいものに使いましょう。

黄色(オレンジ寄り)

娯楽や未来、楽しいことをイメージさせたい場合に
使いましょう。

青色

自分自身の信用や信頼が武器になる人や、
風邪薬などの薬などに使いましょう。

LP(セールスレター)の文章にオススメなフォント

日本語は、

・游ゴシック
・游明朝
・メイリオ

はWindows、MACの両方で搭載されていて
文章が続く文字の中でも見やすく、読みやすい文字です。

英語は、

・Times New Roman(タイムズニューローマン)
・Arial(エイリアル、アリアル)
・Sanserif (サンセリフ)

がWindows、MACの両方で搭載されていて、
日本人が見やすく、読みやすい文字になります。

フォントのイメージ

基本的にファントの線が細いとエレガントで、
太いとカジュアルになります。

日本語

ゴシック体

縦横の線の太さが均一で直線的な形であるため、

「信頼感」をイメージさせるフォントです。

Webや雑誌の文章にもよく使われます。

明朝体

縦の線が太く横の線が細く、太さに強弱があるため、

高級感や大人な雰囲気や繊細さをイメージさせるフォントです。

新聞でよく使われます。

楷書体(かいしょたい)と行書体(ぎょうしょたい)

楷書体と行書体は、筆で書いたようなフォントになります。

和や伝統を感じさせます。

丸ゴシック体

ポップで柔らかいフォントになるので、
可愛らしさや子供っぽさを感じさせることができます。

英語

ヒューマニスト・サンセリフ

曲線が強調されていて温かみがあります。女性らしいイメージです。

視認性が高く、人間的なデザインでもあります。

ジオメトリック・サンセリフ

直線や円弧などが幾何学的です。クリエイティブな印象を持つものが多く
ロゴによく使われます。

TRAJAN(トラジャン)

高級感のあるものにピッタリ合います。

ボタンを押したくなる色

人は、直前まで頻繁に見ていた色と反対色(補色)になる色に
視線が行きやすいです。

例えば、赤をずっと見ていたら、反対の色になる緑が目立って
視線を移したくなるのです。

クリスマスツリーやクリスマスをイメージさせるものは、
赤と緑の色を使っていて、目立ちますよね?

商品やキャラクターの色にも使われています。

・赤のたぬきと緑のきつね
・マリオとルイージ
・ムックとガチャピン

*色相環

まとめ

デザインカラーで印象は全く変えることができます。

なので、使い方が非常に大事です。

色の効果や印象は、特に教育で学ぶことはない分、
自分の感性で選びがちです。

デザインは一般にセンスなように思われているために
自分の感性で作っている人が多いのですが、

目立つ配色や色における心理効果は研究で明らかになっています。

根拠のあることは、科学にもとづいて行う方が
確実で安定した結果を得られます。

本記事では、研究により明らかにされていることを
伝えています。

なので、汎用性が高く、人の色に対してのイメージや
心理効果は変わらないので、ずっと使えるので、

学び活かしてください。