ブログ
Blog
- POSTED :
【IR/CSR分野】デザインにおける余白の戦略的活用のすすめ
統合報告書やサステナビリティレポートのデザインに携わっていると、レイアウトされた誌面の空いたスペースを埋めようと、あれこれ心血を注ぐクライアントの多いことに驚かされます。
生真面目な日本人の性格から「限られた誌面をできるだけ多くの情報で埋め尽くさなければ!」という強迫観念に襲われているのかも?と考えたりもします。
「余白」という言葉は、“余ってしまい埋めなければならない空間”というネガティブなニュアンスに捉えられがちです。しかし、デザインにおいてはなくてはならない重要な要素。今回はこの余白の役割について述べてみようと思います。
余白を制するものがデザインを制する?
巷では「余白を制するものがデザインを制する」とまで言われており、インターネットでキーワード検索すると似たような見出しが複数上がってきます。
事実、グラフィックデザインとは写真や文字を割り付ける作業ですから、それらモチーフ自体の形や大きさもさることながら、必然的にモチーフどうしの関連性を常に考える行為とも言えます。
字間、行間、段落(コラム)間、文字と写真・イラストとの空間、ページ内に占めるそれらの割合、、、ありとあらゆるモチーフの大きさと互いの距離をコントロールしていることを思えば「余白を制するものがデザインを制する」といっても過言ではないでしょう。
この余白は以下の論理的な役割を2つ担っています。
1、余白は読みやすくする
2、余白は印象を演出する
順番に、解説していきます。
余白は会話の間合いと同じ
これからあなたはスピーチで、3つのことを話すとします。
効果的に伝えるために、あなたはどのようなテンポで説明をするでしょうか?
まず冒頭に「これから3つのことを説明します」とアウトラインを伝え、「1つ目は〜についてです」とテーマをはっきりと強調して述べた上で詳細説明へと続けて、少し間合いを取ってから「2つ目は〜」と次の話題へ移るのではないでしょうか?
この話す際のアクセントや間合いを視覚化すること、それが「余白」の活用になります。
以下の(サンプルA)は普段、私がデザインしているように文字を組んだものです。
(サンプルA)
適度なスペースは「3つのかたまり=3つのトピックがあるのだな」と全体像をイメージさせてくれます。
これは関連する要素どうしをまとめ、別の要素との距離をはかる『グルーピング』効果によるものです。
また、見出しの上下に適度なスペースを入れることで、見出しから本文に向けた視線の移動がスムーズになるようになっています。
これを逆の状態にしたものが(サンプルB)です。
(サンプルB)
「文字は小さくしたくないが要素も減らしたくない。なので、なんとか詰め込んでほしい」
クライアントからそのようにオーダーされて陥りがちなデザインです。
同じ記載内容でありながら読み取りづらいと感じられるのではないでしょうか?
スピーチに例えると、ひたすら同じ抑揚で息つぎもなくしゃべり倒しているような状態です。
こうなると見出しが埋もれてしまい目を引かない。
「見出しに罫線や色を使って、見出しをもっと強調させてみて!」
こんな要望を受けて完成したのが(サンプルB’)です。
(サンプルB´)
さらにゴチャゴチャとしたものに仕上がりました(笑)
一方的にしゃべくり倒す傍らで、怪げなBGMまで流れていそうな雰囲気です。
それでは、こうならないために一体、何が必要なのでしょう?
過剰な飾りつけなどに頼ることなく、まずは適切にグルーピングをし、優先順位をつけて情報整理をすることが基本中の基本。この余白コントロールを押さえた上で、必要に応じて色をつけるなどの味付けをすればよいと思います。
以上が「1、余白は読みやすくする」についてでした。
ところで、上にあげたサンプルAとB。Aのほうがより洗練された印象を受けませんか?
その理由は「2、余白は印象を演出する」にあります。
余白の分量は高級か激安かのイメージを決定する
高級ブランド店と激安店、商品の陳列方法には明確な違いがあります。
高級店では広い店内のわりに商品の数は少なめ。商品一点一点にスポットライトが当たっていたりします。
逆に、激安店は所狭しと並べられたり積み上げられてカオスの様相を呈しています。
高級フレンチレストランと牛丼チェーン店の料理についても比べてみましょう。
高級店では大きなお皿に料理がちょこんと盛り付けられているのをよく目にする反面、
牛丼は器に山盛り一杯!あふれんばかりに盛られてこその満足感を実感できます。
そう、高級な商品や料理のまとっている空間的「余白」は高級感を演出するために必要な要素なのです。
周囲から干渉されることなく配置されたモノに対峙する時、私たちの意識はその一点に集中し、不可侵で貴重であるかのような印象を抱きます。そういう人間の性質を前提にして小売店や飲食店はイメージ戦略を仕掛けてきているのです。
この視覚的な効果はそのままグラフィックデザインにも当てはまります。
つまり、重要な写真や言葉を「重要である」と印象付けたいのなら、十分な余白をまとわせてあげる必要があるのです(この場合のモチーフがまとう余白のことをアイソレーションスペースと言います)。
特集やハイライト等の注目してほしいページは写真や図版は大きく、余白もたっぷりとゆとりあるレイアウトにする理由はここにあります。大切な企業ビジョンのすぐ横にデカデカと目次を配して、企業の世界観を台無しにすることのないよう、気をつけたいですね。
重要性>一貫性>スペースが余ること
ところで、誌面に対して意図せず、スペースが余ってしまいそうなときに、皆さんはどうされていますか?
何か追加できる情報がないか、他のセクションとやりくりしてうまくコンテンツのバランスを取れないか、と編集上の努力をするのではないかと思います。
その努力もむなしく穴埋めできる要素を見つけられなかったとしたら。。
そうだ! 文字や図表・写真を大きくして、この鬱陶しいスペースを埋めてしまおう!!
デザインのセオリーにおいて、それだけは絶対に避けなければならない行為です。
これまで述べてきたように、要素の大きさとは情報の優先順位、すなわち「重要度」によって定められるものです。そうした優先順位の高い場合を除き、レポート内で使用される文字・グラフ・表などは、統一したルールに従ってデザインがなされる必要があります。
間違っても「この余白が気になる」という理由だけで、明確な根拠を持たずに文字や要素のサイズ変更をするのはデザイン上の違反行為であり、それにより、むしろ読者の理解を阻害する結果を招きかねないので注意が必要です。
このように埋めることを優先して論理性を欠いて行われた処理は「内容ではなく体裁に腐心する姿勢」が透けて見えるものです。そのような誘惑を打ち切って、勇気を持って「美しく余白を残す」というのもひとつの考え方ではないでしょうか。
実際、海外の質の高いレポートの多くはこうした考え方を採用していますし、国内においてもデザインの意識が高い企業は余白コントロールが優れています。
こうした事例にたくさん触れて知見を深めることが、デザインの良し悪しを判断する助けとなるはずです。
以上、余白とは必ずしも埋めなければならない対象ではなく戦略的に活用しましょう、というお話でした。
企業の業績や取り組みをレポートする際、もちろん「何を」開示するかが最大の関心事ですが、
「どのように」伝えるかで印象もずいぶんと違ってきます。
わかりやすく洗練されたレポーティングで企業ブランド力を高めてみてはいかがでしょうか。
CATEGORY
NEW POST
RANKING
OUR BUSINESS事業内容
WORKS制作実績
CATEGORY: 外国語コミュニケーションWeb制作
日本体育大学 – 女性アスリート競技力向上プロジェクト特設サイト(日本語版/英語版)
CATEGORY: Web制作
エスティック サステナビリティサイト
CATEGORY: Web制作
警視庁創立150年記念サイト
CATEGORY: 経営広報Web制作
ウッドワン サステナビリティレポート・サステナビリティサイト【2022年度】
CATEGORY: Web制作
Tokyo Seaside お台場臨海地域の情報フリーマガジン【Web版】
CATEGORY: 外国語コミュニケーション経営広報
日本通運 多言語広報紙(英文版・中文版)