구글 옵티마이즈(3) - Google Optimize A/B/n 테스트 실시하기

구글 옵티마이즈(3)

 - Google Optimize A/B/n 테스트 실시하기 -

 

 

구글, YouTube, 페이스북, 인스타그램, 넷플릭스, 에어비엔비 등 데이터를 중시하는 기업들은 

A/B 테스트 성공담을 가지고 있다.

위와 같은 서비스를 이용하는 순간 사용자는 특정 테스트의 원본(실험군) 혹은 대안(대조군)에 들어가게 된다.

넷플릭스가 거의 모든 것을 A/B 테스트한다는 것은 유명한 사실이며

구글은 2009년에만 약 12,000개의 실험을 수행하였다고 한다.

아무튼 그들은 언제나 여러 가지 옵티마이즈(최적화) 테스트를 진행 중이다.

 

 

 

A/B 테스트 결과, 넷플릭스 랜딩 페이지에서 

가입 버튼 아래 로그인 옵션이나 ‘더 알아보기’에 해당하는 다른 버튼을 추가하는 대안은 모두 취소되었다. 

다른 서비스의 경우 ‘더 알아보기(learn more)’ 혹은 '둘러 보기(show me the basics)'를 추가하여 

정보를 제공하는 경우 고객 반응이 좋은 경우도 있다.

다만 넷플릭스와 같이 가입율 1위라는 인지도를 가진 기업에서는 CTA 버튼은 1개일 때 가장 큰 영향력을 발휘한다.

 

 

필자가 생각하는 구글 옵티마이즈의 장점은 다음과 같다.

a. 웹 UI를 통해 코딩 없이도 A/B 테스트 설정이 가능하다.

b. 웹 UI를 통해 원본과 대안을 쉽게 확인 할 수 있다.

* 물론 대안을 만들기 위해 HTML 에 대한 기초 지식은 필요하다.

c. 구글 애널리틱스와 연동된다.

d. 테스트 결과분석을 해준다.

 

A/B/n 테스트는 구지 A/B 테스트와 구분하여 웹 사이트의 변형이 3 개 이상이라는 의미이다.

A/B/n의 "n"은 테스트 할수 있는 변형 수를 나타낸다.

 

A/B/n 테스트를 다음 진행 단계를 거쳐 실시하고자 한다.

 

1. 환경 만들기

2. 대안 페이지 만들기

3. 실행하기

4. 결과 확인하기

 

 

 

1. 환경 만들기

우리는 이미 구글 옵티마이즈 계정이 있고, 구글 애널리틱스와 연동도 완료된 상태이다.

크롬에서 https://optimize.google.com 를 접속하면 다음 화면이 니타난다.

‘환경 만들기’를 클릭한다.

 

환경 이름을 ‘A/B/n 테스트 - 랜딩페이지 버튼 변경’ 으로 하였다.

사용할 페이지에는

https://hsjeong106.tistory.com/14 를 입력했다.

환경 유형은 'A/B 테스트'를 선택했다.

'환경 만들기' 설정을 끝내면 상단의 '만들기'를 클릭한다.

 

참고로 사용할 페이지 https://hsjeong106.tistory.com/14 에서 

하단의 '회원 가입' 버튼의 text 와 배경 색상을 바꾸는 대안에 대한 A/B/n 테스트를 실시하고자 하는 것이다.

 

'환경 만들기'에서 '만들기'를 클릭하면

‘A/B/n 테스트 - 랜딩페이지 버튼 변경’ 환경에 대한 세부 내용을 선택하는 화면이 나타난다.

‘대안 추가’할 수 있는 버튼이 보인다.

 

 

2. 대안 페이지 만들기

‘대안 추가’ 버튼을 클릭하면

대안 이름을 설정하는 창이 뜬다.

우리는 다음과 같이 대안을 만들어 실험해 보고자 한다.

즉, 

원본 버전은 ‘회원 가입’ 버튼을 그대로 두고,

대안 1은 버튼 text를 ‘회원 할인 받기’로 바꾸고

대안 2는 버튼 color를 파란색으로 바꾸어 테스트하기로 한다.

 

따라서 첫번째 대안 이름을 ‘대안 페이지 1- change button text’로 하고 '완료'를 클릭하면

 

목록이 나타나고 두번째 대안을 추가하기 위해 '+변이 추가'를 클릭한다.

 

대안 2 는 ‘대안 페이지 2- change button color’ 으로 하였다.

 

대안 이름을 설정하는 창에서 '완료'를 클릭하면

다음과 같은 원본과 대안인 ‘A/B/n 테스트 - 랜딩페이지 버튼 변경’ 실험안 설정 창이 뜬다.

‘변경’안을 만들기 위해 ‘수정’을 클릭한다.

 

다음과 같은 대안 1 편집 페이지가 뜬다.

 

대안 1인 버튼 text 내용 변경을 위해 버튼 부분을 클릭하고

좌측 하단의 편집기 패널의 ‘요소 편집’을 클릭하여

 

'HTML 수정'을 클릭하면 HTML 편집으로 수정할 수 있다.

 

<input  type="button" value='회원 가입' ...  을 <input  type="button" value='회원 할인 받기'

로 수정하였다.

'적용'을 클릭한다.

 

'대안 1'이 완료되었으면 '저장 > 완료'버튼을 클릭한다.

 

 

‘대안 페이지 2- change button color’ 안을 만들기 위해 ‘수정’을 클릭한다.

 

마찬가지 방식으로 HTML에 다음을 추가하였다.

style="color: white; background:blue; font-size:20px;"

 

'대안 2'가 완료되었으면 '저장 > 완료' 버튼을 클릭한다.

 

 

다음과 같이 A/B/n 테스트를 시작할 준비가 된 페이지가 뜬다.

원본, 대안 1, 대안 2 가 33% 균등한 트래픽 가중치로 분배되어 있다.

 

원본, 대안 1, 대안 2 에 대해 '미리보기'를 클릭하여 실험 의도대로 마련되었는지 확인한다.

 

 

실험 목표(experiment objective)에서 실험의 목표를 설정한다.

무료 버전에서는 3개까지 설정할 수 있다.

목표아래 ‘실험 목표 추가’를 클릭하고 ‘목록에서 선택’을 클릭한다.

우리는 ‘세션 시간’을 선택했다.

 

■  실습

목표를 '회원 가입 페이지 도달'로 잡으려면 어떻게 해야 할까?

참고로 우리는 다음과 같이 필자 티스토리 블로그의 목표를 설정한 바 있다.  

 

■

 

 

3. 실행하기

실험 ‘시작’을 클릭한다.

 

'미리보기'를 통해 확인해보라는 창이 뜬다.

실험하기 전에 '미리보기를 통해 의도하는 실험이 되고 있는지 확인한다.

'시작'을 클릭한다.'

 

상태 필드에 '진행 중'이라고 표시되어 있으면 실험이 웹에서 실행 중이라는 뜻이다.

현재 활성화 사용자 수가 0 이다.

 

직접 해당 블로그에 들어가 실험에 동참해보자.

해당 페이지가 랜덤하게 변동하고 있는지 확인해 보자.

크롬에서 https://hsjeong106.tistory.com/14로 이동하니

대안 2가 떳다.

 

익스플로러에서 https://hsjeong106.tistory.com/14로 이동하니

원안이 떳다.

 

4. 결과 확인하기

실험 실시 후 이틀 후에, 구글 옵티마이즈에 들어가 확인해 보았다.

현재 2가지 A/B 테스트가 진행 중이며

 

이중 '랜딩 페이지 버튼 변경 실험' 보고서 내용은 다음과 같다.

 

 

종료된 실험 결과를 확인해보자.

 

모든 사용자에 대한 실험 결과

 

보고서 상단 '애널리틱스에서 보기'를 통해 구글 애널리틱스와 연동하여 실험 결과 보고서를 볼수 있다.

 

세그먼트를 추가하여 특정 세그먼트에 대한 결과를 확인할 수 있다.

 

 

 

신규 사용자에 대한 실험 결과

 

 

​데이터 분석과 디지털 마케팅 강의를 마치면서...

김범수 의장이 카카오 신입개발자 OT 에서(2019. 11. 13.)

 

DT 시대임은 분명하다.

하지만 데이터를 너무 맹신하지 마라.

데이터를 통해, 

데이터에 녹아있는 발상의 꼭지와 통찰을 얻기를 추천한다.

다시 말해, 보고서의 숫자, 계산의 결과 만 보지 말고 생각을 하길 바라고 적극 권장한다.