TOP UX用語 デザイン・情報設計 閉合(ゲシュタルト原則)

閉合(ゲシュタルト原則) Closure

欠けている情報を脳内で補完して、グループとして認識する傾向

人の脳は線が欠けているなどの中途半端な情報を見た時に、足りない部分を脳内で補完して、ひとつのグループとして認識する傾向がある。

知覚した情報の一部が隠れていて、全体が把握できないと緊張してしまう。閉合が起きる理由は、その緊張を解消しようとするため、隠れている部分を脳内で補完し、情報の全体像を把握しようとするためである。

閉合は、人が情報を目にして認識する際の特徴をまとめた「ゲシュタルト原則」のひとつである。

1910年にチェコ出身の心理学者Max Wertheimerマックス・ヴェルトハイマーらを中心に仮現運動というアニメーションの研究が始まる。それを基に1923年「ゲシュタルト原則」の基礎となる6原則の近接・類同・連続・閉合・共通運命・良い形が発表された。

Max Wertheimer(マックス・ヴェルトハイマー)

Max Wertheimer
(マックス・ヴェルトハイマー)
引用:Max Wertheimer – Wikiquote

脳は欠けた情報の補完をする

欠けた情報を補完する例として、WWFジャパンのパンダのロゴがある。図形の線が途切れていて、図として不完全であっても、脳が途切れた箇所の描画を補完して、「パンダ」だと認識している。

閉合を感じるwwfロゴ

線が書かれてい無い箇所にも線があるように見える
参考:WWFロゴ(WWFジャパン

他にもグループを認識できる例として、記号の【】(かっこ)がある。

以下の図は、色、形、順番は不規則だが、カッコでくくられたとたんに、3つのグループを認識できる。

カッコでくくられていると、ひとつのグループだと認識する

カッコでくくられていると、ひとつのグループだと認識する

閉合をUIデザインに活用する

閉合はUIデザインに活用でき、閉合単体ではなく他のゲシュタルト原則と合わせて使用されることが多い。

UXTIMES内でも閉合が使われている

UX TIMESのサイトデザイン:
(上)ゲシュタルト原則を無視したもの。
(下)ゲシュタルト原則を適切に使用したもの

UX TIMES内のデザインでも、カード状に「閉じる」ことで情報をわかりやすく表示している。

例として、ゲシュタルト原則を無視したものと、原則を適切に使用したデザインを実装した。無視した画像では情報のグループが分かりにくいが、適応した画像では閉合と近接を利用しているので、情報のグループがわかりやすい。

ゲシュタルト崩壊をデザインに利用

他にも、ゲシュタルトを逆手に使い、不完全な形を完成させようとする脳の動き(ツァイガルニク効果)を応用した「水平スクロール」がある。

AppleStoreでは、画面の端に次のコンテンツを少しだけ表示している。

途切れている情報を完全な状態で確認したい心理が働き、自然と次のコンテンツを見ようとする。

気になるという心理を逆手にとった水平スクロールデザイン

AppStoreの画面では、右側に次のコンテンツが少しだけ見えていてスクロールを誘う設計になっている

関連用語

参考リンク

ゲシュタルト心理学-ヴェルトハイマーの業績

ゲシュタルト要因(プレグナンツの法則)とは? デザインを見やすくする7つの法則を活用しよう

Law of Closure and Gestalt Psychology Best for Artists [Powerful!]

Visual Perception tutorial

Closure principle

Principle of Closure

東京在住のWEBデザイナー。 趣味:映画鑑賞、気分がノってる時の料理 好きな食べ物:ビリヤニ、野菜、虫 マイブーム:テキスト読み上げ機能での読書

「UX用語」のカテゴリー