AB 테스트에 대한 관심이 있지만 경험이 없거나
AB 테스트를 하기 위한 환경세팅에 어려움을 겪은 사람
특히 뷰저블 도입을 앞두고 있을 때 읽으면 더욱 도움이 될 수 있습니다.

우선 AB 테스트란?

A/B 테스트는 A와 B 두 가지 콘텐츠를 비교하여 방문자/뷰어가

더 높은 관심을 보이는 버전을 확인하는 것이다.

예를 들면 두 가지 시안을 랜덤 하게 사용자에게 일정기간 보여주고,

목표로 하는 지표(클릭률, 전환율, 탐색시간.. 등)를 확인하여 어떤 시안이 더

목표달성에 있어서 효과적이고 적합한 안인지 확인하는 과정이라고 볼 수 있다.

뷰저블을 활용해서 주로 UX Writing의 변화에 따른 지표변화를 실험하기 위해 AB테스트를 진행했는데, 그 배경에는 올해 봄에 진행했던 UX Writing 세미나를 들었었고 강연의 핵심 인사이트였던 ‘UX Writing은 간단한 문구의 변화로도 충분히 유의미한 변화를 이끌어낸 사례를 보고서

현재 맡고 있는 서비스에 테스트해보고자 했다.

그래서 현재 개선하고 있는 프로젝트 중 CTA 버튼의 문구만 바꿔서

얼마나 유의미한 변화를 일으킬 수 있는지 테스트했었다.

현재 담당하고 있는 서비스가 iFrame형태로 자사몰에 설치되는 형태라

Exactly Match로 등록했을 때는 정상적으로 트래킹이 되지 않았다.

그래서 Start Match 등록해야 했는데, 뷰저블 AB테스트의 조건이었던

Exactly Match가 아니었기 때문에 뷰저블을 통한 AB테스트를 진행하지는 못했다.

뷰저블 트래킹 페이지 등록 방식
- Exactly Match : 입력한 URL과 정확히 일치하는 페이지
- Start Match : 입력한 URL로 시작하는 모든 페이지 (AB테스트 제한)

그래서 개발자분들을 통해 추적을 원하는 곳에 로그를 심어 테스트했었고

그 과정과 결과는 아래 글에서 확인할 수 있다.

� CTA문구가 전환율에 미치는 영향

그래서 이번에는 Exactly Match로 등록하여 뷰저블을 통한 AB테스트를 할 수 있는 서비스 환경을 찾았고 자사 서비스의 상세페이지를 뷰저블에 등록하고, AB테스트를 통해 상세페이지를 개선하고자 했다.

상세페이지 개선 기획

목적 : 서비스 상세페이지에 대한 관심/집중도 증가

가설 : Writing을 사용자의 입장에서 직접적인 표현을 사용하면 관심도가 더 올라갈 것이다.

지표 : 체류시간, 페이지 스크롤링, CTA 클릭률

기간 : 2023.06.29 - 2023.07.06

우선 뷰저블에 등록된 상세페이지에서 A/B 테스트 탭으로 진입해서

UX Writing (beta) 기능을 선택하면 기본세팅 이후에 실제 화면에서 수정할 부분을

직접 선택하고 편집할 수 있는 화면으로 전환된다.

원하는 문구를 편집할 수 있는 화면

편집하는 과정은 설명이 따로 필요 없을 정도로 직관적이다. 원하는 텍스트에 Hover & Click 시

편집가능한 형태로 전환되고 텍스트를 바꾸고 편집완료로 마무리하면 끝이다. 굉장히 쉽다.

편집한 내용을 표시하여 여기저기 수정한 뒤에도 어디를 수정했는지 알 수 있다.

편집을 완료하고 본격적으로 A/B가 시작되고 목표한 기간이 지난 뒤 분석결과를 확인할 수 있다.

클릭률 / PV당 클릭 / 이탈률 / 평균 머무르는 시간등.. 의 다양한 정보를 A/B을 비교해서 볼 수 있다.

앞서 목표를 설정하고 목표 달성여부를 확인하기 위한 지표로

체류시간, 페이지 스크롤링, CTA 클릭률을 설정했고 이 또한 뷰저블을 통해 확인할 수 있었다.

평균 상세페이지 체류시간은 파란색 B안 (수정/개선안)을 봤을 때, 조금 더 많이 머물렀음을

알 수 있었다. 체류시간이라는 게 홈페이지에 집중하지 않고 탭을 열고 나가거나 잘못 진입해서

곧바로 이탈하는 등의 다양한 변수들을 고려했을 때 A(기존)보다 B(개선)이 더 높게 나온 게

엄청 유의미하다고 판단하기에는 무리가 있었다.

다음 지표였던 스크롤링(얼마나 많은 사용자가 홈페이지 아래까지 봐주었는지)을 확인했다.

(좌) 기존 안, (우) 라이팅 개선안

기존 A안(좌측)에 비해서 개선 B안(우측)에서 확실히 더 많은 사용자들이 홈페이지 아래까지

스크롤링해서 탐색했음을 알 수 있었다. 첫 페이지에서 더 직관적으로 사용자들이

이해하기 쉬운 단어와, 비유등으로 문구를 수정했을 때 조금 더 호기심을 갖고

서비스에 관심을 가질 것이라는 가설을 어느 정도 확인할 수 있었던 부분이었다.

세 번째 지표는 CTA 버튼이었다.

제품을 둘러보고 설치나 도입문의를 할 수 있도록 도와주는 버튼인데

기존 버튼의 네이밍이 [간편 문의]로 뭔가 문의나 상담을 바로 해야 할 것 같은 부담감을

줄 것 같다는 생각에 [더 알아보기]로 버튼 클릭에 대한 부담감을 낮췄다.

뷰저블을 통해 클릭률을 확인해 본 결과 개선 B가 기존 A대비 더 높은 클릭률이 발생했다는 것을 확인할 수 있었다.

이 또한 표본이 작아서 엄청 유의미하다고 보기는 어려웠지만, 라이팅 하나의 변화만으로

원하는 목적을 달성하는데 어느 정도 도움을 줄 수 있다는 부분이 놀라웠고,

특히 항상 바쁘게 중요한 업무를 처리하고 있는 개발자들에게 귀찮게 문구 좀 바꿔달라고 하지

않아도 손쉽게 바꾸고 언제든지 수정해서 빠르게 테스트해 볼 수 있는 게 뷰저블 A/B테스트의

큰 장점이었다.

개발자들에게 크게 도움을 구하지 않고, 코드설치 한 번으로 원하는 대로 UX 라이팅을 실험해 보고

싶다면, 뷰저블 도입과 A/B 테스트 기능 사용을 권장한다.

뷰저블 서포터즈 1기로 제품을 무료로 제공받아 작성된 솔직한 후기입니다.

A/B 테스트를 통한 UX 라이팅 개선

A/B 테스트를 통한 UX 라이팅 개선