도입문의 클릭률 5.94배 높인 웹사이트 디자인
디자이너가 회사에서 인정받는 성과를 만들어내는 일
https://kimyebin.com/Writing/7
“웹사이트 일단 대충 만들어놓자, 그거 뭐가 그렇게 중요해! 제품이 좋으면 알아서 잘 팔리겠지.”
이번에 '리캐치'라는 제품의 웹사이트를 리뉴얼하였는데요. ‘제품을 잘 포장하여 보여주는 일’이 얼마나 중요한지, 회사에 얼마나 큰 임팩트를 가져다줄 수 있는 일인지 몸소 느끼는 경험이었습니다. 이번 글에서는 그 경험과 과정에 대해 자세히 공유해드리려고 해요.
디자이너와 마케터의 숙원 사업, 웹사이트 리뉴얼.
리뉴얼 이전의 웹사이트 모습입니다. 우선 새롭게 나온 기능들에 대한 설명이 부재할 뿐더러, 무엇을 제공하는 서비스인지 한 눈에 알기가 어려웠습니다. 메인 문구 또한 굉장히 모호했어요. 시각적으로도 브랜딩이 구축되기 전이라 톤앤매너가 일관되지도 않은 모습이였어요.
이걸 갈아엎는 것이 리캐치 팀의 마케터와 디자이너의 커다란 임무였습니다. 데이터로 이를 확실하게 트래킹해야겠다는 생각이 들어 기획부터 끝까지 숫자를 통해 이야기하기로 했어요. 그래야 객관적인 판단과 실행이 가능해지기 때문이에요.
웹사이트 전체 방문자 수 대비 도입문의 버튼 클릭률 4%,
그 중 2%가 도입문의를 남긴다.
저희가 정했던 목표 수치입니다. 이 전 웹사이트는 부끄럽지만 1% 웃도는 수치를 보였거든요. 사실 더 큰 목표를 잡았다가 쉽지 않겠다는 생각이 들어 웹사이트의 평균 전환율인 약 2.35%를 따라 2%로 정했습니다. 가장 중요하게 생각했던 부분은 '우리가 타겟하는 ICP에게 소구되는 콘텐츠들’과 ‘쉽고 명료한 메시지와 이미지’였습니다. 제품의 특성상 써보기도 전에 어렵게 느껴진다는 피드백도 있었거든요. 무조건 예쁘고 멋진걸 떠나서 타겟에 맞는 디자인을 하는 것이 저에게는 큰 목표였습니다. 이 목표를 이루기 위해 다음과 같은 테스크를 진행했습니다.
1. 메인 이미지와 문구는 쉽고 명료하게.
제품의 얼굴이라고 할 수 있죠. 많은 사람들이 서비스를 도입하기 전에 우리 웹사이트에 들어와 어떤 제품인지 둘러보잖아요. 그 경험 중에서도 가장 첫 번째로 마주하는 곳이 바로 Hero 메인 페이지에요. 가장 마지막까지 고민하며 디자인했던 부분이기도 해요. 여기에 넣을 문구만 며칠을 고민하고, 화면을 가득 채우는 컨셉으로 할지, 제품 이미지는 넣을지 말지, 허들없이 누르고 싶은 버튼의 문구를 뭘지 엄청 고민을 많이 했어요.
결국 우리의 타겟 ICP는 무언가 배우고 세일즈에 대해 더 많이 알고싶어하는 페르소나들이라는 것을 판단으로 ‘잘하는 세일즈 맨의 노하우를 알려준다!' 라는 VP로 정했어요.
문제는 문구만 읽었을 때 교육 서비스처럼 비춰질 수 있다는 우려가 있어 소프트웨어라는 것을 알 수 있도록 제품의 이미지를 넣기로 결정을 했고, 작동 방식의 이해를 돕기 위해 정적인 이미지보단 움직이는 이미지를 따로 제작하여 배치했어요.
2. 고객 성공 사례와 숫자로 이야기하여 논리적 설득했어요.
저희는 성공 사례가 다양하고 내세우기에 강점이 있었어요. 워낙 활발히, 새로운 방식으로 제품을 활용하여 성장을 하고 계시는 분들이 많았거든요. 고객사분들이 매출을 만드는데에 도움을 주는 제품이라 특히 '숫자’로 이야기하는 것이 후킹할만한 요소라는 생각이 들었어요.
블로그 콘텐츠도 잘 구성되어있어 아래 쪽에선 해당 고객 성공 사례 블로그 페이지로 연결되도록, 그리고 상단에는 메인 페이지에서 이탈되는 것을 방지하기 위해 텍스트로만 이루어진 Ticker를 배치했어요.
3. 이미지는 누가봐도 어떤 서비스를 제공하는지 이해할 수 있도록 그려냈어요.
어렵게 느껴질 수도 있는 제품의 UI를 최대한 쉽게 단순화하는 것이 숙제였어요. 제품의 기능이 많기도 하고, 하나의 이미지에서도 전달하고 싶은 이야기가 너무 많아서 욕심을 덜어내는 것이 어려웠던 것 같아요. 들어가는 문구 하나 하나도 처음엔 엄청 길고 장황했는데, 마케터분이 고심하여 짧지만 명확하게 정리하여 주셨어요.
컬러도 고객 수집/ /고객 관리 기능을 구분하여 사용하였어요. 별거 아닌 것 같아보이지만 페이지마다 고객들이 느끼는 경험이 일관적이였으면 좋겠다는 생각이였거든요. 고객을 수집하는 과정은 에너지가 느껴지는 제품의 브랜딩 메인 컬러인 주황색을, 고객을 관리하는 과정은 신뢰가 느껴지는 서브 컬러인 파란색을 사용했어요
웹사이트 전체 방문자 수 대비 도입문의 버튼 클릭률 10.7%, 기존 웹사이트 대비 5.94배 목표 초과 달성했습니다.
새로운 디자인을 릴리즈하고 나서 한 달 반 정도 지났을 때 저희가 확인한 데이터입니다. 목표로 했던 2%의 다섯 배가 넘는 수치를 달성할 수 있었어요. 구글 도메인에서는 5.39배 성장, 네이버에서는 2배 성장의 오가닉 유입률 성장을 이루었고요. 저희가 의도한대로 scroll depth 67.2%였어요. 대부분이 메인페이지에서 끝까지 스크롤을 내려 콘텐츠들을 보았다는 의미에요.
이 결과를 보고 팀원들이 모두 경악했어요. 실제 Unique 방문자 수가 늘기도 늘었지만 웹사이트를 통한 인바운드 문의 비율도 덩달아 늘었거든요. 매주 크고 작은 팀들이 저희 제품을 사용하고 싶다는 문의를 남기고, 제품을 무료로 사용하기 위해 회원가입을 하는데, 프로덕트 팀의 일원으로써 너무나도 진귀한 경험이기도 합니다.
디자이너가 성과를 낼 수 있는 방법
디자이너로써 회사에서 성과를 내는 일이 매우 어려웠어요. 항상 그것에 대한 갈증이 있었고, 내 역량을 숫자로, 눈으로 증명하고 싶기도 했거든요. 그 방법이 사실 너무 명확했어요.
목적에 맞는 디자인을 할 수 있어야 해요. 우리 회사가, 우리 팀이, 나의 동료가 원하는 디자인이 무엇인지 고민하며 결과물을 창출해야 합니다. 그에 맞는 목적과, 그것을 소비하는 대상과, 결과물이 일직선 상에 모일 때. 그것이 디자이너가 만들어 낼 수 있는 가장 큰 성과가 된다는 것을 이번 경험을 통해 깊이 느꼈어요.
