ブログデザインにもオススメ！デザインの4大原則とは？

あなたはデザインとは「かっこ良くする事」だったり「かわいい・きれいにする事」だと思っていませんか？

これらは目を引かせるために必要なモノなのは確かですね。
でもデザインの本来の目的は、他の記事でも書いているように「実用的になるように設計する事」です。

それがブログであるならば、まずは「見やすく・わかりやすい」を目指すのが良いでしょう。

でも、そう言われてもどうしたら良いかわからないかもしれません。

そこであなたにぜひ知って頂きたいのが、グラフィックなど視覚情報系のデザイナーが必ず学ぶ「デザイン(レイアウト)の4大原則」です。

この原則を理解して「見やすく・わかりやすい」モノが作れるようになりましょう！

上の図をご覧ください。

左側は必要な要素は用意できています。
しかし「ただ置いただけ」のように見え、情報が多いわけではないのにごちゃごちゃして感じますね。

これは読者の視点があちこち飛ぶことになるので、負荷がかかり認識しづらくなっているのです。

これを修正するのが文字通り「整列」することです。

バラバラな位置関係を合わせて行き、例えばイラストならば一つのイラストを基準として2つ目もそろえる。

文字のブロックもイラストから少し余白を取りつつ、やはり一つの文字を基準としてそろえます。

図の左側のように「見えない線」を意識して、画面上の要素をそろえれば「見やすく」「すっきり」させることができます。

デザインの原則2・近接

図の左側は整列はされていますが、どの言葉がどのキャライラストを説明しているかわかりますでしょうか？

例えば「セッジ/デザイナー思考」という言葉は上の「赤い鳥」と「うり坊」のどちらを説明しているのかわかりにくいですよね。

両方への距離が近すぎるため、どちらとも取れる状態になっています。

また、横方向も近すぎて見づらい印象があります。

これを修正したのが右側になります。

「セッジ/デザイナー思考」を「赤い鳥」に近づけ、「うり坊」から離すようにすると言葉は赤い鳥を説明しているという形に見えるようになります。

また横方向のイラストの配置も離すことで密集した状態を改善することもできています。

「近接」とは、関係するものを近づけて、関係しないものは余白を入れて遠ざけてグループ化する事です。

それぞれの要素をグループ化すれば、初見でも「どれがどれに関係するのか」というのが即座にわかるようになります。

図の左側はイラストの大きさがマチマチだったり、フォントも小さかったり大きかったり、太さや行送りも違っていて…。

「統一感がない」という印象になりますね。

人間は「違いがあるとそこに意味がある」と考えてしまう性質がありますので、こういうモノを目にすると「特に強いのは特別なモノ」だと認識してしまいます。

これを修正してみましょう。

当ブログのキャラはどれも同列に扱いますので、この場合はどのキャラのサイズも同じ、キャラ名は太字のゴシック、説明文は細字のゴシックで行送りも統一しています。

このようにすると読者にルールが伝わるようになります。

「反復」とは、1つのコンテンツの中で、原則として同じものは同じものとして扱い、一貫性を持たせるという考え方です。

これは「トーン＆マナー」とも呼ばれています。

デザインの原則4・対比

デザインの原則4番目は「対比」です。

左の図は「整列」され、「近接」効果もつき、「反復」の統一感もあります。
しかし…とても弱い印象を受けませんか？

印象が弱い情報を見ていると、ひょっとしたら読者は見るのに飽きて離脱するかもしれません。

これを修正したものが右側になります。

まずイラストをできる限り大きくし、文字はキャラ名(見出し)と説明文の区別がハッキリするようにサイズと書体を変えています。

そして、より強く見せるためにキャラ名の下にザブトンをしいて強めの色を引きました。
これにより、かなり強弱がついた印象に変化させています。

「対比」とはコントラストの事です。
強調すべきものとそうでないものを、初見でも見分けられるようするという考え方です。

グラフィック、Web、映像など、視覚情報的な分野のデザインの人は、
今回ご紹介した「デザインの4大原則」を学んでいます。

ポスターや、デジタルサイネージ、TVなどの映像コンテンツ、そしてWebページなど…。
こういったデザイナーが手がけた作品をぜひご覧になってください。

こういったものには、必ず今回解説した原則が見つけられるハズなのです。

1つの原則だけ…ということはまずありません。
複数あるいは、全て見つけられる事もあるでしょう。

今回の記事を読んだあなたなら、解説したことはテクニックというよりは「考え方」であったことにお気づきかと思います。

冒頭でも書きましたがデザインとは、
「かっこ良くする事」であるとか「かわいい・きれいにする事」が全てではなく、「見やすく・わかりやすい」モノを作る事が優先です。

「実用的になるように設計する事」つまりは、問題解決がデザインの本質なのですから。