[레퍼런스 분석] - 컬리

컬리는 2015년 샛별배송(새벽배송)이라는 차별화 된 물류 전략을 선보였다. 밤 11시 전까지 식품을 주문하면, 다음 날 7시 이전까지 고객의 집 문 앞까지 배송해주는 아주 혁신적인 서비스였다. 이후 많은 이커머스 플랫폼은 새벽/당일 배송 서비스를 실시하였고 우리나라 유통 패러다임에 큰 변화를 가져왔다. 이제는 하루만에 택배가 도착하는 일이 당연해진 시대가 되었다.

 

이번엔 사용자 태스크 플로우를 토대로 컬리를 분석할 것이고, 상품 구매의 과정을 상품 탐색 및 검색, 상세페이지 확인, 최종 결제까지 3가지로 나누어보았다. 그리고 마지막에 개선점을 정리해 볼 것이다.

 

☑️  User Task Flow 분석

1. 상품 탐색 및 검색 기능

상품탐색이 가능한 홈화면, 카테고리 탭과 검색이 가능한 검색 탭 화면순으로 분석해보았다.

 

• 홈화면 탭

 

홈화면은 상품 탐색 과정의 가장 첫번째 여정이다.

상단 기본 탭은 '컬리추천'으로 사용자에게 다양한 콘텐츠를 제공하고 있으며, 상품을 소개하는 다양한 모듈들이 모여 하나의 페이지로 구성되어 있다. 중간 중간에 카운트다운 타이머를 활용하여 고객이 시간내에 합리적인 가격의 상품을 소비할 수 있도록 유도하고, 날씨 기반 상품 추천, 큐레이션 콘텐츠로 고객의 관심을 이끈다.

 

 

 

이밖에 상품을 소개하는 모든 타이틀과 서브타이틀 라이팅이 사용자 친화적이다.

그냥 대용량 쇼핑이 아닌 마음까지 넉넉한 대용량 쇼핑 , 거실에서 즐기는 해외여행, 떠나요 컬리 휴게소, 일주일 도시락 반찬 골라담기! 라는 직관적이면서도 고객들이 자주 사용할 법한 일상적인 언어를 사용하고 있다. 고객을 공감하고 소통하는 메시지는 사용자 경험에 아주 큰 플러스 요인이다.

 

 

 

컬리의 베스트 제품을 모아 놓았다.

필터를 누르면 바텀시트 카테고리가 뜨고, 원하는 카테고리를 탭할때마다 CTA버튼에 상품갯수가 달라진다. 버튼색상 대비가 진해서 눈에 잘 띈다. 그리고 '신상품', '알뜰쇼핑' 탭의 화면은'베스트'와 동일한 UX/UI 구조를 가졌으며 카테고리만 변경된다.

 

 

 

'특가/혜택'은 주로 이벤트를 모아놓았다. 상품의 실사 이미지 + 후킹 문구를 더한 배너를 보여주고 있는데 하나의 콘텐츠 큐레이션 이라고 볼 수 있다. 누르면 콘텐츠가 나오기도하고, 각 주제에 알맞은 쿠폰을 쉽게 다운 받을 수도 있으며 상품이 많을 경우엔 상단 탭에 카테고리를 분류해 쉽게 상품을 탐색 할 수 있도록 돕는다.

 

 

•  카테고리 탭

 

- 상단 탭: 뷰티 사업영역을 확장하여 마켓컬리와 뷰티컬리로 나뉘어있다.

- 콘텐츠 로우(Row): 카테고리는 특정 상품을 찾기 위한 화면이기도 하지만 컬리가 밀고 있는 행사/이벤트나 콘텐츠를 사용자가 쉽게 접근할 수 있도록 했다.

- 카테고리: 넓은 범주의 카테고리는 크게 둘로 나누었다. 식품 배송이 위주인 컬리는 식품 카테고리를 더욱 자세하게 나누었는데 왼쪽 박스는 식품의 범위가 넓은 카테고리이고 오른쪽 박스는 더욱 좁게 구분지었다. 하지만 카테고리 분류가 일관적이지 않은 것 같다. 특히 과일•견과•쌀, 국•반찬•메인요리, 면•양념•오일은 카테고리 포괄 범위에 공통점이 안보인다. 그리고 두번째 사진에서 볼 수 있듯 열무가 양파•대파•마늘•배추 카테고리에 속한다는 것을 쉽게 인지하기는 어려울 것 같다. 물론 배추와 같은 개념으로 적용하면 알아낼 수도 있겠지만(?)... 

또한 청양고추가 양파•대파•마늘•배추에 잘못 분류 되어있기도 하다.

 

결론은 상품을 찾는데에 쉬운 카테고리 아니라는 생각이 들었다.

 

2. 상품 검색 

•  검색 탭

 

하단 고정 탭에 검색기능이 있어 접근성이 좋다.

검색화면은 검색창, 최근검색어, 추천검색어, 급상승 검색어가 있고 아주 심플하다.

 

검색 시에는 자동완성 검색기능이 있는데 내가 입력한 단어의 폰트만 한층 얇게하여 위계를 주었다.

삼겹을 쳤더니 '삼겹'부분의 폰트가 얇아졌다. 그동안의 내 경험으로는 보통 입력한 단어가 볼드체 + 색상변경 되기 마련이었는데 컬리는 반대였다. 입력한 단어가 얇아지기보단 굵어져야 입력한 단어가 눈에 더 잘 띄이지 않을까? 다소 아쉬운 UI였다.

 

최근검색어와 추천검색어는 원형 칩을 사용해 쉽게 클릭 + 검색을 할 수 있다.

최근검색어의 칩 안에 '닫기 모양의 X 아이콘'이 따로 없고 오른쪽에 위치한 점 세개 아이콘을 누르면 선택삭제 or 전체삭제를 할 수있다.

그 중 선택삭제의 경우 아이콘 탭 > 선택삭제 선택 > 개별 삭제를 할 수 있는데 나에겐 귀찮게 느껴졌다.

칩을 눌러서 검색하려다 모르고 닫기 아이콘을 누르는 경우가 있어서 그런걸까? 그리고 쿠팡도 컬리와 동일 했는데 무슨이유일지 궁금하다.

 

3.  상세페이지

•  상세페이지

 

브로콜리 상세페이지를 아래로 스크롤하며 캡쳐해보았다.

상단 사진 차례대로 사이즈가 큰 썸네일 사진 -> 상품 요약 설명(상품명, 원산지, 할인 및 가격, 구독유도버튼, 쿠폰버튼, 배송안내글) -> 관련 콘텐츠 소개(고객들은 이렇게 활용해요) 및 광고 기반 상품 추천 -> 다른 고객이 함께 본 상품 추천 -> 상품 설명 순이었다.

 

브로콜리를 바로 소개하기보다는 관련 컨텐츠와 상품 추천 기능을 우선배치 하였다. 이 영역에서도 바로 장바구니에 담을 수 있도록 담기 버튼을 추가해놓았는데 추천 상품 영역의 접근성을 높여 브로콜리를 제외한 다른 상품을 쉽게 구매까지 유도하기 위함으로 보인다.

 

 

 

컬리의 후기는 별점 없이 사진 혹은 텍스트 리뷰가 전부이다.

물론 좋은 리뷰들은 해당 상품을 이용해서 요리 과정까지 친절하게 작성하여 유용한 정보를 제공하기도 한다. 그러한 사용자 덕분에 보다 합리적인 구매를 할 수 있지만, 별점이나 만족도로 후기를 대체하고 싶은 사용자도 있을텐데 사진 혹은 텍스트 리뷰만을 요구하는 것은 사용자가 후기 작성 자체에 부담을 느낄 수도 있다.

 

그리고 후기의 디폴트는 추천순이라 대부분 긍정적인 후기를 볼 수 있다. 때로는 부정적인 후기를 원하는 사용자도 있을텐데, 긍정적인 후기와 부정적인 후기를 구분하기가 어렵다는 것이 불편하다. 별점, 만족도 평가 기능을 도입하면 사용자가 원하는대로 후기를 선별해서 볼 수 있을 것이다.

 

4. 최종 결제 (구매)

 

상세페이지에서도 쿠폰을 다운받을 수 있다. 하지만 쿠폰을 받았어도 여전히 동일한 버튼 UI 때문에 이미 발급된 쿠폰임을 알기가 어렵다. 쿠폰을 다운 받았더라면 버튼 색상을 다르게 바꾸고 '다운 완료' 등의 바뀐 라이팅을 사용자에게 안내해야 할 필요가 있다.

 

 

 

보통 장을 볼 때는 개별구매가 아니라 장바구니에 한번에 담아 놓고 한번에 구매하는 것이 편리하다. 그래서 바로 구매하기 버튼이 없고 장바구니 담기 버튼이 있다. 그리고 그냥 장바구니 담기도 아니고 5,490원 이라는 정확한 가격을 안내해준다.

 

장바구니에 담으면 두번째 사진 처럼 바텀시트가 뜨는데 상단에는 장바구니 바로가기 버튼과 하단에는 다른 고객이 함께 구매한 상품을 상품추천을 해준다. 

 

바텀시트의 바로가기 버튼을 누르면 장바구니 화면으로 이동한다.

구독 멤버십을 운영하는 컬리는 '혜택없이 XX,XXX원 주문하기'라는 다소 강력한 라이팅을 사용하고 있으며 채도가 높은 보라색(대표브랜드색)바탕 + 대비되는 흰색 폰트의 버튼이 '혜택없이' 라는 단어를 더욱 눈에 띄게 만든다. 거기다 컬리멤버십에 가입유무의 금액차를 확실하게 보여주어서 멤버십 가입을 더욱 유도하고 있다. 그리고 아래로 굳이 다 내리지 않아도 바텀시트가 항상 떠있기 때문에 편하게 주문하기 버튼을 누를 수 있다.

 

장바구니 화면을 아래로 스크롤하면 지금 장바구니에 많이 담기는 상품, 이 상품 어때요? 등 고객의 취향을 기반으로 상품을 추천한다.

 

 

 

주문서 화면 상단에 주문 상품, 주문자 정보, 배송지, 배송요청사항 등 상품 배송 관련 필수 정보가 먼저 위치해있다.

편리한점은 가입 시 미리 입력해놓은 값을 긁어온다.

 

하지만 만약 다른 곳으로 배송하고 싶을 때 배송지 영역에서 '변경'을 누르면 '장바구니로 이동하여 다른 배송지를 변경하시겠습니까?'라는 모달창이 뜬다. 배송지 변경을 위해서 다시 장바구니로 이동하고 이 후 같은 과정을 또 거쳐야 하는 번거로움이 있다.

 

적립금/캐시를 입력할 수 있는 영역이 있으며 결제수단에서는 주황색 칩으로 혜택을 강조했다.

 

마지막 최종결제금액 영역에서도 할인을 놓치지 않도록 안내한다.

 

 

 

최종 결제 직전 배송 및 메타 정보를 바텀시트로 알려준다.

 

---

✅  개선점 정리

1. 카테고리 재구성의 필요성

- 카테고리 분류가 일관적이지 않다. 과일•견과•쌀, 국•반찬•메인요리, 면•양념•오일은 카테고리 포괄 범위에 공통점이 안보인다.

 

2. 상품 검색 시 자동완성기능에 폰트 위계 수정

- 입력한 단어가 얇아지기보단 오히려 굵어져야 입력한 단어가 눈에 더 잘 띄일 것이다.

 

3. 후기 별점 및 만족도 기능 추가

- 의도된 디자인으로 보이긴하지만, 텍스트/사진 리뷰가 부담스러운 사용자를 위해 별점 및 만족도 체크 기능을 추가하여 사용자에게 선택권을 부여해야 한다.

 

4. 쿠폰 버튼 디자인 변경

- 버튼으로 쿠폰을 받을 경우 받기 전/후 버튼 디자인이 달라야 한다.

 

5. 구매 과정에서 배송지 변경 플로우 수정

- 구매 과정에서 배송지를 변경하려면 장바구니로 다시 돌아가야 하는 번거로움이 있다.

 

 

 

부실하지만.. 열심히 한 2주차 레퍼런스 분석이었습니다 ..!