センスにつながる、ゲシュタルトの法則。初心者デザイナーさんが知ってると便利なデザイン原則

すぐ使えるテクニック

センスって何だと思いますか?

私は、「デザインを見た人の中で生み出したい気持ちをできるだけ的確に作り出す力」「感覚的に意図した感情を相手の中で作り出す力」だと思います。

これまでデザインの仕事をしてきてそう思います。
(個人的な見解ではあるのですが

でも、センスの身に着け方なんて、いまいちどうしたらいいのかわかりませんよね。
色々なデザインを観察して自分の引き出しを増やしていくということしか私も思いつけません

でも、「センスがいい」とか「センスあるね」と言われるためのポイントはあると思うんです。
そして、そのポイントこそがセンスアップのカギではないでしょうか。

今回は、そんなセンスのポイントとなる「ゲシュタルトの法則」についてお話していきたいと思います。

ゲシュタルトの法則って?

ゲシュタルトの法則とは、見たものをまとめて認識する性質のことをいいます。
具体的には、似たものをひとつのグループと考えたり、何か法則を見出したり、図として認識したり
私やあなた(人間)のこのような傾向のことです。

たとえば、雑誌のコラムを読んでいるとき、文章があってその近くにイラストや画像があると思います。
そのとき、あなたは自然と、文章の近くにあるイラスト(画像)がその文章を説明しているんだと思いますよね?

ほかに、デパ地下でお土産を買うとき、あなたはそれぞれのお店の商品がどこからどこまでなのか、なんとなく分かりませんか?
お店とその店の商品が近い位置にあるのでわかることではないでしょうか。
感覚的に、店頭に並ぶ商品をそのお店の商品だと分かりますよね。

このように、近くにあるもの同士に関連性を感じたり同じグループだと認識することもゲシュタルトの原則のひとつなんです。

ゲシュタルトの法則。
デザイナーさんでも、ノンデザイナーさんでも一度は聞いたことのある言葉ではないでしょうか。

デザイン制作でも、構成を考えるときなどよく使われます。
使われるというよりも、無意識にそうしているデザイナーさんも結構多いでしょう。

何か説明を要約して伝える図(図版)のような「わかりやすく伝えるデザイン」には特によく使われているイメージがありますね。


ゲシュタルトの法則がどういうものかというお話が少し長くなってしまいました

さて、ここからは「相手が感覚的にそう思う」状態を作るための詳しい法則について一緒にみていきましょう!
※ゲシュタルトの法則の詳しい内容です

近接の法則

まずは、近接の法則からです。
人は、近くにあるもの同士を同じグループのものだと認識しやすいです。この傾向のことを接近の法則といいます
関係なさそうなものでも、近くにあると同じ系統のもの・同じグループのもの・仲間だと思われやすいです。

どんなところで使われているかというと
たとえば、写真と文章。
何か文章があってそのすぐ横にお花見の写真があると「この写真はこの文章を表しているんだな」と思ったことはありませんか?

これは、近くにあることで関連性を感じるからなんです。
仮にもし、写真が文章と関連性のないものであっても、何か関係があるんだろうと思われる可能性が高いです。
(情報はできるだけ正確に伝わらないと意味がないので、もちろん写真は文章と関連性のあるイメージを使いましょう

近接の法則は、余白とセットで使われることが多いです
上の画像では「アイコン+テキスト+余白」をはさんで繰り返し配置されています。

このように同じグルーブのものだ(関連性がある)と見せたいものは近くに配置します。
反対に、違うものだと伝えるためには、十分な余白をとることがポイント
です。

ただし、ず~っとひとつのデザインに悩んでいると、余白をとりすぎることもあります。

私の場合は、よくデザインの下の方に多めに余白をとってしまいがちです。
したがって、余白については新しい目で最終確認することも忘れないようにされてくださいね。

類同の法則

類同の法則は、色や形・向きが同じものを同グループ・仲間・関連性のあるのものだと認識されやすいというものです

特に情報をわかりやすく説明するデザイン(フロー図やニュースなどでよくみるフリップなど)では、色でグループ分けをされていることが多い印象です。
いろいろなデザインを見る中で、個人的には、色でグループ分けをしているものが多い気がします。

閉合の法則

閉合の法則は、考え方が2通りあります。

①「」や()・【】のように=”綴じる形は二つで一セットだと認識されやすい。

②一部が欠けていると、欠けた一部を埋めようとする心理的な効果。

①はわかりやすいですね。
ですので、②についてお話していきましょう。

②の例を挙げるなら、例えばハート形。
場合にもよりますが、下の図のようにハート型を思わせるような形を見ただけで、「これはきっと最終的にハートの形になるんだな」と、欠けるた部分が想像できますよね。
そして、無意識に完成したハート型を思い描いたような経験はありませんか?

このように想像する理由は、未完全なものを感じとって、その欠けた部分を埋めようとする心理的な効果が働くからだといわれています。

デザインで応用するとすれば、
①は、制限があってあまり色や効果で強調できないときにおすすめしたいです。
加えて、【】がひとつのまとまりだと思われるので、【】の文字は最後まで読んでもらいやすくなります

もちろん協調なので短い内容を【】の中に入れるのがおすすめです。
いくら閉合の法則とは言っても、【】内の内容が長すぎると読んでもらいにくくなるからです。

SNSのような文字だけで表現する場所で強調したい場合にも最適ですね。

②は、デザインの背景として使うほか、視点のはじまりにアイキャッチとして配置してもよいでしょう。
相手は、形の欠けた部分を頭の中で思い描くので、それをデザイン内容(情報)をみてもらうための入り口(とっかかり)にするのです。

ほかにも応用方法はたくさんあると思いますので、ぜひいろいろ試してみてくださいね。

共通運命の法則

運命共同の法則は、同じ向きに動くもの、一定の間隔で点滅するものを同じグループだと思われやすいというものです。

これは、動きがあるというところがポイントです。
形よりも動きが同じ方がグループだと思われやすい特徴もあります。「形<同じ動き

そして、近の法則や類同の法則よりも、より強い効果があると言われています。

たとえば、インターネットサイトで下へスクロールすると一緒に動くスクロールバー。
画面とスクロールバーの動きが同じなので、同じグループ(=スクロールバーの動いた分下に進んだなど)だと思えます。

エスカレーターで同じ方向に向かっている人々は同じグループだと思うのもそのひとつ。

ただ、「動きがある」というのは、実際に動いているものだけのことではありません。
同じ方向を指す矢印がいくつか並んでいても同じグループだと思われやすいです。


ですので、紙のデザインでも、▼(三角)や矢印(→)で方向をつくってあげると動きができるので、同じ方向のものは線などで区切らなくても同じグループだと思ってもらいやすくなりますよ。

フロー図やステップ図などにもおすすめです。

ちなみに、散歩の途中でも共通運命の法則を見つけました↓
自転車の進行方向を表すイラストです。

連続の法則

連続の法則は、連続性のあるものは、まとまっていると理解されやすい傾向のことです。
連続性の高いものはよりまとまって理解されやすいです。


■連続性の高いについて…
・違う形が並べられるより、同じ形が並べられている方が連続性が高い
・同じ形が横に並んでいるより、同じ形が重なって並んで違法が連続性が高い
と言える

たとえば、正円が重なっているとベン図だと思いますよね?
「月形とマドレーヌの形がならんでるなあ」と思うことはあまりないはずです。

面積の法則

面積の法則は、図形が重なっているとき、大きなものが背景となり(後ろにある)、小さいものが手前にあるように見えるという法則です。

たとえば、Webサイトのトップ画像やバナーは、画像やテクスチャの上に文字が置かれていると思います。
パッとみただけで、「文字の後ろの画像は背景だ」とわかりますよね。
それは、画像やテクスチャが文字よりも面積が大きく、背景として認識されるからです。


図形が重なっている(色が重なっている)とき、小さい面積の方が前にあると思われるため、立体的・空間を感じさせるような演出をしたいときにも活用できるでしょう


特に、webサイトのボタンでは、その小さい図形に影を付けるとより立体的な演出になり、立体的なボタンはクリック率も上げやすいという分析もあるようです。


また、2色しか使わないシンプルなイラストにも使えるでしょう。

まとめ

あなたがデザインを作っているとき、なんだかまとまりがないなとか、ちょっとわかりにくいかなと感じた時は、ぜひゲシュタルトの法則たちを思い出してみてください。

「なんとなく」という感覚的なものって意外と法則や心理効果に当てはめてみると解決することがありますよ。
また、同じグループ・違うグループにみせたいときにも、ぜひぜひ今回の法則たちを思い出してみてくださいね。

以上、抹本でした。

このブログは個人的な研究や視点・観点をもとに執筆しています。
したがって、読者さんのデザインや広告内容の売上等を確実にアップさせるというものではありません。
あくまでこんな工夫があるんだなという観点でよんでいただけると嬉しいです。

抹本について
この記事をかいた人
designkagaku

プロフィール

□■□ 名前 : 抹本 港 □■□

同じものでもデザインを着せればお客さんの反応が変わる!
無駄になるようなデッドストックも表現の方法を変えて欲しいという人をつくる!
そんなプロジェクトのために勉強&実践している現役デザイナーです。

▼経歴などの詳しいプロフィール上の「designkagaku」を押してください。
プロフールのページへ移動します。(下記のページへ移動します)
https://design-kagakusiki.com/profile/hajimeni/

個人的には、お土産のパッケージや雑貨屋さんの封筒・カードデザインとか。つい目がいって長居してしまいます…

まだまだブログには不慣れですがよろしくお願いします!

designkagakuをフォローする
すぐ使えるテクニック デザインの基本編 心理学のテクニック
スポンサーリンク
スポンサーリンク
                          \ この記事をシェアする /
designkagakuをフォローする
リアクションのために私が実践してるデザインのテクニック

コメント

タイトルとURLをコピーしました