카테고리는 기본 탐색에서 쉽게 접근 할 수 있어야하지만 카테고리가 너무 많으면 가독성이 떨어지므로
웹사이트에서 몇 가지 주요 카테고리를 작성하고 나머지는 하위 카테고리로 나열해아합니다.
사용자는 기본 카테고리 페이지와 하위 카테고리 페이지로 모두 이동할 수 있어야합니다.
제품 카테고리를 만들기위한 모범 사례:
제품이 몇 가지 다른 카테고리에 해당되는 경우 모든 제품에 배치하십시오. 상품을 보다 쉽게 찾을 수 있습니다.
카테고리의 이름은 비즈니스/기술이 아니라 사용자의 생각을 반영해야합니다.
너무 많은 선택으로 사용자가 당황하지 않도록 카테고리 수를 제한하세요.
카테고리가 많은 경우 기본 카테고리와 하위 카테고리로 나눕니다.
탐색이 쉽고 직관적인지 확인하기 위해 라이브에 적용하기 전에 항상 카테고리를 테스트하세요.
규칙 #2— 검색 지원
패션스토어에서 동적으로 제안 된 검색 결과 및 오타 지원
커머스에서 검색 창을 사용하는 것은 여전히 인기가 있지만,
일부 사용자가 검색창을 사용하고 다른 사용자가 탐색하는 이유를 이해해야합니다.
Cludo 기사는이를 완벽하게 요약합니다.
검색 창을 사용하는 사람들은 원하는 실제 제품 이름만큼 구체적으로 자신이 찾고있는 것을 알고 있습니다. 탐색하는 사람들은 더 많은 관련 콘텐츠를 탐색합니다. 검색을 이용하는 사용자는 종종 필요한 것으로 판단되는 모든 정보를 수집하고 구매할 제품을 결정했을 때 구매 모드의 후기 단계에 있습니다.
따라서 웹 사이트에서 검색 기능을 고려해야합니다.
다음은 강력한 검색 기능을 지원하기위한 팁입니다.
모든 서브 페이지에서 쉽게 접근 할 수있도록 사이트
눈에보이는 곳에 검색 창을 배치하세요.
사용자는 검색창을 신속하게 찾을 수 있어야합니다.(모바일 포함)
검색 아이콘 만 표시하는 것만으로는 충분하지 않습니다. 전체 텍스트 입력 또는 적어도 부분 입력을 표시하세요.
사용자가 쿼리를 입력 할 때 동적으로 결과를 제안하세요.
위에서 언급했듯이 사람들은 일반적으로 커머스에서 특정 항목을 찾을 때 검색 창을 사용합니다.
예를 들어 브랜드 이름, 제품 모델 또는 의류타입 (예:흰 드레스) 일 수 있습니다.
사용자가 입력 할 때 일치하는 결과를 동적으로 제안하면 검색 활동을 완료하는 데
필요한 시간과 실수(오타)가 크게 줄어 듭니다.
쿼리(검색어) 실수를 지원하세요.
사람들은 항상 철자 실수를합니다. 때로는 상품의 정확한 이름을 기억하지 못하기 때문에 추측합니다.
따라서 실수를 고려하여 검색 결과를 표시해야합니다. 사용자에게 "결과 없음"이 표시되는 것보다 더 나쁜 것은 없으므로, 이러한 상황이 발생하지 않도록해야합니다.
검색 창에 대한 모범 사례 요약 :
모든 페이지에서 검색 창을 표시하고 쉽게 액세스 할 수 있습니다. 검색어에서 오타를 지원합니다.
사용자는 실수를하기때문에 도와주세요. 검색어와 일치하는 항목이 없을 때 유사하거나 추천한 제품을 표시합니다.
가능하면 검색 결과를 동적으로 제안하세요.
엣지 사례를 생각해보세요. (예 : 일부 제품에 2 자 이름이있는 경우 2 자 검색을 지원해야합니다).
규칙 #3— 유용한 필터 사용
패션커머스의 간단한 필터
몇몇 온라인 커머스 사이트에는 수십만개의 제품이 있습니다. 사용자가 탐색하기 어렵기 때문에 회사는 사용 가능한 필터를 제공합니다. 필터는 제품 목록에서 쉽게 접근하고 볼 수 있어야합니다.
이를 설계하려면 먼저 사용자가 제품을 검색하는 방법을 이해해야합니다. 일부 필터는 다른 필터보다 더 중요합니다.
예를 들어 가격대는 일반적으로 고객에게 가장 중요한 요소 중 하나입니다. 필터를 설계 할 때는 순서뿐만 아니라 입력 방법도 고려해야합니다. 정밀도가 중요한 필터의 경우 일반적으로 슬라이더보다는 텍스트 입력을 제공하는 것이 좋습니고, 또는 둘 다 제공 할 수 있습니다.
미리 정의 된 범위, 단일 또는 다중 선택 필드 등을 사용할 수도 있습니다. 항상 데이터 유형과 사용자 상황에 따라 가장 빠르게 사용할 수있는 입력 방법을 선택하십시오. 또한 사용자 명령에서 동적 정렬과 정렬 중 하나를 선택해야합니다.
동적 정렬을 사용하면 사용자가 필터를 선택한 후 결과가 즉시 변경됩니다. 사용자 명령 정렬을 통해 사용자는
먼저 자신의 선택을 확인해야하며 결과 만 표시됩니다. 이 두 가지 방법은 거의 동일한 빈도로 사용됩니다.
그들 사이에서 선택하는 것은 주로 두 가지 고려 사항에 달려 있습니다.
(1) 커머스 사이트에 있는 수많은 상품들의 백엔드 디자인 방법. 기술적인 문제로 인해 항상 가능한 것은 아니지만, 검색결과는 즉시 동적 정렬로 동작해야 합니다.
(2) 일반적인 사용 사례 사용자가 한번에 둘 이상의 필터를 선택하고 있습니까? 아니면 보통 하나의 필터만 선택한 다음 필요한 경우 두번째 필터를 선택합니까? 완벽한 티셔츠를 찾고 있지만 특정 색상에만 관심이 있다고 상상해보세요. 선택한 색상마다 제품 목록이 계속 새로 고침되면 짜증이 날 것입니다. 다만 호텔 렌탈 웹 사이트를 탐색하는 경우 1박당 최대 가격을 선택했다면 결과를 더 빨리 새로 고침하는 것이 좋습니다.
규칙 #4— 제품 목록에 필요한 정보 표시
패션 스토어의 제품 목록 및 홈 화면 제공
많은 제품이있는 매장에서 사용자는 선택의 역설을 쉽게 경험할 수 있습니다— 선택해야 할 옵션이 많을수록 더 압도적입니다. 제품 목록을 통해 사용자는 볼 제품을 결정할 수 있습니다. 원하는 정보를 더 빨리 찾는 데 도움이되는 정보를 표시하여 프로세스를 지원할 수 있습니다.
이 정보는 대개 가격이지만 항상 그런 것은 아닙니다. 사이즈(또는 구입가능한 사이즈), 색상변화, 모델타입 등이 될 수 있습니다. 가격 외에, 하나 이상의 추가 정보를 표시하지 마십시오. 목록을 스캔하고 페이지를 작성하기 어렵게 만듭니다.
또한 제품 목록 수준에서 제품을 바구니에 추가 할 수있는 옵션을 제공할지 여부를 결정해야합니다. 제품 유형에 따라 다릅니다. 사용자가 세부 정보 (예 : 식품)에 들어 가지 않고 구매하려는 품목 인 경우 바구니에 제품을 빠르게 추가 할 수있는 옵션을 추가 할 수 있으므로 매번 추가 단계를 수행 할 필요가 없습니다. 그러나 제품에서 스커트의 크기 나 색상과 같은 일부 속성을 선택해야하거나 값 비싼 제품 (예 : 카메라)을 선택해야하는 경우 사용자가 제품 페이지에 가지 않고 바구니에 제품을 추가 할 것을 기대하는 것은 의미가 없습니다.
규칙 #5— 확인하기 쉬운 상품 페이지 디자인
패션 스토어의 상품 안내
일반적으로 사용자가 제품 구매 여부를 결정하는 제품 페이지에 있습니다. 따라서 의사 결정 과정에서 사용자의 구매결정을 지원할 수있는 정보를 표시하는 것이 매우 중요하지만 세부 정보를 제공하지는 않을 것입니다.
중요한 정보 만 첫눈에 볼 수 있어야합니다. 그 밖의 모든 정보는 쉽게 액세스 할 수 있어야하지만보기에는 혼잡하지 않아야합니다. 일부 사용자는 개요 정보 기반으로 구매하는 것이 좋으며, 다른 사용자는 구매하기 전에 제품에 대한 모든 정보를 알고 싶어하기 때문에 사이트에서 두 유형을 모두 수용해야합니다.
좋은 제품 페이지를 지원하는 요소 :
다양한 각도에서 볼 수 있는 고품질의 상품 사진 (때로는 360 ° 볼 수 있 수 있다.)
제품 개요
한 눈에 보이는 제품 가격
시선을 끄는 클릭 유도 버튼
규칙 #6— 확인하기 쉬운 상품 페이지 디자인
패션 스토어의 방해없는 결제화면
결제 과정에서 전환율이 떨어지거나 수 있습니다. 판매 프로세스의 최종 단계를 사용자에게 안내하는 것은 매우 중요하므로 가능한 한 방해가 없어야합니다.
가장 일반적인 실수는 다음과 같습니다.
하나의 긴 결제 페이지로 프로세스를 혼잡하게 한다.
너무 많은 정보(추천 상품이나 광고 등)로 혼잡하게 한다.
사용자에게 체크 아웃 프로세스에서 쉽게 벗어날 수있는 방법 제공(전체 탐색 표시와 같은)
이러한 모든 실수는 장바구니 포기 횟수에 막대한 영향을 줄 수 있습니다.
체크 아웃 프로세스를 더 작은 단계로 나누면 인지 부하가 줄어들고 진행률 추정이 쉬워져 프로세스가 더 빨리 완료되는 것처럼 보입니다. 장바구니의 평균 금액이 높은 경우 고객이 많은 비용을 지불해야 실수를 저지르는 것에 대해 걱정할 수 있으므로 모든 단계(또는 결제 전)에 주문 요약을 표시하는 것이 좋습니다.
주문이 완료되면 주문 요약과 함께 이메일을 보내 웹 사이트에 표시하십시오. 주문 요약에는 주문한 제품, 지불 한 금액, 상품 도착 날짜 추정 및 배송 주소와 같은 항목을 포함하는 것이 좋습니다.
결제 프로세스에 대한 모범 사례 요약 :
어두운 패턴을 사용하거나 장바구니의 가치를 높이지 마세요.
구매를 완료하는 데 필요한 정보만 표시하세요.
체크 아웃 프로세스의 가시적인 단계를 표시하고 데이터 손실없이 단계 사이를 쉽게 전환 할 수있는 기능을 제공하세요. 사용자가 통제력과 명확성을 가질 수 있도록 주문 요약을 표시하십시오. (고가의 제품에 특히 중요합니다.)
사용자가 장바구니의 내용을 쉽게 편집 할 수 있도록합니다 (예 : 수량 변경, 장바구니에서 제거, 제품 링크).
최소한의 탐색을 표시하여 옵션이 상점 페이지로 돌아가도록 제한하십시오.
사용자가 웹 사이트를 떠나더라도 일정 기간 동안 (바람직한 것은 무한정) 보관하십시오. 이렇게하면 사이트로 돌아가게될 경우 중단 된 지점부터 쉽게 계속 진행할 수 있습니다.
요약
도입하려는 사항이 적용되도록하려면 데이터에 중점을 두고 결과를 자주 확인해야합니다.
시도하고 싶은 아이디어가 확실하지 않은 경우 A / B 테스트를 사용하여 바꾸기전에 가설을 검증 할 수 있습니다.
또한 고객의 결제에서 상점의 사용자 경험이 끝나지 않는다는 것을 항상 기억하십시오.
다음 사항도 중요합니다.
명확한 주문 요약을 이메일로 보내십시오.
배송에 대한 업데이트를 제공하십시오.
고객 문의에 빠르게 연락 할 수 있습니다.
상품을 조심스럽게 포장하십시오.
필요한 경우 쉽게 반품 할 수 있습니다.
모든 단계에서 고객을 돌보는 것은 커머스에서 자주 쇼핑하고 친구에게 추천하는 충성도 높은 고객을 제공합니다.
다 비슷비슷해 보이지만 기획자들의 정말 많은 고민과 유관부서들의 요구사항들이 들어가 있는 곳이기도 합니다.
사용자는 이곳에서 상품의 디테일한 스펙을 확인할 수 있고, 구매전환에 가장 큰 영향을 준다는 이미 구매한 사용자의 리뷰도 확인할 수 있기에 중요한 페이지라고 할 수 있겠습니다. 상품을 마지막으로 점검(?)해보는 중요한 페이지죠.
저는 국내 커머스 쇼핑몰을 많이 이용하기도 하지만 일부로 해외직구, 해외 쇼핑몰을 살펴보고 구매하려고 합니다.
그러다 보면 낯선 UI와 UX를 보고 자극을 받기도 하고 우리나라 커머스 사이트와 비교해보면서 적용할 기능들은 없는지 생각해보게 되더라고요.
그래서 오늘은 국내 커머스와 해외 커머스의 상세페이지를 비교해보고자 합니다.
해외 커머스 앱은 아마존(미국), 알리바바(중국), 타오바오(중국) 그리고 국내 커머스는 네이버(스마트 스토어), SSG, 쿠팡 이렇게 각 3곳씩 선선 정하였습니다.
상세페이지 첫 랜딩 화면
상품을 누르게 되면 바로 마주하게 되는 화면입니다. 아이폰 11 Pro Max (6.5') 기준
1. 상품 이미지와 상품 정보(상품명, 가격)
국내 쇼핑몰 화면을 먼저 볼까요?
<왼쪽부터 SSG, 네이버(스마트스토어), 쿠팡 순>
상품명을 상단에 가격은 하단에 정렬이 되어있습니다. 그리고 할인율이 있는 경우 정가 대비를 얼마나 할인이 되는지 강조하기 위해 볼드 처리를 하거나 다른 색상으로 표기해주었습니다. SSG를 제외한 2개 쇼핑몰에는 리뷰를 바로 볼 수 있도록 상품명 아래에 표기해두었습니다. (SSG는 첫 랜딩에 바로 보이진 않네요!)
해외의 경우 아마존과 알리바바, 타오바오가 조금씩 다르게 보였는데요, 레이아웃 형식은 알리바바, 타오바오가 국내 페이지와 가장 비슷합니다.
< 왼쪽부터 알리, 타오바오, 아마존 순 >
단, 알리바바와 타오바오의 경우 가격을 상단에 위치하고 그 아래에 상품명을 보여주고 있습니다.
상품명(정보) < 가격을 좀 더 강조하려고 했던 것 아닌가 생각됩니다. 실제로 타임세일 상품의 경우 위의 이미지와 같이 띠배너를 두른 듯 빨간색으로 강조하여 보여주고 있습니다.
< 줄어드는 시간을 보면서 빨리 사야 할 것 같은 기분이 들었어요!! >
아마존의 경우 상품 이미지와 옵션 값(이미지)이 바로 보입니다. 상품 이미지 아래에 있는 동그란 옵션 이미지를 선택하게 되면 각 옵션에 맞는 금액이 바로 보이고요, 옵션 선택 따라 상품 이미지의 코트 색상이 바뀌어서 보여줍니다.
그래서 페이지를 이동하지 않고 한 화면에서 옵션(색상, 사이즈)을 선택할 수 있었고, 옵션에 따라 달라지는 금액도 바로 확인할 수 있어서 좋았습니다.
국내에서는 쿠팡의 경우 동일 상품의 옵션(색상, 사이즈)를 선택할 수 있었는데요,
다른 페이지 이동 없이 바로 색상과 사이즈를 선택하고 옵션 옵션 이미지를 볼 수 있어서 경험이 굉장히 좋았습니다.
< 쿠팡에서 옵션 선택하는 플로우 >
각 쇼핑몰별 상세페이지의 첫인상은 어떠셨나요?
쇼핑몰마다 중요하게 생각하는 요소(할인율, 가격, 상품 이미지 등)가 모두 다르고, 표현하는 방법도 다르다는 것을 알 수 있었습니다. 별 것 아닌 것 같지만 사용자를 배려하는 기능도 볼 수 있었습니다.
소개팅을 할 때 첫인상을 무시 못하는 것처럼,
사용자에게 어떻게 하면 첫인상을 잘 보여서 화면 스크롤을 유도 할 수 있을지 고민되는 스터디였습니다.
다음 편에서는 2. 상품 상세 페이지의 하단 탭 비교를 해보려고 합니다.
< 5개 쇼핑몰들의 하단탭 >
상세 페이지를 뚫어지게 보는데 왜 이렇게 했을지? 다른 쇼핑몰들은 어떤지? 궁금증이 생겼습니다. 🤔
"사회 증명 은 사회심리학의 용어로 개인의 의견의 타당성을 증명하는 것을 가리킨다. 사람은 군중 중에서 자신을 지지하는 의견이 전혀 없으면 자기의 의견의 타당성에 의문을 느끼고 의견을 철회해 버리는 것이 보통이다. 그러나, 자신을 지지하는 의견이 하나라도 있으면 상황이 일변한다." 출처: 위키백과
커머스 서비스 입장에서 본다면 사용자의 후기, 리뷰, 평점, 신뢰를 줄 수 있는 텍스트, 아이콘 등을 예로 들 수 있겠습니다.
사회 증명에도 여러 가지 전략이 있는데요, 저는 이 중에서 사용자 경험(후기, 리뷰, 평점) 등을 위주로 하여 이야기해볼까 합니다.
1. 사용자경험(리뷰,후기,평점)과 구매전환율의 관계
사용자가 처음 상품을 구매할때 어떤 기준으로 상품을 구매할까요?
아마 대부분 기존에 구매했던 상품 구매평, 평점 등이 판단기준이 될 것입니다.
실제로 아래 표를 보게되면 UGC(사용자 제작 콘텐츠)를 본 구매자들의 전환비율이 훨씬 높다는 것을 알 수 있습니다.
< UGC가 구매전환율에 미치는 영향>
2. 특히 고가 혹은 고관여 제품일 때 리뷰와 평가는 영향력을 크게 발휘합니다.
고급 제품을 판매하는 소매 업체의 데이터를 기반으로 가격이 상대적으로 높은 제품은 고객 리뷰가 있을 때 전환율이 380% 향상하였고 가격이 저렴한 제품은 190% 향상한 것을 확인할 수 있었습니다.
< 관여도에 따른 리뷰 영향 비율>
가격 자체가 구매 위험도를 고려하는 데 영향을 줄 수 있으나, 그게 유일한 요인은 아닙니다.
위 보고서에 따르면 영향력 있는 사람들은 제품이 반영하는 소비자의 정체성이나 그것이 일상적인 구매인지 여부도 포함될 수 있습니다. 따라서 이 제품의 구매 결정 여부에 있어서 리뷰가 가장 영향력 높은 요인입니다.
3. 그렇다면 왜? 리뷰가 영향을 줄까?
<디자인 심리학>
사람들은 다른 사람들이 좋아하는 것을 좋아하고 관심있어합니다.
(그래서 커머스에서 많은 클릭이 일어나는 메뉴 중 하나도 '베스트 상품' '인기 키워드' 일 것 같습니다.)
'사회도 좋아하니 너도 좋아해도 좋다.'는 증거를 보여주는 것을 사회적 증거(Social Proof)라고 불립니다.
평가, 리뷰, 그리고 추천은 사회적 증거의 궁극적인 예들인거죠.
사용자들은 리뷰/평가가 좋은 제품을 구입하고, 이렇게 되면 제품에 대한 신뢰와 신뢰가 높아집니다.
4. 그렇다면 부정적인 리뷰는 나쁜것일까요?
아닙니다. 높은 평점의 리뷰가 높은 높은 전환율을 끌어온다는 것은 당연한 논리처럼 들릴 수 있지만, 항상 그런 것은 아닙니다. 보고서에 따르면 구매 가능성은 제품 평점이 5점 만점에 4 ~ 4.7점을 얻었을 때 가장 높다고 합니다.
4.7 ~ 5점 범위의 제품은 “너무나도 만족스럽다”는 리뷰를 남기지만 구매 가능성은 위보다 적을 확률이 높습니다.
다시 말해, 너무나 지나치게 긍정적인 리뷰보다 어느 정도는 비판적인 리뷰가 보다 높은 신뢰감을 형성할 수 있다는 것입니다. 보고서에서는 부정적인 리뷰의 영향력이 긍정적인 리뷰의 영향력보다 크다고 말하고 있습니다.
결론
리뷰가 구매전환에 영향력이 있는 것은 누구나 인지하고 있는 사실일 것입니다.
하지만, 가장 중요한 것은 제품과 쇼핑 경험을 올바르게 제공해주는 것 아닐까요? 제품과 쇼핑 및 구매 경험을 제대로 갖춘다면 다른 모든 것들도 사용자의 리뷰/평점 만큼의 영향력이 있을 것이라고 생각합니다.