유사성 원리에 따른 UI 디자인 잘 된 사례, 아닌 사례 비교

잘된 사례

유사성의 원리가 잘 적용된 사례로 퍼블리의 웹 사이트를 찾았습니다.

퍼블리는 컨텐츠를 직사각형의 이미지로 소개해 줍니다.

그러나 상대적으로 중요도가 떨어지는 정보(인기 컨텐츠 순위)는 신규 발행 컨텐츠에 비해 크기를 줄여 배치하여 부수적인 요소임을 사용자가 인지하기 편하게 디자인 하였습니다. 또한 컨텐츠 간의 간격을 충분히 넓게 배치하여 근접성 원리에 따라 각각 컨텐츠도 구분이 쉽도록 도와 주고 있습니다.

아닌 사례

유사성 원리가 아쉽게 적용된 사례로 우체국 택배 접수 시스템을 찾았습니다.

각 버튼의 색깔과 크기, 배치까지 모두 제각각이라 각 버튼의 기능과 위계를 알기 어렵습니다.

상대적으로 중요한 택배 접수용 버튼은 크기를 조금 키우고 색깔을 빨간색으로 배치하여 상대적으로 주목이 되나 미예약 확인, 조회 버튼도 빨간색으로 처리하여 혼선을 줍니다.

또한 유사성의 원리는 아니지만 CTA 측면에서도 사용자가 다음에 무슨 행동을 우선적으로 취해야 할 지 알기가 어려워서 헤매이게 되는 디자인입니다.

가장 중요한 ‘등록’을 ‘택배 등록’ 이라는 이름으로 통일하고, 그 다음으로 중요한 ‘라벨 인쇄’를 부각하여 CTA만 개선해도 훨씬 사용하기 편한 디자인이 될 듯 합니다.