brunch

You can make anything
by writing

C.S.Lewis

by 진하 Oct 22. 2021

삐요로그 UX는 왜 편할까? (1)

User story와 User flow를 확인해보자



삐요로그






삐요로그 기능 설명 이미지




삐요로그는 일본의 회사 PiyoLog Inc. 에서 제공하는 육아 기록 앱이에요. 안드로이드 / iOS 모두 사용할 수 있고, 가족과 기록 내용을 실시간으로 공유할 수 있어 편리합니다. 육아에 필요한 수유, 배변, 건강기록뿐만 아니라 커스텀 항목과 커스텀 디자인 기능까지 갖추고 있어요. 대부분의 기능을 무료로 제공하고 있고, 한국어도 완벽히 지원하고 있습니다.



[삐요로그 랜딩 페이지 바로 가기]




저는 이것 저것 커스텀 기능을 이용해 디자인도 제 취향으로 맞춰놓고, 사용하는 모든 기기와 연동해 두었어요. iOS 사용시엔 시리를 통해 손을 쓰지 않고 기록도 가능합니다. 삐요로그를 사용하면서 굉장히 편리하다는 생각이 자주 들었어요. 이 삐요로그는 어떤 User stoty를 기반으로 설계되었지, 사용하면서 왜 편리하다는 생각이 들게 되었을지 궁금해져서 한번 역으로 UX를 탐구해 보려고 합니다.





삐요로그의 User story




처음 아기를 집으로 데리고 들어왔을 때에 당혹감을 잊을 수가 없어요. 산후조리원에서 배운 내용을 토대로 최선을 다했지만, 언제나 아이 앞에서는 허둥지둥 대더라구요. 아무리 정신이 없어도 맘마는 놓칠 수 없기에.. 하나하나 기록해야 마지막으로 언제 먹였는지, 오늘 하루 먹여야 할 총량은 다 먹었는지 확인할 수 있더라고요. 그래서 종이에 정성스레 적어가며 관리를 했었는데, 매번 종이를 찾는 것도 힘들고 혼자서만 육아를 하는 것도 아니다 보니 기록을 공유하는 것도 쉽지 않았어요. 아마 저와 같은 육아러들은 이런 육아 기록에 대한 문제를 가지고 있을 거예요. 이 내용을 User story로 정리하면 이렇게 되겠죠?



"육아러들은 육아 기록을 할 때, 편하게 기록하고 공동양육자들과 공유하고 싶다. 그러면 복잡하지 않게 육아 기록을 확인하고 신경 쓸 일이 줄어들어 육아 자체에 더 집중할 수 있을 것이다."  
- JTBD 방식으로 정리해본 삐요로그의 User stoty





JTBD에 대한 더 자세한 내용은 여기로 ⬅️ 





User Flow




유저 플로우는 제품을 통한 사용자 움직임의 흐름을 말합니다. 유저가 진입한 시점에서 최종 상호작용에 도달할 때까지의 어떤 것들을 수행하는지를 단계별로 서술하는 것이죠. 이런 흐름을 설명하기 위해 Flow chart라는 다이어그램을 사용할 수 있습니다. User flow를 확인하는 다이어그램을 User Flow Chart라고 합니다.



위에서 이야기한 User story를 해결하는 관점에서 유저의 할일, 즉 테스크(Task)는 '분유수유를 기록하고 확인한다'가 되겠죠? 이 테스크에 대한 삐요로그의 User Flow를 한번 정리해 보았습니다. 단순한 Flow chart로 먼저 표현해 보았습니다.





수유를 하고 기록하는 과정입니다. 앱을 켜면 스플래시 이미지가 뜨고 바로 기록 화면을 메인으로 보여줍니다. 이미 기록한 내용이 있다면 콤팩트하게 바로 기록된 리스트를 보여주는 것이죠.

모유, 분유, 배변, 잠 등 아이콘 중 새로 기록할 항목을 누르면 팝업을 통해 시간이나 양등 정보를 입력합니다. 수정이 필요하다면 이 리스트에서 해당 항목을 누르기만 하면 바로 같은 팝업을 통해 재입력이 가능합니다.



하단 내비게이션에서 정리표 탭으로 이동하면 주간 기록 통계를 바로 확인할 수 있습니다. 시간이나 양을 기준으로 정리되며, 화면을 탭 하면 그래프를 전환하여 확인할 수 있습니다. 유저의 Task를 수행하기 위한 플로우지만 복잡하진 않네요.



물론 이대로 앱 사용이 끝나지는 않습니다. 단순히 기록과 확인 기능에 대한 정리입니다. 실제로 앱이 시작되고 종료되는 지점은 저렇지만, 기록 앱이니만큼 하루에 몇 번씩 반복되고 있습니다.



이런 간단한 플로우를 반복하면서 앱을 여러 번 껐다 키게 되고, 정리표는 주간 단위로 보입니다.





단순히 이렇게 플로우만 놓고 보면 '간단하게 기록을 하고 확인할 수 있다' 정도의 특징만 보이는데요. 그럼 User story에 대한 해결점을 삐요로그는 어떻게 풀어냈을까요? 이 플로우에 해당하는 화면들을 하나씩 Wireframe으로 그려보면서 UX가 어떻게 설계되어 있는지 더 알아보겠습니다.






작가의 이전글 '네이버 웹툰' 모바일 서비스 UX를 분석해보자 (2)
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari