第2回では、第1の足である「色彩」について書きました。
色は、好き嫌いで選ぶものではなく、目的に合わせて選ぶもの。
そして、色彩学や色彩心理、視認性や可読性を学ぶことで、感覚に根拠を持たせることができる。
それが、前回のテーマでした。
今回は、第2の足である「構成」について考えます。
構成というと、難しく聞こえるかもしれません。
しかし、基本的な考え方はとてもシンプルです。
揃える。
まとめる。
余白をつける。
強調する。
この4つです。
構成とは、見た目をきれいに並べることだけではありません。
情報の優先順位を決め、見る人が迷わず理解できるようにするための設計です。
構成は、情報の優先順位を決めること
デザインでは、よく「バランスが悪い」「なんとなく見づらい」と言われることがあります。
しかし、その原因は単に見た目の問題ではないことが多いです。
何が重要なのか。
何から見ればよいのか。
どこを押せばよいのか。
どの情報同士が関係しているのか。
それが整理されていないと、人は迷います。
構成とは、情報の順番と関係性を整理することです。
すべての情報を同じ大きさ、同じ強さで並べてしまうと、見る人は何を優先すればよいのかわかりません。
つまり、構成とは「きれいに置くこと」ではなく、伝わる順番を作ることです。
揃える：視線の迷いを減らす
構成の基本のひとつが「揃える」ことです。
文字の左端を揃える。
画像の位置を揃える。
ボタンの幅を揃える。
見出しと本文の開始位置を揃える。
たったそれだけで、画面や紙面は見やすくなります。
なぜなら、人の目は、揃っているものを自然にまとまりとして認識するからです。
逆に、少しずつズレた要素が多いと、見る人は無意識に違和感を覚えます。
どこから読めばいいのか、どこに視線を動かせばいいのかがわかりにくくなるからです。
揃えることは、単なる見た目の整えではありません。
視線の道を作り、読む人の負担を減らすための設計です。
まとめる：関係のある情報を近づける
次に大切なのが「まとめる」ことです。
関係のある情報は近くに置く。
関係の薄い情報は離す。
これだけでも、伝わり方は大きく変わります。
たとえば、商品名、説明文、価格、購入ボタンが離れて配置されていたら、ユーザーはそれらが同じ商品に関係する情報なのか迷ってしまいます。
逆に、関係する情報がまとまっていれば、ユーザーは自然に理解できます。
まとめることは、情報の関係性を見える形にすることです。
これはWebサイトでも、パンフレットでも、資料でも同じです。
デザインは、ただ情報を置く作業ではありません。
情報同士の関係を整理し、見る人が理解しやすい形に変換する作業です。
余白をつける：理解するための間を作る
余白は、何もない場所ではありません。
余白には役割があります。
情報を区切る。
視線を休ませる。
重要なものを目立たせる。
読みやすくする。
高級感や安心感をつくる。
余白が足りないと、情報は詰まって見えます。
詰まって見えると、読む前から疲れます。
逆に、適切な余白があると、情報のまとまりがわかりやすくなります。
余白は、デザインをおしゃれに見せるためだけのものではありません。
見る人が情報を理解するための「間」です。
会話にも間があるように、デザインにも間が必要です。
余白をつけることは、情報を減らすことではありません。
情報を正しく伝えるために、呼吸できる空間を作ることです。
強調する：全部を目立たせると、何も伝わらない
構成で特に重要なのが「強調」です。
デザインの現場では、よくこう言われます。
「これをもっと目立たせたい」
「あれも大事だから大きくしたい」
「この情報も埋もれないようにしたい」
もちろん、どの情報も大切です。
しかし、すべてを強調すると、結果的に何も強調されません。
大きな文字。
太字。
赤い色。
派手な背景。
目立つアイコン。
強い装飾。
これらをすべて使うと、見る人は何を最初に見ればよいのかわからなくなります。
強調とは、ただ目立たせることではありません。
情報に優先順位をつけることです。
一番伝えたいことは何か。
次に見てほしいことは何か。
最後に確認してほしいことは何か。
その順番を作るために、文字の大きさ、太さ、色、余白、配置を使います。
構成が悪いと、誤解や迷いが生まれる
構成は、単なる見栄えの問題ではありません。
構成が悪いと、見る人は迷います。
重要な注意事項を見落とす。
押すべきボタンがわからない。
申し込みの流れを誤解する。
必要な情報にたどり着けない。
優先順位を間違えて判断してしまう。
こうしたことは、ユーザーにとって大きな負担になります。
場合によっては、損失やトラブル、事故につながることもあります。
だから、構成は軽く扱ってはいけません。
デザインは「なんとなく見やすい」では不十分です。
なぜ見やすいのか。
なぜ伝わるのか。
なぜ迷わないのか。
そこを説明できることが大切です。
構成は、非デザイナーにも必要な考え方
構成は、デザイナーだけのものではありません。
資料を作る人。
Webページを発注する人。
チラシを確認する人。
サービスの導線を考える人。
社内で情報を伝える人。
すべての人に関係があります。
情報をどう並べるか。
何を先に伝えるか。
どこを強調するか。
どこに余白を置くか。
これらは、コミュニケーションそのものです。
構成を理解すると、「なんとなく見づらい」という感覚を、言葉にできるようになります。
「左端が揃っていないから読みづらい」
「関係する情報が離れているから理解しにくい」
「余白が足りないから詰まって見える」
「全部が強調されていて優先順位がわからない」
こう言えるだけで、デザインの会話は大きく変わります。
第2の足としての構成
構成とは、情報を美しく並べることだけではありません。
揃える。
まとめる。
余白をつける。
強調する。
この4つを使って、情報の優先順位と関係性を整理することです。
見る人が迷わないようにする。
必要な情報に自然にたどり着けるようにする。
誤解や見落としを減らす。
正しく判断できるようにする。
それが、私が考える「第2の足：構成」です。
構成は、デザインの土台です。
色が良くても、文字が美しくても、構成が崩れていれば伝わりません。
虹色のタコは、色を理解するだけでは不十分です。
情報をどう並べ、どう見せ、どう伝えるかを考える必要があります。
次回は、第3の足である「視覚生理」について考えていきます。
人の目は、どのように情報を見ているのか。
なぜ見やすい、読みにくい、目立つ、目立たないと感じるのか。
次回は、人間の視覚の仕組みから、デザインを考えていきます。
コメント