【デザインの基本】デザインの4原則について詳しく解説します

これからデザインを初めたい方、今デザインを勉強している方、デザインの４原則というものを知っていますか？

デザインの基礎的な部分で、これを知っているのと知っていないのでは、デザインが大きく変わってくるので、是非この記事を参考にデザインしていただければ幸いです。

デザインの四原則

デザインを美しく見せるため、情報を正しく伝達させるための法則としてデザインの４原則というものがあります。

今回のデザインの４原則を意識してデザインをすれば、今デザインに対して知識がない方も情報を的確に相手に伝え、かつ綺麗なレイアウトを行える画期的な法則になりますので、是非会得してみてください。

近接　(Proximity)

近接とは、どこがどの情報かをわかりやすくグループ化させることです。

下の図はちょっとオーバーに表現していますが、✗がダメな例、○が良い例になっています。

ダメな例✗では、本来１つのグループであるtitleと四角が周りのグループと近すぎて、どこまでが１つのグループなのかわかりづらくなっています。

そこに近接を加えたのが下の図の良い例○です。
四角とtitleが１つのグループとしてまとまっていて、その他のグループと間隔を開けることで、情報のまとまりがわかりやすくなっています。

整列　(Alignment)

整列も近接と同様に、情報をわかりやすくしてくれます。
整列させることによって情報の構成を理解させやすくすることができます。

ダメな例✗では、少しオーバーにやりすぎてしまったのですが、情報がバラバラで整っておらず、どこがどのような構成の情報かわかりにくくなっています。またバラバラに整っていない情報は綺麗なレイアウトとは言えないので、なにか意図がない場合は控えましょう。

良い例○では、情報がキレイに等間隔にズレなくで並べられていて、フォントも左揃えと整列しているので、わかりやすく情報の構成を理解することができます。

反復　(Repetition)

反復とはデザインの一部レイアウトを繰り返すことです。

繰り返すことで、デザインの統一感をださせます。

ダメな例✗では、コンテンツごとのレイアウトがバラバラで、統一感がなく情報を素早く取得することができません。

反復を意識して、良い例○のように、コンテンツごとのレイアウトを繰り返すことで、統一感があり情報の取得性も高いデザインをすることができます。

反復させるものにはコンテンツだけではなく、フォントや文字の太さ、アイコンなど様々な要素があります。

コントラスト　(Contrast)

コントラストとは、目立たせたい項目に強弱をつけることによって、情報にメリハリをつけることです。

ダメな例✗は、文字が均等に並べられているのは良いのですが、フォントのサイズまで均等で、どれが一番読者に知ってもらいたい情報なのかが、いまいち伝わりにくくなっています。

良い例○では、目立たせたい項目に強弱をつけることによって、他の項目との差別化を図り、より一層伝えたい情報をダイレクトに伝えることができます。

コントラストをつけるものには、フォントサイズ、フォントの色、図形など様々なものがあります。

まとめ

デザインの４原則を使用することで、情報をキレイにかつ的確に伝えることができるので、これからデザインを初めたい方、今デザインを勉強している方などは、積極的にこの４原則を使い、これからのデザインライフに励んでみてください。