UX히트맵으로 사용자의 니즈와 실패를 한 눈에 발견하기
[소셜모임 이커머스] 뷰저블 실제 분석 사례 (2/2)
안녕하세요, 뷰저블 입니다.
뷰저블 UX 리서치 팀에서 진행한
UX 무료 컨설팅 사례를 공유 드립니다!
이번 2탄에서는 모드파티를 UX Heatmap으로
'페이지 분석하고 개선안을 도출'한 사례를 소개하려고 합니다!
Notice!
이 글은 모드파티의 실제 분석 사례를 바탕으로 작성되었으며, 이는 모드파티과 당사의 업무협약 및 정보제공활용 동의를 기반으로 합니다. 또한 이해를 돕기 위해 일부 이미지 및 데이터를 가공하여 사용하였음을 알려드립니다.
• 서비스명 : 모드파티
• 분석 페이지 수 : 총 24개
• 분석기간 : 2023년 10월 11일 ~ 10월 24일 (2주간)
개편 전과 후의 사용자 전환 흐름을 비교 분석하고 개편 후 긍정적인 결과가 나왔을 지 점검해보세요.
[분석 목표] " 페이지 개편 전과 후의 결과를 비교해보고 싶어요! "
모드파티는 10월에 모바일 친화적 UI로 서비스를 개편하였습니다.
개편 전과 개편 후의 결과를 분석해보고자 7월과 10월 동안 메인 페이지에서의 사용자 행동을 비교하고 전환 흐름의 변화를 파악해 보았습니다.
[사용 기능] UX Heatmap > Reporting & User Analytics
UX Heatmap의 좌측은 히트맵 영역으로 고객 행동을 시각화해서 보여주며, 우측은 지표 영역으로 요소별 순위 통계 및 상세 지표를 확인해볼 수 있습니다.
Tap Heatmap에서는 [Top Count Rank-더 보기]를 통해 각 요소별 지표 순위를 확인해볼 수 있습니다.
또 Analytics 기능을 통해 페이지로 도달하게 된 유입 채널과 이후 전환 경로까지 꼭 필요한 정보를 한눈에 요약해서 확인해볼 수 있습니다.
[현황]
CTA 버튼의 Tap PV Rate 순위에 따르면, 개편 전은 상품 관련 CTA가 5개만 있지만 개편 후에는 7개로 증가되었으며 이를 통해 개편 전에 비해 개편 후에는 상품 탐색 페이지 전환율이 27%로, 약 1.8%p 증가했습니다.
[결론]
결론적으로 개편 후, 상품 탐색과 관련된 전환이 증가했으며 사용자가 이전보다 다양한 상품에 접근하고 있음을 확인할 수 있었습니다.
신규 사용자와 재방문 사용자를 비교 분석해 서로 다른 니즈를 확인하고 각 사용자에게 적합한 개선안을 진행해보세요.
[분석 목표] " 신규 사용자와 재방문 사용자의 이동 흐름을 비교해보고 싶어요! "
이번에는 이벤트 페이지에서 고객이 어떤 콘텐츠를 얼마나 둘러보고 주목하는지 사용자의 탐색 흐름을 검토해 보았습니다. 이 때, 같은 페이지에 도달하더라도 신규 사용자와 재방문 사용자의 목적과 니즈는 다를 수 있습니다. 때문에 방문 빈도에 따른 사용자의 다른 니즈를 확인하고 사용자에 따라 어떤 개선안을 진행해야 전환률을 높일 수 있을지 확인해보았습니다.
[사용 기능] UX Heatmap > Tap & Scroll Heatmap
뷰저블에서는 신규 사용자와 재방문 사용자의 PV를 분류해 히트맵 데이터를 조회할 수 있는데요, 이를 통해서 두 사용자의 행동을 비교 분석해볼 수 있습니다.
사용자가 어떤 콘텐츠를 주목하는지, 얼마나 관심도를 가지고 있는 지 등 분석 목표를 확인해보기 위해서 신규 사용자와 재방문 사용자로 나누어 이벤트 페이지를 Tap 과 Scroll 히트맵로 분석해보았습니다.
[현황]
먼저, 스크롤 히트맵을 확인한 결과, 신규 사용자는 이벤트 페이지 하단에 위치한 ‘다른 파티 보러가기’ 버튼까지 47%의 사용자가 도달했지만 재방문 사용자는 동일 영역에 29%의 사용자만 도달했습니다. 또 Tap 히트맵으로 비교했을 때, 신규 사용자는 재방문 사용자보다 ‘다른 파티 보러가기’ 버튼의 Tap PV Rate 수치가 0.5%p 더 높게 나타났습니다.
하지만 상단에 위치한 ‘참가신청’ 버튼에서는 재방문 사용자의 Tap PV Rate가 신규 사용자보다 11%p 더 높게 나타났습니다.
[결론]
결론적으로, 신규 사용자는 상품 탐색에 대한 니즈가 크고, 재방문 사용자는 참가신청에 대한 관심이 더 높다고 해석해볼 수 있습니다. 따라서, 신규 사용자에게 지속적인 탐색을 유도하기 위해 ‘다른 파티 보러가기’ 등의 상품 탐색 정보를 상단에 배치하거나 이벤트 페이지와 같은 마케팅 요소를 더 추가해 재방문 사용자의 전환을 적극적으로 유도해볼 수 있습니다.
탐색 과정 중 정체 구간을 통해 사용자의 불편함을
발견해 보세요.
[분석 목표]
" 결제 여정 중에 사용자가 겪고 있는 어려움이 있는 지 확인하고 싶어요. "
결제 페이지에서 구매 전환 CTA를 누르기 전 고객의 행동 흐름을 확인하고 여정 중 어려움 혹은 불편함을 느낄만한 구간이 있는 지 점검해보고자 했습니다.
[사용 기능] UX Heatmap > Scroll Heatmap & Path Plot
Path Plot은 페이지 내 사용자의 탐색 흐름과 동선을 시각화 해 제공하는 기능으로 PC 페이지에서만 제공됩니다. Path Plot의 가장 큰 장점은 잠재 고객의 콘텐츠 소비 순서와 과정, 탐색 단계별 이탈 현황과 체류시간을 한 눈에 파악할 수 있다는 점 입니다. 또한 전환 사용자와 비전환 사용자의 탐색 흐름을 비교해볼 수 있어 잠재 고객의 관심사를 파악하고 유도 전략을 세울 때 큰 도움이 되는 기능입니다.
Scroll Heatmap에서도 콘텐츠 영역 별 체류시간에 대한 정보를 얻을 수 있지만 Path Plot에서는 요소의 위치와 체류 시간을 시각적으로 더 정확하게 파악해볼 수 있습니다.
[현황]
카톡 아이디는 결제 이후 결제 완료 및 모임 공지 메세지를 안내하기 위해 필요한 수집 정보인데요, 모바일에서 Scroll 히트맵으로 분석한 결과, 카톡 아이디 입력란에서의 평균 체류시간은 약 14.3초로 나타났습니다.
PC에서 비전환 사용자가 전환하지 않은 원인을 살펴보고자 [Path Plot-Non Conversion] 세그멘팅을 통해 살펴본 결과, 모바일과 비슷하게 카톡 아이디 입력란에서 평균 체류시간이 약 20.9초로 나타났습니다.
다른 영역의 체류시간은 보통 2~5초인 것에 비해 카톡 아이디 입력란에서는 PC와 모바일 모두 평균 약 17초 정도로 평균보다 높은 체류시간을 보이고 있었습니다.
[결론]
정보를 입력하는 영역에서 다른 영역에 비해 체류 시간이 상당히 높게 나온다면 사용자가 해당 영역에서 어려움을 겪고 있는 것은 아닐지 검토가 필요합니다. 사용자가 카톡 아이디를 숙지하고 있지 못할 가능성을 고려해 카톡 아이디 입력 대신 회원가입 때 수집하는 전화번호를 바탕으로 한 오픈톡이나 SMS를 활용하는 것으로 결제 과정 중 depth를 최소화해볼 수 있습니다.
상품 페이지 별로 회원가입 전환율이 얼마나 다른지 확인해보세요.
[분석 목표]
어떤 상품에서 회원가입 전환이 더 많이 유도되었는지 확인하기 위해서 상품 페이지별 회원가입 전환율을 분석해보았습니다.
[사용 기능] UX Heatmap > Tap Heatmap & Live Heatmap
모드파티는 회원가입을 팝업창에서 진행하기 때문에 Live Heatmap으로 회원가입에 대한 사용자 행동을 분석했습니다. 특정 버튼을 눌러야 나오는 팝업창 혹은 숨겨진 메뉴 등을 분석해보고 싶다면 Live Heatmap을 사용해주세요.
[현황]
현재 상단 GNB 싱글모임과 하단의 캐러셀 카테고리 UI에서는 ‘와인’, ‘요리’, ‘커피’, ‘골프’ 순으로 상품이 나열되어 있는데요, 각 상품 페이지에서 회원가입 버튼의 Tap PV Rate를 확인해보았습니다.
그 결과 ‘와인모임’, ‘커피미팅’에서는 각각 0.5%, 0.3%의 사용자가 회원가입으로 유도되었지만 ‘요리모임’, ‘골프모임’에서는 모두 회원가입 전환율이 0%로 나타났습니다.
[결론]
‘와인모임’과 ‘커피미팅’에서 회원가입 전환율이 높기 때문에 상단 GNB 싱글 카테고리와 캐러셀 하단 카테고리의 순서를 ‘와인-커리-요리-골프’로 변경해 회원가입 전환율이 더 높은 페이지로 사용자가 쉽게 접근할 수 있도록 유도해볼 수 있습니다.
지금까지 UX Heatmap을 이용해 페이지 개편 성과와
목표 페이지 내 사용자의 행동을 분석해보았습니다.
뷰저블은 기업의 규모와 업종에 상관없이 누구나 쉽고 빠르게 활용이 가능합니다.
실제 분석 사례를 참고해 여러분의 서비스를 Data-Driven UX로 분석해보세요!
이번 포스팅이 도움 되었다면
지금 바로 뷰저블 Journey Map과 UX Heatmap으로
여러분들의 서비스를 점검하고 개편해보세요!
시리즈 이어서 보기
▶#1 Journey Map으로 결제까지 이어지는 고객 여정 점검하기
▷#2 UX Heatmap으로 사용자의 니즈와 실패를 한 눈에 발견하기
