brunch

You can make anything
by writing

C.S.Lewis

by 티나 Oct 21. 2021

본격! 서비스 구체화하기 (1)

와이어프레임으로 플로우 구상하기



서비스를 만들기 위해 레퍼런스를 리서치(이전 글 참고)하였다면, 이제 서비스를 만들기 위한 본격적인 단계로 접어듭니다. 리서치 결과, 팀원들이 생각한 '수명 카운트다운' 서비스는 이미 제공하는 서비스가 있었지만 완성도가 높지 않거나 컨셉이 많이 달라서 이런 상황이라면 한번 도전해봐도 괜찮다는 결론에 도달하게 되었죠. 이번 글에서는 제가 참여한 수명 카운트다운 서비스를 기준으로 어떻게 서비스를 구체화하였는지 말씀드리려고 합니다. (차마 기획이라는 표현을 쓰기엔 아직 전문성이 현저히 부족하여 기획이란 표현 대신 서비스 구체화라는 표현을 사용하였습니다. 파면 팔수록 신비롭고 어려운 기획의 세계...)



대부분의 디데이 서비스들은 이미 디데이가 정해져 있고 그 디데이까지 얼마나 남았을지 알려주는 방식인데, '수명 카운트다운'에서의 디데이는 사실상 알 수 없는 영역이기 때문에 서비스 자체에서 남은 수명을 계산할 수 있는 도구가 필요했습니다. 완전 랜덤하게 보여줄 수도 없고, 그렇다고 정확한 수명을 계산하자니 그건 불가능하고... 결국 간단한 설문을 통해 사용자의 답변을 받고 그 답변을 토대로 수명을 계산하기로 하였죠. 비과학적이긴 하지만 아예 기준없이 계산된 값이 아니기 때문에 나름의 신뢰성이 있다고 판단하였습니다.



그래서 대한민국의 평균 수명을 기준으로 카운팅을 깎는 방식으로 계산하게 되었고, 카운팅을 깎을 때에는 사용자 설문을 통해 받은 응답을 기준으로 계산하게 되었습니다. 아무래도 지금까지 살아 온 날 만큼은 제외해야하므로 생년월일을 설문에 포함하게 되었고, 기본적인 건강에 관련한 내용과 크리티컬한 생활 습관 점수까지 합산하여 카운팅을 하게 되면 사용자의 최종 수명 카운트다운을 확인할 수 있습니다. 각의 응답은 고유한 점수를 가지고 있어 사용자가 선택하는 답변에 따라 깎이는 점수가 달라집니다.



Q. 설문은 수명 카운트다운을 계산하는 데만 쓰이나요?

결론부터 말하자면 아닙니다. 설문은 단순하게 남은 수명을 계산하는 데에만 쓰이지 않습니다. 물론 이 서비스의 핵심인 '수명 카운트다운'을 위해 꼭 필요한 단계이지만, 수명 계산 이외에도 사용자들이 남긴 귀중한 데이터는 사용자 개개인의 상황에 맞게 맞춤형 서비스를 제공하는 훌륭한 도구가 되기도 합니다.

예를 들어 음주 습관과 관련된 질문에 일주일의 대부분 술을 마신다고 응답한 사용자에게는 맞춤형 메시지를 전달할 수 있습니다. 예를 들어 일주일에 한 번씩 "오늘은 술 대신 맛있는 무알콜 음료로 대신해 보는 것은 어떨까요?" 등의 푸시 메시지를 보내 금주를 독려하는 방향으로요! 물론 메시지를 받고 금주할지 말지는 사용자의 의지에 달려있지만요.



처음에는 아래 이미지와 같이 계산식의 큰 틀을 짜고, 사용자가 응답할 내용과 깎아야할 점수는 피그마를 활용하여 구체적으로 그려보았습니다. 문항은 건강검진 할 때 실제로 문진



계산식의 큰 틀을 먼저 짜고...
큰 틀을 기반으로 구체적인 설문 내용을 그려보았습니다 (with  Figma)


Q. 여기서 잠깐! 왜 피그마로 그렸을까요?

피그마는 작업 및 마우스 커서등의 위치가 링크가 있는 대상에게는 실시간으로 공유되어 협업할 때 커뮤니케이션이 용이합니다. 설문에 대한 내용도 팀원들과 충분히 이야기를 나눈 후 가장 납득할 만한 방식으로 정리가 필요했기 때문에 함께 쉐어링하기 편한 피그마로 작업 및 공유하게 되었죠.



이렇게 설문에 포함될 문항을 구체화하고 플로우까지 설계하고 나면 와이어프레임 단계로 넘어가 대략적인 화면 설계에 돌입합니다. 와이어프레임이란 디자인 들어가기 전 단계로, 화면에 필수적인 기능 및 요소들을 대략적으로 배치해보고 다음 화면, 그리고 이전 화면과 연결됐을 때 어색한 점은 없는지 확인해보는 단계입니다. 설문 문항만 봤을 때는 빼거나 더할 것이 없어 보여도 막상 화면 설계와 함께 앞뒤 플로우를 짜게 되면 빼야하거나 더 추가해야 할 부분이 눈에 보이게 됩니다. 이 단계 없이 디자인에 바로 들어가는 것보다 와이어프레임 단계를 거치는 것이 디자인 공수 및 시간을 훨씬 단축할 수 있습니다.



설문 단계의 앞뒤 플로우를 간단한 와이어프레임으로 그려보았습니다.



와이어 프레임을 그릴 때에는 아무리 본격적인 디자인 작업에 들어가기 전이라 하더라도, 프로젝트 멤버들이 이것은 어떤 UI인지 인지하고 커뮤니케이션을 이어갈 수 있는 수준은 되어야 합니다. 위의 와이어프레임 샘플처럼 선택 가능한 라디오 버튼, 일반 기능 버튼, 무엇을 눌러야 다음 플로우로 넘어갈 수 있는 지를 보여주는 동선 가이드 등이 명확하게 표시 되어 있습니다. 시각적으로 완성도가 높지 않더라도 명확하게 무엇인지만 알 수 있으면 상관없습니다.









앱 다운로드는 여기에서!

오늘내일 앱을 사용해 보고 싶으시다면, 아래 링크에서 앱을 다운 받아 사용해 보세요!

안드로이드 앱 다운받기 / 아이폰 앱 다운받기




매거진의 이전글 서비스를 만들기 전 꼭 해야할 일
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari