brunch

You can make anything
by writing

C.S.Lewis

by 김자유 Sep 20. 2019

디자이너가 A/B 테스트 하는 법

해외 디자인 아티클 번역 뉴스레터 '디독' 구독링크: http://bit.ly/2FNQNpv


목차


1.A/B 테스트란 무엇인가?

2.무엇을 테스트할지 결정하기

3.테스트 보충하기  

4.결과 측정하기

5.A/B 테스트 사례

6.함정(Red herrings)


데이터는 사용자 경험에 기반하여 의사 결정을 하는 웹 디자이너들에게는 매우 중요하고 가치있는 도구이다. A/B 테스트(=스플릿 테스트)는 서로 다른 디자인, 내용, 혹은 기능의 효과를 비교할 수 있는 가장 쉬운 방법 중 하나이다. A/B 테스트는 당신이 사이트 전반에 보충해야 하는 매우 효과가 좋은 유저 경험 등을 만들어낼 수 있도록 도와준다. 


하지만 통계적으로 중요한 결과에 확실하게 도달하는 것과, 착각할 만한 자료에 주의를 빼앗기지 않는 것이 중요하다. 이를 어떻게 해낼 수 있는지 살펴보자.


1.A/B 테스트란 무엇인가? 


 A/B 테스트에서는, 일정한 시간을 두고 페이지 일부 요소의 두 가지 중 어떤 것이 더 효율이 좋은지 비교해볼 수 있다. 유저들은 첫 번째 버전, 혹은 두 번째 버전을 보게 될 것이고, 당신은 각 설정에서 유저의 전환율이 어떻게 나타나는지를 측정하면 된다. A/B 테스트는 다른 헤드라인, CTA 멘트, 본문 길이 등의 콘텐츠를 비교하는 것에 효과적이다. 디자인과 스타일 역시 테스트 가능하다. 예를 들어, 회원 가입 버튼이 어디에 있는 게 좋은지나, 얼마나 커야 하는지 등을 테스트 해볼 수 있다. A/B 테스트는 오류 메시지가 언제, 어떻게 보여지는 게 좋은지 등, 기능적인 면에서의 변화도 측정할 수 있다. 


스플릿 텍스트 역시, 홈페이지 리디자인 같은 (조금 완급 조절이 필요한)과감한 디자인 변화를 시도할 때도 유용하다. 최종본을 내기 전에, 유저들이 멀어지게 만들거나 전환율을 급격히 떨어뜨릴 것을 걱정하지 않고, 변화할 부분을 일부만 선택하여 적용해볼 수 있다. 


A/B 테스트의 결과는 지속적인 영향력을 가진다. 어떤 디자인 패턴이 유저에게 가장 잘 작동하는지 알고, 사이트 전반에서 A/B 테스트에서 ‘효율적인(winning)' 것들을 반복하는 것이 중요하다. 당신의 콘텐츠의 어조, CTA, 혹은 디자인 레이아웃에 유저들이 어떻게 반응하는지 파악하면, 그것을 활용하여 새로운 콘텐츠를 만들 수 있다. 


또한, 데이터는 디자이너가 아닌 의사결정권자에게도 매우 잘 작동한다. A/B 테스트는 전환율 하락과 유저 이탈률, 수익 감소 등을 방지할 수 있다. 클라이언트는 이런 종류의 데이터를 선호한다. 당신이 측정하는 전환율은 실제 제품 구매율일 수도, 링크 클릭율일 수도, 사이트 재방문, 계정 생성일 수도 있고 혹은 다른 어떤 수치화 가능한 행동들 모두 가능하다. 스플릿 테스트는 당신의 팀이 의견보다는 팩트에 근거하여 의사 결정을 내릴 수 있도록 도와준다. 


2.무엇을 테스트할지 결정하기 


먼저, 어떤 페이지의 요소를 테스트하고 싶은지를 결정해야 한다. A/B 버전의 테스트의 차이는 명확하게 드러나야 한다. 컬러를 아주 조금 변경한다든지, 단어의 배열을 조금 변경한다든지 혹은 무시해도 될 정도의 기능 변경이라든지 하는 것들은 좋은 A/B 테스트를 하기 어렵다. 왜냐하면 그들은 (당신의 유저 풀 사이즈에 따라)유저 경험에서도 두드러진 차이를 보이지 않을 가능성이 높기 때문이다. 버전 간 차이는 반드시 전환율에 영향을 끼쳐야 한다. 그리고 그 차이는 당신이 미래에 디자인할 때 적용하게 될 무언가가 되어야 한다. 좋은 A/B 테스트는 ‘비교할 수 있어야' 한다. 


완전히 다른 이메일 제목란 

한 버전에서 패키지/벌크 딜 제공하기.  

한 유저에게는 회원가입을 강제로 요청하고, 다른 유저에게는 옵션으로 제공하기. 


테스트에서 이긴 버전은 뛰어난 인사이트를 제공한다. 또한, 결과와 함께 왜 특정 버전이 이겼는가에 대한 테스터의 분석 역시 얻을 수 있다. A/B 테스트는 반드시 한 번에 하나의 변수만 시행되어야 한다. 두 가지 이상의 변수로 시행하면, 어떤 변수가 전환율에 영향을 끼쳤는지 얘기할 수 없게 된다. 


이 단계에서는, 두 버전 사이에서 어떤 것을 비교할지 추려내야 한다. 전환율은 A/B 테스트에서 가장 흔히 사용되는 지표이긴 하지만, 당신이 흥미를 가질 다른 데이터 포인트들도 많다. 당신이 측정할 전환율은 버튼을 클릭한 유저의 비율이 될 수도, 회원 가입을 한 유저일 수도, 이메일을 열어본 유저일 수도 있다.  


3.테스트 보충하기 


 A와 B 두 버전에서의 차이를 정했다면, 사이트에서 A/B 테스트를 진행할 준비를 해야 한다. 매체(웹사이트, 이메일), 플랫폼(정적 HTML, 동적 콘텐츠) 혹은 사용하는 서드파티 툴에 따라 쓸만한 A/B 테스트 툴들이 많다. 물론 본인이 제작한 솔루션을 사용해도 좋다. 당신은 하단 내용들을 컨트롤하기를 원할 것이다.: 


테스트를 시행한 두 버전 각각의 방문자 수 

각 버전의 차이점 

각 테스트에서 효과를 어떻게 측정할지 


 만약 당신이 직접 제작한 스플릿 테스팅 솔루션을 사용한다면, GA를 활용해서 트래킹하는 것도 효과적일 것이다. GA(Google Analytics)를 사용하면 테스트 A 버전에 비해 B 버전에서 유저들이 어떻게 반응하는지, 변수를 커스터마이징하여 설정할 수 있다. 이는 당신의 주요 전환율 지표 뿐만 아니라, 새로운 지표들을 발굴하게 도와줄 것이다. 예를 들면, “다른 나라에 있는 유저들은 평균 유저들에 비해 다른 반응을 보이는가?” 


GA에서 맞춤 설정을 하기 위해, 자바스크립트에 하단 문장을 추가해보자. 

_gaq.push([‘_setCustomVar’,1,‘testname’,‘testversion’,2]);


맞춤 변수 설정에 대한 정보는 Google documentation에서 더 찾아볼 수 있다. 위 문장에서 testname은 A/B 테스트의 제목을 뜻하고, testversion은 이 버전이 A인지 B인지 구분해주는 역할을 한다. 당신이 보기에 직관적인 이름을 사용하면 된다. 예를 들어, 내가 홈페이지에서 짧은 텍스트와 긴 텍스트를 A/B 테스트할 때는 이렇게 사용했다.


A 버전

_gaq.push([‘_setCustomVar’,1,‘Homepage Content Test’,‘Short’,2]);


B버전

_gaq.push([‘_setCustomVar’,1,‘Homepage Content Test’,‘Long’,2]);


GA에서 이러한 정보를 모으는 것은 전환율 뿐만 아니라, 사이트에 방문한 시각, 계정 생성 횟수 등 더 많은 정보를 얻을 수 있게 해준다. 데이터 수집을 시작한 후 GA에서 이러한 변수를 보려면, 방문자 -> 사용자 지정 변수로 이동하여 이전에 선택한 테스트 제목을 선택하면 된다. 



4.결과 측정하기


어느 정도 기간이 흐른 후에(보통 몇 주 정도, 트래픽에 따라 달라지기는 하지만), 테스트 결과를 확인해보고, 각 버전별로 전환율을 비교해보자. 각 A/B 테스트는 당신이 그 결과를 신뢰하기 전에 통계적으로 유의미한 수치까지 도달해야 한다. 신뢰도가 95%까지 도달했는지는 인터넷에서 다양한 계산 방법들을 찾아서 확인하면 된다. 중요도는 각 버전의 테스트에 참여한 유저 총합을 기준으로 계산된다. 유저가 너무 적거나 전환 수가 낮으면, 어느 쪽이 더 좋은지 가리기 전에 데이터를 더 모아야 한다. 


Usereffect.com’s calculator를 사용하면 얼마나 많은 유저들이 95%의 신뢰도에 도달했는지 알 수 있을 것이다. 테스트를 너무 빨리 끝내는 것은 “이긴"버전이 최선의 선택이 아니라는 뜻일 수도 있다. 그러니 신중하게 측정해보자.


당신의 테스트를 보는 사람들이 많아질수록, 테스트는 더 빠르게 진행된다. 그러므로 사이트 내에서 트래픽이 높은 영역에서 A/B 테스트를 진행하는 것이, 빠르게 통계적으로 유의미한 수치에 도달하는 데에 있어서는 중요하다. 스플릿 테스트를 진행하면 진핼할수록, 테스트에 참여한 사람이 더 많을수록, 신뢰도 95%에 도달하기가 쉽다는 것을 알게 될 것이다.



5.A/B 테스트 사례


내가 커머스 사이트의 개발자라고 가정해보자. A/B 테스트는 한 번에 한 페이지의 요소를 테스트하기에 완벽한 방법이므로, 유저의 계정에 제품명을 굵게 표시할 것인지 안할 것인지에 대한 A/B 테스트를 기획했다. 우리는 UI에 유저들이 그들의 제품이 리뉴얼된 것을 관리하기 쉽도록 기다린 제품 리스트를 만들었지만, 유저들이 그것을 빠르게 스캔하기 쉬운지에 대해선 확신할 수 없었다. 버전 A에서는, 리스트에 있는 아이템이 볼드처리되게 만들었다.


service name, yourdomainname.com


반면에 B 버전에서는 이렇게 만들었다.

service name, yourdomainname.com


신뢰도 95%에 도달한 뒤에 나온 결과는 다음과 같다.


버전 A가 명백한 승리를 거뒀고, 유저들이 제품 리스트에서 도메인명을 스캔하는 경향이 있다는 인사이트를 얻게 되었다. 


A/B 테스트를 만들 때, 유저 상호작용은 점검해봐야 할 또 다른 측정 수단이기도 하다. 한 테스트에서는 콘텐츠의 톤을 공격성(공격적인 어조)을 기준으로 비교하고, 방문자의 패턴이 어떻게 바뀌는지 봤다.


버전 A:

Don’t miss out on becoming a VIP user. Sign up now.

VIP 유저가 되는 것을 놓치지 마세요. 지금 가입하세요.


버전 B:

Don’t be an idiot; become a VIP!

바보같이 굴지말고, VIP 등록하세요!


랜딩페이지에서 A/B 테스트를 할 때, 볼만한 지표로 이탈률(Bounce rate)이 있다. 숫자로 알 수 있듯이, 각 버전의 이탈률은 확연하게 차이났다. 


우리는 자연스레 지나치게 공격적인 문장은 주의하게 됐다. 이탈률 역시 공격적인 어조가 유저들을 떠내보낸다고 수치적으로 나타나고 있다. 가끔, 특정 데이터가 통계적으로 유의미한 수치에 도달했을 때, 그 지표에 대해서 더 파고들고 싶어질 때가 있다. 다양한 유저군을 가지고 있을 때는 더더욱. 다른 콘텐츠 테스트에서, 나는 GA를 사용하여 나라별로 이탈률을 구분해보았다.


버전 B는 국가와 관계 없이 일관된 이탈률을 보였으나, A의 경우 두 유저 그룹의 반응이 다르게 나타난다는 것을 알게 되었다. 추가적인 테스트를 진행할 필요를 느꼈다. 


디자인과 콘텐츠 테스트에서는, 추가적으로 기능적인 실험도 할 수 있다. 우리는 제품을 장바구니에 간편하게 추가할 수 있는 버튼이 있다. A/B 테스트에서, 같은 언어와 스타일의 버튼을 사용했다. 유일한 다른 점은 A 버전은 1년 가격으로 추가되는 것이고, B 버전은 2년 가격으로 추가되는 것이었다.


우리의 목표는 두 버전 사이의 커머스 전환율과 평균 주문율을 측정하는 것이었다. 우리는 B 버전을 경험한 사람들이 장바구니에 들어있는 제품의 기간을 1년으로 낮출지, 생각했던 것보다 높은 가격을 보고 장바구니에서 삭제할지 등을 확신할 수 없었다. 우리는 버전 B로 더 많은 수익을 창출하기를 바랐으나, 테스트를 해보아야 했다. 통계적으로 유의미한 수준의 데이터가 모인 후에, 우리는 다음과 같은 결과를 얻어냈다.


버전 B(2년 가격으로 장바구니에 추가되는 버전)이 명백한 승리를 거뒀다. 우리는 이 인사이트를 활용하여 사이트 내 장바구니 추가 버튼을 전면 개편했다. 


6.함정(Red herrings)


가끔, A/B 테스트 데이터가 결론에 이르지 못할 때가 있다. 우리는 최근에 어떤 콘텐츠가 더 효율이 좋은지를 판단하기 위해 테스트를 진행했다. 나는 한 버전이 다른 버전을 월등한 비중으로 이기리라고 확신하고 있었다. 하지만, 두 버전 모두 전환율, 페이지뷰, 평균 주문율이 동일한 수치로 나왔다. 몇 주간 테스트를 운영한 후, 우리는 디자인을 변경해야 할 치명적인 데이터를 얻을 수 없음을 깨닫고, 테스트를 그만두고 다음 테스트로 넘어갔다. 중립적인 결과를 얻게 되면, 둘 중 하나를 선택할 수야 있지만, 한 버전이 다른 버전보다 ‘더 좋다'는 것을 데이터로써 증명할 방법은 없을 것이다.


A/B 테스트가 전부라고 믿는 것을 경계하자. A/B 테스트가 모든 차이를 보여주는 것은 아니다. 최선의 방안을 찾기 위해 테스트에 충분한 시간을 들이자(충분한 모수를 모집하기 위해, 나는 최소 3주 정도 소요하는 것을 선호하는 편이다.). 테스트가 성공적이지 않은 것 같다면, 그만두고 다른 테스트를 시행해보자. 


테스트 해보고 싶은 다양한 요소들을 계속해서 리스트로 작성하는 습관을 들이자. 새로운 것을 배우는 데에 도움이 될 것이고, 디자인 결정에 있어서 부딪히는 많은 문제들을 쉽게 해결할 수 있도록 도와줄 것이다. “A/B 테스트 리스트에 추가하겠다"는 말은 의사 결정자들을 설득할 때 유용하게 쓰일 수 있다.



저자 : Lara Hogan

원문 링크: https://alistapart.com/article/a-primer-on-a-b-testing/

*무단 전재 및 재배포 금지(링크 공유 가능)


디독에서 UX/UI 스터디를 진행합니다. 자세한 내용은 여기를 참고하세요.



해외 디자인 아티클 번역 뉴스레터 '디독' 구독링크: http://bit.ly/2FNQNpv


브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari