하루 일과를 위한 습관 가이드, 루티너리 UX 개선하기
습관적으로 개선안을 고민하게 되는 UX 기획자
꿈을 이루기 위해서 필요한 것은 무엇일까? 의지? 계획?
최근의 뇌과학에서는 습관과 무의식을 목표 달성의 키워드로 보고 있다. 기존의 목표 달성 방식이 하기 싫은 마음이 들어도 온 힘을 다해 버티고 견디는 법이었다면, 습관을 만드는 방식은 의지력을 쥐어짜기보단 섬세한 환경과 시스템을 설계하는 것에 초점을 맞춘다.
꿈과 목표를 이루는데 습관은 아주 밀접하게 관여한다. 제임스 클리어는 그의 책 <아주 작은 습관의 힘>에서 여러 행동과학과 인지심리학을 바탕으로 사소한 습관의 힘을 강조한다. 그는 꿈에 가까울수록 의지가 크고 사소한 습관에 가까울수록 달성 가능성과 만족감이 올라간다고 하면서, 꿈을 아주 사소하고 작은 습관들로 나누라고 말한다.
이런 방법은 익숙하지 않고 조금 답답할 수도 있다. 많은 사람들이 습관을 들이기 위한 환경과 시스템을 설계하는 것에 익숙하지 않기도 하다. 요즘 유행하고 있는 미라클 모닝이나 100일 챌린지도 다른 사람들의 도움을 받아 습관을 설계하는 캠페인 중 하나라고 할 수 있다.
행동 과학 기반의 습관 형성 서비스,
루티너리
이번 블로깅에서 다뤄볼 서비스, 루티너리는 생활 루틴을 만드는 것을 도와주는 앱이다. 이 어플을 처음 알게 된 건 힙서비 커뮤니티와 PMB 동기를 통해서였다. 나 같은 경우는 의지 많은 의지박약인 나의 스타일을 잘 알기 때문에, 일부러 강제적으로 할 일을 만드는 편이다. (인강보다 학원 스타일) 그래서 주기적으로 하는 일과 알림을 받을 시간만 설정하기만 하면 된다는 루티너리의 이야기를 듣고 굉장히 흥미로웠다.
인터넷에서 루티너리 사용후기를 찾아보니 흥미로운 블로그가 있었다. 다양한 습관 형성 앱 서비스를 비교한 블로깅이었는데, 그분은 좋은 사용성을 가졌기 때문에 최종적으로 사용할 앱으로 루티너리를 픽 Pick 했더라. 사용성이 사용자를 끌어들이는 것에 큰 몫을 한다는 것을 다시금 되새기면서, 다음 과제를 통해 루티너리의 UX를 간단히 알아보려고 한다.
== 과제 ==
1. 과업(미션) 설정하고 유저 스토리 작성하기
2. 핵심 기능 및 Flow
3. 와이어프레임 lo-fi & hi-fi
+ 프로토타입
4. 불편한 점과 개선 방안 제안하기
루티너리 사용자의 유저 스토리
불규칙한 생활 패턴이 고민이니? 루티너리가 도와줄게!!
루티너리의 앱 스토어의 소개란 글나를 비롯한 루티너리 유저들은 이 서비스를 통해 어떤 과업(Task)을 달성하려고 했을까?
이 질문에 대해 간결하게 답해보기 위해 다음과 같이 항목을 나누어 적어보았다.
Task _ 무엇을 하려고 하는가?
시간을 효율적으로 쓰지 못해 할 일을 미루게 되는 생활 습관을 개선하고자 한다.
문제 해결하기 _ 어떻게 해결하는가?
일상생활에서 할 일을 미리 설정해 둠으로서 일과를 미루지 않고 집중해서 수행할 수 있도록 해준다.
User Story _ 누가, 왜, 무엇을?
이렇게 써봐도 여전히 잘 안 와닿고 안 읽힌다- 는 사람(나야..)은 유저 스토리를 써보는 걸 추천한다.
유저 스토리는 '누가, 왜, 무엇을'이라는 질문에 답하는 것으로, 프로덕트의 방향을 가장 쉽고 간결하게 나타내는 방법이다.
'누구'는 (잠재적) 사용자/유저 ,
'왜'는 사용 목적이나 해결하려고 하는 문제,
'무엇을'은 프로덕트의 기능과 방향성을 암시한다.
루티너리의 유저 스토리
삶의 효율을 높이고자 하는 사람은
생활 패턴의 변화를 위해서
할 일을 정하고 실질적인 수행을 습관화하길 원한다.
핵심 기능과 Flow, 와이어 프레이밍 하기
1. 핵심 기능
- 행동을 습관화하기 위해 필요한 기능
스케줄 설정
할 일 설정
알림 기능
2. Flow
3. 와이어 프레이밍 ( lo-fi & hi-fi )
나는 이제 시안을 컴퓨터로 그리는 것에 익숙해져서 그런지, lo-fi를 손으로 그리는데 상당히 애를 먹었다. ^^
핸드폰 모양 도장을 하나 파든지 해야지,,,
lo - fi루티너리 앱은 대체로 모노톤이라 hi-fi를 구현하는데 큰 어려움이 없었다. 깔끔 그 자체.
hi-fi+ 프로토타이핑
피그마를 통해 루티너리 루틴을 추가하는 간단한 프로토타입을 만들어보았다.
루티너리 앱 프로토타이핑을 간단하게 체험(?)해보고 싶다면 동영상 하단의 링크를 눌러보세요!
▾ 피그마 프로토타입 직접 조작해보기
불편한 점
루티너리를 사용해보니 정보 구조가 잘못되어있거나 UX적으로 사용성이 불편한 점들이 있었다.
그렇지만 루티너리에서 연락이 올 날을 고대하며 비밀스럽게 간직해야보려 한다. ^^
주요 기능 중 가장 개선이 시급하다 생각한 부분은
루틴을 추가할 때 내 루틴 목록에 어떤 행동이 추가되는지 확인이 어렵다는 것이다.
현재는 모달 창에서 습관을 추가하면 창 뒤쪽에서 은밀하게(?) 습관 목록이 만들어지고 있다.
개선 제안하기
개선안 1. 시간 강조
문제점 1 ) 습관을 추가할 때마다 루틴 마감시간을 쉽게 볼 수 있었으면 좋겠다
개선 방안 1 ) 루틴 소요 시간을 강조하고, 루틴 이름에 힘을 뺀다
루티너리를 아침에 사용하는 많은 사용자들에게는 루틴의 시작 시간보다 종료 시간이 중요한 경우가 더 많을 것 같다는 생각이 들었다. 그에 비해 현재의 UI에서 루틴 종료 시간은 모달 백그라운드의 어두움에 가려져있고, 글씨도 흐리고 작아 잘 보이지 않는다.
따라서 루틴 제목에 강조를 줄이고, 추가되는 습관에 따라 실시간으로 변하는 종료 시간을 강조하는 쪽으로 개선을 했다. 아무리 모달의 어두운 배경에 가려져있다 하더라도 화면 내에서 가장 큰 텍스트라는 점과 상단에 위치한다는 점에서, 습관 추가에 따라 실시간으로 달라지는 종료 시간을 보다 편하게 인지할 수 있게 된다.
+ 루틴 종료 시간을 기준으로 루틴 시작을 정하는 기능이 있다면 사용자들이 더 편하게 이용할 수 있을 것 같다.
개선안 2. 토스트 알람
문제점 2 ) 루틴 리스트에 루틴이 추가가 되었는지 알기 어렵다
개선 방안 2 ) 사용자의 행동(루틴 추가)에 대한 액션을 추가한다
사용자 행동에 대한 피드백/리액션을 하는 방안 중 많이 사용되는 방법 중 하나는 바로 토스트 알림이다.
루티너리 습관 추가에서 토스트 알림은 습관 추가에 대한 액션뿐만이 아니라, 어떤 습관을 추가했는지 알려줄 수 있다.
토스트 알림 시안은 위치에 따라 두 가지를 고민해보았다.
먼저 시안 A는 스크롤 시에 화면의 하단(다음 목록)에 시선이 간다는 가정으로 토스트 알림을 하단으로 배치하였다. 하단에서 알림을 해준다면 시선이 지속적으로 하단에 머물러 있을 수 있어서 습관을 추가하는 플로우의 흐름을 방해하지 않는다는 장점이 있다.
반면 시안 B의 경우는 리스트를 추가하면 루틴 완료 시간이 자동으로 계산되는 현재의 기능을 참고하여 토스트 알람을 상단으로 배치했다. 루틴 완료 시간을 고려하며 습관을 추가하는 사용자의 경우, 상단의 시간 변화에 민감할 것이다. 따라서 시안 B는 화면의 변화가 일어나는 시선 구간을 상단으로 일치시킴으로써 사용자의 피로도를 줄일 수 있다는 장점이 있다.
개선 3. 습관 리스트 노출
문제점 3 ) 루틴 추가 현황을 알 수 없다
개선 방안 3 ) 추가된 습관 리스트를 보여준다
그러나 1번 개선안은 여전히 루틴 추가 현황을 알 수 없다는 문제도 있다. 그래서 추가와 동시에 리스트를 함께 노출하는 방안을 생각해보았다.
먼저, 모달 창에 가려졌던 뒤편의 습관 리스트를 상단으로 노출시키고 모달을 제거했다. 추가할 때마다 상단의 습관 리스트 하단에 습관이 추가되는 형식으로 작동한다. 또한 같은 습관을 몇 번이나 추가했는지 알 수 있도록, 습관을 추가할 때마다 + 버튼의 색깔을 점점 진하게 표현했다.
다만 리스트를 상단으로 뺏기 때문에 습관 추가 화면이 상대적으로 좁아져야 했다. 그래서 습관 추가 화면 의상단에 위치한 제목(습관 목록)과 직접 등록 버튼을 제거했다. 직접 등록의 경우, 내 습관 탭에서 '나만의 습관 만들기' 버튼을 추가해서, 유저의 플로우에 불편이 없도록 하였다.
개선 4. 습관 개수 노출 및 목록 분리
문제점 3 ) 루틴 추가 현황을 알 수 없다
개선 방안 4 ) 추가된 습관을 분리하고 추가된 습관 개수를 같이 보여준다
루틴 추가 현황을 장바구니처럼 개수로 표현하는 방법도 있다는 생각을 했다.
습관을 추가하면 설명을 제거하는 대신 습관의 개수와 +- 버튼을 보여주고, 동시에 추가한 습관 목록을 상단에 따로 구성하는 방법을 고안해보았다.
이렇게 구성하는 경우, 사용자는 한 루틴 안에서 자신이 어떤 습관을 몇 번 반복하는지 쉽게 파악할 수 있다. 또한, 추후에 루틴을 수정할 때 습관을 다 외우고 있지 않아도 손쉽게 습관의 개수를 조절하며 습관을 추가할 수 있다는 장점이 있다.
== 요약 ==
1. 과업(미션): 생활 습관(패턴) 개선
유저 스토리 : 삶의 효율을 높이고자 하는 사람은
생활 패턴의 변화를 위해서
할 일을 정하고 실질적인 수행을 습관화하길 원한다.
2. 핵심 기능 및 Flow : 스케줄 설정, 할 일 설정, 알림 기능
3. 와이어프레임 lo-fi & hi-fi
+ 프로토타입
4. 불편한 점과 개선 제안하기
문제 : 루틴 추가 화면에서 습관 리스트(현황)를 볼 수 없다.
개선 1. 시간 강조
개선 2. 토스트 알림
개선 3. 추가된 습관 리스트 노출
개선 4. 추가된 습관 목록 분리 및 개수 노출
마치며,
+ 입소문을 타고 있는 루티너리는 놀랍게도 작년 초에 론칭한 갓난 서비스다. 앱 리뷰에는 사용성에 관련된 요청이 많았지만, 루티너리 팀은 꾸준히 서비스를 개선하고 사용자와 정말 적극적으로 소통하며(브런치와 앱리뷰를 보면 알 수 있다) 좋은 평가를 받고 있었다. 왠지 루티너리 팀은 자신들의 미션과 비전을 위해 매일 그들의 루틴을 수행하지 않을까라는 생각이 든다. 나는 또 이렇게 충성 고객이 되어버렸다. 루티너리 4일째 사용 중인 루티너.
+ 이 블로깅에서는 루티너리의 MVP 메인 기능을 다뤘지만, 이 외에도 다양한 기능과 옵션들이 있다. 꼭 사용해보세요!
+ 루티너리서비스나 목표를 달성하는 습관의 중요성에 대해서 궁금하다면 루티너리 창업자이자 앱 개발자이신 박현주 님의 브런치를 추천한다. 나도 정독했다. 그녀의 글은 우리의 습관이 삶에 얼마나 큰 영향을 미치는지, 습관 하나로 삶을 대하는 태도가 어떻게 변하는지 등등 흥미로운 얘깃거리들이 읽기 쉽게 설명하고 있다. 좀 더 시간을 효율적으로 사용하고 싶거나, 작심삼일 의지가 고민인 사람들이라면 현주님의 브런치도 읽어보고 루티너리도 사용해보는 걸 추천한다.
+ 루티너리 어플의 카피캣을 하면서 확인해보니 디자인이 조금씩 어긋난 부분이나 통일성이 떨어지는 부분이 많았다. 루티너리 팀이 서비스 확장에 앞서 팀 내 디자인 가이드가 있다면 좋을 것 같다. 전직 디자이너인 나의 소망.. 약간 고통스러웠다...
+ 디자인 개선 고민을 함께 해준 영서님, 우철님, 금하님, 예은 님께 감사드립니다.
