LINE
MAIL
目次をチェック
デザインの世界において広く知られている、ゲシュタルト原則をご存知でしょうか。
心理学者のマックス・ヴェルトハイマーを中心として創設されたゲシュタルト心理学の代表的な要素で、人がものを見た時の認識に関する法則です。
多くのデザイナーが基礎として学び、時には無意識的に取り入れています。
人間の視知覚心理を理解すると、より使いやすいUIデザインを設計することができるでしょう。
今回は、ゲシュタルト原則をデザインに活かす方法をご紹介します。
ゲシュタルト原則とは
ゲシュタルト原則とは、複数のものを個々として捉えず、全体を1つの集合体として捉えるという視知覚要因からなるものです。 簡単に言うと、星座を知らない人にとっては、夜空に広がる満天の星は、ただ星がバラバラに広がって見えているのです。 しかし、オリオン座や北斗七星などの星座を知る人が見ると、まとまった1つの星座に見えます。 この現象が、ゲシュタルトです。 人間の認知機能は、単体でものを感じ取るだけでなく、まとまりとして全体を感じ取る機能があります。 ヴェルトハイマーが運動視や思考研究を発表したことで、この原則が知られるようになりました。
ゲシュタルトの基本7原則
ゲシュタルト原則は、ものの見え方や感覚に関する要因が多数あります。 ここでは、基本の7原則と、デザインに活かす方法を見ていきましょう。近接
近接の要因は、距離が近い要素を関係が深い同一グループと認識する法則です。 それぞれ要素の数が違っていても同一と見ますが、距離が遠くなると別の群になるのです。 例えば、アイコンやテキストをつくるとき、段を詰めすぎると見づらくなります。 しかし、適度な空白や同じ意味がある内容を近くに置くと、まとまりが出て見やすくなるのです。類同
類同の要因は、色・形・方向が同じか似たものを、同一グループと認識する法則です。 要素の数が違っていても同一と見ますが、似た要素がなければ、別の群になるのです。 例えば、アイコンやテキストをつくるとき、同一要素ならサイズを揃えます。 1つだけサイズを揃えず、色や形を変えると、そのアイコンだけ別の仕様だと認識されるのです。連続
連続の要因は、連続してつながる図を1つのまとまった図として認識する法則です。 例えば、文字の「X」は、4本の線が中心でくっつくと考えるか、「＞」と「＜」が頂点で交わっていると考える可能性があります。 しかし、ほとんどの人は2直線が交わっていると考えるでしょう。 例えば、グリッドレイアウトは格子状のマス目にコンテンツを並べるため、連続に通じるものがあります。 また、同じボタンの並びが続くと、自然に視線を次のボタンへ移すこともできるでしょう。閉合
閉合の要因は、閉じると完結する領域のものは、1つの同一グループと認識する法則です。 例えば、「」や【】といった記号は2つで1セットと理解できますが、＜）や【＞は、1セットと考えることが難しいでしょう。 また、人の脳は線が欠けた未完全な図を見たとき、1つの図として欠落部分を補完する傾向があります。 この傾向を応用した水平スクロールは、画面の端に次のコンテンツを少し表示することで、誘導する可能性を高めています。共同運命
共同運命の要因は、同じ動作をするものを同一グループと認識する法則です。 視覚的要素が違っても、動く方向や速度が同期していれば、関連するものと判断できます。 しかし、方向・タイミング・速度が同期していなければ、関連性は弱まり、認識しづらくなるのです。 デザインで例えるなら、ブラウザのスクロールバーがあります。 スクロールバーは画面を操作したとき、同時にこのパーツも上下するため、全体の位置や操作の方向が正しいと理解することができます。面積
面積の要因とは、重なった図を見たとき小さい面積がメインになり、大きい面積は背景と認識する法則です。 例えば、大画面に小さい文字を使うと、文字が前に浮き出るように見える感覚です。 注目度を高めたい時は、全画面に写真を表示した上に、ロゴやテキストを使うというケースが多いといえるでしょう。 そのため、大きな写真を背景にして、小さいロゴやテキストを使用する方法は、Webサイトのトップページで多く見られます。対称性
対称性の要因は、左右対称にあるものを1つのグループと認識する法則です。 バランスが良く対照的な図は、対称線を境に視覚的要素が違っても、共通のものと認識します。 対称性を応用する手法は、Web業界でよく用いられているのです。 中でもスプリットスクリーンは、シンメトリー、アシンメトリーなどの様々なレイアウトができます。 エリアの使い方をメインとサブに分けるなど、工夫次第で機能的かつメッセージ性のある表現が可能です。UIデザインとの関係性
ゲシュタルト原則は、UIデザインにおいて重要な考え方の1つです。 人が無意識に認知する心理を応用した手法は、何かを見せて伝えるときに大きな影響をもたらします。 そのため、何かをつくり発信する材料の基礎として、多くのデザイナーが学んでいるのです。 優れたUIのWebデザインは、人の想像力をかき立てる魅力があります。 説明なしに魅せられ、視点や想像を楽しませるものは、往々にしてこの基本原則が取り入れられています。まとめ
今回は、ゲシュタルト原則をデザインに活かす方法をご紹介しました。 メニューの配置がバラバラで整理できていないWebサイトは、使いづらく閲覧時のストレスも高まります。 ゲシュタルト原則を用いた手法は、人の意識に影響を与えます。 感覚的につくる一方で、この原則をあてはめた理論的なデザインを魅せるのも良いでしょう。 
電話によるお問い合わせ
メールによるお問い合わせ
LINEでお問い合わせ