クイック エンジニアリングブログ

株式会社クイック Web事業企画開発本部のエンジニアリングチームが運営する技術ブログです。

ゲシュタルトの法則をおもいだしてみる

こんにちは、いのっちです。

今日は人間がものを見るとき、塊としてまとめて知覚してるよという話。
そう、ゲシュタルトの法則をご紹介します。

ゲシュタルトの法則とは

人がものを見て知覚するとき、無意識の内にまとめてみる特性があり それが起こる際の法則をゲシュタルトの法則といいます。

ゲシュタルトの法則は下記の7つがあります。

ゲシュタルトの法則
1.近接 (Ploximity)
2.類同(Similarity)
3.連続(Continuity)
4.閉合(Closure)
5.共通運命(Common Fate
6.面積(Area)
7.対称性(Symmetry)

さて、どんなものか見ていきましょう。

近接 (Ploximity)

距離が近いものをグループとして認識します。

↓の画像を御覧ください。どのように見えますか?

f:id:aimstogeek:20181026112457p:plain:w300

きっと、このようなグループであると感じたのではないかと思います。

f:id:aimstogeek:20181026113214p:plain:w300

類同(Similarity)


類同は色、形、向きなどが同じものをグループとして認識します。

f:id:aimstogeek:20181026124704p:plain:h300

上の画像も↓のように感じますよね
f:id:aimstogeek:20181026125204p:plain:h300

連続(Continuity)


連続は線を見た時、変化や切れ目がない1本の線としてみることです。

f:id:aimstogeek:20181026132903p:plain:w300
この画像はどう見えますか?

f:id:aimstogeek:20181026133133p:plain
きっと、①のような2本の線に見えたのではないでしょうか。
②や③のような線が集まっているようには感じられなかったと思います。

閉合(Closure)


閉合は閉じた形をみたときに1つのグループとしてみることです。

f:id:aimstogeek:20181026135910p:plain:w300
それでは見てみましょう!

f:id:aimstogeek:20181026135723p:plain
これも①のような3つの楕円が重なっていたように見えますよね。
②のような欠けた楕円と模様の入った楕円であるとは思わなかったのでは無いでしょうか。

共通運命(Common Fate


移動の方向や点滅などの周期が同じであるものをグループとしてみることです。

f:id:aimstogeek:20181026150011p:plain:w300

上2つのマルが左、下2つのマルが右に動いている場合、↓のようにグループ化して見てしまいます。

f:id:aimstogeek:20181026151634p:plain:w300

面積(Area)


図形の中に図形がある場合、中の図形をメインの図形として認識します。

f:id:aimstogeek:20181026154859p:plain:w300

対称性(Symmetry)


左右対称のものには、何らかの意味を見出してしまいがち

f:id:aimstogeek:20181026162350p:plain
生成したランダムドットの画像(左)を加工して、左右対称化した画像(右)を作りました。どこか気になる点はあるでしょうか。

f:id:aimstogeek:20181026163051p:plain
円で囲んだ部分、何か顔に見えてきません?
顔があると、なんだか意味のある画像に思えてきます。

最後に

実は「ゲシュタルト」って言いたかっただけなんです。
なんか、中二っぽくてかっこいいですよね。
ゲシュタルト

ゲシュタルトの法則は日常のデザインの中でよく使われています。
皆さんの身の回りのものを法則に照らし合わせ、「あっ、あれは○○の法則だな」とニンマリしてみると、楽しくデザインについて素養がつくと思います。ぜひお試しを。


\\ 『明日のはたらくを創る』仲間を募集中!! // 919.jp