DDD에서 만난 자낳괴
2019년 하반기, 개발&디자인 스터디인 DDD 3기에 조인했습니다. 제가 속한 팀은 flutter 개발팀이고 저를 포함 디자이너 2명, flutter 개발 2명, 서버 1명으로 구성되었습니다.
팀 결성 후 여느 동아리가 그렇듯이 팀 이름을 정하는 시간이 돌아왔는데, '사이드 프로젝트로 돈을 벌어보자!' 라는 원대한 꿈을 가지며 자낳괴(자본주의가 낳은 괴물)라 이름 붙였습니다. 실제로 팀원 분들의 돈을 향한 갈망(?)과 사업적 센스가 뛰어나서 대충 지었지만 착 붙는 이름이라고 생각합니다. 
기획하기
사이드 프로젝트이니 단순하고 flutter로 구현하기 쉬운 인터랙티브한 제품을 만드는데 의견이 모아졌습니다. 그 중에서도 매일, 누구나 쉽게 사용할 수 있는 일기에 초점을 맞추게 되었고, 영화 <인사이드 아웃>에서 영감을 얻어 다섯 가지 감정을 기록하는 인터랙티브 감정 기록 앱을 기획하게 되었습니다.
기능 자체는 굉장히 심플합니다. 감정을 선택할 수 있고, 그에 대한 짧은 글을 쓸 수 있습니다. 다만 인사이드 아웃에 나오는 감정 구슬처럼 이모지가 구슬처럼 쌓이는 이모지 뷰, 해당 달의 감정을 한 눈에 볼 수 있는 캘린더 뷰, 글을 타임라인 처럼 쉽게 볼 수 있는 리스트 뷰를 제공합니다.
디자인하기
감정 선택하기
인사이드 아웃에 나온 다섯 캐릭터를 Daymood에도 적용했습니다. 다만 기쁨이, 슬픔이라고 명명하진 않았고 감정명과 디스크립션을 구어체로 변환했습니다. 또 감정의 분류 뿐 아니라 정도도 표시하는데, 1부터 100까지 범위 안에서 세 단계로 나눠 감정의 단계가 높아질 수록 격양된 이모지가 나타납니다.
실제 구현된 앱
감정 선택 동작은 탭 또는 롱 탭으로 이루어집니다. 특정 감정을 선택하게 되면 그 이모지가 가운데로 움직이기 때문에, 좌상단의 '기뻐요' 이모지 자리에서 롱 탭하더라도 가운데를 탭하는 것과 같은 동작이 이루어집니다. 실제 기기에서 롱 탭을 해보면 다이나믹한 햅틱도 느낄 수 있습니다. 또 프라이머리 버튼(확인)은 선택하는 감정에 따라 다른 색상을 띄게 됩니다. 사용자가 느끼는 감정에 따라 앱도 같이 변화하는 컨셉을 적용했습니다.
감정 기록하기
감정과 함께 기록하는 짧은 글은 200자 제한을 두었습니다. 등록된 글은 일정한 카드 UI로 보여주게 되는데, 그 카드가 너무 뚱뚱하지 않게 보여야한다는 점, 모바일로 글을 적는 환경이라는 점에서 가장 적당한 분량이라고 생각했습니다. 또 감정만 입력하고 글을 입력하고 싶지 않은 경우도 있기 때문에 확인() 버튼을 누르면 글을 쓰지 않아도 된다는 내용을 힌트 텍스트에 마련해두었습니다.
) 버튼을 누르면 글을 쓰지 않아도 된다는 내용을 힌트 텍스트에 마련해두었습니다.기록한 감정을 보는 세 가지 뷰
앞에서 말한 것 처럼 기록된 감정은 이모지 / 캘린더 / 리스트 세 가지 뷰로 볼 수 있습니다. 각 뷰마다 장단점이 존재하고 사용자마다 선호하는 시각적 차이점과 사용 패턴이 다를거라 예상해, 범용적으로 사용할 수 있는 세 가지 뷰를 제공하기로 했습니다.
이모지 뷰
이모지 뷰는 시각적인 즐거움에 포커스를 맞춘 보기 모드입니다. 인사이드 아웃의 컨셉을 가장 잘 보여줄 수 있는 뷰이기도 합니다. 감정을 추가하면 구슬처럼 감정이 떨어지고 차곡차곡 쌓이는 동작입니다.
러프하게 개발 후 사용해보니 한가지 문제점이 있었는데, 우하단 FAB에 가려진 감정들의 세부 내역을 볼 수 없다는 점이었습니다. 여러 방법을 고민하다가 실제 구슬을 생각했을 때, 디바이스의 기울기에 따라 구슬이 굴러가는 걸 상상해볼 수 있었습니다. 바로 자이로 센서를 적용해 디바이스 기울기에 따라 구슬이 굴러가는 재미있는 인터랙션, FAB와 상관없이 모든 감정을 선택할 수 있게 된 편의성까지 잡을 수 있었습니다.
캘린더, 리스트 뷰
캘린더 뷰는 그 달의 감정을 러프하게 한 눈에 볼 수 있다는 장점, 리스트 뷰는 스크롤만 하면 모든 내용을 뎁스 없이 볼 수 있다는 장점을 가지고 있습니다. 엔터테인먼트에 초점을 맞춘 이모지 뷰를 보강해줄 두 가지 뷰의 가장 큰 차이점은 공유 여부에 있습니다.
현재 이모지, 캘린더 뷰에서는 UI를 제외하고 이모지와 캘린더 자체를 이미지로 말아 저장하거나 공유할 수 있게 하는데, 리스트 뷰 같은 경우엔 모든 기록을 뎁스 없이 보여주기 때문에 길어질 경우 공유 이미지에 적합하지 않습니다. 나중에 공유 기능이 고도화된다면 이 부분을 정리해보고 싶습니다.
감정 통계
한 달 단위로 제공하는 통계는 감정 정도를 1부터 100까지라는 정량적 범위로 설정했고, 하루에 한 번 기록하는 게 아니라 감정이 바뀔 때마다 여러번 기록할 수 있어서 큰 단위까지 넘어가기 때문에 유의미한 기능이 될 것 같았습니다. 자산 관리 앱 뱅크샐러드의 리포트 기능에 힌트를 얻어 한 달 동안 가장 두드러진 감정들을 수치로 보여지게 했는데, 수치 뿐 아니라 상단 빅배너에도 해당 감정을 활용한 그래픽을 배치했습니다.
출시 준비하기
대부분의 개발을 마치고 출시 준비를 했는데, 가장 어려운 관문에 봉착했습니다. 바로 '앱 이름'이다. 팀원들끼리 모여서 인사이드 아웃, 감정, 구슬, 기록, 일기 등등의 키워드를 잡고 1시간 가량 씨드 아이디어를 대량 배출했습니다. 어처구니 없는 씨드 아이디어가 나와도 비웃지 말기란 룰을 가지고 말입니다.
한시간동안 무려 168개의 후보가 쏟아졌고, 이는 곧 웃음 참기 챌린지로 이어졌습니다. 실시간으로 맥락없는 수다를 떨면서 의식의 흐름으로 작성한 결과입니다. 이모르디앙 호텔, 오미자, 이모지 365층 석탑, 무드리 햅번 의 쟁쟁한(?) 후보를 거쳐 결국 지금의 Daymood란 이름이 당선되었습니다.
앱 이름 이외에 플레이스토어 링크를 공유했을 때 펼쳐지는 오픈 그래프, 앱 아이콘, 스토어 스크린샷, 앱 소개 등도 초고속으로 준비되었습니다. 츨시를 눈 앞에 두고 있었기 때문에 별다른 리뷰 과정 없이 만드는 시안마다 빠르게 동의를 얻었습니다.
마치며
원래 DDD 전체 스케쥴 상 2020년 2월 중순까지인데, 자낳괴 팀은 빠르게 런칭하는 걸 목표로 했기 때문에 2019년 말을 예상 시기로 잡았습니다. 다만 모두 직장을 다니고 있었고 연말이 겹쳤기 때문에 일주일정도 늦어지게 되어 2020년 1월 초에 런칭되었습니다.
이전 동아리, 이외 스터디를 겪으며 사이드 프로젝트가 개발 단계에서 머뭇대다 어그러지는 경우를 너무(x10) 많이 봤기 때문에, 완성도보다는 런칭 자체에 초점을 맞춰서 아쉬운 부분도 많습니다. GUI도 얼기설기한 부분이 많고 사용성도 촘촘히 짜지 못한 부분이 마음에 걸립니다.
팀장으로서의 역할도 제대로 해냈는지 의문입니다. 팀마다 자율적으로 선출해서인지 객관적 지표도 없이 적극성만 보고 뽑아 주셨는데, 아직은 디자인과 매니징을 동시에 챙기기에는 버거움이 많습니다. 그래도 팀장이라고 믿고 군말없이 따라주신 팀원분들께 감사의 마음을 전합니다.
