伝えたいことが多すぎる時に読んでほしい-その2

「伝えたいことが多いけどそうやってまとめたらいい？」
「デザインのコツ何かない？」って時に読んでもらえると嬉しいなという気持ちで書いている第2弾目。

※第一回はこちらのURLから移動できます↓
（URLが長くてごめんなさい…）
https://design-kagakusiki.com/technique/color/many-many-things-to-tell/

前回は、主に色を使ってまとめるコツと、イラスト化（アイコン化）して情報をまとめる方法を説明させてもらいました。

今回は、3つめ。
空間の使い方についてお話していきたいと思います。

空間というより「余白」といった方がいいかもしれません。
あなたにいろいろ伝えたいことがありますが、今回は絞って書くことにしますね。

近くに配置して関連性をアピール

まず、デザインの基本中の基本。
4つの原則といったものがあります。
（よくデザインの4大原則といわれます）

簡単にお伝えすると、わかりやすいデザインで大切なのは、
①近づける　
②メリハリをつける（アクセントをつける）
③整列させる
④繰り返す
というもの。

これは、
①同じ分類の情報を近くにおいて関連していることを表す
②色や文字の太さ、サイズで情報に強弱をつける
③いくつかある情報たちをきれいに並べる（レイアウトも含む）
④同じようなレイアウトを繰り返す
というような内容です。


特に、あなたがデザインを考える中で、伝えたい情報がたくさんあるときには、わかりやすいものに仕上げるためにこのデザインの4大原則の考え方が大切です。

似た情報を近くにおいて、グループを作ります。
そして、ほかの情報も同じように似た者同士を集め、余白をとってグループごとにきれいに並べます。
最後に、グループの中で特にアピールしたい内容は文字色や文字のサイズ・太さを変えて強調させて。

例えばこんな感じです↓

たくさんポイントがありますが、余白の視点からみていきましょう♪

-1- タイトルまわりの余白

まず、タイトル「日焼け止めは2度落ちる」の周りに適度な余白があることで自然と目線が向きます。


今回の例は、文字の大きさも関係あると思いますが、十分な余白があると文字のサイズ変化がそこまで大きくなくても視線を集めやすくなります。
専門用語を入れてカッコよく言うなら
「ジャンプ率が高くなくても視線を集めやすくなる」
（自分でいうのもなんですが、ちょっとカッコよく言ってみたかったんです…）

でも、待って。それだけではありません。
この広告の場合、タイトルのすぐ下に伝えたい内容が配置させています。

私もあなたも、縦に書かれたものって大半、上→下へ見たり読んだりしますよね。
この広告の構造は、余白＋視線の動きを活用されています。

まず余白でタイトルへ視線を集め、その下すぐに伝えたいメッセージを配置しています。これによって、タイトルをみた人は自然と、そのメッセージを読むことになるんですね。

このように、余白はしっかり伝えい内容をバチッと伝えたいときにも手を貸してくれる存在です。

だから、情報をまとめたいときにデザインを考えるなら、ぜひ余白も一緒に考えてみてください。

デザインの基本ってネットで調べると、「デザインの4大原則」が検索上位にあがってくることが多いかもしれません。
ただ、その中にはぜひ「余白」もセットにして覚えてみてくださいね。

-2-ハニカム型（ハチの巣型）は等間隔に並べる

次に、左半分に３つ並べられたハニカムです。
余白を均等にとることで、規則性が生まれます。
規則ができることで、同じ分類の情報なんだと感覚的に理解してもらいやすいです。

もちろん場合によることもありますが、均等に並べることでまとまりを感じられやすくなります。

ちなみに、私もあなたも含めて人って、規則が大好きなんですよね。
調べて知ったので、そこまで詳しい説明はできませんが、人は何かを覚えるときや見るとき、よく規則を探してそれによって覚えたりしているそうです。

だからこそ、競争率の高い広告という媒体では、規則性を作ったりして、より情報を覚えてもらえるような工夫も大切になります。

個人的には、それにプラスして、規則があるときれいでなんとなく落ち着ける気もします。
あなたはどうですか？

-3-色の統一

まだまだお伝えできることはありますが、特にここであなたに知ってほしい内容の３つめ。
それは、「配色」です。

第一回めでもお話ししましたが、配色によるまとまりはとても強いと思います。

この広告では、背景の白色、文字やイラスト線の黒、青緑、黄色が使われています。
背景の白色を抜いて考えると、青緑が主体ですね。

同じ情報グループ（特にハニカム型）で同じ青緑が使われているので情報としてとても整理されわかりやすいです。

そして、青緑はなんといっても、商品自体の色。
カラーによって商品イメージを強く伝えています。

それに加えて、タイトルの色も青緑なので、見てすぐに「タイトルの内容がハニカム型で説明された内容だな」とわかりますし、目線もタイトル→ハニカムへ動いていきますよね。

ほかに、イラストで使われている黄色は、青系の色と補色（反対色）の関係にあります。
ただ、まったく主張は強くないですよね。
料理の隠し味的な存在です。
でも、この隠し味があるからこそ
だからこそ、全体にメリハリができて、適度なリズムも生まれるんです。

まとめる　と　余白　はセットで使う

さて、そろそろまとめていきたいと思います。
長々とだらけるクセがでてきてしまいました。

配色のお話になって、余白からいったり来たりしてしまったのですが、 私がこれまでデザインを作ってきた中でおすすめなのが、「似た情報を近くに配置すること」と「余白」をセットで使うこと。

似た情報同士を近づけても、余白がなければまとまって見えず、わかりにくいものとなるからです。

それに、余白があると、人の視線を集めることができるからです。

番外編：おすすめの本～余白のこと～

「余白」については、調べると書籍やテクニック本が結構ヒットするかと思います。
個人的にですが、あなたにおすすめしたい本があります。
それは「けっきょく、よはく。」という本です↓

一番見返している本だって言ってもおかしくないほど、よく見返しているであろう愛読本です♪

ビジュアルでの説明ばかりでわかりやすいです。
そして、見ていて楽しい。
そして、「私もこんなミスしてる…」と気づかせてくれる本です。

デザインの基本としても、おさらいとしても、見ていただくとおもしろい発見が目白押しじゃないかなって思います。

けっきょく、よはく。 余白を活かしたデザインレイアウトの本 [ ingectar-e ] 価格：1980円（税別、送料別)(2020/7/9時点)

抹本

このブログは個人的な研究や視点・観点をもとに執筆しています。
したがって、読者さんのデザインや広告内容の売上等を確実にアップさせるというものではありません。
あくまでこんな工夫があるんだなという観点でよんでいただけると嬉しいです。