관심분야/UXUI

UXUI, 레퍼런스분석 [네이버웹툰]

Jinoo.keem 2023. 10. 29. 18:13
728x90

소개

네이버웹툰

포털사이트 네이버에서 2004년부터 서비스하기 시작. 연재만화를 볼 수 있는 웹툰, 아마추어 만화가가 그린 만화를 볼 수 있는 도전만화, 도전만화에서 인기가 많은 웹툰을 따로 골라낸 베스트 도전, 그리고 주말이면 일부만화를 3권 무료로 볼 수 있는 유료만화 등이있다.

 

 

사용자분석

출처: Mkcloud 23.10 기준

네이버 웹툰의 사용자는 직장인 > 수험생 > 중고생 > 대학생 > 사회 초년생 순으로 분포되어있으며,

출처 : Dighty (android, 약 3천만 유저 기반 데이터)  21.xx 기준

앱 설치자 연령 또한 직장인과 사회초년생이 48%로 가장 많은 비율을 나타내고 있다. 이는 웹툰 컨텐츠를 좋아하는 세대가 10-30대 전반에 걸쳐있는 것과 더불어, 네이버 웹툰이 출범할 당시 웹툰 컨텐츠를 처음 접했던 어린 세대가 지금까지 충성도 높은 사용자로 남아있다고 해석해볼 수도 있을 것 같다.

출처 : 한국콘텐츠 진흥원, 2022만화웹툰 이용자 실태조사 보고서

일주일에 1회이상 웹툰을 이용하는 사용자는 70%에 육박하며,

이는 웹툰의 연재 주기(주 1-2회 연재)와도 관련이 있을 것으로 보인다.


화면분석


HOME

1. 로딩애니메이션 2. 캐러셀영역과 썸네일 이미지 3. 스크롤

1. 네이버 웹툰에 들어갈 때 지금 환경에서는 로딩이 거의 없는 편이지만, 네이버 웹툰 로고가 튀어나오는 애니메이션UI를 설정해둠으로써, 다양한 사용환경에서의 사용자 편의를 고려한 것으로 보인다. 

2. 캐러셀 방식으로 되어있는 상단 이미지모듈에는 공지, 신작, 추천완결, 이벤트 등 다양한 컨텐츠를 담고 있다. 간단한 정보의 플래그와 제목, 그리고 작은 글씨로 소제목 혹은 작가명을 기입해 두었다. 각 텍스트가 들어가는 컨테이너의 색은 썸네일 이미지와 비슷한 색으로 매칭되었다. 아쉬운 점은 너무 많은 정보와 강조색을 이용했다는 점이다. 신작 컨텐츠와 매일+ 컨텐츠, 심지어 이벤트나 공지같은 것은 브랜드 컬러인 초록색으로 통일되어있는 줄 알았는데 그것도 아니었다. 정리안된 느낌의 카테고리와 강조, 많은 정보량은 편리함보다 스트레스로 더욱 다가갈 수도 있을 것 같았다.

반면 강조된 중에서도 모든 썸네일 이미지에 제목이 함께들어가 있다는 점은 좋았다. 텍스트가 눈에 들어오지 않는 어지러운 모듈에서 그림안에 녹아있는 텍스트는 오히려 눈에 잘들어왔고 작품의 향도 함께 녹아있어서 컨셉을 예측할 수 있었다.

3. 최근 스크롤링에 관한 맨 위로 가기 조작이 해당 카테고리 메뉴 (홈화면의 경우 바텀 바의 웹툰)를 한번 더 누르는 것으로 바뀌어가고 있는 추세인 것 같다. 본인도 이런 트렌드변화의 추세에는 동의하고 적응해가고 있지만, 푸터에 맨 위로 가기 버튼을 넣어주거나, 어느정도 내려왔는지 스크롤 위치를 알려주는 UI정도는 적용했으면 어땠을까 하는 아쉬움이 있다.

1,2. 필터와 서랍메뉴 3. 정렬 4. 진행도표시와 마이크로인터랙션  5. UX라이팅

1,2. 정렬필터와 서랍메뉴는 시스템 기본 UI를 사용했고, 글래스모피즘 스타일을 활용하여 사용자가 친숙하게 사용할 수 있으면서도 최신트렌드가 반영된 사례라고 생각되었다. (트렌드는 돌고 도는 것 같다는 생각도 든다.)

3. 조회수로 웹툰을 정렬했는데, 다른 정렬들은 표기된 정보로 정렬된 이유에 대해 납득이 가지만 조회수는 표시가 없는 것 같아 정렬된 이유에 납득이 가지 않았다.

4. 내가 어디까지 봤는지 해당회차까지의 모듈을 어둡게하여 적용하는 방식에 더해 책갈피처럼 오른쪽을 살짝 접는 UI를 추가하여 더욱 친숙하고 읽는다는 느낌이 들었다. 관심과 알림 설정을 할 때, 떨리는 인터랙션도 사용감에 만족도를 올려주는 느낌이었다.

5. 알람동의를 얻기위한 문구에는 거부감을 줄이기위한 노력이 들어간 것을 알 수 있었다. No 라는 선택지를 완화하고 좋아요를 강조한 모습.


추천완결

1. 관심웹툰기반 추천/모듈프레임 2. 툴팁 3. 마이크로인터랙션

1. 과거 연재하고 완결된 웹툰들을 무료로 볼 수 있게 해주는 서비스에 이전에 봤던 웹툰이나 최근 본 웹툰을 보여줌으로써 다시보고싶은 컨텐츠를 빠르게 되짚어 볼 수 있다. 상단 이미지 모듈의 이미지들이 모듈 바깥으로 나옴으로써 관심도을 끌고 몰입감을 높여주는 것 같다.

2. 어떤 웹툰들이 선별되었는지 설명해주는 툴팁이다. 좋은 툴팁이지만, 바로 옆에 무료대여권에 대한 얘기를 해두고 아무런 설명이 없는 것이 아쉬웠다. 언제 주는지, 몇개 이용 가능한지 등 무료 대여권에 대한 라이팅도 있으면 좋을 것 같다는 생각이 들었다. 

3. 스크롤을 내리면 상단 왼쪽에 있던 추천완결이 가운데로 순간이동한다. 이 인터랙션이 매끄럽지 않았고 버벅이는 느낌이 들어서 아쉬웠다. 


베스트도전 /  검색

1. 공모전 2. 플래그 3. 검색지원

1. 베스트 도전 화면은 카테고리가 나누어져 있고, 스크롤바가 있으며, 정렬도 직관적이어서 홈 화면보다는 정리된 느낌이었다. 다만 최상단의 지상최대공모전이 진행된다는데, 그 공모전에 대한 설명이 없어서 아쉬웠다. 새로운 작품을 발견하는 공모전 취지를 보았을때, 추천을 많이 받은 작품이 맨 위에 있는 것이 아니라, 세 개씩 나열되고 새로고침으로 다른 작품을 발견하는 형식으로 구성한 것은 취지에도 맞고 사용성도 불편하지 않을 것 같다는 생각이 들었다.

2. 공모전에 참가한 작품과 완결된 작품, 정식 연재된 작품에 표시가 되어있어, 어느정도 기대를 하게 만드는 효과가 있을 것 같다.

3. 검색기능.. 사용자가 찾고자하는 작품에 대한 정보도 제공해주지 않고, 자동완성 기능도 없으며, 카테고리도 없어서 너무 불편했다. ex. 재밌었던 일진관련 작품을 찾고 싶어서 일진이라고 검색하면 무려 64개나 나온다. 기억이 가물가물한 작품을 검색하는 과정에서 사용자가 어려움을 겪을것이라 예상되었다.


Selling Point

1. 웹툰 로고가 튀어나오는 애니메이션UI를 설정해둠으로써, 다양한 사용환경에서의 사용자 편의를 고려

2. 홈화면의  모든 썸네일 이미지에 제목이 함께들어가 있다는 점

3. 책갈피처럼 오른쪽을 살짝 접는 UI와 마이크로 인터랙션활용 (구독하고싶게 만드는)

4. 알람동의를 얻기위한 문구에 거부감을 줄이기위한 UX라이팅 

 

Pain Point

1. 너무 많은 정보와 강조색을 이용한 모듈

2. 조회수 표시가 없음 (필터와 작품 신뢰 하락)

3. 버벅이는 인터랙션

4. 컨텐츠에 대한 부족한 설명

5. 검색기능의 사용성부재

 

Solution

1. 홈화면 푸터에 상단으로 UI배치

2. 무료 대여권에 대한 UX라이팅 배치

3. 홈화면에 없는 카테고리 기능을 검색기능에 대체하여 배치, 혹은 자동완성기능, 추천기능 추가하여 개선


네이버 웹툰은 굉장히 많은 사람들이 이용해봤고 이용하고 있는 앱이고, 어플의 사용성은 웹툰을 보기에 얼마나 편리한가? 와 새로운 재밌는 작품을 찾거나 다시보는 것 등에 초점을 맞춰야 할 것 같은데 막상 분석할때 이 점을 어떻게 녹여야할지 아직 부족한 점이 많은것 같다. 분석을 하기전 목표를 확실히해야 할 것 같다. 

화이팅!