デザイナーじゃなくてもデザインできる!?デザイン4原則~整列編~

デザインのブログ 2019.08.19

最近はめっきり暑くなってきましたね。

熱中症や脱水症状には充分注意して、水分補給や塩分摂取をしていきましょう。

私は最近、ソルティライチがマイブームです(笑)

 

さて、みなさんは前回ご紹介したデザインの4原則、覚えていますか?

  1. 近接 Proximity
  2. 整列 Alignment
  3. 強弱 Contrast
  4. 反復 Repetition

この4つでしたね。

先月は1番目の「近接」についてのお話をしました。

関係する情報を近づけることで、人は「関係があるもの」として認識するので、

位置関係を整理するだけで視覚的に理解しやすい。

という内容でした。

 

今回はデザイン4原則の2つ目「整列」についてです。

整列とは「要素に一体性を持たせる」ことです。

要素を闇雲に配置せず、左揃えや右揃えのように要素を意識的に配置することで

情報が整理されて全体的にスッキリまとまった印象にすることができます。

 

……と言われてもどういうことかよくわかりませんよね?

 

下図の名刺を見てください。

どんな印象を受けますか?

必要な情報は全て記載されてはいますが、

要素がずらっと羅列されている印象ですよね?

分かりにくい、と感じると思います。

 

まずは全ての情報を整理してみます。

  • デザイナー:肩書き
  • 広報 太郎:名前
  • Kouhou Sentai Inc.:会社名
  • 住所、Tel、Fax:会社情報

関係性がある要素はどれとどれなのか。

どの要素を「近接」にすれば良いかが明確になりましたね。

 

では、近接されたそれぞれの要素を、

さらに「整列」の原則を使って揃えてみます。   

フォントの種類、サイズは全く変えていませんが、

左揃え・右揃えを適用するだけでぐんと見やすくなりましたよね。

 

整列のポイントは「見えない線」で繋げることです。

 

なぜ見やすくなったのでしょうか?

それは、整列によって左右に「見えない線」を感じさせることで、

画面がすっきりと整理されたからです。

上の画像にあるピンク色の点線のように、実際には存在していなくても

デザイン全体を見たときにそれらが自然とあるように感じられれば

上手く活用できている、と言えるでしょう。

逆に、これらの線が見えてこない場合は上手く整列を活用できていない、

ということになってきます。

 

最初の画像の名刺で使われていた中央揃えは、

この「見えない線」を感じにくく、

左右にできたデコボコの余白によって不揃いに感じてしまいます。

象徴的に使いたい、ソフトな印象を持たせたいなどの明確な意図がない限り、

中央揃えは多用しない方が無難です。

 

「整列なんて基本中の基本!」

と思った方もいらっしゃると思いますが、

意外と見落としがちになりやすい要素でもあります。

画面の中に「基準となる線」をいくつか探し、

揃えられるものは全て揃えてみましょう。

意外とそれらの線から仲間はずれになっている文字群などが見つかるかもしれませんよ。

 

今回はここまでです。

知っているかどうか、気をつけるかどうかだけでもデザインはかなり変わってくる、

ということが分かっていただけたら幸いです。

 

次回は3番目の「強弱」についてです。

お楽しみに!

■参考文献

 Robin Williams著、吉川典秀翻訳 2008年

 「ノンデザイナーズ・デザインブック」

 毎日コミュニケーションズ

アクセス数: 259 アクセス数: 260
広報宣隊に興味が出てきた!問い合わせる!

とりあえず問い合わせ!

ページトップへ