본문 바로가기

IT & SNS/UI&UX

LAW OF UX - 06. Law of Common Region

Elements tend to be perceived into groups if they are sharing an area with a clearly defined boundary.

요소는 경계가 명확하게 정의 된 영역을 공유하는 경우 그룹으로 인식되는 경향이 있습니다.

요소 또는 요소 그룹 주위에 테두리를 추가 (공통 영역 만들기)하면 주변 요소를 쉽게 분리 할 수 ​​있습니다. 

공통 영역의 원리는 근접성과 밀접한 관련이 있습니다. 개체가 같은 닫힌 영역 내에 위치하는 경우 우리는 이것을 하나의 그룹으로 인식하게 됩니다.


경계 나 다른 가시적 장벽을 추가하는 것은 개체 그룹이 근접성, 모양, 색 등이 동일한 경우에도 개체 그룹간에 인식되는 분리를 만드는 가장 좋은 방법입니다. 

공통 영역 원칙의 예 
아래 Pinterest의 예에서 공통 영역 원칙은 사진, 제목, 설명, 기고자 및 기타 세부 사항을 포함하여 각 핀을 주변의 다른 모든 핀과 분리하는 데 사용됩니다.


그리고 아래의 Facebook 예에서 댓글, 좋아요 및 상호 작용이이 특정 게시물과 관련되어 있으며 게시물을 둘러싼 다른 게시물과 관련이 없음을 알려줍니다.

 

...더보기

게슈탈트 원칙이란?

 

그룹화 원칙 (또는 Gestalt 그룹화 법칙)은 심리학의 일련의 원칙으로, Gestalt 심리학자가 처음으로 인간이 자연적으로 대상을 조직화 된 패턴과 대상, Prägnanz이라고 알려진 대상으로 인식한다는 관찰을 설명하기 위해 제안합니다. 게슈탈트 심리학자들은 이러한 규칙이 존재한다고 주장하는데, 이는 마음이 특정 규칙에 따라 자극의 패턴을 인식하는 타고난 성향을 가지고 있기 때문이다. 이러한 원칙은 근접성, 유사성, 연속성, 폐쇄성 및 연결성의 5 가지 범주로 구성됩니다.


시각 지각 의 게슈탈트 (Gestalt) 원리로 알려져 있으며 기본적으로 뇌가 어떻게 구조를 만드는지 자세히 설명합니다. 그러나 왜 웹과 모바일 디자인에서 이것을 이해하는 것이 중요한가? 

디자이너가 게슈탈트 원칙에 관심을 가져야하는 이유 
훌륭한 디자이너는 시각적 인식에서 심리학이 수행하는 강력한 역할을 이해합니다. 다른 사람의 눈이 디자인 작품을 만나면 어떻게됩니까? 작품이 공유하는 메시지에 대해 마음이 어떻게 반응합니까? —Laura Busche, Autodesk 브랜드 콘텐츠 전략가 

위 인용문을 잠시 생각하십시오. 사람들이 처음 내 디자인을 볼 때 어떻게 경험합니까? UI 디자인의 작동 원리를 이해하려면 인간 인식의 심리학을 이해해야합니다. 

게슈탈트 (Gestalt) 원칙에 적용되는 기본법은 우리가 경험을 규칙적이고 질서 있고 인식 가능한 방식으로 주문하는 경향이 있다는 것입니다. 이것이 우리가 복잡하고 혼란스러운 세상에서 의미를 만들 수있게 해주는 것입니다. 그리고 이러한 원칙들이 어떻게 작동하는지 확실하게 이해하면 세 가지 방법으로 도움이 될 것입니다. 

1. 주어진 상황에서 가장 효과적인 디자인 요소를 결정하는 데 도움이됩니다. 예를 들어 시각적 계층 구조, 배경 음영, 그라디언트 및 유사한 항목을 그룹화하고 다른 항목을 구별하는 방법을 사용하는 경우. 

2. 이러한 심리적 원리는 시각적 인식에 영향을 미치는 힘을 지니고있어 디자이너는 특정 초점에 관심을 집중하고 특정 행동을 취하고 행동 변화를 일으킬 수 있습니다. 

3. 마지막으로 최고 수준에서 Gestalt 원칙은 고객의 문제를 해결하거나 사용하기에 아름답고, 즐겁고, 직관적 인 방식으로 사용자의 요구를 충족시키는 제품을 설계하는 데 도움이됩니다. 

게슈탈트 7 가지 법칙과 원리 

1. Figure-ground 
2. Similarity 
3. Proximity 
4. Common region 
5. Continuity 
6. Closure 
7. Focal point 

상세 내용 확인 : https://www.usertesting.com/blog/gestalt-principles/

 

'IT & SNS > UI&UX' 카테고리의 다른 글

LAW OF UX - 11. Miller’s Law  (0) 2019.08.18
LAW OF UX - 10. Law of Uniform Connectedness  (0) 2019.08.18
LAW OF UX - 09. Law of Similarity  (0) 2019.08.18
LAW OF UX - 08. Law of Proximity  (0) 2019.08.18
LAW OF UX - 07. Law of Prägnanz  (0) 2019.08.18
LAW OF UX - 05. Jakob’s Law  (0) 2019.08.18
LAW OF UX- 04. Hick’s Law  (0) 2019.08.18
LAW OF UX - 03. Fitts’s Law  (0) 2019.08.18
LAWS OF UX - 02. Doherty Threshold  (0) 2019.08.18
LAWS OF UX  (0) 2019.08.13