[W4D1] '브런치'의 UX를 분석해보자 - 코드스테이츠 PMB 11기

PMB 수업 중 제공되는 한글 읽기 자료들 중 많은 글들이 브런치에서 작성한 경우가 있습니다.

 지금은 읽기자료만으로도 양이 많아 브런치 앱을 따로 열어 새로운 글을 탐색하는 경우는 적지만

PMB를 시작하기 이전에는 브런치에서 자주 내가 궁금했던 분야에 대한 글들을 찾아보기도 하였습니다.

 

브런치

브런치는 IT 기업 카카오가 운영하는 블로그 서비스입니다.

티스토리 역시 카카오가 운영하는 블로그 서비스이지만

이 둘의 차이점은 브런치의 경우, 가입한 이용자는 글을 쓸 수는 있지만

작가로 승인되어야만 글을 타 사용자가 읽을 수 있도록 발행할 수 있습니다.

따라서 작가 신청 과정이 별도로 진행되며 선별 과정을 통해 승인이 되어야만 작가로 활동할 수 있습니다.

 

 

개인적으로 느낀 좋은 UX와 아쉬운 UX

---

브런치의 좋은 UX

첫째, 애니메이션 효과

브런치 시작화면의 로딩 페이지

브런치의 경우 애니메이션이 굉장히 적절하게 배치가 되어있는 앱입니다.

앱을 처음으로 시작하면 홈 화면이 뜰 때까지 브런치 아이콘을 통해 간단한 로딩 애니메이션을 보여줍니다.

왼쪽 상단의 햄버거 메뉴가 팝업되는 과정이나 홈 화면의 세로 캐러셀 역시 애니메이션으로 통해 부드럽게 이동되며

앱에서 원하는 글을 터치해 열 때도 슬라이드 애니메이션이 부드럽게 진행됩니다.

 

 

둘째, 통일성 있는 디자인

브런치의 모바일 앱은 디자인은 전체적으로 매우 통일성 있습니다.

흰 배경에 흑갈색 얆은 선으로 칸을 분류하고

텍스트의 경우 포인트를 주는 민트색 이외에는 검은색과 회색으로 변화를 줍니다.

이러한 디자인 컨셉은 브런치의 모바일 앱 뿐만 아니라 데스크톱용 웹사이트, 태블릿 PC용 앱에도 적용됩니다.

통일성 있는 디자인은 브런치에게 깔끔하고 세련된 브랜드 이미지 형성에 기여합니다.

 

 

셋째, 연동성

브런치는 데스크톱과 모바일 앱, 테블릿PC 앱에서 연동이 되기 때문에

이는 글을 쓰는 작가와 읽는 독자 모두에게 편의성을 제공합니다.

작가는 집에서 데스크톱을 통해 작성하던 글을

지하철을 통해 이동하며 이어서 작성할 수 있습니다.

이는 독자도 마찬가지로 이동하면서 모바일 앱을 통해 잠깐씩 읽던 글을

집에서는 더 큰 화면을 가진 태블릿 PC로 마저 완독 할 수 있습니다.

 

 

넷째, 글을 작품으로

'좋은 글을 쓰고 싶은 모들 이들을 위해 준비했습니다. 글이 작품이 되는 공간, 브런치'

 

브런치는 선별 과정을 통해 승인된 작가만이 글을 작성하는 공간이며

작성된 글을 매거진과 브런치북 기능을 통해 작품으로 만들어줍니다.

글을 브런치만의 세련된 디자인을 통해 단순 나열이 아닌 깔끔하고 심미성 높은 형식으로 제공됩니다.

무엇보다 작품을 만든 작가로서 '제안하기' 서비스를 통해

글을 쓴 작가는 출간, 강연 및 협업 제안을 쉽게 받을 수 있습니다.

이는 N잡을 추구하며 파이프라인을 만들려는 요즘 트렌드에 맞는 서비스라고 생각합니다.

 

 

브런치의 아쉬운 UX

첫째, 홈 화면

홈 화면

브런치의 홈 화면은 세로로 움직이는 캐러셀 형식으로 디자인되어 있습니다.

홈 화면에 처음 뜨는 콘텐츠 이외에도 아래에서 위로 스와이프 하면 추가적으로 콘텐츠를 볼 수 있습니다.

하지만 사이드에도, 하단 혹은 상단에도 캐러셀이 몇 페이지로 이루어져 있는지,

캐러셀을 넘겨 콘텐츠 썸네일을 봤다면 얼마큼 내려온 건지 등을 보여주는 지표가 없습니다.

저의 경우는 실수로 화면을 스와이프 하기 전까지는 홈 화면이 스와이프 가능한지도 몰랐습니다.

화면을 터치하면 우측 끝에 스크롤바가 일시적으로 뜨긴 하지만

눈에 띄는 디자인이 아니라 그다지 도움이 되지 않습니다.

 

 

둘째, 햄버거 메뉴

햄버거 메뉴

우측 상단의 햄버거 메뉴를 터치하면 나오는 화면입니다.

사소하지만 아쉬웠던 UX로 뽑은 이유는

메뉴에서 볼 수 있는 카테고리 6개 중

브런치 모바일 앱에 처음 접속하면 뜨는 화면이 '브런치 홈'인데

메뉴 카테고리 순서상 3번째에 위치합니다.

브런치는 6개의 메뉴 중 사용자가 위치한 메뉴의 텍스트 컬러를 민트로 주고

텍스트 양 옆에 긴 줄을 긋는 인터렉션을 제공합니다.

예를 들어 사용가자 '글을 읽는 서재' 메뉴를 연 상태라면

흑갈색이었던 텍스트가 민트색으로 변하고 양 옆에 줄이 생깁니다.

개인적인 경험으로 해당 앱을 쓰면서 양 옆에 있던 줄 두 개가

해당 메뉴의 위계를 나타내는 걸로 오해를 한 적이 있었습니다.

 

 

셋째, 작가의 서랍 & 글쓰기

햄버거 메뉴를 터치 후 '글쓰기'를 터치하면 사용자가 글을 작성할 수 있는 화면이 바로 뜹니다.

반면 햄버거 메뉴 터치 후 '작가의 서랍'을 터치하면 작가가 글쓰기를 통해 썼지만 저장만 해놓은 글,

발행을 했지만 이를 취소했던 글을 볼 수 있습니다.

 

홈 >> 햄버거 메뉴 >> 글쓰기

 

단 세 번의 터치로 사용자가 바로 글을 쓸 수 있는 환경을 제공하는 것은 좋았으나

문제는 브런치가 오직 승인된 작가만이 글을 발행할 수 있는 곳이라는 것입니다.

작가로 등록되지 않은 경우에는 단순 저장만 가능하며 발행이 불가능하기 때문에

글쓰기, 저장글 보기, 발행 취소글 보기 중

작가로 등록되지 않은 사용자가 실질적으로 쓰게 될 기능은 그나마 글쓰기와 저장글 보기 정도입니다.

따라서 저는 이 기능이 조금 더 간결화되었으면 합니다.

 

 

넷째, 브런치 나우

브런치 나우

 

브런치 나우는 카테고리에 따라 글을 추천해줍니다.

 

특정 알고리즘을 통해 사용자에게 글을 추천해주는 것 인지 궁금하여 데스크톱으로 브런치를 접속하였으나

리스트 형식으로 글이 나열되어 있으며 작성 시간이 1분 전, 3분 전 등 비교적 최근인 것으로 보아

같은 브런치 나우라도 웹사이트 브런치는 최신 글을 추천해주고

모바일 앱은 상대적으로 세분화되어 있는 카테고리에 따라 최신글을 추천해주는 것으로 보입니다.

또한 모바일 앱을 통해 이용할 수 있는 브런치 나우의 경우

화면 맨 하단에 키워드가 위치해 있습니다.

 

개인적으로 해당 UX가 아쉬웠던 점은 카테고리가 어떤 기준으로 형성되어 있는지 모호했기 때문입니다.

 

- 패션 디자인
- 디자인 스토리
- 브런치 인기글
- 배구 분석
- 의사 작가
- 글쓰기 코치
- 디자이너 작가
- 한국 축구 분석
- 주말 나들이
- 영화 리뷰
- 그림, 일러스트 작가
- 알수록 좋은 경제
- 과학, 기술
- 애니메이션, 만화
- 사회, 인문 작가
- 브런치 최신글

위는 이 글을 작성하는 시점에 제게 보인 브런치 나우의 카테고리입니다.

카테고리의 명칭도 통일성이 부족하며 주제에 따라 분류한 것도 아니고

작가나 리뷰 혹은 분석만 따로 분류한 것이 아니라

규칙을 알 수 없는 카테고리만이 나열되어 있어

사용자에게 새로운 글을 추천하는 기능을 충분히 하지 못한다고 생각합니다.

 

 

아쉬운 UX의 개선 우선순위

---

저는 브런치 나우가 우선적으로 개선되어야 한다고 생각합니다.

브런치 나우는 주제에 따라 글을 읽는 사용자에게 새로운 글을 추천해주어

더 많은 작가가 독자에게 노출될 수 있게 유도합니다.

하지만 앞서 말한 불편함을 통해 해당 기능의 사용성이 저하되면

추천이라는 강점이 약화되기 때문에 가장 먼저 개선되어야 한다고 생각합니다.

 

이후 홈 화면과 작가의 서랍 및 글쓰기, 햄버거 메뉴의 UX는

비교적 간단하게 디자인 수정을 통해 개선 가능하다고 생각합니다.

 

 

 

UX 설계 시 기억해야 할 요소들 중
해당 서비스에 주요하게 적용된 것은?

---

UX 설계 시 기억해야 할 3 요소는 다음과 같습니다

이미지   텍스트   흐름

브런치는 '글'이 위주인 플랫폼입니다.

주요 화면의 약 60%를 텍스트가 차지하고 있다고 할 수 있습니다.

사실 브런치의 UX Writing 관점에서만 본다면

브런치의 전체적인 앱 디자인에 비해

그리 세련되지도, 깔끔하지도 않은 writing을 가지고 있습니다.

 

하지만 타이포그래피의 관점에서 브런치를 본다면

텍스트로 이뤄진 주 화면들에서 글을 읽는 사용자의 가독성을 높이기 위해

텍스트의 크기와 굵기로 위계를 주었고

텍스트 컬러와 폰트를 활용하여 내용을 분리하였습니다.

따라서 화면에 텍스트가 아무리 많아도 사용자는 내용을 인식하기 쉽습니다.

 

 

---

 

이번 분석을 통해 아쉬웠던 점은

저의 UX 분석은 주로 '글을 읽는 사용자'인 독자의 관점으로 이루어졌습니다.

하지만 공식 웹사이트에서 브런치를 설명할 때는

주로 '글을 쓰는 작가'의 입장에서 기능을 설명하고 있습니다.

이는 독자는 특정 플랫폼에 한정되어서 글을 읽는 것이 아니지만

작가의 경우 '작품'을 발행하는 곳은 특정 플랫폼에 한정되어 있기 때문이라고 생각합니다.

'작가'라는 타이틀을 줌으로써 글을 쓰는 사용자는 브런치에 소속감을 느낄 수 있고

퀄리티 높은 콘텐츠를 브런치에서 발행하게 되기 때문입니다.

따라서 브런치는 '작가'에게 맞춰진 서비스지만

브런치에 등록된 작가가 아닌 저는 주 타겟층의 관점에서 UX를 분석할 수 없는 것이 아쉬웠습니다.