BLOG

ブログ

技術者Kのデザイン道場
11.デザインの基本原則

デザインの基本原則

今回は私たちがデザインを決めるうえで気をつけていることをご紹介します。

それは、「デザインの基本原則」です。

良いデザインは、見た目が美しいだけでなく情報が正しく伝わりやすいという特徴があります。

デザインの基本原則は、これを守ると伝えたいことを分かりやすく伝えられるという便利な法則です。

デザインの基本原則は、以下の4つに分けられます。

  1. 近接 (Proximity)
  2. 整列 (Alignment)
  3. 反復 (Repetition)
  4. コントラスト (Contrast)

それでは、それぞれの原則を例と一緒に見てみましょう。

1. 近接 (Proximity)

近接とは、関連する項目を近づけてグループ化することです。

人間は無意識に近くにまとまっているものをグループとしてみなす、と言われています。

近接を意識すると、関連性の高い項目は近づけて関連性の低い項目は遠ざけるようになるため、情報のまとまりが分かりやすくなります。

下の例をご覧ください。

ブレンドコーヒー

口当たりがマイルドで飲みやすいため、だれにでもおすすめできるコーヒーです。

アメリカンコーヒー

苦味控えめで後味がすっきりとしたコーヒーです。

コーヒーの種類とその特徴をただ単純に並べてみました。

種類の違いを明確にする場合、例えば下のように表せます。

ブレンドコーヒー

口当たりがマイルドで飲みやすいため、だれにでもおすすめできるコーヒーです。

アメリカンコーヒー

苦味控えめで後味がすっきりとしたコーヒーです。

ブレンドコーヒーとアメリカンコーヒーは違うコーヒーだということが直観的に分かりやすくなったかと思います。

このように、近接は情報のまとまりが分かりやすくなります。

2. 整列 (Alignment)

整列とは、デザイン内の要素の位置や形、色、大きさなどを揃えることです。

整列させることで、すっきりして統一感のある印象をイメージに持たせることができます。

整列させる要素としてよくあるのは文字です。

WordやExcelなどで文字を左揃え、中央揃え、右揃えなどとしたことはありませんか?

下の例は、あえて文字の揃え方をバラバラにしたものです。

ブレンドコーヒー

口当たりがマイルドで飲みやすいため、だれにでもおすすめできるコーヒーです。

220円

 
アメリカンコーヒー

苦味控えめで後味がすっきりとしたコーヒーです。

220円

かなり極端な例なので、非常に見づらいかと思います。

これと比べると左揃えにした下の例は見やすく感じると思います。

ブレンドコーヒー

口当たりがマイルドで飲みやすいため、だれにでもおすすめできるコーヒーです。

220円

 
アメリカンコーヒー

苦味控えめで後味がすっきりとしたコーヒーです。

220円

左揃えが文字では基本ですが、中央揃えや右揃えが有効な場合ももちろんあります。

状況に応じて適切な揃え方をすることで、見やすくしたり統一感を出したりすることができます。

3. 反復 (Repetition)

反復とは、デザイン内の要素を繰り返し用いることです。

反復することで、統一感のあるデザインに仕上げられます。

以下の例ではブレンドコーヒーとエスプレッソコーヒーの部分に下線を引いてみました。

ブレンドコーヒー

口当たりがマイルドで飲みやすいため、だれにでもおすすめできるコーヒーです。

220円

 
アメリカンコーヒー

苦味控えめで後味がすっきりとしたコーヒーです。

220円

 
エスプレッソコーヒー

ギュッと凝縮された旨味と芳醇な香りが特徴のコーヒーです。

220円

少し不自然な感じがしませんか?

コーヒーの種類に下線を引くと以下のようになります。

ブレンドコーヒー

口当たりがマイルドで飲みやすいため、だれにでもおすすめできるコーヒーです。

220円

 
アメリカンコーヒー

苦味控えめで後味がすっきりとしたコーヒーです。

220円

エスプレッソコーヒー

ギュッと凝縮された旨味と芳醇な香りが特徴のコーヒーです。

220円

統一感が出てデザイン性が上がりました。

4. コントラスト (Contrast)

コントラストとは、デザイン内の要素が異なるときに、それぞれが違うことを強調させるために見た目を大きく変化させることです。

コントラストを意識すると、重要なものとそうでないものが分かりやすくなるため、直観的に分かりやすくなります。

ブレンドコーヒー

口当たりがマイルドで飲みやすいため、だれにでもおすすめできるコーヒーです。

220円

 
アメリカンコーヒー

苦味控えめで後味がすっきりとしたコーヒーです。

220円

上の例でも情報は伝えられますが、下のようにするとより分かりやすく伝えられます。

ブレンドコーヒー

口当たりがマイルドで飲みやすいため、だれにでもおすすめできるコーヒーです。

220円

 
アメリカンコーヒー

苦味控えめで後味がすっきりとしたコーヒーです。

220円

コーヒーの種類を太字に、値段を赤色にしてみました。

伝えたい情報の箇所を目立たせることで、情報の重要度を上げています。

まとめ

  • デザインの基本原則は、近接 (Proximity)、整列 (Alignment)、反復 (Repetition)、コントラスト (Contrast)の4つ。
  • デザインの基本原則を守ったデザインは、情報を分かりやすく伝えられる。

今回はデザインの基本原則を紹介しました。

これは資料作成のときにも応用できるため、デザイナーでなくても知っておいて損はないと思います。

「このデザイン良いな」と思うデザインはこの基本原則が満たされていることが多いです。

ぜひ、そのようなデザインに出会ったときにはどの原則が満たされているかをチェックしてみてください!

お問い合わせはこちらから

お問い合わせ