30sec

デザインを中心に。30秒ぐらいで読めるブログ

デザインの原則 - 近接をつかってみる

今回は「高校で教えてほしいデザインの定義」でご紹介した「1.1. 見やすい、読む気になるデザイン」について考えてみます。

参考文献はこちら ↓↓
ノンデザイナーズ・デザインブック [フルカラー新装増補版]

デザイナーの方の多くはご存知だと思いますが、デザイナーでは無い人のためにとても丁寧にわかりやすくデザインについて書かれた本です。
初版1998年のこの本は、2008年にもフルカラーになって今でも受け継がれています。

原則その① - 近接

  • ひとことで言うと、要素をグループ化(組織化)すること。
  • 情報の塊を認識しやすくすることを目的としています。

概念イメージ1

f:id:ogawanaohiro:20150505090717p:plain 2つのグループがあることがハッキリわかります。

概念イメージ2

f:id:ogawanaohiro:20150505090741p:plain 3つのグループがあることがハッキリわかります。


WEBイメージサンプル

f:id:ogawanaohiro:20150504100438j:plain

Gmailのサポートページは近接がうまく使われていました。とってもみやすいですね!

近接をつかうと見やすいのはなぜ?

人間の認知の仕組みがそうなっているからです。 これ以上は深く考えずに覚えてしましましょう。

一度に認知できる情報に限りがある

subitizing:サビタイジング といわれる認知の法則です。
人間の視覚処理は、4つまでは瞬時に処理できる
しかし4つ以上になると処理に時間がかかるようになってます。

たとえばこんなイメージです。

★★★★★★★★★★★★★★ ←何個あるんだろう...
★★★★ ★★★★ ★★★★ ←すぐわかる!!

人は情報のパターンを探し分類する

prägnanz:プレグナンツ の法則です。 これはGestalt Psychologie:ゲシュタルト心理学で論じられている人間の視知覚の特徴です。

人の視知覚の特徴↓↓ f:id:ogawanaohiro:20150505093305p:plain

次回は「整列」について考えていきます。

ogamo