'네이버 웹툰' 모바일 서비스 UX를 분석해보자 (2)
네이버 웹툰의UX 개선사례 알아보기
이전 글에서 네이버 웹툰을 통해 UX의 법칙 10가지를 한번 알아보았는데요.
이뿐만 아니라 네이버 웹툰은 지속적으로 UX를 개선하고 있습니다. 계속해서 발전하고 있는 네이버 웹툰의 UX 개선 사례를 좀 더 찾아보았어요. 그중에서 좋은 개선 사례라고 생각하는 부분을 가져왔습니다.
이전 버전의 화면 이미지를 가지고 있지 않아서 인터넷 서치를 통해 네이버 웹툰에 대한 12년도의 자료를 찾았습니다. 작품 감상 페이지 내에 있는 회차 이동 버튼에 대한 이야기입니다. 아래 링크를 참고해 주세요.
<12년도에 쓰인 네이버 웹툰 '컷툰'페이지 UX 자료 원본 보기>
https://blankdesign.tistory.com/4?category=375163
기존 회차 이동 버튼은 위아래 방향의 화살표가 그려진 버튼을 가지고 있었습니다. 어떤 게 이전 회차이고, 다음 회차인지 아시겠나요? 약간은 혼란스러운 버튼의 방향을 가지고 있습니다. 정답을 말씀드리면, 아래 방향이 이 전 회차이고 위 방향이 다음 회차입니다.
딱 직관적으로 알아볼 수 없는 이 회차 이동 버튼은 사용자에게 혼란스러운 경험을 제공합니다.
위에서 살펴보았던 UX의 법칙 중 '도허티 임계'에 따르면 0.4초 안에 사용자가 인터랙션을 해야 할 텐데, 그럼 적어도 0.3초 안에 이 버튼이 무엇인지 판단해야 할 겁니다. 하지만 이 혼란으로 인해 고민하는 시간이 필요해졌죠. 심지어 고민을 통해 버튼을 선택했더라도 잘못된 판단으로 원치 않는 회차로 이동하는 실수를 하기도 합니다.
"이런 나쁜 UX로 인해 네이버 웹툰의 사용자는 직관적이지 않은 UI 요소로 인해, 회차 이동에 대한 불편함을 겪습니다. "
그렇다면 네이버 웹툰은 어째서 이런 UI를 적용하게 된 걸까요?
아마도 회차 이동 버튼을 누르게 될 사용자의 페이지별 User flow를 기반으로 UX를 설계했기 때문이라고 생각합니다. 네이버 웹툰에서 작품을 선택하고 나면 회차 리스트 화면이 보이고, 그중 감상할 회차를 골라 들어가면 컷툰 감상 화면으로 들어가게 됩니다.
이때 사용자는 여러 회차가 존재한다는 사실을 회차를 선택할 때에 알게 됩니다. 회차 리스트 페이지를 만났을 때에 말이죠. 회차 리스트 페이지는 다음과 같이 생겼습니다.
네이버 웹툰은 이 시점에서 사용자가 '이전화는 아래에, 다음 화는 위에 존재'한다는 것을 학습했을 것으로 판단했을 것입니다. 그렇기 때문에 감상 화면의 회차 이동 버튼도 이와 통일성을 가지고 설계된 것 같아요. 위 방향의 버튼을 누르면 다음 회차로 가도록 말이죠.
하지만 작품 감상 페이지 내에서도 유저의 흐름은 계속됩니다. 유저가 다음 회차로 이동을 하길 원하는 순간은 스크롤을 열심히 '아래로' 내려서 '다음 컷'을 보기를 몇 차례 반복한 직후입니다. 그렇기 때문에 유저는 아래 방향의 화살표를 '다음'으로 인식할 수 있습니다.
위에서 살펴본 UX의 법칙 중 '제이콥의 법칙'처럼 사용자는 여러 사이트에서 대부분의 시간을 보냅니다. 그래서 네이버 웹툰도 자신이 이미 알고 있는 다른 사이트들과 같은 방식으로 작동하길 기대했을 거예요. 하루 중 네이버 웹툰을 이용하는 시간은 큰 비중을 차지하지 않고, 회차 리스트에 머무는 시간도 찰나의 불과합니다. 새로운 동작 방식을 학습하기에는 너무 짧은 시간이죠.
네이버 웹툰은 '이전'과 '다음'이라는 개념에 대해 문제를 가진 해당 UI를 제이콥의 법칙에 따라 좌우 방향 버튼으로 변경합니다. PC를 사용하던 사용자도 모바일에 익숙한 사용자도 '이전'과 '다음'페이지로 이동하기 위해서 좌우 버튼을 눌러 동작시키는 것은 익숙할 테니까요.
그렇게 네이버 웹툰은 12년도 업데이트를 통해 좌우 버튼 화살표를 가진 회차 이동 UI를 가지게 됩니다. 그 이후로 계속해서 UI/UX가 개선되었지만 21년도 현재까지 회차 이동 버튼은 좌우 방향을 향하고 있습니다.
+
12년도 당시와 21년도 현재의 작품 감상 화면을 나란히 붙여놓으니 몇 가지 변화 요소가 눈에 띄어 추가로 메모해 보았습니다.
