brunch

매거진 웹사이트 사용자의 UX 분석

라이킷 45 댓글

You can make anything
by writing

C.S.Lewis

계정을 잊어버리셨나요?

by 뷰저블 Beusable Apr 04. 2018

사용자의 짧은 체류시간 동안 효과적으로 서비스 소구하기

사용자의 체류 시간이 길수록 전환율이 높아지는 것이 아닙니다.

안녕하세요 뷰저블입니다. 오늘은 높은 전환율의 직관적인 웹 사이트를 만들기 위해서는 어떻게 해야 할지 여러분들과 이야기 나누고자 합니다. 특히 뷰저블과 같은 B2B 서비스를 방문한 사용자를 사로잡는 법에 대해 말씀드리겠습니다.

'좋은 웹 사이트'에 대한 오해,

체류시간이 길수록 좋은 사이트라고 말할 수 있을까요?

많은 UX 디자이너와 서비스 기획자가 종종 '체류시간이 길수록 좋은 웹사이트일 것'이라고 오해합니다. 하지만 결코 그렇지 않습니다. 짧은 체류시간 동안 '전환율이 높은 사이트'야 말로 좋은 웹 사이트입니다. UX 디자이너와 서비스 기획자의 목표는 '체류 시간'을 늘리는 것이 아니라, 적정한 체류시간 동안 '전환으로 이어지는 태스크를 완수'할 수 있도록 유도하는 것이야 말로 가장 중요한 역할이라고 말할 수 있습니다.

전자 상거래 사이트로 예를 들어보겠습니다. 사용자가 서비스에 방문한 이후부터 상품 상세 페이지를 확인하고 결제하기까지의 프로세스를 완료하는 체류시간이 짧으면 짧을수록 '성공적인 쇼핑'이라고 볼 수 있습니다. 체류시간이 오히려 길면 길수록 사용자가 원하는 상품을 찾지 못해 탐색 시간이 길어지는 것으로 해석할 수 있습니다. 또는 원하는 상품을 찾았더라도 구입에 확신을 갖지 못하고 망설인다고 볼 수 있어 웹 사이트 개선이 필요합니다.

최근 들어서는 많은 기업에서 회원가입, 상품 구입, 상품 탐색 등 전환과 관련된 다양한 프로세스를 굉장히 간결하게 개선하여 전환율을 높이고 있습니다. 대표적인 사례로 슬랙과 드롭박스의 스크린숏을 가져왔습니다. 핵심 캐치프레이즈로써 상품이 지니는 가치를 명확하게 제안하며, 바로 전환을 달성할 수 있도록 회원가입 UI를 구성하고 있습니다. 스크롤을 하지 않더라도 이 서비스가 어떤 서비스인지, 어떤 가치를 제안하는지 바로 알 수 있는 것이 특징입니다.

슬랙(Slack)의 홈페이지는 핵심 캐치프레이즈와 회원가입 UI를 Above the Fold에 두었습니다.

드롭박스(Dropbox) 또한 명확한 캐치프레이즈와 회원가입 UI를 Above the Fold에 두었습니다.

절반 이상의 웹 사이트 방문자가 10~20초 이내에 이탈한다는 사실을 알고 계신가요?

How Long Do Users Stay on Web Pages?

Users often leave Web pages in 10-20 seconds, but pages with a clear value proposition can hold people's attention for much longer because visit-durations follow a negative Weibull distribution.

www.nngroup.com

그럼 얼마나 짧은 시간 동안 사용자가 전환과 관련된 태스크를 수행할 수 있도록 유도해야 할까요? 체류 시간과 관련된 연구 결과 데이터를 살펴보겠습니다. 제이콥 닐슨 아티클에 따르면 웹 페이지를 방문한 사용자는 10~20초 사이에 이탈하는 경우가 가장 많으며 평균적으로 1분 내외로 체류한다고 합니다. 또한, 실제로 방문한 페이지의 텍스트 중 4분의 1 정도 해당하는 양만을 읽는다고 합니다. B2B 웹 사이트의 랜딩 페이지라면 간결한 캐치 프레이즈를 통해 매우 명확한 가치를 제안하지 않는 이상 아무리 자세히 설명을 한다 하더라도 사용자에게는 전혀 와 닿지 않을 것임을 의미합니다. 이 10~20초 사이에 사용자가 서비스에 대해 기대하는 것, 사용자 스스로가 고민하고 있는 점 또는 원하는 것을 담아 소화할 수 있도록 이끌어내야 합니다.

위 그래프를 보면 더욱 명확해집니다. 처음 10초 동안 사용자가 이 페이지에서 더 머물 것인지 아닌지를 판단한다고 해석할 수 있습니다. 이 10초 동안 사용자가 '페이지에 머무를 것'을 판단한다면, 20초 내외로 더 오래 둘러볼 것입니다. 하지만 충분히 오랫동안 페이지를 둘러보도록 만들기 위해서는 곡선 그래프가 완만해지는 30초 정도까지 머무르도록 유도하는 것이 효과적입니다. 계속해서 트리거를 두어 사용자에게 명확한 가치를 제안하고 이탈하지 않도록 호기심을 끌어봅시다.

10초 이내에 웹 사이트를 방문한 사용자를 사로잡는 방법

사용자에게 아래 트리거들을 계속해서 제안하여 최종적인 전환 태스크를 완수할 수 있도록 유도할 것을 제안합니다. 뷰저블과 같은 B2B 서비스에 적용한다면 특히 효과적일 것입니다. 또한, 아래에서 제시한 중요 트리거와 최종 전환과 관련된 CTA를 함께 두어 사용자가 서비스에 대해 충분히 이해하였다면 바로 전환할 수 있도록 유도합시다. 전환은 회원가입, 구매, 데모 보기 등을 예로 들 수 있습니다.

1. 여러분은 어떤 서비스를 제공 중인가요?

사용자는 여러분의 서비스가 어떤 서비스인지 명확히 이해하기를 원합니다. 추측하거나 고민하지 말아야 합니다. 믹스 패널은 'Understand every user's journey'라는 캐치프레이즈를 사용하여 사용자 여정을 시각화해주는 서비스를 제공하고 있음을 단번에 이해할 수 있게 합니다. 이 정보를 이해하기 위해서 별도로 마우스 스크롤을 하지 않아도 됩니다. Above the Fold 영역에 서비스를 정의 내리는 핵심 가치를 제안하세요. 역시 회원가입 CTA를 함께 두고 있습니다.

믹스패널(mixpanel) 홈페이지는 사용자의 시선을 머무르게 하는 흥미로운 일러스트와 회원가입 UI를 삽입했습니다.

2. 사용자는 어떤 고민을 떠안고 있나요?

사용자의 궁극적인 Pain-Point는 무엇인가요? 여러분의 서비스가 무엇인지를 알았다면 사용자는 자신들의 고민을 이 서비스가 과연 해결해줄 수 있을 것인가?를 궁금해할 것입니다. 짧고 간결하면서도 핵심적인 포인트를 짚어내 사용자에게 소구 하세요. 믹스 패널에서는 서비스를 정의 내리는 캐치프레이즈 하단에 '즉각적인 통찰력을 통해 현명한 의사결정을 내리고 신속하게 행동하세요'라는 문구를 통해, 사용자가 믹스 패널을 사용하면 의사결정에 대한 어려움이 사라진다고 말하고 있습니다.

'어떤 사용자의 어떤 상황 또는 문제점을 해결해 줄 것인가?', '왜 사용자는 당신의 경쟁사 제품이 아닌 당신의 제품을 구매해야 하는가?'를 이야기하세요.

3. 서비스 가격은 얼마인가요?

서비스에 대한 핵심 장점을 파악했다면 다음으로는 가격을 궁금해할 것입니다. 가격 정보를 반드시 올려야 할 필요는 없지만 눈에 띄는 곳에 두어 바로 확인할 수 있도록 해야 합니다.

뷰저블(Beusable) 홈페이지에서는 GNB 영역에 Pricing 메뉴를 별도로 두었습니다.

뷰저블리(Beusably)에서도 이용요금 메뉴를 GNB의 첫번째 메뉴로 두었습니다.

뷰저블은 상단 GNB에 'Pricing' 메뉴를 두어 원하는 즉시 바로 가격 정보를 파악할 수 있게 하였습니다. 뷰저블리 또한 이용요금 메뉴를 두고 있습니다.

뷰저블 Pricing 상세 페이지에는 전환과 직결될 수 있는 CTA를 다수 배치하고 있습니다.

상세 요금 페이지에서는 '문의', '결제' 등 전환과 직결되는 CTA를 함께 제공하였습니다.

4. 타 서비스와 차별화되는 점은 무엇인가요?

쿠팡에서는 차별화된 가치 제공으로 이전에 '로켓 배송'을 한동안 활발히 소구하였습니다.

여러분의 브랜드가 경쟁사 서비스와 차별화되는 점은 무엇인가요? 로열티 프로그램이 될 수도 있고 실시간 고객 센터 등을 운영하는 것이 예가 될 수도 있습니다. 고객이 수많은 경쟁사 서비스 중에서 여러분의 서비스를 이용해야만 하는 이유를 찾아서 소구 하세요. 국내 이커머스 중 하나인 쿠팡에서는 예전에 저녁 12시 이전에 구입한 상품을 익일 배송을 해주는 '로켓 배송'서비스를 통해 센세이션을 일으킨 적이 있습니다. '쿠팡=로켓 배송'이라는 큰 차별점을 소구 할 수 있었고 시장을 선도하는 이미지를 가져갈 수 있었습니다.

5. 여러분의 서비스를 사용자가 신뢰할 수 있나요?

여러분의 서비스를 사용자가 신뢰하기 위해 리뷰, 수상 로고, 고객사 사례 등을 게재하세요. 브랜드 자산이 구축되지 않은 서비스일 경우 이런 신뢰에 직결되는 요소는 특히나 중요합니다. '너희와 비슷한 사용자도 우리 서비스를 쓰고 있어'라고 마음을 자극하세요.

믹스패널 Fold 하단에 바로 보이는 고객사례와 로고

삼성닷컴 독일(DE) 사이트에서는 Footer에 어워드 로고를 삽입하였습니다.

6. 즉각적으로 커뮤니케이션할 수 있는 연락 수단이 있나요?

삼성 전자 미국(US)는 라이브 챗 기능을 통해 실시간 연락을 지원합니다.

다음으로는 연락 수단을 게재하세요. 서비스에 대해 파악한 사용자는 궁금증이 생겼을 것입니다. 여러분에게 연락하도록 연락 수단을 배치하세요. B2B 서비스는 별도 Contact Us 페이지를 두는 곳도 많으며, 커머스 중에서는 실시간 채팅 등을 통해 웹 페이지 탐색 중 바로 연락할 수 있도록 지원합니다.