坂本邦夫「ウェブデザイン＆配色の見本帳」
- 作者: 坂本邦夫,フレア
- 出版社/メーカー: エムディエヌコーポレーション
- 発売日: 2014/05/19
- メディア: 単行本
- この商品を含むブログを見る
色ベタで目立たせる配色
色ベタとは印刷用語で1色で塗りつぶした面のことです。
単色で塗りつぶした面は、平坦で変化のない単調な印象になります。
しかし、ほかの要素と組み合わせることで対比が生まれます。
たとえば写真のような細かい変化がある要素と並べると、その違いが強調されます。
対比によって互いを引き立たせて目立つようになります。
また色ベタの面積も画面の印象に影響します。
ベタ面を大きくして使うと斬新な印象になります。
大きなベタ面の単調なイメージを抑えたいときは、同系色の明度が少し異なる色を使った薄いパターンなどを加えます。
パターンによってリズムが生じ、明度差が変化の大きさをコントロールして単調な印象を避けることができます。
色の対比でインパクトを出した配色
色の対比は強く知覚に働きかけて、見る人を刺激するので、サイトを訪れるユーザーにインパクトを与えることができます。
（中略）
刺激が強いのは色相差を最大にした補色の組み合わせです。
刺激が強すぎるときは明度や彩度を変更して強さを調整します。
周辺の色の影響を受けて、色の見え方も変わるので、色相や、明度、彩度を微調整しながら配色します。
このほかに無彩色と有彩色で対比を作る方法もあります。
黒やグレー、白などの無彩色が有彩色の色味をより強調する効果があります。
高彩度を使うとその鮮やかさが際立ちます。
写真の色味を利用する
写真が入る場合、その写真の色味を抜き出して配色すると、全体の印象が統一されやすくなります。
写真や商品パッケージのグリーンと商品ロゴのレッドを配色に使い、文字などは淡いグレーでまとめています。
エレガントで高級感のあるデザイン
高級なイメージを伝える1つの方法に、余白を十分に確保して要素をあまり詰め込まないレイアウトにする方法があります。
このレイアウトを活かすためには、背景に白や明るいグレーを使ってクリーンな印象を持たせます。
そして、少ない面積で部分的に明度、彩度が低い重厚感のある強い色彩を使うことで、ページ全体を引き締めて、清潔感のある高級なイメージを演出します。
また、写真の点数を少なくしたり、小さく使うなどの工夫をして、できるだけ他の色を使わないように配慮します。
もし、他の色を使う場合は、明るい無彩色などを使うことで色数を抑えたスッキリとしたデザインにします。
食べ物を引き立てる「黒」
黒は、食べ物を美味しそうに見せるのに効果的な色です。
艷やかさや瑞々しさを強調できます。
また、黒を背景やあしらいで配色すると、上質な雰囲気や高級なイメージを与えることができます。
- 作者: 坂本邦夫,フレア
- 出版社/メーカー: エムディエヌコーポレーション
- 発売日: 2014/05/19
- メディア: 単行本
- この商品を含むブログを見る
