👀 최근 본 상품, 어떻게 활용해야 할까?

안녕하세요. 구독자님, 오늘도 팁스터 뉴스레터와 함께 해주셔서 감사합니다.
팁스터 이번 주제는 '최근 본 상품' 화면입니다. 최근 본 상품 화면이 어떤 역할을 하고 있으며, 각 서비스는 해당 화면을 어떻게 구성하고 활용하는지 자세히 들여다볼 예정입니다. 

👀 오늘 살펴볼 유형과 서비스

메인(홈) 화면에서 최근 본 상품 확인 : 오늘의집, 네이버 쇼핑, 카카오 메이커스
최근 본 상품 화면 내 다양한 정보 확인 : G마켓, SSG 새벽배송, 멜리즈
날짜에 따라 최근 본 상품 확인 : G마켓, 네이버 쇼핑, 위메프, 코오롱몰, W컨셉
하단 탭 메뉴를 통해 최근 본 상품 확인 : 신세계 라이브 쇼핑, 올리브영, HAGO, 제철밥상
마이페이지를 통해 최근 본 상품 확인 : 쿠팡, 라운즈, 아마존

🐳 메인(홈) 화면에서 최근 본 상품 확인

홈 화면에서 최근 본 상품을 확인할 수 있다는 건, 탐색 과정에서 확인을 상대적으로 쉽게 할 수 있다는 것을 의미합니다. 별도 메뉴 등을 통해 들어가지 않아도, 앱을 다시 실행하거나 홈 화면으로 돌아와 탐색을 하며 자연스레 리스트를 접하고 확인할 수 있기 때문입니다.

인지를 쉽게 하기 위해 하단 탭 등에 최근 본 상품 메뉴를 배치하는 경우도 비슷한 이유일 수 있지만, 홈 화면에서 보여주는 방법은 탐색의 흐름을 유지할 수 있다는 점에서 차이가 있는데요. 오늘의집, 네이버 쇼핑, 카카오 메이커스 사례를 통해 홈 화면 내 최근 본 상품을 어떻게 보여줄 수 있는지 자세히 살펴보겠습니다.

오늘의집, 네이버 쇼핑, 카카오 메이커스

오늘의집은 (1) 쇼핑 홈 화면 내, ‘최근 본 상품'이라는 이름으로 리스트를 노출합니다. 기본적으로 상품명, 할인 여부, 가격, 리뷰 및 평점 등의 정보를 확인할 수 있으며, 더보기 등 별도 화면으로 이동은 제공하지 않습니다. 눈에 띄는 건, 바로 아래 ‘내가 본 상품의 연관상품' 리스트를 제공한다는 점입니다. 두 영역이 연결되어 있어 내가 본 상품과 연관 상품을 함께 살펴볼 수 있다는 장점이 있습니다.

한 가지 생각해볼 내용은 본 상품과 연관상품의 맥락을 현재 구성에서 사용자가 쉽게 이해할 수 있을까?입니다. 올리브영은 최근 본 상품에 있는 특정 상품 아래로 연관상품을 제안하며, 더보기도 이때 활용할 수 있습니다. 같은 공간에서 두 상품을 함께 볼 수 있다는 건 동일하지만, 기준이 조금 다른 구성으로 볼 수 있는데요. 묶음 대 묶음이 아니라, 하나의 상품과 유사한 여러 상품을 함께 볼 수 있는 것 중 무엇이 더 밀접하게 다가올까 궁금합니다. 개인적으로는 후자가 더 좋은 사용성을 제공한다고 생각합니다.

(2) 네이버 쇼핑 역시 홈 화면 내 최근 본 상품을 보여주는데, 위치가 인상적입니다. 모든 상품 리스트 보다 우선순위가 높게 적용되어 있기 때문입니다. 다만, 상품 썸네일만 확인할 수 있어 이미지가 애매하게 적용된 경우 본 상품에 대한 파악이 어렵고, 이름이나 가격 등의 정보를 보기 위해서는 상세 화면으로 이동 등의 행동을 반복해야 하는 어려움이 있습니다.

(3) 카카오 메이커스는 홈 화면 첫 번째 탭을 ‘최근 본'으로 활용합니다. 확인 가능한 조건을 안내하고 있으며, 최근순으로 상품을 볼 수 있어요. 리스트에서 눈에 띄는 정보는 ‘주문 종료일'입니다. 정해진 기간 동안 주문이 가능한 서비스 특성상, 언제든 주문할 수 없다는 점을 간접적으로 제공하는 모습이에요.

(덧붙임 🐳) 카카오 메이커스 일정 기간 내 주문을 해야 조건이 충족되어 실제 상품을 받아볼 수 있는데요. 이런 상황이라면 접근이 쉬운 곳에 최근 본 상품 리스트가 제공되어야 합니다. 마이페이지 등에 있다면, 공간에 대한 인지는 물론 접근성이 떨어질 수 있어요. 최근 본 상품을 제공할 수 있는 위치는 정말 다양하지만, 어떤 공간에서 제공할까? 에 대한 답은 서비스 특성과 밀접하게 연결되어 있다는 사실을 다시 한번 알 수 있는 사례라고 생각합니다.

👻 최근 본 상품 화면 내 다양한 정보 확인

G마켓, SSG 새벽배송, meliz

최근 본 상품 화면에서 상품뿐만 아니라 다양한 정보도 제공한다면, 사용자의 편의성은 얼마나 높아질까요? 굳이 또 다른 액션을 취하지 않아도 최근 본 상품과 함께 다양한 정보를 확인할 수 있는 세 가지 사례를 찾아보았습니다.

G마켓은 (1) 최근 본 상품과 관심상품/매장을 함께 볼 수 있어요. 사용자가 최근 본 상품뿐만 아니라 그동안 관심을 표시한 상품, 매장까지 한 번에 확인하고 이동할 수 있는 구성입니다. 사용자는 자연스럽게 더 많은 상품에 접근할 수 있어요. 게다가 검색한 검색어까지 확인 가능한 모습입니다.

SSG 새벽배송은 (2) 상품, 검색어, 카테고리, 이벤트, 기획전 등 다섯 개의 정보를 제공해요. 오늘 소개하는 세 가지 서비스 중 가장 많은 정보를 제공하는 모습을 볼 수 있는데요. ‘카테고리, 이벤트, 기획전’ 정보까지 보여준다는 건, 사용자가 검색하거나 최근 본 상품이 많을수록 유용한 기능이 아닐까 싶어요.

또 사용자가 어떤 카테고리에 관심 있었는지 보여주는 ‘카테고리’ 필터를 통해 다양한 상품을 바로 볼 수 있는 모습과 장바구니, 하트 아이콘을 통해 최근 본 상품을 바로 장바구니와 관심 있는 상품으로 추가할 수 있는 버튼도 눈에 띕니다.

meliz는 (3) ‘최근 본 콘텐츠’로 묶어 표현하는 모습을 볼 수 있어요. 아이템과 패션톡, 브랜드, 컬렉션 네 가지를 함께 볼 수 있는데요. 이는 앱을 구성하는 핵심 기능입니다. 저는 이 네 가지 콘텐츠가 사용성에 많은 도움을 준다고 느꼈습니다.

(덧붙임 👻) 개인적으로 meliz의 구성이 좋다고 생각한 이유는 네 가지 콘텐츠를 기반으로 한 최근 본 화면 때문이에요. (1) 최근 본 아이템을 리스트로 먼저 볼 수 있고, (2) 아이템의 상위 구분이라고 할 수 있는 브랜드 역시 확인할 수 있어요. 마지막으로 (3) 카테고리 및 기획전에 맞게 넣어둔 컬렉션을 볼 수 있는 모습입니다. 

(1), (2)를 통해 사용자가 필요하고 관심 있는 아이템을 개별적으로 묶어 제공한다면 (3)을 통해 특정 컨셉의 아이템을 한꺼번에 만날 수 있는 기회를 제공하는 느낌입니다. SSG 새벽배송이 상품, 검색어, 카테고리, 이벤트, 기획전 등 총 다섯 가지로 구분한 것을 meliz 컬렉션에서는 이벤트와 기획전을 함께 제공합니다. 

또 패션 앱 사용자가 필요한 것은 다양한 제품을 원하는 가격대와 카테고리에 맞게 빠르게 찾을 수 있는 것일 텐데, 이 니즈를 최근 본 상품 페이지에서 한꺼번에 충족한다고 느꼈어요. 여러모로 변화하는 금액 및 특가를 제공하는 목적의 앱인 만큼, 해당 앱의 정체성을 느낄 수 있는 공간이란 생각이 들었습니다.

🍟 날짜에 따라 최근 본 상품 확인

대부분의 최근 본 상품 페이지는 상품을 본 순서에 따라 상품을 보여주고 있는데요. 몇몇 서비스들은 날짜로 구분을 주기도 해요. 언제 어떤 상품을 봤는지, 언제 어떤 카테고리나 브랜드를 확인했는지, 언제 어떤 키워드를 검색했는지 - ‘언제’를 좀 더 중요하게 생각하는 서비스라고 볼 수 있겠죠? 날짜 정보가 화면에서 어떻게 작용하는지 몇몇 사례를 통해 확인해 보겠습니다.

G마켓, 네이버 쇼핑, 위메프

G마켓, 네이버쇼핑, 위메프 - 이 세 오픈마켓이 제공하는 최근 본 상품 페이지의 공통점은 날짜로 페이지 구획을 명확하게 구분한다는 점입니다. 상품 썸네일이 위치하는 화면 좌측을 따라 시선을 쭉 내려보면 확실하게 느껴지는데요. 날짜와 상품 썸네일이 같은 위치에 나타나고, 날짜가 굵은 글씨로 강조되어 있어 날짜에 시선이 한 번씩 걸리도록 유도했어요.

(1) G마켓은 히스토리 각각을, (3) 네이버쇼핑은 날짜 단위 히스토리를 박스 형태로 표시해 상품과 상품, 날짜와 날짜 사이의 구분을 더 강조합니다. (5) 위메프는 ‘찾으시던 상품과 비슷해요’라는 영역을 만들어 가장 최근 날짜와 다음 날짜 사이를 간격을 더 벌렸어요.

날짜가 중요한 이유에는 몇 가지 가설을 떠올려볼 수 있습니다. 오픈마켓의 특성에서 고민을 시작해 보면 좋을 것 같은데요. 우선 이들은 다양한 카테고리를 다룹니다. 그리고 유저 대부분은 하나의 카테고리에 집중해 서비스를 탐색할 가능성이 높아요. 식재료를 사야 하는 날에는 식재료 카테고리를, 인테리어 소품을 사고 싶은 날에는 인테리어 카테고리를 둘러보는 방법입니다.

키워드나 카테고리로 묶이는 개별 히스토리가 날짜로도 묶인다면 특정일에 내가 둘러본 특정 카테고리 제품들을 쉽게 비교할 수 있지 않을까요? (2), (4), (6) 개별 히스토리를 삭제할 수 있게 한 것은, 비교 후 사지 않을 상품들은 쉽게 삭제하고 구매할 가능성이 높은 상품은 다시 빠르게 확인할 수 있도록 하기 위한 방법이라고 생각합니다.

코오롱몰, W컨셉

코오롱몰과 W컨셉은 위 예시와 비교하면 날짜가 덜 강조되는 UI로 보여요. 날짜에 따라 최근 본 상품을 나열할 때 선을 메타포로 사용하는 경우가 많은데요. 위 오픈마켓 예시는 이 선을 날짜를 기준으로 끊었다면, (1) 코오롱몰과 (3) W컨셉은 히스토리가 라인을 타고 노출됩니다. 코오롱몰은 날짜를 선 위에 같이 노출하지만 강조하지 않고, W컨셉은 날짜를 아예 화면 중앙에 배치해 시선 밖으로 보냈습니다.

코오롱몰과 W컨셉은 패션 커머스로 오픈마켓 대비 다루는 카테고리가 한정적이에요. 오픈마켓과 달리 특정 카테고리에만 한정해 탐색이나 구매를 하는 유저는 많지 않을 것 같네요. 옷 좀 살까? 싶은 날, 오픈마켓에서는 의류 카테고리로 들어가겠지만, 패션 커머스는 전체가 의류 카테고리잖아요. 날짜 구분이 크게 중요하지 않은 거죠. (2), (4)처럼 ‘전체 삭제’를 제공하는 것도 같은 이유 아닐까요? 계절이 바뀌었을 때 혹은 좋아하는 스타일이 바뀌었을 때, 패션 커머스에서는 히스토리 전체를 삭제해도 문제없으니까요.

(덧붙임 🍟) 사실 오늘 한 얘기는 전부 제 뇌피셜입니다. 커머스에서 최근 본 상품 페이지를 기획해 본 경험은 없지만, 나름의 가설을 세워봤어요. 기획에 정답은 없으니 이런 식으로 하나하나 특성과 차이점을 생각해가며 ‘왜’를 고민해 보기를 추천합니다. 위 예시의 (1), (3), (5)와 아래 예시의 (1), (3)은 오늘을 표시하는 방법이 전부 다른데요. 그 이유를 찾는 것으로 연습해 보면 어떨까요?

🌷 하단 탭 메뉴를 통해 최근 본 상품 확인

앱 하단 탭에는 주요 서비스(기능)가 배치되는데요. 상품을 탐색하고 구매하는 이커머스에서는 ‘최근 본 상품’을 아예 하단 탭에서 제공하는 경우도 찾아볼 수 있었어요!

신세계 라이브 쇼핑, 올리브영

(1) 신세계 라이브 쇼핑과 (2) 올리브영 모두 하단 탭 가장 우측에서 ‘최근 본 상품’ 페이지의 진입점을 제공합니다. 또 ‘최근 본 상품’ 메뉴만 ‘이미지’로 표현하고 있어요. 아이콘으로 표현한 다른 메뉴보다 강조하면서, 사용자가 방금 본 상품의 이미지를 노출해 직관적으로 어떤 페이지인지 인식시키고 있어요.

하단 탭을 통해 진입하는 경우, 최근 본 상품 페이지로 이동하는데요. 진입점은 동일해도 최근 본 상품 페이지는 각 서비스마다 달랐어요. 그중에서도 올리브영 사례가 눈에 띄었습니다.

(3) 올리브영은 최근 본 상품 하단에 ‘이런 상품은 어떠세요?’라는 문구와 함께 관련 상품을 추천합니다. 최근 본 상품 페이지는 이미 구매를 결심한 사용자가 진입하는 장바구니 페이지와는 달리 재탐색을 위해 들어왔을 가능성이 큽니다. 아직까지 탐색 과정에 있는 사용자에게 관련 상품을 노출하면서, 자연스럽게 또 다른 제품으로의 탐색을 유도하려는 의도가 엿보입니다.

HAGO, 제철밥상

제철밥상과 HAGO는 두 번째 탭에 ‘최근 본 상품’ 메뉴가 위치하고 있어요. 앞선 사례와 다르게 우측에 자주 배치되는 마이페이지와 혼동할 확률이 적은 사례라고 생각됩니다.

(1) HAGO는 최초 진입 시 최근 본 상품 메뉴를 ‘아이콘’으로 제공합니다. (2) 상품을 하나라도 확인하면, ‘이미지’로 바뀌는 것을 확인할 수 있는데요. HAGO 이외에도 오늘 살펴본 사례 대부분이 동일한 패턴을 보였어요.

(3) 다만 제철밥상의 경우 상품을 확인한 뒤에도 계속해서 아이콘으로 제공하는데요. 하단에 메뉴 명도 노출되지 않아 아이콘만 봤을 때는 무엇을 의미하는지 직관적으로 알기 어려웠어요. 동일한 기능이라도 사용자의 상황에 맞게 달리 제공하는 것이 중요하다는 것을 알 수 있는 사례였어요.

(덧붙임 🌷) 물건을 구매하는 상황을 떠올려 볼까요? 아마 딱 한 번의 탐색으로 구매까지 이어지는 경우는 드물 거예요. 몇 번의 검색을 거치고 여러 물건의 장단점을 비교하는 과정이 필요하죠. 이때 최근 본 상품 페이지는 재탐색의 번거로움을 덜어줍니다.

개인적으로 이번 뉴스레터를 작성하며, 하단 탭 메뉴에서 최근 본 상품 페이지로 진입하는 사례를 처음 접했는데요. 어플 진입 시 바로 파악이 가능한 위치라는 점에서 최근 본 상품을 확인하고자 하는 사용자에게 접근성이 높은 사례라는 생각이 들었습니다.

🌼 마이페이지를 통해 최근 본 상품 확인

쿠팡, 라운즈, 아마존

마이페이지에서는 주문 배송 정보, 쿠폰, 포인트와 리뷰 등 서비스마다 조금의 차이는 있지만 개인화된 정보들을 담고 있어요. 따라서 개인화된 정보중 하나인 ‘최근 본 상품’을 마이페이지에서 보여주는 경우를 쉽게 볼 수 있습니다.

(1)쿠팡과 (2)라운즈(아이웨어 쇼핑몰)는 하단탭의 마이페이지 아이콘을 클릭, 이동해 최근 본 상품의 수를 확인할 수 있습니다.

쿠팡은 마이페이지에서 최근 본 상품을 펼쳐 보여주는 대신, ‘최근 찾던 상품의 연관 상품’ 리스트를 통해 추가 탐색이 가능하도록 유도하고 있어요. 최근 본 상품 화면에서는 다른 서비스에서 보지 못한 기록 개수 제한이 있습니다. 리스트를 최대 20개까지 보여주고 있는데, 방대한 데이터를 효율적으로 활용하기 위한 방법이라고 하네요.

라운즈는 최근 본 상품 1개 이미지와 총개수를 보여주고 있어요. 아쉬운 점은 아이웨어 플랫폼이라 작은 이미지로 보면 상품의 차이점을 알지 못해 이미지를 보여주는 효과를 별로 보지 못한다는 점입니다. 쿠팡과 같이 다양한 상품을 판매하는 공간이라면 이미지를 쓰는 효과가 더 있을 수 있지만, 탐색을 돕는 데에 (2)과 같이 노출하는 이미지는 큰 역할을 하지 못할 것 같습니다.

아마존도 마이페이지로 이동하면 최근 본 상품을 확인할 수 있어요. 다만 위 다른 사례와 달리 (3) 최근 본 3건의 상품 이미지와 상품명을 보여줘 상세 페이지로 바로 이동할 수 있습니다. 이동 후 (4) 최근 본 상품 노출 여부를 선택하면 (6) 하단 팝업으로 최근 본 상품 미노출 설정 방법, 이미 기록된 내역 개별적으로 삭제하는 방법 그리고 전체 상품 한 번에 삭제하는 방법 등을 자세하게 설명해주고 있네요.

대부분의 국내 서비스는 최근 본 상품을 X 버튼 등으로 삭제할 수 있는데, 아마존은 각 상품마다 (5) “Remove from view”라는 다소 긴 문구의 삭제 버튼을 제공하고 있네요. 아마존의 최근 본 상품 페이지를 보면서, 본인의 데이터는 사용자 본인이 스스로 통제할 수 있음을 가시적으로 보여주려 한다고 느꼈어요.

(덧붙임 🌼) 커머스가 아닌 여행, 숙박, 배달 등의 서비스는 최근 본 상품을 보여주는 경우가 드물었어요. 물건을 탐색할 때 보다 여행 숙소를 구할 때 더 많은 상품을 찾아보는 경향이 있고, 한 상품에 대한 판매 가능한 수량에 한계가 있어서 그런지 이 경우엔 보통 ‘찜한 상품/상점’ 등으로 처리하는 것이 아닐까 싶습니다.