상반된 위치 효과 (Juxtaposition)
서로 비교해보면 확실히 알 수 있게 만드는 나란히 배치하기의 힘
따로 볼 때는 몰랐지만 두 대상을 나란히 붙여놓는 순간 선명히 보이는 효과
정의
서로 상반되거나 대조적인 요소 두가지를 같은 시각적 범위 안에 배치해 각각의 특성을 더 강조하거나 두 요소 사이의 관계에서 새로운 의미를 찾아내도록 유도하는 인지적 현상
유래
이 효과는 본래 문화·예술 분야에서 서로 어울리지 않는 단어나 이미지를 배치해 긴장감을 주는 기법에서 출발했다
현대에 이르러서는 인간의 뇌가 절대적 수치보다 상대적 차이에 더 민감하게 반응한다는 인지심리학의 대비 효과(Contrast Effect)와 결합해 UX 디자인의 핵심 원칙으로 정착했다
예시
•
플랜 비교 : 무료(Free)와 유료(Pro) 플랜을 나란히 두어 결제 시 얻는 이득을 극적으로 강조한다
•
비포&애프터 : 변화의 효과를 극적으로 느끼게 하기위해 사용한다
•
명도 대비 : 어두운 배경에 밝은 텍스트를 배치해 가독성을 극대화하는 것도 시각적 병치의 일종이다
활용
디자이너는 사용자가 빠르게 판단하고 행동하게 만드는 비교의 기준점을 설계해야 한다
•
대비효과를 사용해 의사결정 보조 :
사용자가 고민할 때 두 옵션을 나란히 배치하면 정보 인출 과정 없이 그 자리에서 인식하고 선택할 수 있다
사용자가 고민할 때 두 옵션을 나란히 배치하면 정보 인출 과정 없이 그 자리에서 인식하고 선택할 수 있다
•
이미지 슬라이더 : 슬라이더 핸들을 좌우로 밀며 2개의 이미지를 실시간으로 비교하게 만드는 인터랙션
상반된 두 요소를 어디에, 얼마나 가까이 두느냐에 따라 사용자 인식이 완전히 달라질 수 있다
사용자의 시선과 마음을 사로잡는 강한 대비를 만들어내야한다