2022.11.21

ノンデザイナーも今すぐ使えるデザインの基礎『４つの基本原則』

今回は「ノンデザイナーも今すぐ使えるデザインの基礎」の第一段として

『デザインの４つの基本原則』をご紹介します。

ノンデザイナーの方もSNSの投稿、ブログのアイキャッチ画像、会社の資料作りやパワポ作成などデザイナーに頼らずにデザインを作る機会も多いかと思います。

デザインしてみたものの、どこかしっくりこないというときに
「デザインの４つの基本原則」を守ってデザインを行うと、見た目の美しさもアップし、見る人が読みやすく情報が伝わりやすくなります。

デザインには近接、整列、反復、対比という４つの基本原則があります。

・「近接」関連性の高い要素をグループ化する
・「整列」すべての要素を意識的に整えて配置する
・「反復」同じルールに基づいて繰り返す
・「コントラスト」要素の優先度を明確に示す

「近接」とは、関連性の高い要素を近づけてグループにすることです。

左が「近接」を意識していないデザイン、右が「近接」を意識したデザインです。

左は商品画像も商品名も説明も離れているのでグループ関係が分かりづらく、パッと見て情報を理解しにくいです。

同じグループに属する写真や文字は近づけて、異なるグループとは距離を離しましょう。そうすることで、瞬時に情報を理解しやすくなります。

「整列」とは、すべての要素を意識的に整えて配置することです。

左が「整列」を意識していないデザイン、右が「整列」を意識したデザインです。

左は適当に並べただけなのでバランスも悪く、商品名や価格が読みづらく伝わりにくいです。

「中央揃え」「左揃え」「右揃え」「上揃え」「下揃え」の揃えを意識して、揃える時は「見えない線」を意識しましょう。
「揃える」ことで見た目の美しさがアップし、情報を分かりやすく伝えることができます。

「反復」とは、同じルールに基づいて要素を繰り返すことです。

左が「反復」を意識していないデザイン、右が「反復」を意識したデザインです。

左は色もフォントもあしらいも異なるので統一感のないうるさいデザインになっています。

「近接」でグループ化した写真・文字などの要素を、サイズ・色・フォント・あしらいを同じルールで固定して繰り返すことで一貫性が生まれ、共通している情報と認識されやすくなります。

「コントラスト」とは、要素の優先度を明確に示すことです。

左が「コントラスト」を意識していないデザイン、右が「コントラスト」を意識したデザインです。

左はあまりにも単調で一番に何を伝えたいのか全く分かりません。

まず、特に伝えたい情報、その次に伝えたい情報、その次に・・と情報に優先度をつけます。

その優先度に応じて、色を変える、フォントを変える、形や大きさに差をつけるといった方法でメリハリをつけてデザインすることで、伝えたい情報の優先度が視覚的にわかりやすくなり伝わるデザインになります。

「デザインの４つの基本原則」をご紹介しました。

今後デザインする機会があったときは、「デザインの４つの基本原則」を意識してみてください。