INTJ와 INTJ가 2주 만에 만든 Show Your Time 앱 제작기
안녕하세요, 여러분들!
저는 프로덕트 디자이너이자 유튜브 크리에이터로도 활동 중인 나나산이라고 합니다!
해당 글은 2023년 8월 Show Your Time 앱 출시 직후
제 개인 블로그에 올렸던 글입니다 :)
서핏에 한 달 가량 노출되어 보신 분들도 계시겠지만,
디스콰이엇에서는 못 보신 분들도 분명 계실 것 같아요!
앞으로 Build in Public 글을 디스콰이엇에 올려보려고 해서,
Show Your Time의 첫 시작이었던 글을 재업로드해봅니다!
이 이후 과정과 배운 점들도 꽤 많은데요, 차차 글을 써서 올려보도록 하겠습니다! 🙌
갓생 바람이 불다
때는 바야흐로 6월. 팀 내에 갓생 살기 바람이 불었다. 매일 지킬 수 있는 목표를 세우고, 매달 초 공유한다. 목표를 매일 인증하고, 인증하지 못하면 하루당 벌금 1만 원. 적어 보이지만 모으면 많은 벌금의 효과는 엄청났다.
내 6월 목표는 하루 5천보 걷기, 스픽 영어회화, 6시~7시 30분 사이 기상, Blinkist 읽기, 그리고 주 3회 헬스, 총 5개였다. 어떻게 인증했을까? 걷기와 기상은 모니모 앱으로 인증, 스픽과 Blinkist는 각각의 앱으로, 헬스는 애플 피트니스 앱으로 인증할 수 있었다. 7월에는 책 읽기, 경제기사 읽기, 수학 문제 1개 이상 풀기, 글 한 덩어리 쓰기, 주 3회 헬스 목표를 세웠다.
순탄하던 인증에 문제 발생 ⚠️
첫 책으로 종이책을 고르며 책 읽기 인증에 문제가 발생했다. 종이책이라 날짜가 담긴 스크린샷을 찍을 수 없었다. 물론 해결책은 있다. 번거롭지만 책 사진을 찍고, 사진 앱에서 날짜 정보가 나오게 스크린샷을 찍어서 공유하기. 하지만 매일 하긴 귀찮았다. 전차책을 읽는 것도 방법이다. 하지만 집에 쌓아 놓은 종이책이 많았다. 종이책이 많은 이유는 IT 서적은 전자책으로 잘 나오지 않기 때문이다(제발 PDF라도 팔아주세요).
해결책은 타임스탬프 앱 🕓
그래서 타임스탬프 앱을 찾았다. 타임스탬프 앱이란 사진을 찍는 시점의 날짜, 요일, 시간 등의 정보를 함께 사진 위에 노출하여 저장할 수 있는 앱이다. 여기서 날짜, 요일, 시간 등의 정보를 타임스탬프라 일컫는다.
돌이켜 보면 타임스탬프 앱을 써보려고 했던 순간은 꽤 있었다. 하지만 앱을 찾을 때마다 내 마음에 드는 앱을 찾을 수 없었다. 앱 자체의 사용성도 물론이거니와 사진 위에 타임스탬프 폰트, 레이아웃들이 디자이너인 내 성에 차지 않았다. 7월 목표를 시작하며 다시 타임스탬프 앱을 찾다가 푸념을 늘어놓았다. 마음에 드는 앱이 없다고.
내 푸념을 본 개발자님이 빠르게 웹앱을 만들어 주셨다. 물론 타임스탬프의 디자인은 날것이었다. 점심으로 롯데리아를 제안하면 더 좋은 제안이 나오는 것처럼, 날것의 타임스탬프를 보자 빨리 디자인을 바꾸고 싶었다. 빠르게 시안을 만들어서 전달드렸다.
개발자님이 만든 웹앱으로 찍은 사진. 빨리 디자인하고 싶은 마음이 들게 해주었던 마법의 사진
빠르게 잡아서 드린 앱과 타임스탬프 프레임 시안
디자인이 적용된 첫 번째 버전인 웹앱을 사용하기 시작했다. 하지만 화질이 아쉬웠다. 웹앱은 사진을 실제로 찍는 게 아니라 카메라 화면의 스크린샷을 사용하기 때문이다. 화질을 좋게 만들려면 결국엔 어떤 방식이든 네이티브 앱을 만들어서 카메라로 찍어야 했다. 그렇게 앱 출시 프로젝트가 시작되었다. 앱 출시 목표는 2주 후로 정했다.
네이밍과 로고 작업
프로덕트 디자인 과정을 진행하면서 동시에 네이밍과 로고 작업을 진행했다. 이름은 영문으로 짓기로 했다. 이유는 한국뿐만 아니라 포함한 모든 국가에 배포하기로 결정했기 때문이다. 왜 전 세계에? 모든 지구인이 우리 앱을 써줬으면 하는 마음… 도 있지만 문화에 크게 영향을 받지 않는 유틸리티 앱이고, 텍스트가 많이 들어가지 않아서 다국어 지원을 하기에도 용이하다. 또 많이 쓰면 많이 쓸수록 좋지 않을까? 이런 상황에서 네이밍은 세계 공용어인 영어로 짓는 게 제일 낫다는 판단이 섰다.
Chat GPT에게도 물어보기도 하고 브레인스토밍을 하여 많은 네이밍 후보를 만든 후 고민 끝에 이름을 ‘Show Your Time’으로 결정했다. 타임스탬프, 타임 같은 키워드가 들어간 이름은 이미 시장에서 많이 선점한 상황이었다. 그래서 다른 방향으로 선택해야겠다는 판단을 했다. 또 레퍼런스를 조사하면서 How we feel이라는 앱을 알게 되었다. 이렇게 문장형 이름도 가능하구나 하는 힌트와 영감을 얻고, ‘Show Your Time’이라는 이름으로 짓게 되었다.
앱 프로덕트 디자인 과정
레퍼런스 조사
우선 레퍼런스 조사를 했다. 현재 타임스탬프 앱들의 하이어라키는 어떻게 되어 있는지, UI는 어떻게 구성되어 있는지, 어떤 기능들을 제공하는지, 사용자들의 피드백은 어떤지, 그리고 제일 중요한 비즈니스 모델도 조사한다. 이 과정은 손으로 직접 타 서비스들의 앱을 스케치도 하고, 표로 만들어서 정보를 비교하기도 한다.
레퍼런스를 조사하며 만든 자료
플로와 기능 리스트 작성
이후 앱을 어떤 순서로 사용해 나가는지 전체적인 앱의 주요 플로를 만들고, 거기에 필요한 기능들을 간단하게 작성한다. 앱을 키고, 촬영을 하고, 사진을 저장한다는 플로를 정리하고, 각 인터랙션에 필요한 기능들을 적어나간다.
만약 촬영과 관련된 기능이라면 전면 카메라, 후면 카메라, 플래시, 보정하기 등 카메라와 필요한 기능들을 최대한 적어 나간다. 현재 스콥에 포함되기 어려울 것 같아도 전체적으로 다 적어야 큰 그림을 볼 수 있다. 이후 다양한 방향에서 우선순위를 따져서 2주 만에 만들 수 있는 스콥을 정한다.
나열한 주요 플로우와 기능들
1차 버전에 나갈 스콥
와이어프레임
뼈대를 잡는 와이어프레임 작업 시작. 우선 제일 중요한 메인 인터랙션인 촬영 시, 모든 기능을 넣었을 때 화면을 만들어 본다. 나중에 바뀌더라도 어떤 형태로 갈지를 추측해 보기 위해 작업한다. 그리고 1차 버전에 쓸 와이어프레임을 잡는다. (가운데 세 개의 이미지) 제일 우측 이미지는 앱 다운로드 버튼을 포함한 랜딩 페이지이다.
단출한 와이어프레임
UI 작업
와이어프레임을 바탕으로 UI 작업을 시작했다. 라이트 테마가 아닌 다크 테마로 가기로 결정했다. 사진에 더 집중할 수 있게 해주지 않을까 싶었다. 타임스탬프 앱을 조사했을 때 다크 테마인 앱들이 적기도 했다. 다른 앱들과의 차별화를 줄 수 있는 포인트가 될 것 같았다.
UI 시안
프레임 (a.k.a. 타임스탬프)
타 서비스에서는 타임스탬프로 불리는 프레임 작업도 했다. 첫 번째 버전에는 총 8개의 프레임을 지원한다. 뭉게구름같이 귀여운 느낌의 폰트부터 깔끔한 디자인의 폰트까지 다양한 폰트로 타임스탬프를 표현하고, 정렬과 레이아웃 배치도 다양하게 구성했다.
앱을 사용해 실제로 찍은 결과물
그 외
랜딩 페이지 디자인, 국문과 영문으로 된 핵심 카피라잇, 앱 소개 글, 서브 텍스트 작성, 앱스토어 스크린샷 등 앱 출시에 필요한 작업을 진행했다. 물론 QA도 함께 진행했다. 다행히 스콥 범위가 적어서 QA할 게 엄청 많진 않았다. 거기에 더불어 마케팅을 위해 소셜 네트워크 계정들을 생성하고, 콘텐츠를 올리고, 유튜브와 인스타그램 릴스에 올릴 제작기 영상도 만드는 등의 작업을 진행했다.
지표도 설정했다. 우선은 초기 제품이기 때문에 앱 다운로드 수를 측정하기로 했다. 소소하게 8월 안에 1,000 다운로드 수를 기록해 보자! 하지만 진행하다 보니 앱 다운로드 수는 계속 올라가기만 하는 지표이기 때문에 큰 의미가 없고, 특히 앱스토어 커넥트에서는 중복 다운로드 수도 포함되어 더 유니크한 다운로드 수는 알기 어려워서 더 의미가 없게 느껴졌다. 그래서 비교할 수 있는 다른 지표도 함께 추적하기로 했다. 바로 앱 삭제 수. 앱 삭제 수는 마케팅 툴을 붙여야 알 수 있기 때문에 당장은 추적할 수 없지만 곧 나올 다음 버전에 추가하려고 한다.
INTJ와 INTJ의 프로젝트
2주 후에 앱을 출시하자고 제안한 것은 독기 독기 산독기 가득한 INTJ였다. 제안을 챌런지로 받아들인 INTJ는 다급하게 프로덕트 디자인을 비롯한 다양한 작업을 시작해 나갔다(누가 독기 가득한 INTJ일지는 당신의 판단에…). 할 말만 하는 건조하지만 생산적인 논의 속에 INTJ들은 앱을 만들어 나가기 시작했다.
생각보다 간단하지 않았다
1.0이기 때문에 간단하게 만들자고 했지만 해야 할 일이 많았다. 앱을 처음 출시하는 과정은 준비할 게 많기 때문에. 하지만 일정이 정해졌기 때문에 지켜야 한다는 압박이 커졌다. 내 주말은 사이드 프로젝트로 가득 차게 되었다. 그리고 마침내 배포하기로 예정한 날짜보다 하루 빠르게 출시할 수 있었다.
Show Your Time 앱 다운로드하러 가기
노력한 시간을 감각있게 공유하는 타임스탬프 앱📱
Show Your Time에서 작심3일클럽을 시작합니다!
3+3은 귀요미가 아니고(...)
3+3+3... 하다 보면 어느새 1년! 작은 습관을 만들어서 큰 변화를 만들 수 있어요 🙌
작심3일클럽의 첫 번째 시즌은 '운동 인증'입니다.
Show Your Time으로 운동 사진 찍고, 인증해서 계속 3일씩 해나가봐요 🏃♀️🏃♀️🏃♀️
✅ 멤버 모집: 2023.12.19(화)~12.26(화)
(선착순으로 모집해서 일찍 마감될 수 있어요!)
프로필에 있는 링크 🔗
showyourti.me/three-days-club
에서 지금 작심3일클럽을 신청해보세요!
프로그램 시작 안내 사항은
신청해 주신 분들에 한해서 안내 드릴게요!
지금 바로 GO GO! 🏃♀️🏃♀️
3가지는 반드시 얻어갈 수 있어요 
내년엔 매출 수직 상승시키고 싶은 대표님이라면? 
