브런치, 작가를 작가답게 만드는 사용자경험(UX) 분석
[코드스테이츠 PMB 13기] UX, UI
들어가며
요즘 들어 내가 매일 사용하고 있는 서비스는 바로 지금 글을 쓰고 있는 이 브런치다. 반강제로(?) 매일 코드스테이츠 PMB 13기 과제를 이 브런치에 올리기 때문이다. 나는 네이버 블로그와 브런치 둘 다 운영하고 있어 둘의 차이점이 확연하게 보인다. 브런치의 사용자 경험(UX)을 분석해보고자 한다.
W4D1. 사용자 경험(UX), 사용자 인터페이스(UI)
자주 사용하는 서비스를 통해 좋은 UX와 아쉬운 UX는 무엇인지 파악하고, 해당 서비스에서 주요하게 설계한 UX가 무엇인지 고민해봅니다.(에세이)
1. 평소 자주 사용하는 서비스 1가지를 선정합니다.
오늘의 프로덕트
: 브런치
2. 해당 서비스를 사용하면 느낀 좋은 UX, 아쉬운 UX는 무엇인지 3가지 이상 작성합니다.
1) 좋은 UX
① 브런치 작가 선발 제도
- 네이버 블로그, 티스토리 등의 블로그는 가입만 하면 누구나 글을 쓰고 발행할 수 있다. 그러나 브런치는 작성글과 자기소개, 글쓰기 계획 및 콘텐츠 등의 내용을 토대로 '작가'를 선발한다. 이 제도를 통해 선발된 고객은 선발됐다는 '특별함'을 느낄 수 있고, 브런치는 콘텐츠 자체 신뢰감이나 퀄리티도 높은 수준으로 유지하고 있다.
2022년 5월 6일 브런치 작가로 선정됐다는 메일을 받았다. 첫 시도만에 글 한 개로 통과돼서 뿌듯했다.② 임시저장 글이 아닌 작가의 서랍
- 글을 쓰다가 글을 바로 배포하는 것이 아니라 저장을 할 때가 있다. 네이버는 이를 '임시저장 글'이라고 부른다. 그러나 브런치는 '글이 작품이 되는 공간', '좋은 글과 작가를 만나는 공간'이라는 설명에 걸맞게 글이 임시저장되는 공간을 '작가의 서랍'이라고 칭했다. 나는 이 지점에서 표현의 섬세함을 느꼈고, 브랜드의 보이스를 일관되게(On Brand) 유지한다고 느꼈다.
(왼쪽) 브런치 '작가의 서랍' (오른쪽) 네이버 블로그 '임시저장 글'③ 매거진 기능
- 브런치에는 매거진 기능이 있다. 블로그로 치면 카테고리에 해당된다고 할 수 있다. 브런치는 이를 '매거진'이라고 칭했으며, 브런치 앱에서 매거진을 확인하면 책장처럼 넘어가는 모션 효과를 볼 수 있다. 하나의 브런치 계정으로도 주제별로 모아서 글을 작성할 수 있는 점이 편리했고, 책으로 발행하기에도 유용할 것 같아 좋은 UX로 선정했다.(실제로 브런치 고객들은 브런치 글을 통해 책을 발간해 '진짜' 작가가 된다)
(왼쪽) 브런치 '작품' (오른쪽) 브런치 '작품' 상세 페이지2) 아쉬운 UX
① 제목 글자 수 30자 제한
- 이건 코드스테이츠 PMB 13기를 수강하며 느낀 아쉬운 점이다. 코드스테이츠에서는 과제 포스팅 제목에 [코드스테이츠 PMB 13기]를 표기하기를 바라는데 브런치는 제목 글자 수가 30자까지 밖에 표현이 안돼 설정할 수 있는 제목에 한계가 있다. 반면 네이버 블로그는 제목 글자 수를 100자까지 적을 수 있다. 네이버 블로그만큼 길지는 않아도 50자 정도까지는 늘려도 좋지 않을까 생각한다.
(왼쪽) 브런치 타이틀 (오른쪽) 네이버 블로그 타이틀② 표 삽입 기능 부재
- 브런치 포스팅을 하면서 표 삽입 기능이 없는 점이 불편했다. 네이버 블로그 편집 툴바에 익숙했기 때문에 불편함이 더 크게 느껴진지도 모른다. 브런치 편집 툴바가 네이버 블로그 편집 툴바 보다 간단명료해서 초보자가 사용하기에 편하다는 이점이 있을 수 있지만, 책을 출판한다고 가정했을 때도 표 기능은 필요하다고 생각한다. 브런치에 코드스테이츠 과제를 작성할 때 간결하게 정리하기 위해 표를 삽입하려는 순간마다 네이버 블로그가 떠올랐다. 다른 프로그램을 통해 표를 만들어와야 해서 불편했다.
또, 이 글을 작성하면서 하나 더 느낀 점은, 네이버 블로그는 편집 툴바 아이콘이 많지만 대신에 아래에 한글로 다 무슨 기능인지 표시해뒀다는 것이다. 반면 브런치는 편집 툴바에 아이콘만 배치하고 한글로 기능 설명을 하지 않았다. 아이콘 위에 커서를 갖다 댔을 때만 이미지, 그룹 이미지 등 한글 설명이 나온다. 한글 설명이 있었다면 눌러보지 않고도 알 수 있을 듯하다.
(왼쪽) 브런치 편집 툴바 (오른쪽) 네이버 블로그 편집 툴바③ 글 작성 중 태블릿, 모바일 화면 최적화 확인
- 오늘 수업에서 나온 것처럼 PC, 태블릭, 모바일 화면에서의 최적화는 중요하다. 각 화면에 맞게 콘텐츠가 보여져야 한다. 나는 UX, UI에 대해 따로 배운 적은 없지만 블로그를 운영하고 포스팅을 작성하면서 네이버 블로그 웹에서 글을 작성할 때, PC 화면과 모바일 화면에서 문장이 애매하게 끊어지지 않도록 화면을 비교하면서 글을 조절해서 게시하고는 했다.
네이버 블로그에서는 글 작성 페이지에서 오른쪽 하단에 모니터 모양 아이콘을 누르면 PC 화면→모바일 화면 태블릿 화면 순으로 실제 보이는 대로 판이 바뀐다. 나는 이 기능을 애용하고 있다.
그러나 브런치 글 작성 페이지에서 나는 약간의 충격을 받았다. 브런치 글 작성 페이지에도 왼쪽 상단에 '모바일 미리보기' 기능이 있지만 이 기능을 클릭하면 별도의 팝업이 뜬다. 그리고 이 팝업은 읽기 전용으로 수정이 불가능하다. 나는 이 기능이 매우 불편하다고 느꼈고, 왜 네이버 블로그에는 있는 기능이 브런치에는 없을까 궁금하기까지 했다.
(왼쪽) 브런치 모바일 웹 화면 미리보기 (오른쪽) 네이버 블로그 PC, 태블릿, 모바일 화면 모드④ 글 붙여 넣기를 하면 원하는 자리에 붙는 게 아니라 갑자기 글 상단에 붙음
- 글을 작성하다 보면 다른 글을 붙여 넣을 때가 있다. 글을 쓰고 있는 중간에 붙여 넣기를 하면 당연히 그 자리에 붙어야 하는데 브런치는 갑자기 붙여넣기한 글이 맨 위에 붙는다. 도대체 왜 이런지 모르겠고, 프로그램 상의 오류인가 싶기도 하다. 매우 불편하다.
예시를 위해 글을 붙여 넣어 봤다. 들어가며 위에 화살표가 갑자기 붙어있고, 아쉬운 UX~ 이 부분도 붙었다.3. 아쉬운 UX의 개선 우선순위를 명확한 근거를 통해 설정합니다.
- 위에서 작성한 ④→③→②→① 순이다.
→ ④글 붙여 넣기를 하면 원하는 자리에 붙는 게 아니라 갑자기 글 상단에 붙음
→ ③글 작성 중 태블릿, 모바일 화면 최적화 확인
→ ②표 삽입 기능 부재
→ ①제목 글자 수 30자 제한
- ICE(Impact 임팩트·Confidence 자신감·Ease 쉬움) 프레임워크에 따르면 ④번 문제가 개선하기 가장(Ease) 빠를 것 같아서 선정했다. 또한, 비교적 적은 노력으로 오류 개선이라는 큰 효과를 줄 수 있을 것이라 생각했다.
- 사실 ③번 문제를 먼저 해결하고 싶지만 ③번 문제는 해결되면 편리한 부가 기능이라고 생각했고, 개선하는데 시간이 소요될 수 있다고 생각했다. ②번과 ①번 문제는 해결되면 좋겠으나 해결되지 않아도 그만인 정도의 문제라고 생각해 우선순위를 판단했다.
4. UX 설계 시 기억해야 할 요소들 중, 해당 서비스에 주요하게 적용된 것은 무엇인지 작성합니다. 설계된 UX 장치가 고객에게 어떤 경험을 주는지 설명합니다.
- UX 설계 시 기억해야 할 요소는 세 가지로 이미지, 텍스트, 흐름이 있다.
- 이 중에서 브런치에 주요하게 적용된 것은 텍스트로 보았다.
- 앞서 언급한 것처럼 브런치는 아무나 글을 발행하게 하는 대신 글을 발행할 수 있는 고객을 '작가'로 선발해 자격을 주고 있고, 작성하다가 저장된 글은 임시저장 글 모음이 아닌 '작가의 서랍'에 정성스레 보관해주고 있다. 또한, 내가 쓰는 글을 단순한 포스팅이 아닌 '작품'으로 칭하고 있다.
- 이러한 UX 장치는 고객에게 선택받은 사람, 특별한 사람이라는 인식을 주고 콘텐츠 발행에 대한 의무감이나 책임감을 부여한다고 생각한다. 이렇게 생각한 이유는 '브런치 작가' 관련 검색어에서도 찾아볼 수 있다.
구글 '브런치 작가' 검색 시 표시되는 관련 검색어- 구글에서 '브런치 작가'를 검색하면 관련 검색어에 '브런치 작가 되는 법', '브런치 작가 합격', '브런치 작가 거절' 등의 문구가 있다. 사람들의 검색어를 통해 브런치 작가는 합격해야 하는 것으로, 브런치 작가가 되고자 하는 관심을 확인할 수 있다.
