커머스 UX의 유용성과 혼란 사이 균형 잡기

장세희🥐🥨🥯·2023년 12월 4일

1. 오늘의 아티클 주제

1️⃣ 커머스 상품 목록과 2️⃣ 상품 탐색 경험 개선!

2. 아티클 정보 요약

상품 목록의 복잡함을 다루는 방법

1. 서비스 특성을 고려하자

목적형 쇼핑 사용자는 검색과 필터, 정렬과 같은 기능을 활용하고 상품을 상세히 확인하고 싶을 때 상세 페이지로 접근합니다.
발견형 쇼핑 사용자의 경우 목록을 좀 더 빠르게 스크롤하며 정보를 '훑어보며'확인합니다.

모든 커머스는 어느정도의 상품 상세 정보를 목록에서 제공해야 할 필요가 있지만, 그중에서도 발견형 쇼핑을 중심으로 설계되어 있는 서비스에서는 목록을 빠르게 훑어보는 사용자 행태를 고려해 여러 정보를 목록에서 바로 확인할 수 있도록 하는 것이 더 중요합니다.

2. 사용자 중심으로 정보를 제공하자

정보는 사용자 입장에서의 상품 이점을 중심으로, 하나의 속성에 단일한 정보를 제공하는 것이 좋습니다.
가격, 배송, 상품 옵션, 리뷰 등 정보를 제시할 때 사용자가 마주쳤을 때 머릿속에서 계산을 여러번 소화해야 하는 혼란스러움은 반드시 제거해야 합니다.
한 모듈에 정보가 많이 들어가더라도 명확한 정보 전달만 된다면 오히려 더 효율적인 탐색에 도움을 줄 수 있을 것입니다.

3. 체계와 위계를 부여하자

사용자에게 필수적인 정보
사용자가 인식하는 정보끼리의 유사성
우리가 사용자에게 반드시 강조하고 싶은 항목
일반적으로 커머스 서비스를 이용하면서 익숙한 체계와 위계
등을 고려해 목록의 상품 모듈의 체계와 위계를 기획해야 합니다.

필수 정보는 강조해 보여주고, 덜 중요한 건 팝업이나 아코디언에 숨기고, 비슷한 요소들끼리는 같은 UI로 묶어서 사용자가 목록을 살피면서 피로가 아닌 흥미를 느낄 수 있도록 다양한 요소를 고민해야 합니다.

11번가의 상품 탐색 경험 개선

오픈 마켓은 하나의 상품을 다양한 판매자들이 등록/ 판매하고 있어 판매자 수만큼이나 다양한 가격과 혜택이 존재합니다. 사용자들은 그 사이에서 최저가 상품을 찾고자 검색결과 화면과 상품상세 화면을 반복적으로 이동하며 탐색 하는 과정을 거칩니다.

기존 상품 상세 화면이 판매자가 등록한 내용을 사용자가 쉽게 잘 확인할 수 있도록 하는 것에 집중했다면, 새롭게 추가된 상품 상세는 11번가에 등록된 상품 중 옵션별 최저가 상품을 찾아, 사용자들이 옵션을 탐색하듯 최저가 상품을 둘러볼 수 있도록 화면을 구성

새로운 상품 상세