brunch

라이킷 1 댓글

You can make anything
by writing

C.S.Lewis

계정을 잊어버리셨나요?

by Jeff Nov 01. 2023

윌라 (feat.A/B 테스트)

들어가기 앞서 랜딩 페이지와 A/B 테스트의 개념이 뭔지 알아보자.

랜딩 페이지(Landing Page)란?

홈페이지 방문, 키워드 검색 혹은 배너 광고 등으로 유입된 인터넷 이용자가 최초로 보는 페이지를 말한다. 랜딩 페이지는 불필요하거나 혼란을 주는 내용을 최대한 피하고, 방문자가 방문 목적을 쉽고 빠르게 달성할 수 있도록 안내하는 것이 중요한데, 제작자 또는 디자이너가 랜딩 페이지를 어떤 형태 또는 방식으로 디자인하느냐에 따라 방문자의 적극적인 참여 또는 행동을 유발할 수 있다.

A/B testing이란?

디지털 마케팅에서 두 가지 이상의 시안 중 최적안을 선정하기 위해 시험하는 방법.

일반적으로 웹페이지나 앱 개선 시 사용자 인터페이스(UI/UX)를 최적화하기 위해, 실사용자들을 두 집단으로 나누어 기존의 웹페이지 디자인 A안과 새로 개선된 B안을 각각 랜덤으로 보여준 후, A와 B중 선호도가 높게 나온 쪽으로 결정한다.A/B 테스팅은 단순히 선호도 조사이기 때문에 쉽고 직관적이지만, 사용자가 어떤 부분을 왜 선호하는지와 같은 심층 조사를 할 수 없다.

< A/B테스트 시 주의점 >

1. 실제 통계를 사용하되 단순한 일대일 비교 측정 항목에 의존하지마라. 통계적으로 유의미한 데이터를 보고 판단해야한다.

2. 테스트를 오래 진행할 수록 정확한 결과가 나온다.

3. A/B테스트에 너무 의존하지마라. 버튼 색상이나 레이아웃 문제가 아니라 제품의 기능 자체의 문제인지 파악해야한다.

효과가 없는 테스팅에 시간과 인력과 돈을 낭비해서는 안된다.

4.두 개의 웹(또는앱)페이지 중 어떤것이 성과가 좋은지 판단하기 위해, 다른 시안을 “비슷한 사용자군”에게 “동시에” 노출함으로써 성과를 측정한다.

5. 통제 변수는 1개만 설정해야한다.

출처 : https://benefits.fastfive.co.kr/product/welaaa/

오늘 분석해볼 제품은 오디오북 어플리케이션 '윌라'이다.

윌라는 ㈜인플루엔셜(대표 문태진)에서 만든 오디오북 플랫폼이며 현재 월정액 구독형 스트리밍 서비스로 운영되고 있다. 2020년에는 2019년에 비해 오디오북 구독자수가 33만명에서 106만명으로 800%성장하였고, 1명당 월평균 재생시간이 250%증가하며 지속적으로 성장중이다. 2021년 2월에는 벤처캐피털 UTC 인베스트먼트로부터 250억원 규모의 시리즈C 단독 투자를 성공적으로 유치시키며 앞으로의 성장이 기대되는 플랫폼이다.

윌라의 랜딩 페이지는 총 몇 단계로 나뉘어 있을까?

윌라 웹페이지(https://www.welaaa.com/)의 랜딩 페이지는 총 8단계로 이루어져있다.

특이한 점은 '첫 달 무료 시작하세요'라고 써있는 CTA 버튼이 특정 화면에 포함된 상태가 아니다.

화면 하단 가운데에 계속 고정되어있어 스크롤을 내려도 함께 따라가는 상태로 움직이며, 이것은 스크롤 끝까지 읽지 않더라도 도중에 설명이 유저의 마음에 든다면 바로 멤버쉽 구독 화면으로 갈 수 있도록 유도 해놓은 것으로 보인다.

·1단계 : CTA (회원가입 및 멤버쉽 구독)

→ 2단계 : 광고 영상 (CTA)

→ 3단계 : 설명 1

→ 4단계 : 설명 2

→ 5단계 : 설명 3

→ 6단계 : 설명 4

→ 7단계 : 이용후기 및 영상 (CTA)

→ 8단계 : FAQ

그럼 이제 랜딩 페이지별 분석과 함께 A/B testing를 위한 정리를 해보자.

1단계 : CTA

출처 : 윌라 홈페이지

· 메인 카피 : 윌라 오디오북으로 귀깔나게 즐기다

· CTA : 첫 달 무료 시작하세요(회원가입 및 멤버쉽 구독 페이지로 가는 버튼)

2단계 : 광고 영상

출처 : 윌라 홈페이지

· 메인 카피 : 윌라 오디오북

· CTA : 죽음 편, 위대한유산 편, COMING SOON(아직 활성화되지 않음.)

3단계 : 설명 1

출처 : 윌라 홈페이지

· 메인 카피 : 윌라 오디오북

· 서브 카피 01 : 전문 성우 낭독으로 실감나게

· 서브 카피 02 : 100% 완독본으로 완전하게

· 서브 카피 03 : 마음껏 즐길 수 있게 무제한으로

>>>

이 페이지에서 살짝 아쉬웠던 점은 메인 카피와 서브 카피의 폰트 크기, 위치 등이 동일해 메인카피가 눈에 잘 들어오지 않는다는 점이었다. 모두 왼쪽 정렬되어 보기에 깔끔하지만 메인 카피 정도는 가운데 정렬로 수정하고 폰트 크기를 살짝 조절한다면 좀 더 보기 좋은 페이지가 될 것같다.

간단하게 수정해본 설명 1 페이지

4단계 : 설명 2

출처 : 윌라 홈페이지

· 메인 카피 : 오디오북의 품격을 높인 윌라만의 스페셜 라인업

· 서브 카피 : 책을 읽어준다고 다 같은 오디오북일까요?책을 읽어준다고 다 같은 오디오북일까요?

· 카테고리 : 윌라 시그니처 오디오북, 윌라 독점 오디오북, 윌라 매거진, 윌라 클래스, 윌라 북토크

>>>

설명 2 페이지는 깔끔하게 정리된 듯 보이지만 일단 책표지 이미지가 너무 작아서 책 제목조차 읽기가 힘들다는 점이눈에 띄었다. 그리고 모든 카테고리의 포맷과 컬러가 동일하여 스크롤을 내리며 페이지를 보는 동안 새로운 카테고리를 보는 것이 아니라 모두 동일한 페이지를 보는 건가 하는 생각이 들기도 했다.

간단하게 리디자인해본 설명 2 페이지

이런 점들을 개선하기 위해서 책표지 이미지 크기를 키우고 카테코리의 카피는 왼쪽에, 이미지는 오른쪽에 배치함으로써 적어도 책 제목정도는 쉽게 볼 수 있도록 개선해보았다. 또한 책에 대한 정보가 없는 상태로 가정할 때 책 내용이 어떤 것인지 궁금해 클릭해보았는데 따로 링크가 있지는 않고 이미지 뿐이었다. 상세설명으로 가는 링크가 있으면 유저가 책 내용에 대해 따로 찾아보지 않아도 책 내용을 보고 흥미를 느껴 구독을 유도할 수 있으므로 이미지

자체에 해당 상세설명 페이지로 갈 수 있는 링크로 갈 수 있도록 설정해놓은면 좋을 것같다.

5단계 : 설명 3

출처 : 윌라 홈페이지

· 메인 카피 : 오디오북에 진심이니까. 윌라의 믿고 듣는 큐레이션 시리즈

· 서브 카피 : 어떤 작품을 들을지 고민된다면?

· 카테고리 : 이달의 오디오북, 아동/주니어, 테마별 클래스, Coming soon 기대작

>>>

설명 3 페이지는 설명 2 페이지와 동일한 포맷으로 진행되고 있다. 변경된 것은 살짝 밝아진 배경톤 정도이다.

장점은 보기에 깔끔하다는 것이지만 단점이 오히려 큰 것같다. 앞의 페이지와 동일한 포맷, 거의 비슷한 컬러로

내가 어떤 페이지를 보고 있는 지, 방금 전에 봤던 페이지를 또 다시 보고 있는 듯한 착각에 빠질 수도 있다.

또한 앞서 말했던 문제점들을 모두 동일하게 가지고 있었다.

간단하게 리디자인해본 설명 2 페이지

이를 개선하기 위해 스크롤을 내리지 않아도 한 화면에서 4개의 카테고리를 한 눈에 볼 수 있도록 수정해보았다.

윌라의 랜딩 페이지를 보며 느꼈던 가장 큰 단점은 동일한 포맷의 스크롤을 두세번은 내려야하는 긴 페이지의 반복이었다.그래서 윗 페이지는 카테고리가 많아서 기존처럼 한 페이지를 두세번의 스크롤을 보는 것으로 유지했지만

설명 3 페이지는 카테고리가 4개로 충분히 한 화면에 넣을 수있을 것같았고 또한 스크롤을 좀 더 줄여 유저가

지루함에 이탈하지않고 화면의 끝까지 조금 더 수월하게 갈 수 있도록 했다.

6단계 : 설명 4

출처 : 윌라 홈페이지

· 메인 카피 : 첫 달 무료 체험 안심하고 시작하세요, 무료 체험 중에도 언제든 해지 가능

>>>

설명 4 페이지는 유저가 마음 가볍게 구독을 시작해볼 수 있도록 첫 달 무료 체험중인 것과 무료 체험 중에도

언제든 해지가 가능하다는 것을 한번 더 강조하고 있다. 이 페이지는 필수적으로 수정해야겠다고는 느끼지 않았지만내가 윌라 서비스를 처음 구독할 때 가장 안심하고 구독을 시작한 문구인 '걱정하지 마세요. 결제 7일전 문자와 이메일로 알려드려요! 무료기간 안에 해지하면 결제되지 않아요. 이용 중 언제든 해지할 수 있어요.'가 있으면 더 좋을 것같다는 생각이 들었다. '첫 달 무료 시작하세요'라는 버튼을 클릭하면 이동한 멤버쉽 구독 페이지에 있는 문구인데 오히려 이 페이지에넣는다면 유저의 클릭율을 더 높일 수 있는 핵심 문구가 될 수도 있겠다고 느꼈다.

7단계 : 이용후기 및 영상 (CTA)

출처 : 윌라 홈페이지

· 메인 카피 : 윌라 회원님들의 이용 후기를 확인하세요

· CTA 01 : 윌라를 접하고 새로운 꿈과 희망이 생겼어요

· CTA 02 : 일하는 3시간이 소중한 독서 시간이 된 것 같아요

· CTA 03 : 아들과 함께하는 등교 시간이 아주 즐거워졌습니다

· CTA 04 : 윌라가 나만의 운동 친구가 되었어요

>>>

윌라의 랜딩 페이지 중 가장 아쉬웠던 페이지는 바로 이용 후기 페이지였다. 딱봐도 너무 밋밋한 느낌에

심지어 동영상의 배경, 말하고 있는 사람의 옷 컬러 등 4가지 영상이 거의 똑같아 보였다. 깔끔하다는 장점도 있겠지만 랜딩 페이지의 거의 마지막 단계에서 유저에게 한번 더 확실하게 구매를 유도하기에는 조금 부족하지 않나라는 생각이 들었다. 또한 첫 페이지부터 블랙 컬러의 배경의 강한 느낌의 포맷으로 시작했는데 갈수록 조금씩 깔끔(또는 밋밋)한 느낌으로 진행되고 이렇게 마지막 페이지에서는 너무 심플해져버린것은 아닌가하는 느낌이었다.