<figure data-type="image-block" data-src="https://attachments.datarian.io/production-1c89463d-984d-801b-b543-f32f6755b9a2-nSxq5QeoQ9N0sN_wnuYNahLRqti1-ABGwduPKU96J9E.jpg" data-align="center" data-width="100%" style="width: 100%; max-width: 100%"><img src="https://attachments.datarian.io/production-1c89463d-984d-801b-b543-f32f6755b9a2-nSxq5QeoQ9N0sN_wnuYNahLRqti1-ABGwduPKU96J9E.jpg" /></figure>안녕하세요. 여기어때 UX 디자이너 최정인(Sherry)입니다. 좋은 UX 디자인은 사용자를 망설이지 않게 하는 것입니다. 이를 위해 사용자의 페인 포인트(pain point)를 데이터 분석, User Test 등을 통해 면밀하게 분석하여 문제 정의를 뾰족하게 만들어야 해요. 듣기엔 단순해 보이지만, 올바르게 파악하여 사용자의 문제를 해결하기는 결코 쉽지 않죠.UX Designer인 제가 데이터를 어떻게 의사결정에 활용했고, 이해관계자들을 어떻게 설득했는지 최근에 개선한 ‘로그인/회원가입 페이지’ 사례를 통해 공유해 보려고 해요.<h1 id="1c49463d984d80ac8deaffc39dbb356a">데이터로 날카롭게 문제 발라내기</h1><figure data-type="image-block" data-src="https://attachments.datarian.io/production-1c89463d-984d-80b9-b256-e9a7b7a460f7-qEXaQQjL1uMWuXYQKfwLEJNhrt2j3nJszoCirfly3N8.webp" data-align="center" data-width="100%" style="width: 100%; max-width: 100%"><img src="https://attachments.datarian.io/production-1c89463d-984d-80b9-b256-e9a7b7a460f7-qEXaQQjL1uMWuXYQKfwLEJNhrt2j3nJszoCirfly3N8.webp" /></figure>‘로그인/회원가입’ 페이지 개선은 VOC(Voice of customer)에서 시작되었어요. 여기어때는 현재 여러 로그인 방식을 제공하고 있는데요. 기존 사용자가 다시 로그인할 때, 로그인 정보가 기억나지 않는다는 VOC가 계속해서 인입되었어요. 추가로 회원 탈퇴 사유를 살펴보니 ‘다른 계정이 있어서 계정 정리를 위해’ 탈퇴하는 비율이 22%나 되었죠. 이를 통해 사용자가 기존 계정을 다시 이용하는 데에 어려움이 있다는 것을 알 수 있었죠. 담당 PO는 사용자에게 최근에 사용한 로그인 방식을 툴팁으로 알려주는 솔루션으로 빠르게 해결해 보자고 했어요.저는 이참에 ‘로그인/회원가입’ 페이지를 개선하기에 좋은 기회라고 생각했습니다. 데이터를 기반으로 개선되어야 할 부분이 정말 많다고 판단했거든요.우선, 이메일과 비즈니스 로그인 비율은 각각 5% 미만임에도 화면에서 가장 많은 공간을 차지한다는 문제가 있었어요. 반면, 카카오 로그인은 75%가 넘는 압도적인 사용 빈도에 비해 자그마한 버튼으로 제공되고 있었죠. 또한, 신규 가입 안내 UX가 명확하지 않아 혼동을 주고 있었습니다. 신규 가입자가 꾸준히 유입되고 있는 ‘여기어때’에 지금의 로그인/회원가입 UX는 알맞지 않았죠.우리 서비스의 위치와 현재 사용자 행동에 맞게 로그인/회원가입 페이지 역할을 명확하게 수행하도록 개선이 필요했어요. 그래서 직접 데이터를 뜯어보며 분석한 내용을 토대로 PO에게 페이지 전체 UX를 개선해 보자고 역제안했죠.<h1 id="1c49463d984d80189b66cb89d1d4cdbd">목적부터 분명하게 설정하기</h1>담당 PO분도 새로운 제안에 동의하면서 본격적인 ‘로그인/회원가입’ UX 개선 작업이 시작되었어요. 이번 개선 목적은 사용자가 망설임 없이 다음 단계로 넘어가게 만드는 데 두었어요. 다시 말해, 로그인 전환율에 초점을 두고 의사결정이 진행됐습니다.먼저 PO와 함께 JTBD(Jobs to be done)부터 정의했어요. 정확하게 문제를 해결하려면 달성하려는 goal를 분명히 해야 해요.<ul><li>기존 사용자 : 빠르게 기존 계정으로 로그인하여 서비스 이용을 이어가는 것</li><li>신규 사용자 : 편한 방식을 선택하여 가입 완료 후 서비스에 진입하는 것</li></ul>다음으로, 목표 달성을 확인하기 위한 데이터(success metric)를 설정했어요.<figure data-type="image-block" data-src="https://attachments.datarian.io/production-1c89463d-984d-805d-90c0-cca5d78026d4-1yFsmI6inDyelaO3COKqq2AZ-JyCk3k-MtKIPjpXrCM.webp" data-align="center" data-width="100%" style="width: 100%; max-width: 100%"><img src="https://attachments.datarian.io/production-1c89463d-984d-805d-90c0-cca5d78026d4-1yFsmI6inDyelaO3COKqq2AZ-JyCk3k-MtKIPjpXrCM.webp" /></figure><h1 id="1c49463d984d80398a37d259c49b6391">데이터를 활용하여 솔루션 만들기</h1>막힘없는 ‘로그인/회원가입’ 페이지가 되도록 화면 IA 개선 및 UI 개선/ 툴팁 추가 / 비즈니스 계정 버튼 통합 등 전체적인 개선을 진행했어요. 지금부터 각 솔루션을 어떻게 고안하게 되었는지 소개해 볼게요.<figure data-type="image-block" data-src="https://attachments.datarian.io/production-1c89463d-984d-80ef-adce-c1114e3bfbee-hDcSANi5-kQgI2LOHHJEf2GnZJqGg7cmLZzvv7yZmhA.webp" data-align="center" data-width="100%" data-show-caption="true" style="width: 100%; max-width: 100%"><img src="https://attachments.datarian.io/production-1c89463d-984d-80ef-adce-c1114e3bfbee-hDcSANi5-kQgI2LOHHJEf2GnZJqGg7cmLZzvv7yZmhA.webp" /><figcaption>화면 IA 및 UI 개선</figcaption></figure><h3 id="1c49463d984d80cea5baf6e5165f9258">(1) 화면 IA(Information Architecture) 및 UI 개선</h3>기존 화면을 보면 상단의 SNS 버튼은 로그인만 가능한 것처럼 소구 되고 있었어요. 하지만, 이 버튼은 로그인과 회원가입이 모두 가능했죠. 또, 회원가입을 하려면 하단에 ‘계정이 없으신가요?’ 구좌에서만 가능하다고 오해할 수 있었어요. 이처럼 불분명한 정보 구조가 사용자를 혼란스럽게 만들고 있어 처음부터 다시 정보를 재구성했습니다.먼저, 일반 사용자와 B2B 사용자로 크게 분리하고, 클릭률이 가장 높은 SNS 버튼을 화면의 메인 버튼으로 크게 배치했어요. 그리고 각 버튼을 누르면 로그인과 회원가입이 모두 가능하다는 걸 인지하도록 상단에 ‘로그인/회원가입’ 타이틀을 추가해 고민하지 않고 사용자가 원하는 선택지를 빠르게 찾을 수 있게끔 개선했습니다. 계정 비율이 5% 미만이고 계정 분실률이 높은 이메일 로그인의 경우, 가입과 로그인 버튼을 하나로 통합하고 시각적 주목성을 낮춰 신규 사용자들이 SNS 버튼을 선택하도록 유도했어요.<figure data-type="image-block" data-src="https://attachments.datarian.io/production-1c89463d-984d-8084-bb69-fe1b2a935c3f-CXdh_CDaqYg7p3BPFeR-Y3v2DeUcsoK_IuD7Hg35Bjs.webp" data-align="center" data-width="100%" data-show-caption="true" style="width: 100%; max-width: 100%"><img src="https://attachments.datarian.io/production-1c89463d-984d-8084-bb69-fe1b2a935c3f-CXdh_CDaqYg7p3BPFeR-Y3v2DeUcsoK_IuD7Hg35Bjs.webp" /><figcaption>툴팁 추가와 비즈니스 계정 버튼 통합</figcaption></figure><h3 id="1c49463d984d80f7a6c5f43c8483fc75">(2) 툴팁 추가</h3>다시 로그인을 시도하는 사용자가 빠르게 로그인할 수 있도록 최근 로그인한 방식을 툴팁으로 안내했어요. 여기서 작은 이슈가 발생했었어요. 툴팁으로 인해 다른 버튼이 가려지는 문제가 생겼죠. 하지만, 동일한 디바이스에서 여러 SNS 로그인 계정을 이용하는 사용자의 비율이 굉장히 소수라는 데이터를 확인하여 해당 이슈는 critical하지 않다고 판단했어요. 다만, 일정 시간이 지나면 툴팁이 사라질 수 있도록 해결했어요.<h3 id="1c49463d984d80719629f745eaba2bee">(3) 비즈니스 계정 버튼 통합</h3>비즈니스 로그인은 여기어때와 제휴를 맺은 기업 사용자를 위해 쓰이고 있어요. 데이터를 보니 ‘비즈니스 로그인’은 5% 미만의 사용자만 이용하고 있었어요. 사용률에 비해 AS-IS에선 많은 영역을 차지했죠. 비즈니스 계정 가입 경로를 확인해 보니 앱에서 거의 이뤄지지 않았어요. 그 때문에 일반 사용자에게 혼란을 가져다준다고 판단했어요. 따라서 버튼 주목성을 줄이고, 가입과 로그인을 통합된 버튼으로 제공했어요. 이러한 개선에, 처음에는 영업팀에서 우려를 표했지만, 사용자 행동 데이터를 근거로 개선 이유를 설득한 끝에 동의하셨죠.<h3 id="1c49463d984d800d9b88ea04469ce420">개선 후 결과는?</h3><figure data-type="image-block" data-src="https://attachments.datarian.io/production-1c49463d-984d-8053-8eb2-f9208588ebfe-45maXFOtwPAgxntc_m7VSbIBH5sOinFWoPRPxFLHed4.png" data-align="center" data-width="100%" style="width: 100%; max-width: 100%"><img src="https://attachments.datarian.io/production-1c49463d-984d-8053-8eb2-f9208588ebfe-45maXFOtwPAgxntc_m7VSbIBH5sOinFWoPRPxFLHed4.png" /></figure>일련의 과정을 통해 ‘로그인/회원가입’ 개선 작업이 마무리되었어요. 프로젝트 이후 로그인 전환율은 27%나 개선되었어요! 또한, 사용하던 계정을 찾지 못해 발생하는 VOC가 동일 기간 대비 14% 정도 줄었어요.<h1 id="1c49463d984d80c6849ceec869fc9bc5">UX 디자이너의 강력한 무기는 데이터</h1>다들 공감하실 것 같아요. 간단한 UX 개선 같아 보여도 세심하게 고려해야 하는 사항이 참 많습니다. 무엇보다 여러 이해관계자와 커뮤니케이션을 잘 진행해야 해요. 어쩌면 UX 디자이너의 숙명 아닐까요? 데이터와 친숙해지면 이 프로세스가 간결하고 명확해집니다.💡 데이터를 활용하면 이런 점이 좋아요.<blockquote>1. UX 디자인의 방향성이 명확해져요데이터를 기반으로 사용자를 객관적으로 이해하며, 문제점을 좀 더 뾰족하게 만들 수 있습니다. 여러 이해관계자와 문제 정의에서부터 해결 방향성까지 같은 선상에서 고민하고 토의할 수 있습니다. 2. 의사결정의 근거가 됩니다이로 인해 나의 디자인에 설득력이 생기죠. 서비스, 시기 등 다양한 요인에 따라 사용자도 특성도, 행동 패턴도 달라져요. 우리 서비스 사용자의 행동 데이터를 기반으로 근거를 제시한다면 논리력은 자연스럽게 따라와요. 3. 확실한 결과 확인이 가능해요결국, 나의 디자인이 정말 효과가 있었는지 확인하는 지표도 ‘데이터’에요. 어떤 데이터를 측정해야 하는지, 어떤 지표를 개선해야 하는지 이해하고 있다면 목적이 확실한 디자인을 할 수 있을 뿐만 아니라, 그 효과까지 명확하게 확인할 수 있습니다.</blockquote>단순 VOC만으로 바로 개선에 돌입하지 않고, 전체적인 개선이 필요하다고 PO를 설득할 수 있었던 것도 현재 데이터를 뜯어보면서 구체적인 근거를 제시했기 때문이었어요.<h1 id="1c49463d984d802da67bd29d14e772d2">계속해서 데이터와 친해지기</h1>저는 UX 디자이너가 데이터와 더욱 친숙해져야 한다고 생각해요. 하지만 데이터 기반의 UX 디자인을 하루아침에 해내긴 어려워요. 데이터를 친숙하게 느끼고 정확하게 활용하기 위해선 많은 공부와 연습이 필요합니다. 저도 처음엔 기본적인 데이터 용어들을 익히는 것에서 시작해서, 회의에서 데이터와 관련된 이야기들을 귀 기울여 듣고, 궁금한 점을 데이터 분석가나 PO에게 물어보면서 꾸준히 지식을 쌓아왔어요. 이해되는 내용들이 하나씩 늘어나다 보면 점점 재미있고 쉬워진답니다.또, 더 자주 다양한 주제에 대한 데이터를 접하기 위해서는 팀원들과 함께 각자 진행하고 있는 프로젝트의 데이터를 공유하고 논의해 보는 것도 좋은 방법이에요. 그래서 저는 여기어때 UX center 내 10명의 팀원과 데이터 스터디를 진행하고 있어요. 벌써 3개월째 데이터 문해력과 데이터 기반의 사고력을 기르고 있어요.데이터와 친해지면 사용자가 어떤 행동을 하는지, 어떤 특성을 가졌는지 그리고 메이커가 정말 해결해야 하는 문제가 무엇인지 알기 쉬워져요. 나아가 디자이너가 만드는 UX에 대한 의사결정을 더욱 견고하게 만들어줄 뿐 아니라 이해관계자들과의 협의도 수월해지고 설득력도 강해질 거예요. 가장 중요한 건 데이터와 계속해서 친해지려는 마음 아닐까요! 저는 오늘도 고려해야 할 데이터 지표가 무엇일지 고민하며 UX를 만들러 가볼게요!<blockquote>✔️ 글쓴이를 더 알고 싶다면?: <a href="https://www.linkedin.com/in/jeong-in-choi-sherry/" target="_blank">링크드인</a>편집: <a href="https://www.linkedin.com/in/soyeon-lee-%EC%9D%B4%EC%86%8C%EC%97%B0-7518aa194/" target="_blank">이소연</a>(Jetty) UX Writer</blockquote><div data-type="callout" data-emoji="✍🏻" data-background-color="rgba(235, 236, 237, 0.3)" style="background-color: rgba(235, 236, 237, 0.3);">Editor 혜정’s comment이 글의 원문은 여기어때 기술 블로그에 업로드 된 “<a href="https://techblog.gccompany.co.kr/ux-designer가-데이터를-만나면-26918c14ae0d" target="_blank">UX Designer가 데이터를 만나면?</a>”입니다.</div>

중요한 건 성공 혹은 실패의 원인을 집요하게 파고들며 궁금해하는 태도인 것 같습니다

A/B 테스트를 실패해도 괜찮은 이유

UX에 대한 의사결정을 더욱 견고하게 만들어줄 뿐 아니라 이해관계자들과의 협의도 수월해지고 설득력도 강해질 거예요

UX Designer가 데이터를 만나면?

실험은 성공하는 결과를 빠르게 도출하는 게 아니라, 신뢰성 있는 인과 검증을 통해 ‘비즈니스에 실질적 가치’를 주는 것입니다.

데이터 실험으로 성과를 만드는 방법

데이터로 날카롭게 문제 발라내기

데이터를 활용하여 솔루션 만들기

UX 디자이너의 강력한 무기는 데이터

UX Designer가 데이터를 만나면?

Contents

데이터 분석 소식을
매월 받아보세요

🏖️ 여기어때 데이터 분석 사례 모아보기

함께 읽어보면 좋은 글

리텐션이 웃다니

데이터 분석가의 뉴스레터 그로스 해킹: 구독자 수, 오픈율만 보고 계신가요?

뉴스레터는 무엇으로 돈을 벌까?

데이터 분석 소식을
매월 받아보세요데이터 분석 소식을 받아보세요

UX Designer가 데이터를 만나면?

Contents

데이터 분석 소식을 매월 받아보세요

🏖️ 여기어때 데이터 분석 사례 모아보기

함께 읽어보면 좋은 글

리텐션이 웃다니

데이터 분석가의 뉴스레터 그로스 해킹: 구독자 수, 오픈율만 보고 계신가요?

뉴스레터는 무엇으로 돈을 벌까?

데이터 분석 소식을 매월 받아보세요데이터 분석 소식을 받아보세요

데이터 분석 소식을
매월 받아보세요

데이터 분석 소식을
매월 받아보세요데이터 분석 소식을 받아보세요