모바일 메인 페이지의 스크롤 진행률 급락 원인

온라인으로 컨텐츠를 확장 중이지만 재무 성과가 부진해서 걱정인 전통 잡지사에서 원본 모바일 메인 페이지의 스크롤 진행률이 급락했던 이유는 무엇일까요?

모든 임직원이 불필요하다고 생각한 섹션이 사실은 방문자의 회원 가입 전환율에 중요했을까요?

위의 질문들이 질문이 낯설게 느껴지시면 이전 포스팅을 먼저 보세요.

전통 잡지사의 Heatmap과 Scroll 진행률 분석

1. UX 테스트는 하는 것이 항상 더 옳습니다.

누구도 정답을 찾지 못한 질문의 답은 엉뚱한 곳에 숨어있었습니다.

뷰포트 하단에 둥둥 떠다니는 3사 배너의 가림 효과 때문이었습니다.

뷰포트 하단 3사 배너의 가림 효과
뷰포트 하단 3사 배너의 가림 효과
전통 인쇄 잡지사 모바일 메인 페이지 원본 스크롤 진행률
원본 페이지의 스크롤 진행률 (Y축은 표본수)

위와 같이 원본 모바일 메인 페이지에서 스크롤 진행률이 급락했던 이유는

동영상 컨텐츠 섹션애 거부감을 느꼈다는 해석보다 뷰포트 하단에 고정되도록 설정된 3사 배너가 우연히도 동영상 컨텐츠 섹션이 이 메인 페이지의 마지막인 것과 같은 시각 효과를 연출했기 때문이었습니다.

AB 테스트 과정에서 그저 산만하고 뜬금없어 보였기 때문에 제거한 3사 배너 영역이 메인 페이지에 컨텐츠가 더 있다는 시각적인 신호를 제공했기 때문에 자연스럽게 스크롤 진행률이 상승했던 것입니다.

뷰포트 하단의 3사 배너 제거
뷰포트 하단의 3사 배너 제거
전통 인쇄 잡지사 모바일 메인 페이지 대안 스크롤 진행률
변경 페이지의 스크롤 진행률 (Y축은 표본수)

하지만 스크롤 진행률은 또 다시 급락했고 오히려 대부분의 방문자가 무의식적으로 스크롤을 내려서 메인 페이지의 첫 뷰포트에 표시된 회원 가입 관련 프로모션 메세지에 관심을 잃었을 뿐입니다.

2. 온라인 업무 방식의 문제도 드러났습니다. 

3사 배너를 모바일 메인 페이지에 개재한 이유는 회사 수익에 조금이라도 기여하려는 담당자의 애사심이었습니다.

그러나 3사 배너를 개재하여 얻은 수익은 매월 평균 15만원에 미치지 못했고 경영진은 방문자가 살펴보기를 바랬던 전문 컨텐츠를 아무도 보지 않았습니다.

더하여, 3사 배너는 모바일 단말기에서만 표시되도록 설정되어 있었는데 모든 임직원이 업무 PC에서 모바일 페이지에 접속해서 이와 같은 가림 현상을 수년간 아무도 몰랐습니다.

이와 같이 스크롤 진행률 AB test만으로 수년간 숨어있던 업무 방식의 문제까지 발견할 수 있었습니다.

그래서 UX 테스트는 하는 것이 하지 않는 것보다 항상 더 옳습니다.

3. 모든 방문자가 본 모바일 첫 뷰포트에서는 무엇을 클릭했을까요?

이 포스팅 연재의 주제가 클릭 히트맵인데. 이제야 클릭 히트맵이 거론될 차례입니다.

오른쪽 팝업 메뉴에 숨어있는 로그인 양식에 클릭이 집중된다고 나타났지만 모든 임직원분께서 그 결과에 시큰둥했습니다.

왜냐하면 이 홈페이지에서 유일하게 활성화된 서비스가 무료 경품 신청이기 때문이었습니다.

무료 경품 신청 결과를 확인하려면 반드시 로그인해야 했습니다.

유일하게 반응하는 로그인 버튼
유일하게 반응하는 로그인 버튼

그 외에 상단 메인 배너 영역의 클릭 히트맵도 수집했습니다.

배너 역시 무료 경품 이벤트에만 클릭이 집중되었습니다.

그런데 이 홈페이지의 메인 배너 영역은 수평 방향으로 5개 이상의 배너가 돌아가는 방식인데 애초에 클릭 히트맵 측정 따위는 염두에 두지 않고 작성한 매우 오래된 코드여서 대부분의 상용 솔루션이 각 배너의 클릭 히트맵을 측정하는 것은 불가능에 가까웠습니다.

낙후된 롤링 배너 섹션
낙후된 롤링 배너 섹션

약간의 자바 스크립트 코딩 능력과 구글 태그 매니저를 활용하는 것이 유료 Heatmap 서비스를 사용하는 것보다 더 정확하고 유연한 경우가 많습니다.

4. UX 테스트는 지속해야 합니다.

이 연속 포스팅의 주제인 유료 클릭 히트맵 서비스를 사용하실 필요가 없는 이유는 클릭 히트맵이 무의미하기 때문이 아니고 클릭 히트맵이 매우 세부적인 UX 상황을 관찰하기 위한 현미경과 같은 특수한 측정 도구이기 때문입니다.

여러 편에 걸친 포스팅에서 클릭 히트맵은 해당 뷰포트를 보는가?라는 좀 더 상위의 가설을 검증한 후에 분석하는 의미가 더 분명해지는 과정을 보여드렸습니다. 은밀하게 숨어있는 UX 관련 문제들이 존재할 수 있기 때문입니다.

지금까지 유료 클릭 히트맵 서비스를 구매하지 않고 매우 정밀하게 측정하고 분석하는 방법을 안내해 드렸습니다.

긴 연재를 끈기있게 살펴보신 노력에 존경과 감사의 말씀을 드립니다.

Leave a Comment