デザインの基本！「対比」でメリハリとインパクトのあるデザインを作る

デザインしたものが

• メリハリがない
• 資料のような感じ
• インパクトがない

なんてことありますよね。

対比がうまく出来ていないのが原因ではないでしょうか。

対比とはコントラストです。

このコントラストをつけることで印象的で魅力的な動きのあるデザインが出来ようになります。

今回はデザインの基本である「近接」「整列」「反復」「対比」の4原則の「対比」のお話したいと思います。

対比とは

先ほども言いましたが、「対比」とはコントラストです。

ある要素と別の要素に差をつけることで差別化をする技法です。

わかりやすく言うと重要度が高いものは大きく目立たせて、重要度が低いものはそれよりも小さく配置する。すると自然とコントラストがつきます。

これが「対比」です。

対比をつける理由は優先順位を明確にし、重要な情報をしっかり伝えることです。

広告を見るとき、上から下までしっかり読みますか？よほど興味のあるものなら、読むかもしれませんが、ほとんどは目立つところだけしか見ないのではないでしょうか。

対比は重要な部分や確実に伝えたい部分を明確にして、しっかり伝えるための技法です。

広告では非常に重要なことです。

コントラスト（対比）つける方法

コントラストの付け方はいくつかあります。

• 大きい文字と小さい文字でコントラストをつける。
• 大きい写真と小さい写真(または文字）でコントラストをつける。
• 色でコントラストをつける。
• 余白でコントラストをつける。

の以上4つです。

ひとつひとつ解説していきます。

大きい文字と小さい文字でコントラストをつける。

文字の強弱でコントラストをつけます。メリハリが出て元気で活発な印象になります。

デザイン初心者さんへアドバイスですが、目立たせたいばかりに大きな文字で尚且つ太いゴシック体でレイアウトすると他の要素にもよりますが、そこだけが目立ちすぎて重い感じになってしまう場合があります。そんな時は細い書体で大きくしてみることを試してみてください。また、太く大きな文字でも、色を調整することでバランスを取る方法もあります。全体のバランスが大切です。

下の記事を参考にしてみてください。

大きい写真と小さい写真(または文字）でコントラストをつける。

写真の強弱でコントラストをつけます。強弱の差が大きいほど、インパクトのあるデザインになります。

色でコントラストをつける。

色の対比でコントラストつけます。２つの物を比較したり、目立たせたい部分をより強調するときに使える方法です。

余白でコントラストをつける。

余白を使ってゆったりと見せる部分と、情報量の多い部分を対比させたデザインです。

余白をうまく使うことで情報量が多くてもスッキリとした印象のデザインになります。

余白の解説をした記事がありますので参考にしてください。

余白のおすすめの本

余白はデザインする上でとても重要です。

余白の使い方でデザインの印象がガラッと変わります。この本は余白の入れ方が大変詳しく書かれています。非常に参考になるかと思います。

対比の注意点

コントラストをつけるデザインでの気を付ける点があります。

強調したい要素とそうでない要素をしっかりと差をつけると言うことです。

中途半端な差はかえってインパクトがないつまらない平凡なデザインになってしまします。

コントラストを付けたい場合は、大、中、小のような差ではなく、大、小でまとめるつもりでデザインするぐらいがちょうど良いように思います。

ジャンプ率とは

対比にはジャンプ率というものがあります。

ジャンプ率とは大きい部分と小さい部分の比率のことを言います。

ジャンプ率が高ければ、つまり差が大きければ、インパクトが出て訴求力のあるデザインになります。また、ジャンプ率が低ければ、落ち着いた印象のデザインになります。

ジャンプ率を意識してデザインすることでインパクトのあるデザインになったり、逆に高級感のある落ち着いたデザインにもなります。

• 下の記事はジャンプ率について詳しく書いた記事です。合わせて参考にしてください。

まとめ

いかがでしたでしょうか。

優先順位を明確にして、コントラストをつけることで伝わりやすいデザインになります。

今回は基本である「近接」「整列」「反復」「対比」の4原則の「対比」の解説をしました。合わせて4原則の記事も参考にどうぞ。より理解が深まるかと思います。

参考になれば幸いです。