brunch

You can make anything
by writing

C.S.Lewis

by DDD Jun 01. 2020

조금 더 편리하게 읽고 쓰도록

콘텐츠 상세 페이지의 UX 개선

텍스트를 읽고 글을 작성하는 것에서 더 편리한 경험을 주기 위해 디자인을 개선한 내용이다. 개선은 사용자가 해당 기능을 어떤 flow로 사용하는지, 어떤 불편함을 겪는지 관찰한 내용을 바탕으로 이루어졌다. 


OVERVIEW

이 기능은 글을 읽고, 읽은 내용을 바탕으로 질문에 대해 나의 생각을 남기는 콘텐츠이다. 유저는 글을 읽는 것에서 새로운 정보전달의 가치를 제공받고, 질문에 대한 답을 남기는 것으로 감정을 해소하거나 감정을 표현하는 것의 가치를 경험한다. 또한 서비스는 유저가 남긴 글을 다시 읽을 수 있도록 기록을 제공하여 자신의 기록을 다시 보는 것으로 얻는 자기 회고 혹은 자기반성과 같은 가치도 느낄 수 있다.


간략한 사용 flow는 진입한다 > 글을 읽는다 > 질문에 대한 답을 남긴다 > 다시 진입하여 남긴 글을 읽는다 로 정리할 수 있다. 



AS IS

기존의 시안은 글, 질문, 타이핑, 기록 저장 기능이 모두 한 페이지에서 이루어졌다. 다른 인터렉션과 depth가 없기 때문에 사용하는 것에 따라 불편함을 느낄 수 있는 요소들이 존재했다. 유저가 가장 불편함을 겪는 문제를 2가지로 추리면 내용을 작성하면서 글을 읽기 위해 다시 스크롤을 위아래로 반복적으로 움직여야 하는 것, 페이지 내 여러 개의 질문들이 한 번에 저장되기 때문에 글을 작성하는 도중 작성한 내용이 삭제되지 않을까 불안함을 겪는 것이었다. 



수고를 예측하도록 하기

불편함을 해결하기 위해 가장 먼저 외부 콘텐츠 카드와 내부 상단에 해당 콘텐츠에 몇 개의 미션이 존재하는지, 해당 콘텐츠의 미션을 작성하는데 총 몇 분이 걸리는지 정보를 제공했다. 유저는 콘텐츠에 진입하기 전 혹은 콘텐츠를 이용하기 전에 미리 몇 개의 미션을 작성해야 하는지, 몇 분 정도가 소요되는지 그 수고를 예측할 수 있어 심리적 부담이 줄고, 능동적으로 콘텐츠를 자신의 상황에 맞춰 선택할 수 있게 되었다.



자유로운 미션 확인

drag를 통해 질문 모달을 열 수 있다.

기존 글 아래쪽에 위치했던 질문을 하단에 고정하여 글을 읽기 전 어떤 질문이 있는지 미리 확인할 수 있도록 하였다. 미리 정보를 노출하여 조금 더 자유롭게 원하는 정보를 선택적으로 얻을 수 있도록 했으며, 스크롤을 내려야만 볼 수 있던 답답함을 해소할 수 있었다.



자연스러운 과제 제시

또한 스크롤을 내려 글을 모두 읽었을 경우, 고정되어있던 하단의 질문 페이지가 자연스럽게 글 하단에 배치되도록 했다. 사용 flow에 따라 사용자가 글을 모두 읽은 후 바로 다음 행동을 이어나갈 수 있도록 자연스럽게 유도한 것이다.



작성은 더 집중되게

기존 시안에서는 페이지 내에서 글을 작성해야 했기 때문에, 글을 작성하는 도중 페이지가 움직일 수 있는 불편함이 존재했다. 이를 개선하기 위해 미션을 작성하기 위한 입력 페이지를 제공했고, 미션 별로 개별 저장 기능을 추가하여 작성 도중 오류로 인해 글이 삭제될 불안감을 해소했다. 



미션의 완료 상태 알려주기

하단에 고정되는 미션은 아직 작성하지 않은 미션 한 개를 순차적으로 노출하도록 했다. 예를 들어 한 콘텐츠에 2개의 미션이 존재한다면, 아무 미션도 작성하지 않았을 경우 1번 미션이 하단 노출되며, 1번을 작성하고 난 후 2번 미션이 노출되도록 하였다. 미션을 모두 작성한 후에는 "User name님의 기록"이라는 타이틀과 작성한 글을 읽어보기 버튼이 노출되도록 변경하였는데, 이는 작성하지 않은 미션의 여부를 알 수 있도록 하면서 모두 작성을 완료한 경우 자신의 기록을 다시 읽어볼 수 있도록 유도한 것이다.



다음 콘텐츠로 바로가기

추가적으로 페이지 하단에 이동할 수 있는 다른 콘텐츠를 노출하여, 콘텐츠의 모든 미션을 완료한 후 페이지를 나가지 않고 이어서 다음 콘텐츠를 진행할 수 있도록 유도했다. 페이지를 나가는 행위로 인해 유저가 행동할 수 있는 여러 가지 선택지를 제공받게 되면, 유저는 비교적 선택의 자유가 주어지기 때문에 서비스가 유도하는 대로 진행하지 않을 수 있다. 이 때문에 선택지를 최소화하여 자연스럽게 다음 행동으로 이어지도록 하는 것이 유저를 원하는 방향으로 이끄는 좋은 방법일 것이다. 



TO BE

이 디자인에서는 적절한 때와 장소에 적절한 정보를 제공하도록 한 것이 가장 핵심인 개선이었다. 필요한 정보를 얻지 못하는 불편함을 해소하기 위해 자유롭게 원하는 정보를 얻을 수 있도록 하였으며, 너무 다양한 선택지가 제공되어 유도한 대로 행동하지 않을 것을 방지하여 하나의 행동에 집중할 수 있도록 필요한 기능만을 제공했다. 


사용하는 과정에서 편하고 자연스럽다고 느끼게 하기 위해서는 실제 사용경험을 분석하여 어디에서, 언제, 어떤 행동을 보이는지 그 원인에 공감하는 것이 중요하다. 그렇기 때문에 사용성을 개선하기 위해서는 유저의 데이터와 행동을 직접 관찰하고 원인을 분석해내는 것이 필요할 것이다.

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari