소개
1회성의 행위보다 꾸준히 하는 것이 중요한 경우가 있습니다.
그런데 매번 뭘 해야하는지 생각해야하고, 했는지 안 했는지 기억을 해야하게 되면 부담이 생겨서 많은 루틴을 운영하기 어렵습니다.
저는 원래 옵시디언에 간단히 기록을 하는 방식으로 보조를 하고 있었는데,
단순히 디지털 노트에 기록을 하는 방식으로 하는 보조는 한계점이 있어서 시스템을 하나 만들기로 하였습니다.
루틴을 운영하는데 도움을 줄,
저에게 딱 맞는 루틴 운영 보조 시스템을 만들 예정입니다.
요구 사항 도출
휴대폰에 있는 한국어 앱 스크린샷
매일 수행하는 루틴 뿐만 아니라 2~3일에 한번 같은 주기를 가진 루틴도 관리가 용이하게 만들 예정입니다.
기존 도구와 맞지 않는 지점
### Todo app
todo app은 보통 아래에 초점을 둔다.
- one-off task
- due date
- checklist
- daily planning
이 프로젝트는 다르다.
많은 루틴 Action은 정확한 due date보다 현재 상태 표시가 중요하다.
예를 들어 "운동하기"는 반드시 calendar event일 필요가 없다.
사용자에게 더 중요한 것은 아래다.
- 마지막으로 언제 했는가?
- 너무 오래 지나지는 않았는가?
- 지금 다시 수행할 필요가 있는가?
### Habit app
habit app은 보통 아래에 초점을 둔다.
- streak
- daily checkmark
- motivation
- gamified consistency
이 프로젝트는 다르다.
사용자에게 필요한 것은 감정적 동기부여나 streak pressure가 아니다.
사용자에게 필요한 것은 명확한 operational interface다.
### Calendar app
calendar app은 예약된 event 관리에 적합하다.
하지만 이 프로젝트는 scheduling 중심이 아니다.
핵심은 반복 Action이 시간 속에서 유지되고 있는지 추적하는 것이다.시스템 정체성 재정의
"Todo 앱이 아니라 '행위 상태 추적 시스템' 의 표현이 더 정확하다."
시스템 핵심 컨셉
저장할 것과 계산해서 보여줄 것을 올바르게 잡는 것이 중요한 부분이었다고 생각합니다.
시스템 핵심 구조
다양한 유형의 작업이 포함된 한국 앱의 스크린샷
MVP-1 스펙 정의
한국 회사의 구조를 보여주는 다이어그램
기술 스택 결정
Vite
└─ React App
├─ TypeScript types
├─ React components
├─ Dexie DB layer
│ └─ IndexedDB
├─ PWA setup
│ ├─ manifest
│ └─ service worker
└─ lightweight CSS저는 웹앱 개발이 처음이어서 다 처음 써보는 기술 스택이었는데 클로드 코드가 잘 해줘서 큰 문제 없었습니다.
각 기술 스택이 뭔지 기본적인 것은 학습하면서 진행했습니다.
사용할 개발 도구 결정
gpt 클로드 코드 한국어로
vercel 이용해서 배포함
url :
https://action-state-tracker.vercel.app아직 단순한 수준이지만 궁금하신 분들은 결과물 확인이 가능합니다.
호환이 안되는 수준의 급격한 업데이트가 있을 수 있으니 유저로서 사용은 아직 적합하지 않습니다.
모바일 홈 화면 설치 방법(PWA, 웹인데 앱 같은 사용자 경험 제공) :
안드로이드 Chrome 기준으로 설명드립니다.
---
홈 화면에 추가하는 방법
1. Chrome에서 https://action-state-tracker.vercel.app 접속
2. 주소창 오른쪽의 ⋮ (점 세 개) 버튼 탭
3. 메뉴에서 "앱 설치" 또는 "홈 화면에 추가" 탭
4. 확인 팝업에서 "설치" 탭
---
설치하면 홈 화면에 Action Tracker 아이콘이 생 기고, 탭하면 브라우저 주소창 없이 앱처럼 실행됩니다.추가 설명 :
데이터는 각자 로컬 기기(브라우저)에 저장됩니다.
연동 기능은 아직 없습니다.
MVP 로 충분한지 확인, 사용자 경험 확인
#### 현재 제품이 MVP 로 충분한지 살펴보기.
내 입장에서 충분하려면 액션을 더 세분화 및 그룹핑 하기 좋아야할듯.
그리고 표기 방식이 더 유연해져야함.
- 2, 4 이런식으로 표현하는거
- ㅇ 로 표현하는거 (완료 여부만 표현하면 되는 기본형)
- 슬롯 1, 2, 3 으로 분리해서 다루는거
이후 추가할 기능 :
액션 카드에 슬롯 여러개가 가능하게
액션 카드에 숫자 방식으로 기록 가능하게.
- 숫자 1~7 정도 화면에 보여주고 숫자 누르면 체크되는 방식.
실수로 완료 눌렀을 때 취소 가능하게.
화면에서 액션 순서 바꿀 수 있게.이해를 돕기 위한 추가 자료
와
