Pain point
웹 페이지를 디자인할 때 CX를 향상시키기 위해 실 고객의 동선을 파악하여
고객 여정 지도를 그리는 것은 비즈니스 차원에서 필수
서비스에 접근하는 모든 고객의 동선을 수집하여 이를 만들고 마케팅 팀이 이를 잘 이용할 수 있게 하고싶다
Solution
HTML 태그에 특정 처리를 하면 이벤트 발생시 마다 할당된 주소로 전송하여
우리 서비스에서 이를 처리, 분석 하여 클라이언트에게 분석 대시보드 화면을 제공
•
유사 서비스
프로젝트 이름
MATA
My Awesome Tag Analytics
프로젝트 목표
웹 사이트 이용자의 사이트 내 동선을 파악하여 수집하고 이를 처리, 분석하여 사이트 관리자 및 운영자에게 사이트 내 흐름에 대한 시각화 정보 제공
서비스 기능
사업자는 자신의 웹서비스 도큐먼트 최상단에 JS 스크립트를 추가하여 코드를 심음
사용자의 상호작용에 따른 이벤트를 익명의 세션으로 수집하여 클러스터로 제출
전달된 데이터는 시간, 태그 ID, 세션 ID, 페이지 이름 등을 포함
수집된 로그를 분석해서 사이트 운영자에게 사이트 개선에 필요한 정보를 시각화하여 제공해 주도록 한다.
고객 동선 분석과 평균 방문 시간대 확인 등 각종 분석을 확인할 수 있다.
예시 시각화:
메인 대쉬보드
고객 동선 그래프
사용 기술
•
Nodejs
•
Vue.js
•
Kafka
•
Spark
•
Spark-Streaming
•
Hadoop
•
Hive
•
Airflow
•
Cassandra
•
SpringBoot
•
Mysql
클러스터 구성
데이터 플로우
시각화 자료 목록
•
오버홀 대쉬보드
◦
웹서비스 실시간 접속자 수
◦
웹서비스 시간대 별 접속자 수
◦
웹서비스 접속 위치 통계 → 과금됨
◦
웹서비스 유입 경로
◦
웹서비스 체류 시간
◦
각 페이지 접속자 수
→ 필요한 데이터: 최초 접속했을 때부터 이탈 까지 집계된 사용자 데이터
•
서비스 ID
•
사용자 세션 ID(실시간이라면 Cassandra에서 일부 가져와야 할듯)
•
사용자 IP 주소
•
사용자 접속 시간
•
사용자 접속 직전 페이지
•
사용자 총 클릭 수
•
사용자 체류 시간
•
페이지별 통계
◦
페이지 별 실시간 접속자 수
◦
페이지 시간대 별 접속자 수
◦
페이지 별 접속 위치 통계
◦
페이지 별 유입 경로
◦
페이지 에서 발생한 클릭 수
◦
페이지 별 체류 시간
→ 필요한 데이터: 페이지로 도착했을 때부터 다음 페이지로 떠날때 까지 집계된 사용자 데이터
•
서비스 ID
•
현재 페이지
•
사용자 세션 ID(실시간이라면 Cassandra에서 일부 가져와야 할듯)
•
사용자 IP 주소
•
현재 페이지 유입 시간
•
이전 페이지
•
현재 페이지에서 총 클릭 수
•
현재 페이지 체류 시간
•
고객 여정 지도
◦
메인 페이지
◦
해당 페이지→다음 페이지 이동 수 토탈
◦
해당 페이지→다음 페이지 이동 수 백분율
◦
해당 페이지→다음 페이지 이동 직전 발생한 이벤트 집계
→ 필요한 데이터:
•
서비스 ID
•
웹서비스 전체 페이지 목록
•
…
