テスツ PR

【ブログで図解作りたい人向け】デザインの4原則を理解しよう

記事内に商品プロモーションを含む場合があります
デザインの4原則
アイキャッチ

図解を制作する時にはデザインの4原則を取り入れる事が大切です。

これが出来ていないと文章の羅列になってしまい情報が読み取りにくいのです。

一目見ただけで情報として読み取りやすくする事が図解する目的であり
それを達成するのに必要なのがデザインの4原則です。

この記事を読むと分かる事

・デザインの4原則について
・実際に図解で活用する方法

デザインの4原則とは

デザインの4原則

これら4つの手法の事を言います。

③の「強弱」は「対比」と言われる場合もありますが本質は同じです。

文章だけでは分かりにくいので、例を出しながら詳しく解説していきます。

①整列の使い方

整列は文章に統一感を持たせて視覚的に意味を作ります。

ポイントは1本の線をイメージして揃える事です。

例えば下の図を見てください。

整列解説図解

左は中央揃えになっていて要素同士がバラバラの印象を受けてしまいます。

対して右は始点を揃える事で1本の線に沿って並んでいるように見えませんか?

この線を意識して整列すると意味のあるグループになって情報が分かりやすくなるのです。

・中央揃えはやめる
・左揃え、右揃えを使って要素をグループ化する
・揃える事によってできた集合がカテゴリーになる(情報が整理される)

②近接の使い方

近接は関連性のある情報を近くに配置する事で意味を作ります。

下の図のようにレストランのメニューをイメージしてもらうと分かりやすいと思います。

近接解説図解

左はメニューが等間隔で書かれていて一瞬でカテゴリーを把握するのは難しいと思います。

対して右はカテゴリーとメニュー名を近づけて配置する事でグループである事が一瞬で
分かります。

このように同じ分類の要素を近くに配置すると情報が整理されて探しやすくなり、
見る人にとっては利便性の高いデザインになります。

・関連性のある情報を近くに配置してグループ化する
・文字のサイズや色を変更する事なくカテゴリ分けできる
・情報を近くに寄せて配置すると関連情報なのだと認識しやすい

③強弱の使い方

強弱は優先度の高い情報を目立つように文字サイズを大きくしたり装飾する事です。

同じ文字サイズの要素を羅列しても本当に伝えたい情報が埋もれてしまうので、
見る側からすると重要な情報がわかりません。

強弱解説図解

上の図でいうと作品タイトルの重要度が高いです。

左は全て文章の調子が同じで強調したい情報がわかりません。

右は作品タイトルのフォントが大きいのでわかりやすく、付帯する情報は小さくする事で
強弱がついています。

このように一番伝えたい情報は、フォントサイズを大きくするなど強調して目立たせる事
見る人に重要な情報である事をアピールする事ができます。

・一番伝えたい情報は文字サイズを大きくする
・優先度の低い情報は逆に小さくする
・強調されている要素の情報だと認識しやすい

④反復の使い方

反復はデザインルールを繰り返す事で統一感を出します。

デザインルールとは要素の見た目に規則性を持たせる事です。

1個目の要素のルールが把握できれば2個目以降の要素に何が書いてあるのかわかりやすくなります。

これを繰り返す事で複数の要素が記載されていてもテンポよく情報を読み取る事ができるようになるという手法です。

下記の図は4匹の動物に対して関連する情報を記述しています。

反復解説図解

左は配置もバラバラで関連情報に規則性もなく統一感がないので、どのような情報が書かれているのか理解するのに一苦労ですよね。

右は要素の配置や関連情報に規則性があり統一されています。

①動物の名前、②英語での肉の種類表記、③代表的な料理という記述ルールに沿っている
のでポンポンと頭に入ってくるはずです。

このように規則性に沿った情報の記述を繰り返すのは読む人にとって情報が整理されているので理解しやすくなります。

・要素は均等配置する
・要素の関連情報は法則性を持たせる
・同じ法則性の要素は頭に入ってきやすい

まとめ

デザインの4原則とは

・整列:要素を並べる事で意味をつくる
・近接:まとめる事で強い意味をつくる
・強弱:優先度で強弱をつけて意味をつくる
・反復:同じ意味の見た目を統一して意味をつくる

となります。

図解のポイントは読者が認識しやすく情報を整理して一目でわかるようにすることです。

この4つの原則は全て図解を見る人にわかりやすく伝える為の手法であり、
整理した情報を提供する事ができるようになります。

このデザインの4原則を図解制作の入り口にして、どんどん図解を制作していきましょう!

昨日より1歩前へ!

GMがお送りしました。