상품 결제를 원활하게 만드는 UX디자인
베이마드 연구소(Baymard Institue)는 미국의 이커머스 사용자 경험을 전문으로 연구소이다. 최근에 4560명의 사용자를 대상으로 온라인 마켓에서 자신의 장바구니에 담은 제품을 구입하지 않는 비율을 조사하였다. 그 결과 미국 온라인 쇼핑객의 69.57%의 소비자가 장바구니의 제품을 포기한 것으로 나타났다. 이들은 대부분 결제 창에 가기 전에 구매를 포기하였다.
출처: https://baymard.com/lists/cart-abandonment-rate구매 포기 비율을 살펴보면 50%의 잠재 고객은 엑스트라 비용 부담이 싫어서 포기를 했다. 28%의 고객들은 새로운 계정을 만드는 것에 대한 부담을 느꼈고 21%의 고객들은 결제 과정의 복잡성을 이야기하였다.
많은 요소들이 최종 구매율에 영향을 준다. 위의 연구 결과에서 알 수 있는 것은 기술적인 문제가 소비자들의 구매율에 영향을 미치지만 그런 기술적인 문제를 UX 디자인 설계를 통해 고객에게 쉽게 접근한다면 고객의 구매율을 높일 수 있는 단서를 제공받을 수 있다.
상품 결제를 원활하게 만드는 UX 디자인을 하기 위해선 어떤 노력을 기울여야 할까? 위의 연구 결과를 토대로 사용자 중심의 디자인을 하는데 도움이 되는 디자인 요소 5가지를 정리해 보았다.
1. 비회원 결제 시스템
회원가입은 상품 구매를 위한 첫단계이다. 기업의 입장에서 고객의 회원가입은 또 다른 마케터의 용도로 사용될 수 있는 데이터를 확보하는 것이다. 그래서 가능하다면 회원가입을 권장한다. 기업은 회원가입자들에게 광고 이메일을 보낼 수 있고 회원의 연락처로 할인 쿠폰을 보내 제품 구입을 유도할 수도 있다. 이런 과정을 통해 기업은 매출을 올릴 수 있기 때문에 회원가입율을 올리기 위해 다양한 방법을 도입한다.
과거의 복잡한 회원가입 과정과 비교해 보았을 때 오늘날의 회원가입은 매우 간편해졌다. 자주 사용하는 SNS로 회원가입을 유도해 몇 번의 탭으로 쉽게 회원 가입이 가능하다. 입력해야 하는 정보가 많아질수록 회원의 이탈률이 커진다. 그렇기 때문에 기업 입장에선 한 번 온 고객은 놓치지 않는다는 마음으로 기본적인 정보만 받고 회원가입 절차를 진행하고 있다.
여기서 아래와 같은 질문이 발생한다.
간편 가입조차 싫어하는 일회성 고객의 상품 구입은 어떻게 유도할 것인가?
사이트의 성격에 따라 다르겠지만 일부 고객들은 (최소한의 절차일지라도) 무분별한 회원가입을 싫어하는 사람들도 많다. (제품의 단가가 높거나 일회성 구입일 경우, 그 비율은 더 높아진다.)
이런 고객들은 어떻게 잡아야 할까? 기업의 최종 목적이 결제를 통한 상품 판매라면 일회성 고객들을 위해서라도 비회원 구입창을 제공하는 것을 고려할 필요가 있지 않을까?
필자 역시 가격이 똑같은 제품을 A와 B 사이트에서 판매할 경우 비회원으로 구입이 가능한 곳에서 결제를 한다. 인터넷 쇼핑 경력만 15년이 넘어가는 입장에서 너무 많은 사이트에 내 아이디가 노출되어 있다. 평생 1-2번 구입만 할 것 같은 사이트에서는 되도록 나의 최소한의 정보라도 공개하고 싶지 않은 마음이 크다.
똑똑한 고객들은 더 이상 기업에서 제공하는 할인문자에 현혹되지 않는다. 회원정보를 통해 제공하는 마케팅 수단에 집중하기 보다는 양질의 제품과 결제과정을 편리성에 집중하는 것이 실제 구매율을 더 높이는 방법이다.
100% 회원가입제도와 비회원 회원가입제도는 판매 상품에 따라서 달라질 수 있기 때문에 기업 입장에선 A/B 테스트를 통해 비회원 구입 가능 여부에 따른 구매율을 조사해보는 것은 필요하다고 생각된다.
나이키 웹사이트 결제창. 비회원을 위한 구입창을 식별하기 쉽게 만들어 놓았다.2. 단순한 결제 과정
"네이버페이 안 되면 최저가라도 안사요."
인터넷 쇼핑할 때 제일 중요한 게 네이버페이로 결제할 수 있냐 없냐에요. 다른 쇼핑몰보다 조금 비싸더라도 네이버페이가 되는 곳이 있으면 거기서 사요. 최저가라고 해봤자 어차피 1000~2000원 차이인 경우가 많은데, 간편 결제 안 되는 데서 사려면 되게 귀찮거든요. 그리고 주문 내역을 한 번에 관리할 수 있어서 좋아요. 적립금도 여기저기서 찔끔찔금 받으면 사실상 버리는 돈인데, 네이버페이로 사면 적립급도 한곳에 모이니까. 개이득이에요. -정은주(16세 중학생)
MZ 세대를 타겟으로 마케팅을 하는 사람들을 위한 인사이트 사이트인 '캐릿'의 연구결과에 따르면 10대들은 간편결제(여기선 네이버페이)를 제공하지 않는 결제창은 고민도 안 하고 닫아버린다고 답했다. 위의 인터뷰를 통해 MZ 세대들은 소소한 할인율 이벤트보다 간편 결제 시스템을 적용한 사이트를 더 선호하는 것을 알 수 있었다.
단순한 결제 과정을 선호하는 것은 비단 MZ 세대들 뿐만 아니다. 베이먼드 연구소의 결과에도 나타났듯이 많은 소비자들이 복잡한 결제과정을 선호하지 않는다는 것을 알 수 있었다.
최근 아마존은 결제 단계를 3단계에서 2단계로 축소시켰다.상품을 검색한 후 'Buy Now' 버튼을 탭하면 기존 앱 아래에서 결제를 할 수 있는 창이 바로 올라온다. 새 창으로 넘기지 않고 기존의 창에서 결제를 진행함으로써 사용자는 내가 사려는 물건을 정확히 알 수 있다. 사용자가 등록해 놓은 주소와 카드 정보가 보여지고 결제는 '탭' 방식이 아닌 '스와이프(옆으로밀기)' 방식을 적용해 더 손쉽게 만들었다.
(미세상호작용 디자인 관점에서 '탭' 방식보다 '스와이프' 방식이 더 자연스러운 제스처라는 것은 아래 아티클을 참고하길 바란다.)
온라인쇼핑 도중 실수로 스와이프를 해서 물건을 구매하는 일이 생길 수 있다. 하지만 취소와 환불이 쉬운 아마존 쇼핑몰에선 소비자의 구매 절차를 더 높이는 것에 집중을 한 것 같다.
3. 상품 정보 전달
상품 이미지
상품 이름
상품 상세 내용
상품 수량
상품 가격
최종 금액을 분명히 전달
필요한 정보는 확실히 전달
의외로 많은 이커머스 사이트에서 이 부분에 신경을 덜 쓰고 있다. 그저 필요한 정보를 다 제공하면 되는 식이 아니라 제품 구입에 영향을 끼치는 요스를 어떻게 배치를 하느냐가 중요하다.
이미지는 텍스트보다 뇌에서 더 빨리 인식하는 경향이 있다. 큰 이미지는 고객들에게 제품을 더 분명하게 설명해 준다. 고객들은 점점 똑똑해지고 있다. 수차례의 온라인 쇼핑과 시행착오를 바탕으로 어떤 포즈로 사진을 찍어야 잘 나오는지 알아차린다. 눈속임으로 구매를 유도하는 시대는 지나갔다. 이미지는 최대한 크게 보여주는 것이 좋으며 잘못된 부분은 미리 언급해 놓는 게 낫다. 가격에 따른 옷의 퀄리티를 어느 정도 알기 때문에 내가 사려는 금액에서 터무니 없이 퀄리티 좋은 제품을 기대하지 않는다.
소비자가 화가 나는 시점은 나에게 안 어울리는 옷을 샀을 때보다 화면의 이미지와 실제 이미지와 다를 때, 언급되지 않은 사실을 상품을 받아보았을 때 알아차리는 것이다.
영국의 온라인 쇼핑몰 AOSO은 모바일 화면의 상단의 불필요한 요소를 제고하는 대신 이미지를 최대한 확대해서 보여주고 있다. 소비자가 이미지를 아래로 스크롤하면 하단의 네비게이션 바(bar)는 <이미지 2>에서 보는 것처럼 자동으로 사라진다. 또한 모든 이미지에 'vidoe' 를 제공하고 있다. 'video'를 탭하면 모델의 워킹샷에 따른 옷감의 핏을 살펴볼 수 있다. 개인적으로 랜딩페이지의 이미지에 gif 파일을 적용해 이미지를 움직이에 하는 레이아웃보다 소비자가 원하는 이미지만 선택적으로 비디오로 볼 수 있게 해주는 UX 디자인이 훨씬 깔끔하고 상품 전달에 효과적이라는 생각이 든다.
<이미지 3>에서 보는 것처럼 결제창의 경우 상품을 왼쪽으로 밀면 삭제가 가능하고 오른쪽으로 밀면 저장이 가능하다. 탭(bar) 방식 대신 스와이프(swipe) 방식을 사용하고 있다.
영국의 온라인 쇼핑몰인 Pull & Bear 역시 UX 디자인에 신경을 쓴 모습을 발견할 수 있다.
제품을 검색창에서 이미지를 최대한 크게 보여주고 있고 스크롤을 내리지 않고도 옷 정보와 가격, 색상, 사이즈, 장바구니 담기가 모두 가능하도록 디자인했다.
결제창 역시 스와이프 방식을 적용해 장바구니 리스트를 삭제 & 저장할 수 있도록 해놓았다.
필요한 정보는 확실히 전달할 것! - 모바일앱을 열었을 때 일시적으로 뜨는 팝업보다 방해하지 않는 선에서 지속적으로 보여주는 정보가 더 확실하다.
랜딩페이지에 지속적으로 노출되는 'Free delivery on all your orders!' 정보는 작은 글씨라도 매우 강력하다!Pull & Bear 사이트의 경우 랜딩페이지에서 지속적으로 무료 배송 이미지를 제공하고 있다. 작은 폰트이지만 고객의 입장에서는 매우 강력한 메시지 어필이 될 수 있다. 배송비 걱정 없이 제품을 구매할 수 있다는 확인을 시킨 상태에서 온라인 쇼핑을 지속할 수 있는 힘이 생긴다.
4. 단순하고 정확한 CTA
기업의 최종 목적은 소비자에게 상품을 파는 것이다. 소비자의 마음에 희소성과 긴박함을 불러 일으키는 클릭 유도 문안(CTA) 디자인은 매우 중요하다.
CTA 버튼의 내용은 간결해야 하며 비슷한 단어들 중 상황에 가장 적합한 단어를 선택할 줄 알아야 한다. 배경화면과 대비되는 색상을 선택해서 사용자의 실제 행동을 유도해야 한다.
5. 빠른 고객 상담 서비스
고객이 실시간으로 질문을 할 수 있는 대화 상자를 디자인하는 것 역시 매우 중요하다. 과거에는 1:1 게시판을 통해 질문을 올리는 시스템이 대부분이었다. 하지만 1:1 게시판은 담당자가 언제 확인을 하는지 알 수 없으며 구매의 관심사에서 고객을 이탈시키시 매우 쉽다.
카톡 1:1 채팅이나 인스타 DM, 로봇챗 등 사람이든 AI를 통한 상담이든 고객은 내가 실시간으로 확인하는 것을 매우 중요하게 생각한다. 이런 경향은 어린 연령층일수록 더 심화된다. 10-20대 초반에서 페이스북 메신저를 선호하는 이유 중 하나도 대화창에 로그인이 되어 있는 사람을 볼 수 있기 때문에 바로 채팅을 할 수 있다는 믿음에서 비롯된다.
MZ 세대는 실시간 소통에 익숙하다. 대학내일 20대 연구소에서 진행한 '세대별 커뮤니케이션 비교 연구'에 따르면 Z세대의 67%가 '메시지 읽음 여부' 정보가 필요하다고 응답했다.
하지만 고객의 질문을 실시간으로 상담해줄 수 있는 대화창 디자인이 너무 튀어서 제품을 검색하는데 방해를 해서는 안된다. 제품을 가리지는 않아야 하지만 쉽게 찾을 수 있는 구도내에서 필요할 땐 언제든 사용할 수 있는 곳에 배치하는 것이 중요하다.
실시간 상담이 어렵다면 답변이 가능한 시간을 정확하게 명시해 두는 것이 필요하다. 또한 접수된 질문은 최대 몇 시간 이내에 답변이 완료된다는 것을 알려줘도 좋다.
마치며
지금까지 상품 결제를 원활하게 만드는 UX 디자인를 살펴보았다. 상품 구매의 가장 중요한 요소는 퀄리티 좋은 상품이겠지만 좋은 상품을 얼마나 효율적으로 전달하는지도 중요한 세상이 되었다. UX 디자인은 단순히 멋있어 보이고 화려한 애니메이션을 사용하는 디자인이 아니다.
UX디자인(사용자 경험 디자인)은 제품이나 서비스의 각 기능 혹은 요소들이 사용자에게 제공하는 다양한 감정의 총합이다. 그렇기 때문에 UX 디자인을 할 때는 디자인에 들어가는 모든 요소들에 대한 합당한 이유를 설명할 수 있어야 한다.
'UX디자인을 하는 것 = 건축 설계 도면을 그리는 것'
참고문헌
https://baymard.com/lists/cart-abandonment-rate
https://uxdesign.cc/7-cta-button-design-guidelines-4cdc21c2c85a
