こんにちは。Halcana（@halcana21）です。
今回はカラーコーディネーター検定スタンダードクラスの範囲から、コンプレックスカラー配色を取り上げます。また、リープマン効果にも触れています。
この記事のために作ったオリジナルバナーもつけて解説しているのでお楽しみに！
ちなみに、今回の記事はナチュラルハーモニー配色の解説記事の続きという位置付けなので、よかったらこちらも読んでみてください。（読んでいなくてもわかるようになっているのでご安心ください）
参考：『スピード合格！カラーコーディネーター【スタンダードクラス】テキスト＆問題集』
垣田玲子・著（2020） 株式会社ナツメ社
コンプレックスカラー配色とは？
本題に入る前に、前回のおさらいから始めましょう！
復習：ナチュラルハーモニー配色
ナチュラルハーモニー配色ってなんだったっけ？
黄色に近い色は明るく、青に近い色は暗くすることで自然界の色味に合わせた、なじみのよい配色のことだよ！
ナチュラルハーモニー配色は、自然界の色味に合わせた配色です。多くの人に受け入れられやすく、違和感のない雰囲気になります。
（もうちょっと詳しく知りたい…という方はこちらからチェック！）
コンプレックスカラー配色とは？
さて本題です。
コンプレックスカラー配色とは、ナチュラルハーモニーに逆らった配色のことを言います。
つまり、黄色に近い色は暗く、青に近い色は明るくする配色です。
自然界の色味に逆らっているので、見慣れない感じを与えたり、少し違和感を感じることが多いです。その分、印象に残りやすかったり、個性的な印象を与える配色と言えるでしょう。
コンプレックスカラー配色の実例
コンプレックスカラー配色でバナーを作ってみよう
実際に、サンプルバナーを見ながら考えていきましょう。
今度はセールの告知バナーを作ったから見てみて！
いいんじゃない？それぞれの要素も揃っているし、配色も悪くないと思うけど。
でも、もうちょっと印象的にしたいというか、ちょっと目を引く感じにしたいんだよね…
それなら、コンプレックスカラー配色にしてみたら？黄色に近い背景色を暗めに、（どちらかというと）青寄りの外枠やあしらいの色を明るめにするといいかも。
なるほど〜 修正してみるね！
完成！
確かに、こっちの方が印象に残るかも。
カラーのトーンを変更しただけですが、ガラッと雰囲気が変わりましたね。
並べて比較してみましょう。
左はしっくりくる感じがしますが、右の方が少し違和感を感じませんか？
PCCSの観点から解説すると、8:Yに近い6:yOを明度が低いソフト（sf）にし、比較的20:Vに近い2:Rを明度が高いライト（lt）にしました。
（カラーはWSJ21[GHP] – 良いホームページの作り方講座様の「PCCS表色系に基づいた【色一覧】」からピックしました。）
個性を出したいときはコンプレックスカラー配色を意識するといいかもしれません。
明度とリープマン効果
ところで今回のバナーですが、コンプレックスカラーの方はなんとなくストライプの外枠が見にくい気がしませんか？なぜでしょうか？
ポイントは明度にあります。
色相自体の明度を考えると、8:Yに近い6:yO（オレンジ）の方が明度が高く、20:Vに近い2:R（ピンク）の方が低いはずです。それをあえて逆の明度にしているので、コンプレックスカラー配色の左の方が2色の明度が近くなっていますね。
2色の明度が近くなると、輪郭がぼやけて見えるため、文字は読みにくくなります。この現象を、リープマン効果と言います。
それでも同明度の配色でバナーを作りたいんだけど、どうすればいいの？
そんなときは、セパレーションをすると見やすさが上がるよ！
左側バナーをもう一度見てみてください。「MAX」という字をよくみると、微妙に白で縁取りがしてあるのが見えるでしょうか。
このように、異なる明度の無彩色で縁取りをすることで、見やすさを上げることができます。
バナーを作るときは明度差にも注意して見やすさをコントロールしましょう！
おわりに
今回はコンプレックスカラー配色とリープマン効果を取り上げました。
配色の明度をコントロールすることで印象をガラッと変えて新鮮な印象を与えることができます。また、明度差が近いときはセパレーションをして見やすさを上げることも重要です。ちょっとしたテクニックですが、デザインのレベルアップを目指して意識してみましょう！
コンプレックスカラー配色とは逆の、自然界の色みに合わせた配色（ナチュラルハーモニー配色）に就いてはこちらの記事を参照してください！
ちなみに、PCCSに興味を持たれた方はこちらの記事に解説があるのでぜひ読んでみてください。
コメント