見出し画像

理想的な配色とは|スライドデザイン研究所

PowerPointでは、文字や図形の色を無数のバリエーションの中から選択できる。スライドの配色を考える際、これほどの選択肢を前に迷いが生じてしまうことはないだろうか?

過去記事「テキストは太字や下線ではなく“色”を変えて強調すべき理由」では、テキストの特定の箇所を強調する複数の方法について考察し、有彩色を活用する利点について説明した。

今回は、これを踏まえた上で理想的な配色について掘り下げていきたい。

青×オレンジのパワー①:反対色の効果

Timewitchの標準フォーマットではをメインカラーとし、オレンジを強調箇所に用いるアクセントカラーのひとつとしている。

ここで「赤の方が強調に適しているのでは?」と疑問に思う人もいるだろう。確かに教科書からテレビCM、チラシまであらゆる媒体で赤は目立たせたい部分によく使用される。

しかし、Timewitchフォーマットでオレンジが強調色に選ばれたのには訳がある。

第一に、オレンジは青の補色である。補色とは、マンセル色相関でちょうど反対に位置する色であり、反対色とも呼ばれる。


Source: https://commons.wikimedia.org/wiki/File:MunsellColorCircle.png

反対色は互いを引き立て合い、はっきりとしたコントラストを生み出してくれるのだ。

実際、この視覚効果は日常のさまざまな場面で活用されている。上図の通り緑は赤の反対色となっており、例えば料理において、トマトベースのパスタにバジルを添えたり、グリーンサラダにプチトマトをトッピングしたりすると見栄えが良くなる。

このため、青を基調としたデザインのスライド内で目立たせたい部分には、オレンジが最適なのだ。

青×オレンジのパワー②:ウェブ画面における理想的な色づかいとは

ここで興味深い研究を一件紹介したい。

Nathalie Bonnardel教授(Aix-Marseille大学)率いる研究チームは、ウェブサイトの色が閲覧者(およびウェブデザイナー)に与える影響を分析した。

Bonnardel, N., Piolat, A., & Le Bigot, L. (2011). The impact of colour on Website appeal and users’ cognitive processes. Displays, 32(2), 69-80.
https://doi.org/10.1016/j.displa.2010.12.002

この実験は、同内容で色違いのウェブサイトが用意され、23色ものバリエーションの中から閲覧者が魅力的(appealing)と感じる色を調査するというもの。様々な属性の被験者たちの間で最も評価が高かったのが、まさに青とオレンジだったのだ。

実験イメージ図
※Fig. 1 "Samples of Web pages in a variety of colours" (Bonnardel et al. 2011: 72) を元に作成

さらなる追加実験では、青のウェブサイトとオレンジのウェブサイトを比較した。すると、オレンジの方が被験者による閲覧時間が長い上、箇条書きで提示された情報がより記憶に残りやすいとの結果であった。

以上のデータからも、メインカラーに青を用い、閲覧者に特に注目してもらいたい箇所にオレンジを用いるのは、理に適った配色だと言えよう。

「読みやすい」を一人でも多くに届けたい:色覚多様性とU D C

身の回りのあらゆるものに反射した光の波長の差異を、我々は「色の違い」と認識する。これを可能にするのは「錐体」と呼ばれる視細胞だ。

L錐体・M錐体・S錐体の3種類がそれぞれ赤・緑・青の色を感じる役割を果たすが、これらのうちどれかがなかったり他の錐体と似た性質を示したりすると、色の見え方が通常とは異なるのだ。

参考:「色覚についての基礎知識」(NPO人にやさしい色づかいをすすめる会)

特定非営利活動法人Color Universal Design Organizationは、異なる色覚タイプについて以下の呼称を提案している:

  • 「C型」:一般的な色覚

  • 「P型」:L錐体の変異に起因する色覚

  • 「D型」:M錐体の変異に起因する色覚

この色覚多様性に配慮した配色は「ユニバーサルデザインカラー(UDC)」と呼ばれており、その基本原則は以下の通りである:

  1. 視認性の確保:すべての色覚タイプに対して見やすい配色を選ぶ

  2. コントラストの重要性:背景色と文字色のコントラストを高く保つ

  3. 情報の可視化:色だけでなく形やパターンでも情報を伝える

色覚シミュレーション用アプリ「Chromatic Vision Simulator」を使用して作成

上の色覚シミュレーションでも明らかな通り、青系の色はP型及びD型の色覚タイプでも見やすい色と言える。一方、赤と緑はともに茶色系の色味と区別がつきにくくなってしまう。

補色の利用は高いコントラストを生み出す効果があると先に述べたが、同じく反対色であっても緑×赤より青×オレンジの組み合わせを選ぶ理由はここにもある。

尚、③に関しては、Timewitchでは各スライドに最低1つのアイコンを含める方針をとっている。アイコンによる視覚化の重要性については、過去記事「スライドにアイコンを使う効果」を参照されたい。

まとめ

Timewitchのメインカラーである青は、人を惹きつける上、多様な色覚タイプの持ち主にとって識別しやすい色である。さらに、この色を基調としたスライド内でとりわけ重要な箇所に反対色・オレンジを用いることは、その部分を際立たせ、より印象に残りやすくする効果を見込める。

スライドの配色に迷ったときは、青×オレンジのコンビネーションを検討してみてはいかがだろうか。

この記事を作成したTimewitchについて

Timewitch(タイムウィッチ)は、スピードに特化した資料作成代行業者です。最速4時間、最遅24時間で納品します。
スピードの秘密は、世界中の海外在住日本人が資料を作成するシステムを構築していること。時差を利用し、依頼者が寝ている間に地球の裏側で資料を作成し、納品します。

納品が早いからといって、品質が低いわけではありません。Timewitchの資料デザイナーは全員、外資系コンサルティング会社出身者が監修した数十時間にもおよぶ資料作成研修を受講しています。そのため、短時間で見やすくわかりやすい資料を作ることができるのです。

しかも、費用はなんと最安で1枚あたり300円〜(AIを活用したプラン)。

Timewitchでは資料作成のご依頼を、24時間365日受付しています。
事前のお打ち合わせは不要で、専用フォームへの入力だけで依頼が完了するので、時間を有効活用したいビジネスパーソンにぴったりです。

「朝、出勤したらもう、昨日依頼したパワポ資料が納品されている」
そんなスピード重視の資料作成代行は、Timewitchにお任せください。