Yahoo!カテゴリ登録
管理者の日記：デザイン・配色
2011年12月24日 20:36Responsive Web Design
今はやりのレスポンシブWebデザインサイトについて。
Inspiration and Resources for Responsive Web Design | Artfans Design
http://www.artfans.info/inspiration-and-resources-for-responsive-web-design/Christmas Decoration Ideas
クリスマスのデコレーションです。赤と緑の色相、明度、彩度のずらし方がポイントです。
34 Beautiful Christmas Decoration Ideas - DesignSwan.com
34 Beautiful Christmas Decoration Ideas - DesignSwan.com
ウェブデザインの作り方、インターフェイスデザインの考え方。
ウェブデザインの作り方、インターフェイスデザインの考え方。
矢野りん著、MdNコーポレーションより、2300円。ちょっと高い？
補色でグラデーションを作成すると○○とかおもしろいことが書いてあります。サイトのメニューの数なども大幅に修正する予定です。ひじょーに参考になります。
20 Beautifully Created Charts and Graphs
このサイトも大変参考になります。ホームページへ画像としてグラフなどを挿入する際に、Excelでのグラフをそのまま貼り付けるよりは、はるかにデザイン的にすぐれた画像となります。もちろん、配色はサイトとの調和を図る必要があります。
20 Beautifully Created Charts and Graphs
http://mystrious.com/20-beautifully-created-charts-and-graphs/
Twitter's Lazyweb [infographic]
この配色はよく見かけます。
再生紙のような背景の色が絶妙です。
Twitter's Lazyweb [infographic]
インテリアデザイン
木目とコンクリートの対比ですが、直線と曲線の対比にも注目しましょう！
Beautiful and Elegant Rounded Loft Design in Prague - DesignSwan.com
鮮やかな配色
同じ配色で様々なバリエーションのデザインが紹介されています。
このようなサイトをたくさん見ることで、プロと素人のデザインの違いがわかるようになります。
ポスターデザイン
かっこいいと思ったポスターについて、なぜそう思ったのか具体的に書き出してみましょう。
30 Cool Concert Poster Designs for Print Inspiration
名刺のデザイン
Cool Business Card Designs: 70+ Samples that Work
名刺のデザインです。日本の会社ではまず使えないと思いますが、デザインサンプルとしてはすばらしいものばかりです。
ネガティブスペースの利用
ネガティブスペースを使う方法です。
Clever and Creative Logo Designs in Using Negative Space | Artfans Design
すごい、の一言。
パッケージデザイン
35 Fresh Packaging Design Examples For Inspiration
見事です。すごいです。
ロゴデザイン
非常に美しいロゴデザイン、参考になります。
35 Excellent Logos With Gradient Effect
デザイナー
webデザイナー - デザイン会社に勤めるwebデザイナーの記録
デザイナーを目指すのであれば、ウェブ希望の方でなくても、大変参考になります。色彩のみではだめだということがわかると思います。色彩検定に合格後は総合的なスキルを要求されます。
Gradientのサイトです
非常に美しいグラジエントの特集です。
5000+ Free Photoshop Gradients | CreativeFan
Mulher : Lovely Package®
色使いが絶妙としか言いようがありません。すごい。
Mulher : Lovely Package® . Curating the very best packaging design.
Color Hunter
写真から色をピックアップして、デザインに利用するテクニックは知っておくべきですが、このツールを使うと簡単に色をピックアップできます。
デザインのすぐれたサイト
webデザインレシピ：（Yなどで検索お願いします）
プロのデザイナーの方のページです。twitterも利用されているので、Web関連に限定されますが、さまざまな情報が入ります。
色彩を勉強する上で参考になるサイト-5
よくよく考えると、リンク設定をしなければ、URLを掲載しても問題なさそうです。
josephjoseph、英語のページです。
色彩検定合格後は、このような実践的な配色の勉強が楽しくできます。
可能なら、他人に説明できるような勉強方法がベストです。
色彩を勉強する上で参考になるサイト-4
雑貨ばかりでもうしわけありませんが、
カラフルです。同じ製品でもこれだけのバリエーションを加えると鮮やかです。
もちろん、使用している色はプロの集団が徹底的に詰めて選んでいます。
トレンドや対象とする年齢層、販売する場所など、マーケティング戦略も重要です。
まずは色だけでもご覧ください。
色彩を勉強する上で参考になるサイト-3
色彩を勉強する上で参考になるサイト−２
ひきつづき、ステーショナリーと雑貨のRYURYU、雑貨屋さんです。
いつも利用しています。宣伝ではありません。。。
ProductsやRYU-RYU Marketをご覧下さい。
色彩を勉強する上で参考になるサイト−１
デザインのネタ
最近ですが、仕事でパンフレットを作成することになりました。
某デザイン事務所さんに依頼して、打ち合わせなどを行い、4000部ほど印刷していただきました。
気づいたのは、素材辞典をうまく利用していることです。話をしていて気づいたのですが、まずデザイン、色、ではなく、コンセプトが先です。
どのような目的でパンフレットを使用するのか、誰に配布するのかなどを真っ先に聞かれて、なるほどと思ってしまいました。いつもは作成するばかりで、まず、かっこよくとか、ブルーのイメージなど、見た目が先行しますが、それではダメだと気づきました。
当たり前ですが、そのようにコンセプトを十分に詰めてデザインし、意図を説明しても、今ひとつだな、の一言で却下されてしまいます。
難しい世界です。
配色のコツ
なんとなく気に入ったものを買いそろえていたら、いつのまにかブルーとオレンジのセットになってしまいました。
自分の欲求を満たすモノ、つまり、あ、これは良いな！と思うモノには法則があるようです。結果、何も考えなくても配色が揃ってしまったようです。
あとは、より法則の近いものを近くに置いてまとめるなどすれば、それだけで結構きれいな部屋になります。
考えすぎないことも重要かもしれませんね。
ロゴデザイン
もう一冊買いました。
Photoshop プロフェッショナル ロゴデザイン、MdN、2800円
テキスト、アイコン、テクスチャー、ロゴなどの詳しい解説があります。
ちょっと難易度が高いのですが。。。
フォトショップとイラストレター
フォトショップとイラストレターをお使いですか？
昨日、Photoshop & Illustrator 素材×簡単作成、SoftBank Creative、2200円
を購入しました。
写真の加工、イラスト、バナー、素材など詳しく紹介しています。
色だけでなく、素材感も重要な要素です。勉強しておく必要があります。
おすすめの一冊
ホームページのデザインをされる方に、以下の書籍をお薦めします。
Web配色デザインのセオリー、毎日コミュニケーションズ、2200円
大変参考になります。ホームページに限定せず、一般的な配色を学ぶことができます。
もちろん、ホームページはほぼ無料でいくらでも閲覧できますので、上記の書籍とあわせて勉強するとかなりおもしろいですよ。
教材
eラーニング関連の仕事に最近とりかかっています。
パソコンで勉強するシステムですが、教材の色がどうしても気になります。
プロがつくったものは、かなり高価ですが、やはりきれいで見栄えがよいのですぐわかります。一方、素人の方（失礼！）のものは、どうしても地味ですね。
大切なのは内容かもしれませんが、鮮やかな教材というのは、それだけでも十分魅力があります。今は教材を利用するだけですが、将来的に作成する側になるかもしれません。利用する側だけとしてだけでなく、視点を変えて作る側からも眺めると勉強になります。
フォントが失敗！
以前、依頼されたパンフができました。
ブログで書いた2番目のものです。
できあがりを見て、フォントの失敗に気づいてショック！
いわゆるマイクロソフトワードなんかに付属のフォントは、
デザイン的にはあまりよくありません。
ワープロでは問題ないのですが、デザインものでは見た目が貧相になりがちです。
（絶対ダメとは言わないが、プロは使いません）
明朝系は小塚なんかを使いましたが、ゴシック系の文章のフォントが
ノーチェックでした。失敗！
依頼者は、別にそんなことは気付きもしないし、満足されていますが、
個人的には残念です。
お金をもらってやってる仕事ではないので、気にしなかったのですが、
いただいた原稿の配色しかチェックしていませんでした。
うーん、ちょっと焦りました。
ブログで書いた2番目のものです。
できあがりを見て、フォントの失敗に気づいてショック！
いわゆるマイクロソフトワードなんかに付属のフォントは、
デザイン的にはあまりよくありません。
ワープロでは問題ないのですが、デザインものでは見た目が貧相になりがちです。
（絶対ダメとは言わないが、プロは使いません）
明朝系は小塚なんかを使いましたが、ゴシック系の文章のフォントが
ノーチェックでした。失敗！
依頼者は、別にそんなことは気付きもしないし、満足されていますが、
個人的には残念です。
お金をもらってやってる仕事ではないので、気にしなかったのですが、
いただいた原稿の配色しかチェックしていませんでした。
うーん、ちょっと焦りました。
携帯のカタログ
携帯の調子が悪いので、auショップに行きました。
カタログに新機種がたくさん載っています。
しかし、さすがに力を入れて売ってるだけあって、
カタログのデザインも気合いが入っています。
こういうカタログなどは、無料の教科書です。
プロの中でもトップの方が作っているので、ほぼ完璧です。
機種を眺めるのではなくて、配色を眺めてみましょう。
ドミナントカラーの場合は、面積比なんかをよく見ましょう。
カタログばかり集めていると嫌われそうですが、
各社のものを比較すると勉強になりますよ。
ちなみに、スクラップしておくと、何かをデザインするときに、
大変参考になります。
カタログに新機種がたくさん載っています。
しかし、さすがに力を入れて売ってるだけあって、
カタログのデザインも気合いが入っています。
こういうカタログなどは、無料の教科書です。
プロの中でもトップの方が作っているので、ほぼ完璧です。
機種を眺めるのではなくて、配色を眺めてみましょう。
ドミナントカラーの場合は、面積比なんかをよく見ましょう。
カタログばかり集めていると嫌われそうですが、
各社のものを比較すると勉強になりますよ。
ちなみに、スクラップしておくと、何かをデザインするときに、
大変参考になります。
素材
配色をする場合、ホームページなどの液晶画面と
紙などの媒体では仕上がり結果がかなり異なります。
もっとも違うのは、素材による影響です。
紙でも、表面に光沢があったり、つや消しだったりと様々です。
そこまで考慮して配色する必要があります。
ところで、http://www.at-print.net/ におもしろい名刺があります。
紙ではなく、化繊フィルムで透明感があります。
こういう場合にどのようなデザインがよいのか、上記ページをご覧ください。
勉強になりますよ。
紙などの媒体では仕上がり結果がかなり異なります。
もっとも違うのは、素材による影響です。
紙でも、表面に光沢があったり、つや消しだったりと様々です。
そこまで考慮して配色する必要があります。
ところで、http://www.at-print.net/ におもしろい名刺があります。
紙ではなく、化繊フィルムで透明感があります。
こういう場合にどのようなデザインがよいのか、上記ページをご覧ください。
勉強になりますよ。
微妙な配色でも
前回の記事に書いたように、次のパンフレットの依頼がきました。
すでに原稿はpublisherで作成しているので、イラストレターで
もうちょっとどうにか、という話でした。
明るいイメージで、と言われましたが、原稿も微妙です。
でも、まあ、依頼されたように配色して、、、、
なんだか、かなり微妙なできあがりです。
個人的には、かなり今ひとつです。。。
でも、依頼者は、良い感じになった！
と喜んでいただけました。
まあ、そんなもんです。理論的に完璧でも、依頼者にダメと言われれば終わり。
自由なクリエイターではないので、お客さんの望みが一番です。
難しい世界です。
すでに原稿はpublisherで作成しているので、イラストレターで
もうちょっとどうにか、という話でした。
明るいイメージで、と言われましたが、原稿も微妙です。
でも、まあ、依頼されたように配色して、、、、
なんだか、かなり微妙なできあがりです。
個人的には、かなり今ひとつです。。。
でも、依頼者は、良い感じになった！
と喜んでいただけました。
まあ、そんなもんです。理論的に完璧でも、依頼者にダメと言われれば終わり。
自由なクリエイターではないので、お客さんの望みが一番です。
難しい世界です。
次の依頼
2/18日の記事に、ヘルスプロモーションセンターのパンフができたことを書きました。
入稿まで済ませましたが、さらに次の依頼が来ました。
別のパンフもつくってほしい・・・しかも今週中に。
え、そんな無理です、とは言えません。。。
話をすると、もうほとんど原稿はできていましたが、
イメージと違うのでどうにかしてくれとのこと。
強いイメージで、はっきりしたものがよいそうです。
ならば、明快な写真を背景に入れて、とか考えています。
大変ですが、勉強にはなります。
入稿まで済ませましたが、さらに次の依頼が来ました。
別のパンフもつくってほしい・・・しかも今週中に。
え、そんな無理です、とは言えません。。。
話をすると、もうほとんど原稿はできていましたが、
イメージと違うのでどうにかしてくれとのこと。
強いイメージで、はっきりしたものがよいそうです。
ならば、明快な写真を背景に入れて、とか考えています。
大変ですが、勉強にはなります。
こだわり-4
たまたま撮った写真です。
ジャケットの黄色と雑誌の黄色の色相が一致していました。
イスの青との補色配色です。
なかなかでした。
なかなかでした。
こだわり-3
グリーン系を集めてみました。
グリーンとホワイトの配色ですが、
ビンの濃いグリーンと、ラベルの赤が補色です。
赤はアクセントカラーです。
ビンの濃いグリーンと、ラベルの赤が補色です。
赤はアクセントカラーです。
こだわり-2
さらに、こだわりのパート2です。
やわらかいトーンのブルーとグリーン。
白の家具と合っていて、これもお気に入りの一つです。
白の家具と合っていて、これもお気に入りの一つです。
研究室のこだわり-1
テーブルの上の容器です。
ミスドのカップ以外は100均です。
合計300円也。
合計300円也。
ヨーロッパの街並み
テレビで情熱大陸を見ていました。
ヨーロッパの街はなぜあんなに独特の雰囲気があるのでしょうか。
建物がきれいですよね。すべての色彩や質感が統一されてますし、
美しい、の一言です。
日本の田舎もそういえば、同じ雰囲気の家が多いですね。
うちの田舎もそうです。
今の日本が悪いわけではないのですが、やっぱりあこがれますよね。
ヨーロッパの街はなぜあんなに独特の雰囲気があるのでしょうか。
建物がきれいですよね。すべての色彩や質感が統一されてますし、
美しい、の一言です。
日本の田舎もそういえば、同じ雰囲気の家が多いですね。
うちの田舎もそうです。
今の日本が悪いわけではないのですが、やっぱりあこがれますよね。
パンフレットできました。
今日は一日パンフレットの作成でした。
イラストレーターで作成です。
イラストレーターで作成です。
これは、表だけですが、三つ折りにしてしまうので、表紙と裏表紙も入っています。
色彩検定に受かっているだけでこんな感じの仕事がどんどんやってきます。
勉強になるので悪くないですよ。
色彩検定に受かっているだけでこんな感じの仕事がどんどんやってきます。
勉強になるので悪くないですよ。
クレジットカードのチラシ
クレジットカードを使っていると、毎月請求書といっしょに冊子がついてきませんか。
携帯電話の場合も同じですが、これが役に立つんです！
めくってみると、温泉の紹介や飲食店などが掲載されていますが、
写真の配置や見出し、小見出しの位置、色、フォントなど大変参考になります。
無料の教科書です。
これらも是非、詳細に研究してください。
色彩検定に合格しても、すぐにはできないと思いますが、
気に入ったデザインはスクラップするなどして、
勉強することが重要です。
携帯電話の場合も同じですが、これが役に立つんです！
めくってみると、温泉の紹介や飲食店などが掲載されていますが、
写真の配置や見出し、小見出しの位置、色、フォントなど大変参考になります。
無料の教科書です。
これらも是非、詳細に研究してください。
色彩検定に合格しても、すぐにはできないと思いますが、
気に入ったデザインはスクラップするなどして、
勉強することが重要です。
もうひとつの方法
前回、配色の方法について書きましたが、
別の方法もありますので紹介します。
簡単な方法で、多くの色を使いたい場合に有効ですが、
トーンを合わせる、という単純な方法です。
トーンとは、色味ともいわれますが、
明度と彩度が同じ色です。
もう少しわかりやすく説明しますと、
真っ赤、真っ青などの原色を基本として、
これに白、または黒を少しずつ加えていくと
明度や彩度が変化します。
この加える白、黒の色を同じにすることです。
全く同じである必要はありません。
身の回りで、４色くらいの配色はありませんか？
リモコンのボタンでもよいのですが、
使われている色は、ほぼ同じトーンになっています。
このトーンをあえて変える場合もありますが、
まずは、トーンを揃える方法を試してみて下さい。
これも、色彩検定のテキストに掲載されています。
別の方法もありますので紹介します。
簡単な方法で、多くの色を使いたい場合に有効ですが、
トーンを合わせる、という単純な方法です。
トーンとは、色味ともいわれますが、
明度と彩度が同じ色です。
もう少しわかりやすく説明しますと、
真っ赤、真っ青などの原色を基本として、
これに白、または黒を少しずつ加えていくと
明度や彩度が変化します。
この加える白、黒の色を同じにすることです。
全く同じである必要はありません。
身の回りで、４色くらいの配色はありませんか？
リモコンのボタンでもよいのですが、
使われている色は、ほぼ同じトーンになっています。
このトーンをあえて変える場合もありますが、
まずは、トーンを揃える方法を試してみて下さい。
これも、色彩検定のテキストに掲載されています。
色彩がわからない？
色をどのように使えばよいのか、よく聞かれます。
考えすぎずに、濃い青色、普通の青色、薄い水色、という感じで、
同一色相で責めると簡単ですよ。
ただし、濃い色は小面積で、薄い色は広い面積で。
明度か彩度のグラデーションですが、簡単です。
さらに付け加えるなら、類似した色、緑をちょっと、
あるいは、反対色の黄色をちょっと。などなど。
そこらあたりが難しいときは、白、黒、グレーなどの無彩色を使えば、
何色とでもあうので無難にまとまります。
あまり深く考えず、配色してみて、自分でOKなら、それでOKです。
よくない配色であれば、一般的には、なんとなく違和感を感じるものです。
トライ＆エラーで配色を楽しんでみてください。
あ、色彩検定の教科書にも詳しく書いてありますので。
試験を受けない方も参考になるかと思います。
考えすぎずに、濃い青色、普通の青色、薄い水色、という感じで、
同一色相で責めると簡単ですよ。
ただし、濃い色は小面積で、薄い色は広い面積で。
明度か彩度のグラデーションですが、簡単です。
さらに付け加えるなら、類似した色、緑をちょっと、
あるいは、反対色の黄色をちょっと。などなど。
そこらあたりが難しいときは、白、黒、グレーなどの無彩色を使えば、
何色とでもあうので無難にまとまります。
あまり深く考えず、配色してみて、自分でOKなら、それでOKです。
よくない配色であれば、一般的には、なんとなく違和感を感じるものです。
トライ＆エラーで配色を楽しんでみてください。
あ、色彩検定の教科書にも詳しく書いてありますので。
試験を受けない方も参考になるかと思います。
歌番組の背景
今日は、12/23ですが、Xmas関連のTV番組がたくさんあります。
その中で、歌番組をやっていましたが、この背景はもちろん、
歌っている人の衣装まで総合して観察すると勉強になります。
例えば、歌っている人の服、ピアス、髪の色、さらには、メイクの色まで、
すべて計算済みです。それを説明できますか？
これも無料の教科書なので是非活用してください。
色彩検定の教科書の配色のところを参考にしましょう。
その中で、歌番組をやっていましたが、この背景はもちろん、
歌っている人の衣装まで総合して観察すると勉強になります。
例えば、歌っている人の服、ピアス、髪の色、さらには、メイクの色まで、
すべて計算済みです。それを説明できますか？
これも無料の教科書なので是非活用してください。
色彩検定の教科書の配色のところを参考にしましょう。
フランスの国旗
赤と青だけのシンプルな配色ですが、様々な場所で使われています。
ちょっと、まわりを見てください。どこにでもある配色です。
ただし、青をちょっと濃くしたり、色相をずらしたり、
赤も同様に色相をずらしたりして工夫してあるはずです。
つまり、何かの配色をする場合には、このように既存の配色を利用し、
必要な色相やトーンにしてやれば、自分の配色として利用できるわけです。
そのまままねすると、それは単なるまねでしかありませんが、
必要に応じて色を変えてしまえば、それはあなたのオリジナルになります。
その材料は身近にあります。色彩のコレクションをつくっておくと役に立つでしょう。
ちょっと、まわりを見てください。どこにでもある配色です。
ただし、青をちょっと濃くしたり、色相をずらしたり、
赤も同様に色相をずらしたりして工夫してあるはずです。
つまり、何かの配色をする場合には、このように既存の配色を利用し、
必要な色相やトーンにしてやれば、自分の配色として利用できるわけです。
そのまままねすると、それは単なるまねでしかありませんが、
必要に応じて色を変えてしまえば、それはあなたのオリジナルになります。
その材料は身近にあります。色彩のコレクションをつくっておくと役に立つでしょう。
雑誌の裏表紙
雑誌の広告は極めて有用な配色の教科書です。
写真をもとにメインの色を決定し、その色を抽出、
本文の見出しや小見出しに使用しています。
その色と反対色を背景に持ってきたり、
あるいは、グラデーションになるように配色されたりしています。
オススメは、ザ・テレビジョン、女性ファッション誌などです。
是非、色彩について解析してみてください。
写真をもとにメインの色を決定し、その色を抽出、
本文の見出しや小見出しに使用しています。
その色と反対色を背景に持ってきたり、
あるいは、グラデーションになるように配色されたりしています。
オススメは、ザ・テレビジョン、女性ファッション誌などです。
是非、色彩について解析してみてください。
飲料のラベル
デザインに興味のある方は、ビール、チューハイ、缶コーヒーなどの色彩を研究しましょう。
プロがデザインした無料の教科書です。かなり参考になります。
まず、ビールなどは色数が限定されています。少ない色で、強いイメージです。
黒、シルバー、ゴールドを中心として、もう一色、青、緑などが使われています。
コーヒーはもちろん、茶色、黒がメインですが、そこに、どのような色が
アクセントカラーとして使われているか、など研究しましょう。
是非やってみてください。
プロがデザインした無料の教科書です。かなり参考になります。
まず、ビールなどは色数が限定されています。少ない色で、強いイメージです。
黒、シルバー、ゴールドを中心として、もう一色、青、緑などが使われています。
コーヒーはもちろん、茶色、黒がメインですが、そこに、どのような色が
アクセントカラーとして使われているか、など研究しましょう。
是非やってみてください。
色彩検定に合格された方へ
以下のホームページにある画像について考察してみましょう！
注意！ サウンドが突然流れる可能性があります、ボリュームに注意してください。
→ http://www.724-christmas.com/index.html
この図は、7月24日通りのクリスマス、のオフィシャルページの表紙です。
これをご覧になって、クリスマスの配色とはなんぞや、と考えてみてください！
・・・・（考察中）
..........................................................以下、解説です。
■解説
今回は時期はちょっと早いのですが、クリスマスです。
では、さっそく、私なりの解釈を述べてみたいと思います。
1.中心となるカラーは赤と緑、サンタクロースもこの色をしていますよ。
典型的な補色対比配色ですね。
2.赤と緑はビビッドではなく、ちょっとシェード気味です。
重厚な感覚です。明るくポップな感じとはちょっと違いますね。
3.さて、もう一つ、重要なのは、金色！です。
背景の窓から見える景色、タイトルロゴ、左下のロゴ、
そして、MENU、WHAT'S NEWなどの文字、
さらには、右の女性のスカートの柄が同じ金色のストライプです。
全く同じ色をくり返し用いています。
クリスマスプレゼントは、この金色のリボンで結ばれているはずです。
参考までに、バレンタインやホワイトデーのプレゼントに、
この配色はありません。季節はずれだと思われます。
コンビニに行けばわかりますよ、必ずそれらしい配色のプレゼントがあります。
この季節になると、ずらっと！
4.左上のレリーフですが、これもクリスマスプレゼントのリボンの模様に使われます。
金色の鈴がついていたりしますね。
このレリーフと、7月24日通りという文字の右上にある街灯の繊細なイメージ、
ヨーロッパ調ですが、くり返し効果です。
5.なお、ホワイトクリスマスのイメージを強調する場合は、白が使われます。
6.右下のおじさんの服も、背景の配色と全く同じです。
白の枠をつけてアクセントをつけています。
7.もう一つ重要なのが、右の女性の深い青色の服。
上下、ストッキングまで完全に統一されていますね。
まず、トーンが背景の2色に合わせてあることが重要です。
この色もプレゼントのリボンに使われます。
上着の白の模様、スカートの金色のストライプも計算済みです。
8.左の男性の服は、茶色で統一、クリスマスツリーの木の色です。
靴や時計！までしっかり揃えてありますよね。
靴の茶色はあえてトーンを変えてアクセントをつけ、退屈にならないようにしています。
さらに、女性の髪の色、眼鏡のいろとも同じ茶色です。もちろん計算済み。
ただし、シャツは女性の服と同じ青色、くり返し効果です。
靴も女性と同じ色、こうやって二人の統一感を出しています。
色以外では・・・
人物は中心から両側に広げて、
右の女性には右から、左の男性には左からライトが当たっています。
構図は中心から、右、左、右前、左前、（二つの大きな矢印の方向）へ、
広がりを計算しています。
体はお互いに反対向きをしていますが、男性の笑顔、女性のすました顔、
そして、右手で服を掴んでいる部分など、撮影者の意図が見えます。
姿勢も、男性はリラックス、女性は背筋が伸びていますね。
基本的に左右対称ですが、人物の表情を対照的にしたり、
矢印を交差させたりして、リズム感を出しています。
----ここまで。
いかがでしょうか。
まもなくクリスマスなので、前述のコンビニなどに、
この手の配色が出回ります。
なお、関係ないときにこの色にすると、間違いなく違和感を覚えます。
ちょっと見ただけで、普通の人の頭の中では、
クリスマスが自然にイメージされるわけです。
今回は、ここまでです。
注意！ サウンドが突然流れる可能性があります、ボリュームに注意してください。
→ http://www.724-christmas.com/index.html
この図は、7月24日通りのクリスマス、のオフィシャルページの表紙です。
これをご覧になって、クリスマスの配色とはなんぞや、と考えてみてください！
・・・・（考察中）
..........................................................以下、解説です。
■解説
今回は時期はちょっと早いのですが、クリスマスです。
では、さっそく、私なりの解釈を述べてみたいと思います。
1.中心となるカラーは赤と緑、サンタクロースもこの色をしていますよ。
典型的な補色対比配色ですね。
2.赤と緑はビビッドではなく、ちょっとシェード気味です。
重厚な感覚です。明るくポップな感じとはちょっと違いますね。
3.さて、もう一つ、重要なのは、金色！です。
背景の窓から見える景色、タイトルロゴ、左下のロゴ、
そして、MENU、WHAT'S NEWなどの文字、
さらには、右の女性のスカートの柄が同じ金色のストライプです。
全く同じ色をくり返し用いています。
クリスマスプレゼントは、この金色のリボンで結ばれているはずです。
参考までに、バレンタインやホワイトデーのプレゼントに、
この配色はありません。季節はずれだと思われます。
コンビニに行けばわかりますよ、必ずそれらしい配色のプレゼントがあります。
この季節になると、ずらっと！
4.左上のレリーフですが、これもクリスマスプレゼントのリボンの模様に使われます。
金色の鈴がついていたりしますね。
このレリーフと、7月24日通りという文字の右上にある街灯の繊細なイメージ、
ヨーロッパ調ですが、くり返し効果です。
5.なお、ホワイトクリスマスのイメージを強調する場合は、白が使われます。
6.右下のおじさんの服も、背景の配色と全く同じです。
白の枠をつけてアクセントをつけています。
7.もう一つ重要なのが、右の女性の深い青色の服。
上下、ストッキングまで完全に統一されていますね。
まず、トーンが背景の2色に合わせてあることが重要です。
この色もプレゼントのリボンに使われます。
上着の白の模様、スカートの金色のストライプも計算済みです。
8.左の男性の服は、茶色で統一、クリスマスツリーの木の色です。
靴や時計！までしっかり揃えてありますよね。
靴の茶色はあえてトーンを変えてアクセントをつけ、退屈にならないようにしています。
さらに、女性の髪の色、眼鏡のいろとも同じ茶色です。もちろん計算済み。
ただし、シャツは女性の服と同じ青色、くり返し効果です。
靴も女性と同じ色、こうやって二人の統一感を出しています。
色以外では・・・
人物は中心から両側に広げて、
右の女性には右から、左の男性には左からライトが当たっています。
構図は中心から、右、左、右前、左前、（二つの大きな矢印の方向）へ、
広がりを計算しています。
体はお互いに反対向きをしていますが、男性の笑顔、女性のすました顔、
そして、右手で服を掴んでいる部分など、撮影者の意図が見えます。
姿勢も、男性はリラックス、女性は背筋が伸びていますね。
基本的に左右対称ですが、人物の表情を対照的にしたり、
矢印を交差させたりして、リズム感を出しています。
----ここまで。
いかがでしょうか。
まもなくクリスマスなので、前述のコンビニなどに、
この手の配色が出回ります。
なお、関係ないときにこの色にすると、間違いなく違和感を覚えます。
ちょっと見ただけで、普通の人の頭の中では、
クリスマスが自然にイメージされるわけです。
今回は、ここまでです。
色の解釈
配色について解釈することは重要です。
プロが作成した作品について徹底的に分析してみましょう。
→ http://www.cinemacafe.net/news/cgi/release/2006/07/280/
この図は、安野モヨコ原作『さくらん』のプロモ写真です。
※ 実際には、画像を取得したり、貼り付けたいのですが、
著作権の問題があり、遠慮しました。
ただ、こうすると、そのうちリンク切れになってしまうんですね。。。
それでは、この図の配色について、あなたなりに考察してみてください！
・・・・（考察中）
..........................................................以下、解説です。
■解説
では、さっそく、私なりの解釈を述べてみたいと思います。
1.中心となるカラーは当然、オレンジ。
そのオレンジとグリーンの補色対比配色である。
2.グリーンは、小面積で、アクセントカラーであり、
着物と首とを明確に区切るセパレーション効果の役割もある。
全体が引き締まる。
3.オレンジもアクセントカラーで、着物、そで、パイプ、髪飾り、口紅とくり返し、
レピテーションでアクセントをつけている。
背中のところの着物がめくれてオレンジの模様がみえているが、
これも計算済み。
4.肩の金色の模様は、背景の龍の金色と同じ。
これもレピテーション効果。
5.龍のグリーンよりも、着物の肩のグリーンのほうが、
彩度も明度も高い。
あえて同じトーンにしなかったのは、オレンジのトーンに合わせたため。
また、龍のグリーンは古典的な雰囲気を、
着物のグリーンは現代的な雰囲気をつくり、
意図的に対比させている。
6.髪飾りの黄色も金色とのレピテーションであるが、
これを金色にすると少々不自然、黄色にした。
7.肩のグリーンは背中のところで影がついている。
後からあえて照明をあてず、影にして肩の丸みなどを強調し、
女性らしさを強調している。
色以外では・・・
人物を中心ではなく、左に配置、右手を伸ばし、
さらにパイプを右向きに構えて、強く右向きの方向を意識させている。
右側に広がっていくイメージ、右側を指し示すイメージ。
これに垂直に垂れた髪飾り（オレンジ）は、
上から下への強いイメージを示し、
結果的に、左上から真下に下がり、
自然に右方向への動線を作っている。
写真では背景をすこしぼかし、奥行きを感じさせている。
さらに、人物の視線はこちらから右方向、
しかも首の動きは振り返って見ていることで、
手前右方向への動線も作っている。
よって、右、右手前に広がっている空間を表現。
人物にも動きがあり、ダイナミックな構図である。
視線もやや上目遣いであり、
気がついて、たった今振り返ったばかりのようなイメージ。
リラックスではなく、緊張したイメージ、
人物の性格、職業を表現している。
前を向いていないのも、他人に心を開いてはいない、
やや影のある性格などを表現。
垂直に垂れた髪飾りと顔の向きが少しずれていて、動きを感じさせる。
----ここまで。
いかがでしょうか。
オレンジもグリーンも強い色なので、
全体に占める面積比は小さくなっています。
逆にそのほうが、目立つわけで、典型的なアクセントカラーのテクニックです。
そういえば、背景にもスポットでライトを当てて、
華やかさを出しているのがわかりますか。
なお、気に入った配色は、保存しておきましょう。
例えば、ネットならすぐ落とせますし、
イラストレターやフォトショップで開けば、
スポイトツールで色をピックアップすることができます。
このような、配色コレクションの作成をオススメします。
今回は、ここまでです。
※ なお、配色等は個人によって解釈が異なります。
私の解釈が絶対であり、それが全てではありません。
各個人で独創的な解釈をしていただければ、
あるいは、それができるようになり、
自分の配色に取り入れることができるようになれば、
それがベストです。
私の解釈と異なっている場合は、そちらを優先してください。
あくまで、あなた自身のステップアップのための練習である！
と認識していただければと思います。
プロが作成した作品について徹底的に分析してみましょう。
→ http://www.cinemacafe.net/news/cgi/release/2006/07/280/
この図は、安野モヨコ原作『さくらん』のプロモ写真です。
※ 実際には、画像を取得したり、貼り付けたいのですが、
著作権の問題があり、遠慮しました。
ただ、こうすると、そのうちリンク切れになってしまうんですね。。。
それでは、この図の配色について、あなたなりに考察してみてください！
・・・・（考察中）
..........................................................以下、解説です。
■解説
では、さっそく、私なりの解釈を述べてみたいと思います。
1.中心となるカラーは当然、オレンジ。
そのオレンジとグリーンの補色対比配色である。
2.グリーンは、小面積で、アクセントカラーであり、
着物と首とを明確に区切るセパレーション効果の役割もある。
全体が引き締まる。
3.オレンジもアクセントカラーで、着物、そで、パイプ、髪飾り、口紅とくり返し、
レピテーションでアクセントをつけている。
背中のところの着物がめくれてオレンジの模様がみえているが、
これも計算済み。
4.肩の金色の模様は、背景の龍の金色と同じ。
これもレピテーション効果。
5.龍のグリーンよりも、着物の肩のグリーンのほうが、
彩度も明度も高い。
あえて同じトーンにしなかったのは、オレンジのトーンに合わせたため。
また、龍のグリーンは古典的な雰囲気を、
着物のグリーンは現代的な雰囲気をつくり、
意図的に対比させている。
6.髪飾りの黄色も金色とのレピテーションであるが、
これを金色にすると少々不自然、黄色にした。
7.肩のグリーンは背中のところで影がついている。
後からあえて照明をあてず、影にして肩の丸みなどを強調し、
女性らしさを強調している。
色以外では・・・
人物を中心ではなく、左に配置、右手を伸ばし、
さらにパイプを右向きに構えて、強く右向きの方向を意識させている。
右側に広がっていくイメージ、右側を指し示すイメージ。
これに垂直に垂れた髪飾り（オレンジ）は、
上から下への強いイメージを示し、
結果的に、左上から真下に下がり、
自然に右方向への動線を作っている。
写真では背景をすこしぼかし、奥行きを感じさせている。
さらに、人物の視線はこちらから右方向、
しかも首の動きは振り返って見ていることで、
手前右方向への動線も作っている。
よって、右、右手前に広がっている空間を表現。
人物にも動きがあり、ダイナミックな構図である。
視線もやや上目遣いであり、
気がついて、たった今振り返ったばかりのようなイメージ。
リラックスではなく、緊張したイメージ、
人物の性格、職業を表現している。
前を向いていないのも、他人に心を開いてはいない、
やや影のある性格などを表現。
垂直に垂れた髪飾りと顔の向きが少しずれていて、動きを感じさせる。
----ここまで。
いかがでしょうか。
オレンジもグリーンも強い色なので、
全体に占める面積比は小さくなっています。
逆にそのほうが、目立つわけで、典型的なアクセントカラーのテクニックです。
そういえば、背景にもスポットでライトを当てて、
華やかさを出しているのがわかりますか。
なお、気に入った配色は、保存しておきましょう。
例えば、ネットならすぐ落とせますし、
イラストレターやフォトショップで開けば、
スポイトツールで色をピックアップすることができます。
このような、配色コレクションの作成をオススメします。
今回は、ここまでです。
※ なお、配色等は個人によって解釈が異なります。
私の解釈が絶対であり、それが全てではありません。
各個人で独創的な解釈をしていただければ、
あるいは、それができるようになり、
自分の配色に取り入れることができるようになれば、
それがベストです。
私の解釈と異なっている場合は、そちらを優先してください。
あくまで、あなた自身のステップアップのための練習である！
と認識していただければと思います。
