配色のデザイン

わひゃ。2ヶ月近く放置してた。ほったらかしてた言い訳はそれなりにあるけど、やめるつもりは無いのはかわらないよ。

今回は、最近覚えた配色の薀蓄から推測した見立て。

勤め先のコーポレートサイトのカラーチャートはこんな感じ。 デザインガイドラインからひっこぬいてきた。

メインカラーは深めの青です。これは会社のロゴの色からとってる。

これの補色は黄色ですけれども、これをアクセントカラーとするには、ニュートラルカラーである白に明度が近すぎて誘目性が低い。そこで明度をちょっと下げるために赤を混ぜた橙をアクセントカラーにした、と見た。

競合調査で見つけた三菱系の某サイトのベースカラーは黄緑でした。
これはアクセントカラーが真紅、三菱のロゴの色。それを引き立てるために補色の黄緑系をベースカラーにしたと見た。
そして、真紅と黄緑のチャートの間から、視認性が下がんないあたりの橙をセカンドアクセントカラー、サードアクセントに黄色を持ってきてるんだね。
うまくできてるぅ。

どちらも、会社のロゴの色を手がかりに、ニュートラルカラー(背景色)を白としたうえで、ほかの使用色を決めている。

一見しただけじゃ簡素なビジュアルでも、配色をしっかりおさえておくだけで、ずっと安定した仕上がりになると思うねぇ。ひらめきに頼らなくてもある程度まで理論でアタリを付けられるのだし、ちゃんと学んでおきたいところ。

ちなみにこの本を読んでそう思いました。配色について体系的にまとまっていて、導入部としておすすめです。»「Webプロフェッショナルのための黄金則-Web配色デザインのセオリー-Web-Designing-BOOKS」