Gestalt 법칙, 게슈탈트 5원칙으로 보는 그룹화

한 줄로

1920년대 독일 심리학자들이 정리한 "사람이 시각 정보를 어떻게 그룹화하는가"의 법칙들입니다. UI 디자인의 가장 오래된 기반입니다.

어디서 왔나

1910년대 독일에서 시작된 게슈탈트 심리학(Gestalt psychology)입니다. 막스 베르트하이머, 볼프강 쾰러, 쿠르트 코프카가 핵심 인물입니다. 독일어 Gestalt는 "형태, 전체"를 뜻합니다. 핵심 주장은 "전체는 부분의 합 그 이상이다"입니다.

그들은 사람의 시각이 무작위가 아니라 그룹화 법칙을 따른다고 봤습니다. 핵심 5법칙입니다.

1. Proximity (근접의 법칙)

가까이 있는 것끼리 같은 그룹으로 인식됩니다. 폼 디자인에서 라벨과 입력 필드를 가까이 두는 이유입니다.

2. Similarity (유사의 법칙)

모양·색·크기가 비슷한 것끼리 같은 그룹으로 인식됩니다. 동일한 스타일의 버튼들을 묶어서 보게 됩니다.

3. Closure (폐쇄의 법칙)

빠진 부분을 채워서 인식합니다. 점선으로 그린 사각형도 사각형으로 보입니다. NBC 로고의 새가 흩어진 색 조각으로 보입니다.

4. Continuity (연속의 법칙)

연속된 선·곡선을 따라가는 경향이 있습니다. 차트의 데이터 포인트를 선으로 잇는 이유입니다.

5. Common Region (공통 영역의 법칙, 1992 Palmer 추가)

같은 박스/영역 안에 있는 것끼리 그룹화됩니다. 카드 디자인의 기반입니다.

UI 적용

• 버튼 그룹: 비슷한 색·크기로 묶음 (similarity).
• 폼 라벨: 입력 필드 바로 위/옆 (proximity).
• 카드 UI: 박스 안에 제목·이미지·설명을 묶음 (common region).
• 로고 디자인: 빠진 형태를 인식하게 (closure). IBM, FedEx의 화살표, Apple 사과의 한입.

바이브 메이커가 챙길 한 가지

좋은 레이아웃은 게슈탈트 법칙을 명시적으로 의식하지 않아도 따라가는 디자인입니다. 라벨이 입력 필드에서 너무 멀면 사용자는 무의식적으로 다른 입력 필드의 라벨로 오해합니다. 간격은 의미를 만듭니다.

관련

Visual hierarchy · Common region · Card