イメージスケールを使った色彩戦略

デザインをやっていて特に難しいと感じるのが、色の決定です。色は、構成やレイアウト以上に心理的なイメージに作用するため、デザイナーとしては慎重に成らざるを得ません。しかし残念ながら、私自身は、色に関して天才的なセンスを持っているわけではありません。そこで、配色のためのツールや配色理論などを用いて色を決定していくのですが、特によく使うのは言語イメージスケール（©小林重順／日本カラーデザイン研究所）を使った配色の定義です。その一連のプロセスを、実際に関わった某学習塾サイトを例にご紹介します。

キーワードの抽出

配色の決定にあたり、まずは学習塾のパンフレットや広告、既存のWebサイトなどの情報を収集し、ブランドキーワードの抽出を行いました。結果として、以下のようなキーワード群を抽出しました。

安心、安全、堅実、真面目、確実、知的、本物、楽しい、明るい、健全、のびのび、元気な、豊か、丁寧、親切、誠実

ここでは、「塾」や「教育」といった単語ではなく、抽象的な心理イメージの抽出となります。Webサイトのリニューアルによって印象を変えたい場合には、現在の印象ではなく、今後与えたい印象も考慮して抽出していきます。ここでニッチなキーワードも含めて網羅的に抽出しすぎると方向性が定まらなくなるので、サイトとしてもっとも与えたいのはどういう印象かを念頭に置きながらキーワードを選定していきます。

言語イメージスケールへの落とし込み

さて、これらのキーワードをもとに言語イメージスケールに落とし込んだものが以下となります。赤い点線で囲まれた部分がさきほど抽出したブランドキーワードに近いキーワードが属するエリアです。

言語イメージスケールには、対になる配色イメージスケール（©小林重順／日本カラーデザイン研究所）が存在します。言語イメージスケール上でのポジションをもとに、配色イメージスケールで配色を確認しながら、最終的なカラースキームを決定していきます。（配色イメージスケール上での配色サンプルについては、『配色イメージワーク』などの書籍をご覧ください）

競合のポジショニングと前提条件の考慮

本プロジェクトの場合、競合になりうる企業がいくつか存在していました。そこで、それら競合企業のCIやサイトの配色も言語スケジュール上に配置して検討の対象としました（緑の丸で囲まれたA～H）。これは競合との印象の差別化を行うために重要なプロセスとなります。さらに学習塾のCIカラーである濃紺を変えることはできないため、濃紺と調和する配色というのも、配色決定の条件となっています。こうした条件を踏まえて、最終的には以下の4種類の配色を提案しました。

その後、クライアントのブランド担当者と協議し、最終的にはクリア系の配色に決定。この方向性をもとに、実際に入ってくる写真や素材のテイストに合わせて、トーンの調整や色の追加・削除などの微調整を行いながら、サイトに定着させていきました。

まとめ

色をこのように決定していくと、Webサイトの配色とブランド戦略をうまくマッチングさせることができます。また、完成された配色イメージスケールを用いるため、デザイナーの感覚的なセンスだけに頼ることなく、目的に見合った美しい配色を行うことができるようになります。さらにこのような論理武装を行っていると、クライアント企業内での社内調整やデザインの説明もスムーズに行うことができます。Webサイトの配色を考える際には、イメージスケールを活用し、感覚的ではなく、論理的に決定してみてはいかがでしょうか。