デザインする時に大事な要素としてフォント、レイアウト、写真などいろいろなことが検討項目になりますが、配色も大きなポイントです。
今日は自分の「想い」や「イメージ」を配色に展開するコツで私が良く使っている方法を「旗」の配色を例にご紹介します。
今回は自社製品の作成ですが、カフェ用のフラッグをデザインしてみました。Wifiが使えるゆったりした大人っぽい空間をイメージした配色にしたい。そこでアメリカ西海岸でとても人気の「Blue Bottle」をイメージしてみました。今は日本にもお店がありますね。
まずは思い描いているイメージに近い写真を探しました。
今回この２点をイメージとして使います。
この写真はブログ掲載の著作権あるので、契約しているShutterstockから使わせてもらっています。通常はGoogle画像検索等で十分です。画像はそのまま使うのではないから解像度などは気にしないでOKです。
イラストレーターを使用しているのであれば、この画像をデザイン画面に配置して、スポイトで色を選んでいきます。
比較的明るめのウッドのイメージ、ブルーラッテのイメージ、そして補色として黄色で元気さが表現できました。
次にスポイトを置く位置を変更して、もっとシックな配色をしてみます。
おとなしい色使いですが、たくさんの色が溢れている街中ならば、もしかしたらここまでシックなトーンに落とし込んだ色合いの方がお店の中の雰囲気を、伝えやすいかもしれません。
フラッグの場合視認性をより高めるよう、できれば３枚は配置するよう工夫してください。同じ色ばかり３枚でも良いのですが、雰囲気をあわせた上記のような配色であれば違う色を同時に置いても大丈夫です。
イラストレーターのスポイトで色を選んでいく場合、いずれにしても自分自身の「配色センス」は必須になりますが、実はもっと簡単に色をピックアップしてくれる無料ツールがAdobeで用意されています。
アドビ・カラーのカラーホイールというサイトです：
このリンクにいくとこんな画面が出てきます。ぱっと見ではナンノコッチャ？って感じなんですが、しかし実は相当なスグレモノなんです。
左上にある「画像から抽出」を選んで ドラッグ＆ドロップで先程の写真を投げ込みます。そうすると自動的に色を選んでくれます。
モードがいくつかあって、「カラフル」「ブライト」「ミュート」「ディープ」「ダーク」「なし」から選べます。下は「カラフル」を選んだときの推奨配色例です。
もしも推奨された色が気に入らなければ、自分でピックアップするポイントを動かすこともできます。下は右端のチョコレートブラウンをグレーに変更したものです。
次に「ディープ」のモードを選んでみました。
今度はより深めの色を選んでくれたようです。
気に入った配色がここで選べたらキャプチャなどで保存してデザインに用いてみてください。
気に入った配色は、他のツールにも使えるはずなので、ぜひ大事に保管して整理しておくのがオススメです。今回フラッグに使った配色を別の会社の「チラシ」に展開してみました。
今回ご紹介した方法だとオリジナルな配色を手軽に考えることができるので、私自身はとても気に入っています。画像検索の時にどれだけキーワードを入れ込むことができるかは大事なことですね。
イメージ自体が定まらない、お客様や上司から来ている曖昧な指示では画像検索もちょっとむずかしいかな...と感じたときには配色手帖が便利です。
300ページに渡る様々な配色例がcmyk値やrgb値と共に紹介されていますので、イメージ喚起などにも力強い味方です。配色手帖系はいろいろな本があって、私も５冊ぐらい持っていますが、この上の本はお気に入りの一冊です。
長文にお付き合いいただきましてありがとうございました。
コメント