랜딩페이지 분석하고 개선하기 _코드스테이츠 PMB 10기
초록창에 윌라를 검색하면 최상단에 홈페이지 검색결과가 나온다. "일상을 더 즐겁게, 윌라 오디오북" 이라는 카피를 클릭하면 윌라의 랜딩페이지를 마주할 수 있다.
랜딩 페이지(landing page)는 키워드 검색이나 배너 광고 등을 경유하여 프로덕트에 접속한 이용자가 최초로 보는 홈페이지다. 즉 프로덕트의 첫인상으로, 불필요한 설명은 최대한 배제하여 핵심을 안내하는 것이 중요하고 방문한 목적을 빠르게 달성할 수 있도록 유도해야한다.
윌라는 랜딩페이지에서 서비스를 소개하고 체험신청을 하도록 유도하고 있다. 그의 첫인상은 그 목적을 달성하기에 충분히 안녕할지 분석해보고 개선할 점을 짚어보자.
1단계 : 고정CTA
2단계 : 영상
3단계 : 설명1
4단계 : 설명2
5단계 : 설명3
6단계 : 유도
7단계 : 보충
8단계 : FAQ
9단계 : 정보고지
*고정CTA(첫 달 무료 시작하세요)
- 네비게이션 : 윌라 / 오디오북 / 클래스 / 로그인 / B2B 멤버십 안내
- 메인카피 : 시간 낼 필요 없이 틈.틈.이. 듣기만 하면 독서가 된다.
- 서브카피 : 벌써 200만이 선택한 윌라 오디오북 입니다.
- 고정CTA : 첫 달 무료 시작하세요
[개선방안]
시간이 없어도 틈틈이 귀로 들을 수 있는 오디오북 윌라가 의도하는 서비스 지향점이 확연히 다가오지만 우측에 위치한 모바일 이미지와 연결이 되지 않는다고 느꼈다. 바로 하단에 시간을 활용하는 테마별 영상이 재생되고 있는데 이를 활용하여 메인카피와 연결될 수 있게 수정한다.
CTA가 랜딩페이지의 하단에 고정되어 지속적으로 노출되고 있어서 페이지를 스크롤 하며 윌라에 대한 설명글을 읽을 때에도 원하면 해당 버튼을 클릭하여 윌라를 시작할 수 있다. 그러나 스크롤다운 내내 하단에 존재하는 버튼으로 인해 거슬리는 사람이 CTA클릭으로 전환할 사람보다 많을 것 같아 아쉽다. 이 버튼의 위치를 카피 아래로 변경하고 중간과 최하단에 버튼을 한번씩 더 노출하여 클릭을 자연스럽게 유도한다.
- 영상 : 영상 재생화면 하단의 7개의 테마별 영상 선택
[개선방안]
영상이 차지하는 영역이 너무 커서 오히려 영상에 나온 카피가 눈에 들어오지 않았다. 앞서 말한대로 해당 영상 영역을 상단 메인카피 영역으로 가져가고 7개의 테마별 영상은 시간대별로 나누어 노출하거나 CTA1 영역에서 선택하여 시청할 수 있게 한다.
- 설명1 : 윌라의 특별한 점을 4가지로 나누어 설명하는 영역
- 메인카피 : 200만명이 선택한 대한민국 NO.1 오디오북만의 특별함
- 서브카피1 : 가족과 함께 이용할 수 있어 두배 더 저렴하게
- 서브카피2 : 전문 성우 낭독으로 실감나게
- 서브카피3 : 100%완독본으로 완전하게
- 서브카피4 : 마음껏 즐길 수 있게 무제한으로
*각 서브카피 별 하단 설명글은 생략
[개선방안]
줄글이 4가지로 나열되어 있어서 단 1가지도 눈에 들어오지 않는 구조이다. 경쟁사인 밀리의 서재는 장점을 3가지로 정리하여 소개하고 있는데 훨씬 눈에 잘 들어온다. 카피 영역을 아래 양식을 참고하여 윌라가 보유한 4가지의 장점을 부각할 수 있도록 재구성한다.
- 설명2 : 윌라만의 스페셜 라인업 콘텐츠를 분야별로 나누어 설명하는 영역
- 메인카피 : 오디오북의 품격을 높인 윌라만의 스페셜 라인업
- 서브카피 : 책을 읽어준다고 다 같은 오디오북일까요?
[개선방안]
메인카피만으로도 충분히 설명이 되는데 서브카피까지 들어가서 간결하지 못하므로 삭제한다. 윌라에서 자사 콘텐츠를 많이 자랑하고 싶어 이렇게 노출한 마음은 충분히 이해가 가지만, 영역이 너무 길게 차지해서 스크롤을 내리기 지루하고 무엇이 포인트인지 잘 모르겠다. 콘텐츠들은 좌우로 넘겨 목록만 볼 수만 있을 뿐, 하나씩 개별 클릭하여 정보를 볼 수 없기 때문에 1줄에 2분야씩 노출하여 영역을 줄이고 책을 클릭했을 때 1분 미리듣기를 제공하여 윌라의 퀄리티를 체험할 수 있게 한다.
- 설명3 : 윌라에서 특별히 큐레이션하는 콘텐츠를 분야별로 나누어 설명하는 영역
- 메인카피 : 오디오북에 진심이니까. 윌라의 믿고 듣는 큐레이션 시리즈
- 서브카피 : 어떤 작품을 들을지 고민이라면?
[개선방안]
설명2와 마찬가지로 불필요한 서브카피는 삭제한다. 그리고 설명2가 차지하는 영역만큼 또 다시 반복되기 때문에 집중이 되지 않는다. 해당 영역은 큐레이팅이라는 장점을 부각시켜야 하는 영역이다. 요즘 스타트업 홈페이지에 가면 볼 수 있는 멤버 소개란처럼 어떤 에디터가 어떤 방식으로 큐레이션을 하는지 소개하고 큐레이션 된 결과 값을 2개의 카테고리로만 노출하여 특별함을 강조한다.
- 유도 : 윌라 첫 달 무료체험을 안심하고 시작할 수 있게 유도하는 영역
- 메인카피 : 첫달 무료체험 안심하고 시작하세요.
- 서브카피 : 무료체험 중에도 언제든 해지 가능
- 보충 : 윌라를 왜 써야하는지 보충 설명을 하는 영역
- 메인카피 : 윌라 회원님들의 이용후기를 확인하세요
- 서브카피1 : 윌라를 접하고 새로운 꿈과 희망이 생겼어요
- 서브카피2 : 일하는 3시간이 소중한 독서 시간이 된 것 같아요
- 서브카피3 : 아들과 함께하는 등교시간이 아주 즐거워졌습니다
- 서브카피4 : 윌라가 나만의 운동친구가 되었어요
- FAQ : 서비스 이용 시 자주 묻는 질문과 답변 소개
- 정보고지 : 사이트 이용 약관 및 기본 정보 표기
윌라의 랜딩페이지는 그다지 안녕하지 못했다.
윌라의 랜딩페이지에 접속했을 때 전체적으로 윌라가 갖고 있는 장점이 와 닿지 않았고 정보가 단순히 나열되어 있다는 느낌을 받았다. 마이크로카피는 별도의 테마나 스토리 설정 없이 사실 그대로를 적어 두었기 때문에 매력적으로 느껴지지 않았다. 과연 해당 랜딩페이지에 접속한 사람들은 1달 무료체험하기 CTA를 많이 눌렀을까? 다음 글에서는 오늘 짚어본 단계별 개선안을 발전시켜서 CTA활성화를 위한 A/B테스트를 설계해 보기로 한다. (계속!)
문제를 기막히게 해결하는 유익한 기획자.
코드스테이츠 PM 부트캠프로 획기적인 프로덕트 매니저가 되어 가다.
기막힌 생각과 획기적인 방법론자, PM이야기 #9. 끝.