고객 흐름을 통해 29cm의 UIUX 살펴보기.
29cm의 User Flow와 UIUX 분석[코드스테이츠 PMB 16기]
제목처럼 고객의 이용 흐름을 살펴보고,
그 흐름 속에서 이용자의 사용 경험에 문제는 없는지 살펴보는 시간을 가지려 한다.
오늘 살펴볼 서비스는 바로,
감각적인 온라인 편집샵
29CM
모두가 더 많고 저렴한 상품을 외칠 때, 각 브랜드만의 고유한 가치관을 알리기 위해 고민하는 29CM.
그만큼 특별하고, 편안한 사용자 경험에도 심혈을 기울이고 있다.
하지만 그들의 미처 발견하지 못한 문제가 있을 수 있기 때문에, 고객의 입장으로써
이용 흐름을 살펴보고 불편한 경험은 없었는지 살펴보았다. ( + 특별히 좋았던 경험도 살펴보도록 하자)
고객의 일상에서 더 나은 선택지를 제안하고 스토리텔링합니다
29CM 회원 고객의 고객 이용 흐름 살펴보기(User Flow)
29cm는 2011년에 출시하여 지금까지, 장기간 운영이 이루어진 서비스이다.
이미 많은 회원들을 보유하고 있고, 나 또한 29cm의 열렬한 회원이다.
그래서 기존 29cm의 회원 고객들의 이용 흐름을 통해 사용자 경험을 살펴보는 것이
목적성이 적고, 구매 경험까지의 시나리오를 적용하기 힘든 단순 방문자의 이용 경험을 분석하는 것보다
좋은 방법과 인사이트들을 얻게 될 것이라 생각했다.
(흐름은 간결하게 핵심 서비스의 도달하는, 로그인에서 제품 결제까지의 여정을 담고 있다.)
29cm 회원 고객들의 이용 흐름 (User Flow)
29cm 회원 고객들의 User Flow / Used Tool : figjam29cm 회원들의 고객 이용 흐름을 나누어 보자면,
로그인 / 홈 화면 / 검색 / 탐색 / 제품 상세 확인 / 장바구니 / 주문 및 결제
로 분류 할 수 있다.
직접 서비스를 이용해 보면서 완성을 한 유저플로우이지만,
더 자세한 분석을 위해서 다시 한번 고객 입장에서 서비스를 이용했고,
반복되는 과정에서 다양한 UIUX 인사이트를 발견할 수 있었다.
29CM를 이용하며 좋았던 UIUX
1. 로그인 화면 중 최근 로그인 알림
최근 로그인했던 로그인 SNS를 안내해주는 29cm다양한 SNS를 통해 손쉽게 가입하고 이용할 수 있는 편리함도 우리에게 찾아왔지만,
어떤 SNS를 통해서 가입을 했는지, 이용을 했는지 늘 헷갈려야 하는 숙제도 우리에게 찾아왔습니다.
헷갈리지 않게, 똑똑하게 잘 안내해주는 29cm에게 감사의 인사를 드립니다.
2. 홈 화면 중 다양한 맞춤 컨텐츠 제공
다양한 맞춤 정보 및 유용한 정보를 큐레이팅해주는 29cm우리 모두가 뚜렷한 목적을 가지고 쇼핑몰에 방문하지는 않는다.
아직 뭘 살지 모르는, 사고 싶은 것이 있지만 분명하지 않은 준목적, 비목적적 방문도 매우 잦다.
이럴 때 참고 할 수 있는 맞춤, 유용한 정보들은
방문은 했지만 우리가 어떤 것을 둘러보고, 소비할지 모르고 얼어붙는 콜드 스타팅 문제를 해결해 준다.
3. 제품/브랜드 탐색 중 다양한 필터 제공
고객에게 다양한 필터를 제공해주는 29cm29cm는 아주 다양한 조건 필터를 제공하여 고객이 원하는 기호에 맞게, 조건에 맞게 제품들을
탐색할 수 있도록 하고, 궁극적으로 더 편리하고 합리적인 소비를 할 수 있도록 도와줍니다.
29CM를 이용하며 불편하다 느낀 UIUX
1. 제품/브랜드 검색 중 검색 오류
원하는 검색 값이 아니라 다른 검색 값이 노출되는 29cm패션 브랜드를 입력했는데, 그 브랜드의 정보도 제품도 아닌 뜬금없는 제품들이 나열되었다.
29cm에는 검색 결과가 없다는 출력값이 존재하고 있는데, 검색 결과가 없다는 안내가 아닌
레이블이나 이름에서 어느 부분 유사한 때문에 잘못된 상품들이 나열되고 있다.
이는 분명 잘못된 정보로, 고객에게 혼동을 줄 수 있다.
2. 제품 상세 확인 중 장바구니 발견의 어려움
장바구니가 구매하기 안에 포함되어 있는 29cm장바구니 특성상 제품의 옵션 및 사이즈를 선택하고 담는 과정이 있다는 것을 알아서
구매하기 버튼과 동일시했다는 것을 이해했지만, 그래도 구매하기와 장바구니의 속성은
다른 부분이 분명 명확히 존재하기 때문에 분리하거나, 구매하기 / 장바구니 담기로 표현하여
혼란을 최소화해야 한다.
3. 주문/결제하기 중 쿠폰 미적용 상품 확인
쿠폰적용 불가상품을 결제 직전 알려주는 29cm소비자가 쿠폰적용 불가상품을 인지하는 데에 너무 많은 여정을 겪고 있다.
상품의 가격 및 배송 정보, 각 종 할인 혜택까지 확인할 수 있는 제품 상세에서 정보를 알려주는 것이
아니라, 굳이 주문 및 결제의 단계에서 쿠폰적용 불가상품을 확인할 수 있다는 것이
고객들이 눈속임(다크패턴)으로 인식할 수 있다는 것을 인지해야 한다.
정보를 제한적으로 제공하여 고객들의 흐름을 어지럽히고 있다.
가장 시급하게 29cm이 개선해야 할 UIUX
주문/결제하기 중 쿠폰 미적용 상품 확인
주문/결제창까지 도달해서야 쿠폰이 적용되지 않는다는 정보를 제공하는 것은 꽤나 치명적인 다크패턴이다.
제품 상세에서 충분히 제공받을 수 있는 정보를 굳이 주문 및 결제에서 제공하여 생겨난 불편과
합리적이고 기분 좋은 소비를 박탈당해 생기는 감정은 고객의 이탈로 이어질 확률이 매우 크다.
제품에 대한 각종 정보를 확인할 수 있는, 제품 상세 확인 페이지에서 제공받아야 고객의
구매까지의 이용 흐름에 방해나 불편을 겪지 않고 사용자 경험을 이어나갈 수 있다.
개선한 UIUX (WireFrame)
(좌) 문제의 UIUX / (우) 개선한 UIUX (WireFrame)주문 및 결제 이전 단계인 제품 상세 화면에서 쿠폰 적용이 불가한 정보를 노출하여,
다크패턴으로 인한 불필요한 스텝들과 결제 단계에서의 느끼는 박탈감을 제거할 수 있다.
+ 긴급 추가 사항
다른 제품의 상세 페이지를 더 살펴본 결과, 몇몇 제품의 상세 페이지에서는 쿠폰적용불가
라는 안내문구와 태그가 표시되어 있었다.
그렇다면 내가 문제를 잘못 짚었을까? 아니다 오히려 제대로 짚었다.
이게 머선1 29cm?
무슨 일인지 말 좀 해봐요 29cm..굳이 애써서 어떤 정보나 데이터 차이 때문에 저렇게 태그 노출의 여부가 결정되는지 분석하지 않았다.
이번 글에서는 Pm의 입장에서가 아닌 고객의 입장에서 29cm를 이용하고 있기 때문이다.
고객의 입장에서 어떤 상품은 쿠폰 적용 불가 상품이라고 노출이 되어있고,
어떤 상품은 안되어 있는지 알 수 없고, 궁금하지도 않다.
단지 서비스의 이질성을 겪게 되는, 그런 불편을 감당해야 하는 것이다.
이미 개발이 완료된 기능이 제대로 적용이 되고 있지 않는 것이 더 큰 문제라고 생각한다.
어떤 제품은 정보가 제공되고, 어떤 제품은 제공이 되지 않는다.
분류 기준과 적용 기준을 더 정확히 해야 할 필요가 반드시 있어보이는 문제다.
+별책 부록
If : 내가 PM이고, 위의 개선사항을 구성원들에게 어필하고 설득하여 개발을 진행해내야 하는 상황이라면.?
개발을 설득할 PRD 만들어보기
이제는 고객의 입장이 아닌, PM의 입장으로 구성원들에게 UIUX 개선사항을 설명하고,
설득할 PRD를 만들어보고 글을 마무리하도록 하자.
1. 문제와 해결 방안을 요약한 User Story
구성원들에게 문제와 솔루션을 쉽게 설명할 수 있는 유저 스토리구성원들이 미처 바라보지 못할 사용자의 시점으로 문제를 풀어가면서,
구성원들에게 보다 쉽고 와닿게 문제를 설명하고, 솔루션과 아웃풋에 대해 인식시킬 수 있다.
2. 주요 사용자
29cm에서 구매 의향이 있는 모든 고객들이 그 대상이다.
29cm의 주 고객층은 20대 남녀이며, MZ세대인 그들에게
요즘 따라붙은 수식어가 존재한다, "체리슈머"가 바로 그것이다.
체리 슈머란 구매는 하지 않으면서 혜택만 챙기는 사람을 가리키는 ‘체리피커(Cherry Picker)’에서
‘체리(효용을 광범위하게 일컫는 단어)’를 빌려와 소비자를 뜻하는 컨슈머(Consumer)와 결합해 만들었다.
그들이 가지고 있는 한정적인 자원을 최대한 합리적이고 효율적으로 사용하려 한다는 의미이다.
단군 이래 최초로 부모님 보다 가난한 시대를 살아가고 있는 MZ세대들에게
"체리슈머"적 성격이 생긴 것은 어찌 보면 당연하다고 볼 수 있다.
29cm 사용자 연령층 / 출처 = 혁신의 숲3. 핵심 사용자가 얻게 될 것
핵심 사용자인 "MZ세대 체리슈머"는 특히 정보에 예민하다.
다양한 정보에 기반한 현명한 소비가 그들의 생존 방식이기 때문이다.
그래서 일부러 눈속임을 하거나 정보를 제한하는 "다크패턴"에 매우 예민하다.
구매 직전의 단계에서 그들이 필요한 정보를 얻는 것은 그들에게 큰 불편을 가져다줄 것이다.
이미 그전 단계인 제품 상세 화면에서 충분히 제공받을 수 있던 정보이기 때문이다.
굳이 그 단계를 늘려 정보를 제공하고, 소비라는 결단을 내리기 직전에 가치 판단이 흔들릴만한
정보를 제공하는 것은 그들에게 박탈감과 혼란을 제공한다.
그들이 필요한 정보를 필요한 때에 제공하는 것, 그것이 핵심이다.
체리슈머들은 29cm가 제공하는 다양한 정보(쿠폰 적용 여부)를 통해서 현명한 소비를 판단할 것이며,
그들은 소비에 대한 만족감을 얻을 것이다.
4. 구성원들에게 바라는 기능적 요구사항
아주 적은 노력으로, 다크패턴과 나쁜 흐름을 모두 제거할 수 있다.
개발자는 쿠폰 미적용 제품 데이터에 따른 고정 텍스트를 주문 및 결제 화면이 아닌,
제품 상세 페이지에서 가격 및 포인트 적립의 바로 밑 하단에 표시시켜주면 된다.
즉 지금 데이터에 따라 노출되는 텍스트 값을 페이지와 위치만 바꿔주면 문제를 해결할 수 있다.
디자이너는 고객이 충분히 제품 상세 페이지에서 보고 있는 제품이
쿠폰 미적용 상품인지 확실히 인지할 수 있는 최적의 문구, 폰트 크기와 색을 같이 고민해주면 된다,
그리고 고객들이 인지할 수 있는 최적의 위치를 같이 논의해봐도 된다.
굳이 가격 및 포인트 적립의 바로 하단 부분이 아니라 고객이 잘 인지할 수 있는
위치가 어디인지, 여백은 어느 정도인지 설정하는 것도 디자이너의 영역 중 하나이다.
