더리치(The Rich.)의 랜딩 페이지 살펴보고 변화 제안하기 | 코드스테이츠 PMB 13기
W5D3, W5D4
더리치의 랜딩페이지를 분석하고 개선해야 할 부분에 대해 이야기해봅시다. 그리고 개선하고 싶은 내용과 관련해 A/B 테스트를 설계해봅시다.
프로덕트 선정 배경
오늘 분석할 프로덕트는 '더리치' 라는 증권 포트폴리오 관리 서비스다. '개인 투자자가 가지는 정보 비대칭을 해결한다'는 목적으로 스타트업 빌리어네어즈가 개발한 서비스로, 실시간 차트, 주가 확인 및 관심주 관련 뉴스 정보를 찾아볼 수 있으며 인증서를 연동해 여러 증권사의 계좌를 통합해서 관리할 수 있다. 배당일이 임박한 종목 정보 및 권리 입금 스케줄을 보기 쉽게 정리해줘서 배당주를 관리하기에 특히 좋은 서비스다. 나는 작년부터 서비스를 사용하기 시작했는데, 당시에는 연동되는 금융기관이 몇 안돼서(아마 미래에셋만 가능했던..) 불편했다. 나중에 다시 접속해보니 내가 가진 계좌를 다 연동할 수 있을 정도로 서비스가 확대되고 좀 더 구체적인 투자 일지도 작성할 수 있게 되었더라. UI도 보기 좋게 개선되어서 우와아 하면서 구경했었다. 다만 내가 투자를 쉬어서 쓸 일이 없을 뿐...🥺 최근 오랜만에 재접속해서 박살난 내 계좌를 확인했기 때문에.. 인연 삼아 이번 과제로 선정하게 되었다.
랜딩 페이지를 살펴보기에 앞서
더리치는 무료로 사용할 수 있는 서비스다. 아직까지는 웹 페이지의 배너 광고로 수익을 창출하고 있으며, 최근 스타트업 엑셀러레이터 김기사랩으로부터 시드 투자를 유치한 것으로 보아 투자금으로 기능 개발 및 성장에 집중하고 있는 것 같다. 그리고.. 순전히 나의 추측이지만 이 부분이 랜딩페이지에 반영되고 있는 것으로 보인다. 더리치의 KPI에는 앱 다운로드 횟수가 포함되지 않았을 것이다. 그 이유로 떠올려본 것은 아래 항목들이 있다.
1. 사용자(개인투자자)들은 포트폴리오 관리를 모바일로 하지 않고 데스크톱에서 할 것이다.
나 같은 초초초초슈퍼개미는 모바일 앱으로 거래를 하지만, 전업 투자자 내지 중소개미들은 큰 화면에서 실시간 차트 동향을 보며 거래할 것이다.
2. 주요 사용자들의 연령층은 30대~40대 위주일 것이다.
이들은 앱보다 HTS를 활용해서 주식 거래를 하는 것에 익숙할 것이다.
3. 광고 배너가 웹사이트에만 노출된다.
당장 매출 성과가 중요한 상황인 것처럼 보이지는 않지만, 유일한 수익창출 통로가 웹페이지 상의 광고 배너인 것으로 보아 사용자들이 앱을 깔아 사용하는 것보다 웹 상에서 사용하는 것이 서비스에게 더 유리할 것이다.
나의 생각에, 더리치의 랜딩 페이지는 위와 같은 이유들로 '앱 다운로드'보다는 '신규 회원가입'을 유도하고 있다.
로그인하기도 전에 다 보여주는 담백한 서비스: 더리치 랜딩 페이지 살펴보기
아래 이미지들 중 맨 처음은 랜딩 페이지의 첫 화면을 캡처한 것이다. 두 번째 이미지부터는 페이지가 어떤 요소들로 이뤄져 있는지 박스로 표시해서 구분해두었다. 노란 박스는 로그인 전후로 변화가 없는 부분, 빨간 박스는 로그인 전에만 보이는 부분이다. 결론부터 말하자면, 더 리치의 랜딩 페이지는 CTA(call to cation)를 유도하는 부분이 특별히 없다.
1. 페이지 상단
a. 메인 카피: 고무적인 메시지를 사용자가 제일 처음에 볼 수 있는 위치에 두어 긍정적인 감정을 느낄 수 있게 한다.
(나도... 정말 부자 될 수 있는 거야..?🥺)
b. 인증서 연동, 로그인, 회원가입: 기본적인 기능이라 설명 생략.
c. 상위 카테고리: 서비스가 다섯 개의 기능으로 구성되어있음을 한눈에 확인할 수 있다.
d. 공지사항: 아이콘을 두 개나 사용해서 페이지에서 가장 눈에 띄는 텍스트 중 하나다.
e. 차트 이미지, 내 포트폴리오 바로가기, 심리 테스트, 주요 종목 바로가기: 부수적인 기능들을 확인할 수 있는 화면.
페이지의 가장 넓은 면적을 차지하고 있으나 차트에 종목을 입력하거나 심리 테스트 페이지로 넘어가는 것 외에
비회원 유저가 활용할 수 있는 기능은 없다.
A. 로그인 버튼(CTA)과 유도 카피: 페이지 하단에 '보유 자산과 관련된 뉴스를 확인'하고 싶으면 로그인을 하라는 문구와
로그인 버튼을 위치시켰다. 버튼은 브랜드 컨셉과는 반대되는 붉은색을 사용해 눈에 띄게 해 두었다.
B. 실시간 상담 아이콘: 로그인하기 전에는 채팅상담 아이콘이 펼쳐진 상태로 노출된다.
상담 아이콘만 유일하게 유저가 스크롤을 할 때 따라온다.
2. 페이지 중반
f. 오늘 사면 바로 배당받는 종목: 더 리치 정말... 착한 서비스다. 로그인을 하지 않아도 배당 캘린더를 확인할 수 있다.
g. 억만장자들의 명언: 이미지를 클릭하면 좌측에는 명언 이미지가, 우측에는 해당 인물의 포트폴리오를 확인할 수 있다.
역시나 로그인을 하지 않아도 접근할 수 있는 영역이다. 명언 링크를 복사해 공유할 수 있는 기능이 있다.
3. 페이지 하단
h. 부자들의 투자 종목: 바로 위의 억만장자들의 명언과 콘텐츠가 다소 겹치는 부분이 있다.
다른 점이라고 하면 클릭하면 우측에 나만의 뉴스를 확인할 수 있다는 것 정도?
i. 기업 정보 및 앱 다운로드 버튼: 기본적인 기업 정보를 확인할 수 있다.
신기한 건 앱 다운로드 버튼이 페이지 맨 구석에 존재감 없이 있다는 것이다. 이유는 위에서 적어둔 추측을 참고하자.
개선해볼 수 있는 부분 찾아보기
랜딩 페이지를 살펴보면 웹 홈페이지가 철저히 기존 유저 중심으로 이루어져 있음을 확인할 수 있다. 로그인 전후로 달라지는 화면 구성이 없다는 것은 회원가입을 하기 이전의 신규 유저들을 위한 충분한 정보가 제공되고 있지 않다는 것을 의미한다고 생각한다. 이와 더불어 페이지를 살펴보면서 의아했던 점이 세 가지가 있었다.
첫 번째로는, 신규 유저는 자신이 더리치에서 어떤 일을 할 수 있는지 정확히 알 수 없다는 점이었다.
아래 사진은 앱을 다운로드한 유저가 앱에 첫 접속 했을 때 확인할 수 있는 간단한 튜토리얼 화면이다. 자세한 건 아니지만 제공하고 있는 기능에 대한 정보를 확인할 수 있다. 그러나 검색을 통해 웹 홈페이지로 접속한 신규 유저는 이러한 기본적인 정보조차 접할 수 없다. 상관관계가 있는지는 모르겠지만.. 오죽했으면 더 리치의 연관 검색어가 '더 리치 사용법'일까?
두 번째는 회원가입 유도를 위한 홍보 카피로 쓰일 법한 문구들이 앱 다운로드 이후에나 보인다는 점이었다.
위의 이미지들은 앱을 처음으로 실시하면 보이는 화면이다. 각각의 이미지 아래 자세히 보면 회색 문구로 온갖 '믿음직한' 문구들을 확인할 수 있다.
실투자 인증 기반의 포트폴리오로 토론합니다!
100명이 넘는 인플루언서로부터 인사이트를 얻으세요
이미 40만 명이 사용 중인 1등 자산 관리 앱 더리치!
하지만 이는 앱을 설치한 이후에나 조막만 한 크기의 텍스트로 확인할 수 있을 뿐이지, 회원가입을 하거나 앱을 설치하기 이전에는 확인할 수 없는 부분이다. 이런 매력적인 문구들을 랜딩 페이지에서부터 노출하면 더 좋지 않을까?
마지막으로, 임팩트 있는 CTA가 없다.
좀 극단적으로 적었는데, 정확히 말하자면 웹에 접속한 사람들이 그다음으로 해야 할 일을 명확하게 제시하고 있지 않다는 것이다. 어떤 지표를 설정하고 측정하고 있는지는 모르겠지만, 일단 회원 수가 늘어나는 것이 좋을 테니 회원가입을 유도하기 위해 붉은색 A박스(윗부분 랜딩페이지 사진 참조)와 같이 원하는 정보를 확인하고 싶으면 '로그인'을 하라고 보여주고 있다. 하지만 내 생각에는 임팩트가 부족하다. 물론 더리치가 왜 하필이면 '보유 자산과 관련된 뉴스를 보려면' 로그인을 하라고 했는지 이해한다. 더리치의 미션은 아래와 같다. 정보 비대칭을 해결하는 것을 중요하게 여긴다.
기존 금융 자산관리 서비스의 불편함과 정보 비대칭과 같은 이슈를 각종 접근이 쉬운 도구로 개선하여
금융 분야의 페이스북이 되고자 하는 자산 포트폴리오 서비스입니다.
하지만 더리치 타깃의 접속 목적이 정말 보유 종목과 관련된 뉴스를 보기 위함일 뿐일까? 여러 증권사의 포트폴리오를 하나로 합치고 그것의 배당 정보를 편하게 확인하기 위함일 수도 있지 않을까? 세계 부호들의 실시간으로 변하는 투자 포트폴리오 정보를 보고 싶어서이지 않을까? 더리치는 자신들이 가지고 있는 강점들을 사용자들에게 적극적으로 노출시켜야 한다고 생각한다. 그리고 사용자들이 가장 필요로 하거나 잘 사용하고 있는 기능에 CTA버튼(회원가입)을 위치시켜야 한다고 생각한다. 아래 두 이미지는 내가 생각해본 CTA와 관련된 아쉬운 요소들이다. 자세한 설명은 이미지 아래 캡션을 확인하자.
As is - To be: 뉴비에게 좀 더 친절한 서비스가 되어봅시다.
한창 성장 중인 더리치에게 가장 중요한 것은 유저 수 확보일 것이다. 즉, 처음 들어온 사람이 회원가입을 하게 만들어야 한다. 활성 유저의 수가 많은 것이 나중에 추가될지도 모르는 유료 기능을 론칭하기에도 좋은 환경일 것이다. 따라서 더리치에 처음 유입되는 유저(맨 처음으로 랜딩 페이지를 본 유저)를 기준으로 A/B테스트를 설계해보려고 한다. 내용은 별 거 아니다. 좀 더 친절하게 사용법을 알려주자는 것이다. 기본적으로 검색해서 들어온 사람들 또는 맞춤형 광고를 통해 처음으로 방문한 사람들은 서비스 자체에는 관심이 많을 것이다. 관심은 있는 사람들이 회원가입을 하기 전에 고려할 내용은 아래와 같을 것이다.
과연 이 서비스가 나에게 도움이 될 것인가?
이미 증권사들은 마이데이터를 통해 통합 계좌 관리 서비스를 제공하고 있다. 그것을 능가하는 더리치의 장점은 무엇인가? 그것에 대해 효과적으로 설명할 수 있으면 더리치의 전환율은 상승할 수 있을 것이다. 입소문도 탈 것이다.
AS IS
사용자가 알아서 사용법을 숙지해야 함. 단, 각 기능에 접근했을 때 안내문구는 상세하게 서술되어 있음
To be
사용자가 회원가입 하기 전에 대략적인 기능을 알 수 있도록 하고, 로그인 후에 할 액션을 분명하게 알려줌
A/B 테스트 세팅하기
📍 가설: 서비스 사용 안내와 관련된 팝업창을 보여주면 회원가입을 하는 사람의 수가 늘어날 것이다.
📍 목표: 어떤 기능을 제공하는지 알려주고, 각각의 기능을 어떤 흐름으로 사용할 수 있는지 알려준다.
신뢰와 흥미를 가지고 회원가입을 하도록 유도하고, 이들이 활성 유저로 전환되도록 한다.
📍 기간: 2022.07.30 ~ 2022.08.30 (한 달간 실시)
📍 대상: 기간 내 신규 방문자
📍 측정 지표: 팝업창 맨 마지막의 CTA버튼 클릭률 (회원으로의 전환율), 회원가입 직후 1주일 내 인증서 연동 완료 비율
A/B 테스트 화면을 디자인해봅시다
유저가 처음으로 페이지에 접속했을 때 팝업창을 활용해 기능을 쭉 살펴보도록 유도해보자. 맨 처음에는 회원가입 영역 아래에 CTA 버튼을 삽입해 사용자가 클릭을 하면 팝업창을 띄워 흐름을 진행하는 것이 좋겠다고 생각했다. 하지만 그렇게 되면 적극적인 어필이 힘들 수 있을 것 같고 (패기 뿜뿜😤) 유입되는 유저들은 기본적으로 더리치 고유의 기능에 관심을 가지고 있을 것이기 때문에 적극적으로 다가가도 거부감을 적게 느낄 것이라고 생각했다. 버튼 아래에 '괜찮아요, 혼자 살펴볼게요'를 추가해 팝업에 대한 거부감도 줄여보려고 했다. 데일리 과제의 무게를 줄이기 위해 중간 부분에 대한 이미지는 제작하지 않았다(못했다)
우선, 아래의 첫 번째 이미지에서 볼 수 있듯이 '더리치 기능 알아보기' 버튼을 누르면 튜토리얼처럼 각 기능에 대한 세부 팝업이 뜨면서 기능에 대한 설명을 들을 수 있다. 이 과정에서 유저들은 더리치의 기능(배당 캘린더, 커뮤니티 기능, 실험실 수익률 계산)을 알고 어떤 순서로 사용하면 좋을지 대략적으로 익힐 수 있게 된다.
이미지로는 구현하지 않은 튜토리얼 화면들을 거치고 나면, 두 번째 이미지와 같이 최종적으로 로그인하기 CTA 버튼이 노출된다. 이 과정을 거치면 유입된 유저들이 회원가입을 한 이후에 활성 유저로 전환될 확률도 높을 것이라고 생각한다. 회원가입 이후에 '자신이 가장 먼저 해야 할 일(인증서 연동, 관심종목 등록 등)'을 알 수 있기 때문이다.
정리
이 방법은 첫인상을 망칠 수도 있는 것 같다는 생각이 든다. 적극적으로 기능을 어필한 이후 자연스럽게 회원가입을 유도하는 방법이라고 생각할 수 있겠지만 다르게 생각해보면 팝업창(=장애물)을 보자마자 안 좋은 인상을 받고 '이게 뭐야' 하고 바로 뒤로가기 버튼을 누를 수도 있지 않을까. 아니면 1초도 생각 안 하고 '혼자 살펴볼게요' 버튼을 누르는 순간, 기능을 어필할 수 있는 기회는 넘어가버린다. 이런 경우를 대비해 페이지 한쪽 구석에(로그인, 회원가입 구역에) '더리치 기능 100% 활용하기' 버튼을 추가해두면 좋을 것 같다. 언제든 누르면 튜토리얼을 볼 수 있는 거다.
근데 또 드는 생각은. 아니 더리치가 이렇게 튜토리얼까지 만들 정도로 복잡한 기능을 제공하고 있는가? 이다. 으으 머리가 복잡하다. 그래서 다시 단순하게 생각해보았다. 가설을 떠올리는 것이다. 나의 가설은 '사용자들이 더리치의 기능에 대해 잘 알게 되면 회원가입을 할 확률이 올라갈 것이다'였다. 그래서 '더리치 기능 알아보기' 버튼을 처음에 노출시키려고 하는 것이다. 효과가 있을지 없을지는 A/B테스트를 통해 조사해보면 되는 거다. 그러려고 하는 테스트 아닌가!
5주차 학습도 이렇게 마무리되는구나. 위클리 과제도 힘내고, 다음 주도 이겨내보자! 🔥
'부트 캠프 > 📓 Daily Tasks' 카테고리의 다른 글
| 네이버웹툰의 핵심 지표를 GA를 통해 확인해보기 | 코드스테이츠 PMB 13기 (0) | 2022.08.03 |
|---|---|
| 순도 100% 뇌피셜로 네이버웹툰 백엔드 살펴보기 | 코드스테이츠 PMB 13기 (0) | 2022.08.02 |
| 마켓컬리의 AARRR 탐구 | 코드스테이츠 PMB 13기 (0) | 2022.07.27 |
| Pinterest의 그로스 마케팅 전략 (Growth Hacking) | 코드스테이츠 PMB 13기 (0) | 2022.07.25 |
| Figma로 유튜브 뮤직 '내가 고정한 음악' 기능에 대한 와이어프레임 디자인하기 | 코드스테이츠 PMB 13기 (0) | 2022.07.22 |
