Hotjar를 도입하게 된 이유
사이드 프로젝트를 진행하면서 프로토타입을 배포하고 인스타 광고를 태워봤다.
GA를 봤을 때, 간단한 프로토타입이어서 페이지가 별로 없음에도 랜딩페이지에 비해 메인 기능을 가진 좌석 시야 비교 페이지의 page_view가 낮았다.
무언가 잘못되었음을 느꼈다. 그래서 좀 더 유저의 행동을 시각적으로 보고 싶었기에 Hotjar(핫자)를 도입해봤다.
Hotjar에는 1. 유저의 화면을 녹화해주는 기능 2. 유저가 클릭한 곳을 히트맵으로 보여주는 기능이 있다.
이 기능들이 사이드 프로젝트의 UX를 개선하는데 큰 도움이 되었기에 기록한다. (세션타임 증가 및 좌석 시야 비교 페이지로의 전환)
수정하기 전 랜딩페이지
우리는 프로토타입에서 올림픽홀만 데이터를 수집하고 구현했지만,
앞으로 더 많은 공연장을 구현할 것이라는 걸 알리고 싶어서 다른 공연장도 넣어놨었다.
올림픽홀 외의 공연장을 클릭하면 아래와 같은 모달을 띄워 준비중임을 알렸다.
하지만 이것이 문제였었다.
Hotjar의 Heatmap과 Recording을 이용해서 유저가 어떤 행동을 했는지 살펴본 결과,
유저가 보고 싶었던 공연장이 준비중이라는 멘트가 나오자 랜딩페이지에서 나가버리는 사람들이 많았던 것이다.
그래서 팀원들에게 이를 전했다.
개선 방향으로 아래 두가지를 제안했고 1번으로 결정하게 되었다.
1. 미구현된 공연장 가리기
2. 미구현된 공연장 색깔 다르게 하기
수정 후 랜딩페이지
올림픽홀만 선택지가 있으니 선택 안할 수 없게 생긴 것 같다.(주관적인 생각)
그리고 데이터를 확인해보자.
5월 17일 - 20일 (수정 전) : 평균 세션 타임 17초
5월 21일 (수정 후) : 평균 세션 타임 59초
사실 더 데이터를 쌓고 싶었지만.. 예산으로 잡아두었던 광고비를 다 썼기에 하루밖에 비교할 수 없었다.
하지만 난 이 차이가 유의미한 수치라고 생각하고 수정하기 잘했다는 생각이 든다.
+ 그리고 Heatmap을 통해 유저들이 어떤 공연장을 보고 싶어하는지도 알 수 있었다. 다음 공연장은 잠실 실내체육관이다!
이 프로젝트를 좀 더 발전시키고 싶다.
데이터를 쌓아서 UX를 개선해나가고 싶고, 유저가 우리가 원하는 방향대로 서비스를 이용하고 싶게 만들고 싶다.
기껏 만들었는데 보지도 않고 나가면 너무 슬프니까... 😂
댓글