القائمة
TaillogToss 사용자 여정 — 6개 여정 플로우, 신규 6개+보강 4개 화면 와이어프레임, 상태 전환, 인게이지먼트 훅.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
Toss Mock 인증 스킬 — stable userKey 설정, survey 루프 근본 원인 진단, adb 기반 진단 순서를 표준화한 스킬.
Toss IAP 검증 스킬 — Edge Function 404 우회, Service Role 감지, mTLS mock 설정, 토큰 헬퍼 분리, subscriptions 활성화 E2E.
Toss 수익화 운영 스킬 — Ads/IAP/TossPay 콘솔 설정, 샌드박스 시나리오, QA 증적 수집을 표준화.
AIT .ait 번들 빌드 → 콘솔 업로드 → 테스트 진입 성공 패턴. env var 인라인 실패(supabase url is required), babel/esbuild 충돌, __dirname 경로 문제 해결책 포함.
FastAPI + SQLAlchemy + Supabase 모델 작성 규칙 — DB 타입 불일치 방지, async cascade 패턴, Pydantic enum 검증. 2026-05-19 E2E 테스트(Wave 1~9)에서 발견한 BUG-01~05 재발 방지 지침.
TaillogToss 로컬 개발 서버(Metro + FastAPI) 시작/재시작 절차. "서버 켜줘", "서버 재시작", "앱 안됨", "번들 안됨" 등 서버 기동 관련 모든 상황에 사용한다.
| name | toss_journey |
| description | TaillogToss 사용자 여정 — 6개 여정 플로우, 신규 6개+보강 4개 화면 와이어프레임, 상태 전환, 인게이지먼트 훅. |
화면 간 전환 흐름(사용자 여정)과 신규 6개 화면 와이어프레임을 정의한다.
개별 화면의 기본 와이어프레임은 /toss_wireframes, TDS 컴포넌트 상세는 /toss_apps 참조.
Section 9의 개별 화면 와이어프레임을 보완하여, **화면 간 전환 흐름(사용자 여정)**과 누락 화면 6개를 정의한다.
기존 Section 9의 10개 + 신규 6개 화면 + 재사용 컴포넌트 2개 + PRO 업셀 바텀시트 1개.
| # | 화면 | 파일 경로 | 레이아웃 패턴 | 신규/기존 |
|---|---|---|---|---|
| 1 | login | src/pages/login.tsx | Standalone | 기존 9-1 |
| 2 | welcome | src/pages/onboarding/welcome.tsx | B (상세형) | NEW |
| 3 | survey | src/pages/onboarding/survey.tsx | C (입력폼형) | 기존 9-2 |
| 4 | survey-result | src/pages/onboarding/survey-result.tsx | B (상세형) | NEW |
| 5 | dashboard | src/pages/dashboard/index.tsx | D+A (탭+목록) | 기존 9-3 보강 |
| 6 | quick-log | src/pages/dashboard/quick-log.tsx | E (모달형) | 기존 9-4 보강 |
| 7 | analysis | src/pages/dashboard/analysis.tsx | D (탭형) | 기존 9-5 |
| 8 | coaching-result | src/pages/coaching/result.tsx | B (상세형) | 기존 9-6 보강 |
| 9 | training-academy | src/pages/training/academy.tsx | A 변형 (GridList) | 기존 9-7 |
| 10 | training-detail | src/pages/training/detail.tsx | B (상세형) | NEW |
| 11 | dog-profile | src/pages/dog/profile.tsx | C (입력폼형) | 기존 9-8 |
| 12 | dog-switcher | src/pages/dog/switcher.tsx | E (모달형) | NEW |
| 13 | dog-add | src/pages/dog/add.tsx | C (입력폼형) | NEW |
| 14 | settings | src/pages/settings/index.tsx | A (목록형) | 기존 9-9 |
| 15 | subscription | src/pages/settings/subscription.tsx | B (상세형) | NEW |
| 16 | notification | src/pages/onboarding/notification.tsx | B (상세형) | NEW |
| 17 | ops-today | src/pages/ops/today.tsx | D+A (탭+목록) | 기존 9-10 |
| 18 | EmptyState | components/EmptyState.tsx | Result 기반 | NEW |
| 19 | ErrorState | components/ErrorState.tsx | ErrorPage 기반 | NEW |
| 여정 | 대상 | 핵심 경로 | 목표 소요시간 |
|---|---|---|---|
| A: Cold Start | 첫 방문자 | login → welcome → survey(7) → survey-result → notification → dashboard | < 3분 |
| B: Daily Loop | 기존 사용자 | dashboard → quick-log → dashboard(갱신) | < 35초 |
| C: Upgrade | 무료 사용자 | (트리거) → PRO 업셀 시트 → subscription → Toss IAP → dashboard(PRO) | < 2분 |
| D: Deep-Dive | 기록 10건+ | dashboard → analysis → coaching-result → training-academy → training-detail | 5-10분 |
| E: B2B Ops | 트레이너/관리자 | subscription(B2B) → role 전환 → dashboard(운영탭) → ops-today → 기록 → 리포트 | 10-30분 |
| F: Multi-Dog | 다견 보호자 | dashboard → dog-switcher → 선택/추가 → dashboard(전환) | < 10초 |
[Toss 앱]
│
▼
┌─────────┐ ┌──────────┐ ┌──────────────┐ ┌───────────────┐
│ login │────▶│ welcome │────▶│ survey (7단계)│────▶│ survey-result │
│ (9-1) │ │ (11.3-1) │ │ (9-2) │ │ (11.3-2) │
│ │ │ │ │ │ │ │
│토스 OAuth │ │단일 카드 │ │이름→품종→나이 │ │AI 요약 + 티저 │
│브릿지 │ │Lottie │ │→체중→중성화 │ │Skeleton 블러 │
│ │ │"90초 시작"│ │→문제행동→목표 │ │광고/기록 CTA │
└─────────┘ └──────────┘ └──────────────┘ └───────┬───────┘
│
▼
┌───────────────┐
│ notification │
│ (11.3-3) │
│ │
│벨 Lottie │
│체크박스 ×3 │
│"허용"/"나중에" │
└───────┬───────┘
│
▼
┌───────────────┐
│ dashboard │
│ (9-3 보강) │
│ │
│EmptyState │
│"첫 기록 남기기"│
└───────────────┘
핵심 지표: 설문 시작→대시보드 도착 138초 이내 (Aha Moment) 이탈 방지: welcome에서 "90초면 충분해요" 카피, survey에서 ProgressBar로 진행감
┌───────────────┐ ┌───────────────────────┐ ┌───────────────┐
│ dashboard │────▶│ quick-log │────▶│ dashboard │
│ │ │ (9-4 보강) │ │ (갱신) │
│ │ │ │ │ │
│"+ 빠른 기록" │ │ [빠른] [상세] ← 탭 │ │ Toast 확인 │
│BottomCTA 탭 │ │ │ │ 목록 갱신 │
│ │ │ 빠른: 12칩 원탭 저장 │ │ 스트릭 갱신 │
│ │ │ 상세: ABC 접이식 │ │ │
└───────────────┘ └───────────────────────┘ └───────────────┘
2초 최대 30초 3초
핵심 지표: 빠른 탭 원탭 = 2초, 상세 ABC = 30초 이내 Sticky: 저장 후 "🔥 N일 연속 기록 중!" 스트릭 뱃지 즉시 갱신
┌─ 트리거 ──────────────────────────────────────────┐
│ │
│ R1: survey-result → "광고 보고 전체 분석 보기" │
│ R2: dashboard 코칭 → "광고 보고 코칭 열기" │
│ R3: coaching-result → "광고 보고 열기" │
│ C1~C5: 자연 전환 포인트 (Skeleton 블러 노출) │
│ │
└────────────────┬───────────────────────────────────┘
│
▼
┌─ useBottomSheet ─┐ ┌───────────────┐
│ PRO 업셀 시트 │────▶│ subscription │
│ │ │ (11.3-4) │
│ "PRO로 업그레이드" │ │ │
│ 핵심 혜택 3줄 │ │무료 vs PRO 비교│
│ [자세히 보기] │ │월간/토큰팩 │
└───────────────────┘ │Toss IAP 결제 │
└───────┬───────┘
│ 결제 성공
▼
┌───────────────┐
│ dashboard │
│ (PRO 활성화) │
│ │
│ Skeleton 해제 │
│ PRO Badge 표시 │
│ 전체 기능 활성 │
└───────────────┘
보상형 광고 퍼널: Skeleton 블러 → TextButton("광고 보고 열기") → 토스 Ads SDK 2.0 Rewarded (토스 SDK 공식 지원 폴백만 허용) → 1회 해제 → "매번 광고 귀찮다 → PRO 구독" 자연 전환 터치포인트: survey-result(R1), dashboard(R2), coaching-result(R3)
┌───────────────┐ ┌───────────────┐ ┌────────────────┐
│ dashboard │────▶│ analysis │────▶│coaching-result │
│ │ │ (9-5) │ │ (9-6 보강) │
│ [분석] 탭 탭 │ │ │ │ │
│ │ │주간/월간 차트 │ │진단: insight │
│ │ │행동별 빈도 │ │프로토콜 3단계 │
│ │ │"AI 코칭 보기" │ │dog_voice 말풍선 │
└───────────────┘ └───────────────┘ │7일 훈련 계획 │
│위험 신호/상담 │
└───────┬────────┘
│
▼
┌──────────────────┐
│training-academy │
│ (9-7) │
│ │
│GridList 커리큘럼 │
│진행률 ProgressBar │
└───────┬──────────┘
│ 미션 선택
▼
┌──────────────────┐
│training-detail │
│ (11.3-6) │
│ │
│가이드 Asset │
│체크리스트 │
│메모 + "미션 완료" │
└──────────────────┘
핵심 지표: 분석→코칭→훈련 전환율, 훈련 완료율 PRO 잠금: coaching-result 심층 분석 영역 Skeleton 블러 (무료 유저)
┌───────────────┐ ┌─────────────────┐ ┌───────────────┐
│ subscription │────▶│ role 자동전환 │────▶│ dashboard │
│ (11.3-4) │ │ │ │ (운영 탭 활성) │
│ │ │IAP 결제 완료 │ │ │
│B2B 플랜 선택 │ │verify-iap-order │ │[기록][분석] │
│트레이너/센터 │ │→ role='trainer' │ │[훈련][운영] ← │
│ │ │ or 'org_owner' │ │ 4탭 활성화 │
└───────────────┘ └─────────────────┘ └───────┬───────┘
│ [운영] 탭
▼
┌───────────────┐
│ ops-today │
│ (9-10 보강) │
│ │
│[대기][진행][완료]
│반려견 목록 │
│개별/벌크 기록 │
└───────┬───────┘
│
┌─────────┴─────────┐
▼ ▼
┌──────────────┐ ┌──────────────┐
│ 개별 기록 모달 │ │ 벌크 모드 │
│ │ │ │
│[프리셋][ABC] │ │다견 선택 │
│프리셋: 원탭 │ │카테고리 일괄 │
│ABC: 다중태그 │ │[일괄 저장] │
└──────────────┘ └──────────────┘
역할 전환: IAP 결제 → Edge Function verify-iap-order → users.role 자동 변경
센터 플로우: 센터 플랜 결제 → organizations 생성 → 직원 초대(코드/링크) → org_members 등록
구독 만료: role 유지, 기록/리포트 생성 차단, 기존 데이터 열람 30일 유예
┌───────────────┐ ┌─ useBottomSheet ──┐ ┌───────────────┐
│ dashboard │────▶│ dog-switcher │────▶│ dashboard │
│ │ │ (11.3-5) │ │ (전환 완료) │
│반려견 카드 탭 │ │ │ │ │
│또는 헤더 탭 │ │ListRow(반려견 ×N) │ │선택된 반려견 │
│ │ │Badge("선택") │ │데이터 갱신 │
│ │ │"+ 반려견 추가" │ │ │
└───────────────┘ └────────┬──────────┘ └───────────────┘
│ "+ 반려견 추가" 탭
▼
┌───────────────┐
│ dog-add │
│ (11.1 #13) │
│ │
│survey 축소판 │
│이름+품종+나이 │
│→ 저장 → 전환 │
└───────────────┘
핵심 UX: 바텀시트로 즉시 전환, 추가 시 survey 축소판(3필드)
데이터: 전환 시 active_dog_id 업데이트 → 대시보드 전체 갱신
┌─────────────────────────┐
│ │ ← Navbar 없음 (단일 카드)
├─────────────────────────┤
│ │
│ ┌───────────────────┐ │
│ │ [Asset: Lottie] │ │ ← Asset(type="lottie")
│ │ 강아지 애니메이션 │ │ 단일 가치 제안 카드
│ └───────────────────┘ │
│ │
│ "반려견 행동, │ ← Text(heading)
│ 90초면 기록 끝" │
│ │
│ "AI가 분석하고, │ ← Text(subtitle, muted)
│ 맞춤 훈련까지" │
│ │
├─────────────────────────┤
│ ┌───────────────────┐ │
│ │ 시작하기 (90초) │ │ ← BottomCTA > Button(primary)
│ └───────────────────┘ │
└─────────────────────────┘
사용 컴포넌트: Asset(Lottie), BottomCTA, Button, Text
전환: "시작하기" → survey(Step 1)
카피 원칙: 숫자 강조("90초"), 결과 중심, 부담 최소화
참고: 최초 1회만 표시 (AsyncStorage 플래그), Navbar.CloseButton 삭제, "이미 계정이 있어요" 삭제
┌─────────────────────────┐
│ 분석 결과 │ ← Navbar(.Title)
├─────────────────────────┤
│ ScrollView │
│ │
│ ┌───────────────────┐ │
│ │ [Asset: AI 아이콘] │ │ ← Asset
│ │ │ │
│ │ "뽀삐의 행동 분석 │ │ ← Text(heading)
│ │ 결과입니다" │ │
│ └───────────────────┘ │
│ │
│ ┌───────────────────┐ │
│ │ 행동 유형 │ │ ← ListHeader
│ │ Badge: "불안형" │ │ ← Badge(variant="warning")
│ │ │ │
│ │ 위험도: ■■■□□ 중간 │ │ ← ProgressBar(value=0.6)
│ │ │ │
│ │ "설문 기반 초기 │ │ ← Text(paragraph)
│ │ 분석입니다. │ │
│ │ 기록이 쌓이면 더 │ │
│ │ 정확한 분석이 │ │
│ │ 가능해요." │ │
│ └───────────────────┘ │
│ │
│ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ │ ← Border
│ │
│ ┌───────────────────┐ │
│ │ 📋 상세 리포트 │ │ ← ListHeader
│ │ ┄┄┄┄┄┄┄┄┄┄┄┄┄┄┄ │ │ ← Skeleton(블러 처리)
│ │ ┄┄┄┄┄┄┄┄┄┄┄┄┄┄┄ │ │ 잠금된 상세 분석 영역
│ │ ┄┄┄┄┄┄┄┄┄┄┄┄┄┄┄ │ │
│ │ ┄┄┄┄┄┄┄┄┄┄┄┄┄┄┄ │ │
│ │ │ │
│ │ TextButton: │ │ ← TextButton("광고 보고 전체 분석 보기")
│ │ "광고 보고 전체 │ │ → Rewarded Ad → 1회 잠금 해제
│ │ 분석 보기" │ │
│ └───────────────────┘ │
│ │
├─────────────────────────┤
│ ┌───────────────────┐ │
│ │ 기록 시작하기 │ │ ← BottomCTA > Button(primary)
│ └───────────────────┘ │ → dashboard
└─────────────────────────┘
사용 컴포넌트: Navbar(.Title), Asset, Badge, ProgressBar, Border, ListHeader, Skeleton(블러), TextButton, BottomCTA, Button
보상형 광고(R1): "광고 보고 전체 분석 보기" → Rewarded Ad 시청 → Skeleton 해제 → 1회 열기
이탈 안전망: "기록 시작하기" → dashboard (무료 진입 보장)
행동 유형 Badge 규칙: 프론트엔드 규칙 엔진 (Step 6 응답 기반)
┌─────────────────────────┐
│ [✕] │ ← Navbar.CloseButton ("나중에")
├─────────────────────────┤
│ │
│ ┌─────────┐ │
│ │ 🔔 │ │ ← Asset(type="lottie", 벨 애니메이션)
│ │ (Lottie)│ │
│ └─────────┘ │
│ │
│ "반려견의 변화를 │ ← Text(heading)
│ 놓치지 마세요" │
│ │
│ "중요한 알림만 보내 │ ← Text(subtitle, muted)
│ 드릴게요" │
│ │
│ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ │ ← Border
│ │
│ ┌───────────────────┐ │
│ │ ☑ 훈련 리마인더 │ │ ← Checkbox(checked=true)
│ │ 매일 설정한 시간 │ │ "매일 훈련 시간 알림"
│ │ [오전 9시 ▾] │ │ ← Dropdown(options=시간, default="오전 9시")
│ ├───────────────────┤ │
│ │ ☑ 행동 급증 알림 │ │ ← Checkbox(checked=true)
│ │ 평소보다 문제행동 │ │ "문제행동 급증 시 알림"
│ │ 이 많을 때 │ │
│ ├───────────────────┤ │
│ │ ☐ 프로모션/팁 │ │ ← Checkbox(checked=false)
│ │ 할인·이벤트 소식 │ │ "프로모션 알림 (선택)"
│ └───────────────────┘ │
│ │
├─────────────────────────┤
│ ┌───────────────────┐ │
│ │ 허용하기 │ │ ← BottomCTA > Button(primary)
│ └───────────────────┘ │
│ TextButton("나중에") │ ← TextButton → dashboard (건너뛰기)
└─────────────────────────┘
사용 컴포넌트: Navbar(.CloseButton), Asset(Lottie), Checkbox × 3, Dropdown, Border, BottomCTA, Button, TextButton
로직: "허용" → OS 푸시 권한 요청 + Smart Message 등록 API → dashboard
기본값: 리마인더/급증 ON, 프로모션 OFF (옵트인 원칙)
Smart Message: Title 13자, Body 20자 제한 (Toss S2S API 규격)
┌─────────────────────────┐
│ ← TailLog PRO │ ← Navbar(.BackButton, .Title)
├─────────────────────────┤
│ ScrollView │
│ │
│ ┌───────────────────┐ │
│ │ Top │ │ ← Top(title, subtitle)
│ │ "더 정확한 AI 코칭, │ │
│ │ 더 빠른 변화" │ │
│ └───────────────────┘ │
│ │
│ ┌───────────────────┐ │
│ │ 무료 vs PRO 비교 │ │ ← ListHeader
│ ├───────────────────┤ │
│ │ AI 코칭 3회/월 │ │ ← TableRow(label, value)
│ │ 무제한 ✓ │ │ PRO 쪽 Badge("무제한")
│ ├───────────────────┤ │
│ │ 행동 분석 기본 │ │ ← TableRow
│ │ 심층 ✓ │ │
│ ├───────────────────┤ │
│ │ 훈련 커리큘럼 기본 │ │ ← TableRow
│ │ 전체 ✓ │ │
│ ├───────────────────┤ │
│ │ PDF 리포트 ✕ │ │ ← TableRow
│ │ ✓ │ │
│ ├───────────────────┤ │
│ │ 광고 없음 ✕ │ │ ← TableRow
│ │ ✓ │ │
│ └───────────────────┘ │
│ │
│ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ │ ← Border
│ │
│ ┌───────────────────┐ │
│ │ [월간] [토큰팩] │ │ ← SegmentedControl(2 segments)
│ └───────────────────┘ │
│ │
│ ┌───────────────────┐ │
│ │ 개인 PRO 월간 │ │ ← BoardRow + Badge("인기")
│ │ ₩4,900/월 │ │
│ │ Badge: "인기" │ │
│ ├───────────────────┤ │
│ │ 토큰팩 30회 │ │ ← BoardRow
│ │ ₩4,900 (1회=₩163) │ │
│ └───────────────────┘ │
│ │ (B2B 플랜: v1 숨김, Wave 3 게이트 이후) │
│ │
│ ListFooter: │ ← ListFooter
│ "구독은 언제든 해지 가 │
│ 능합니다. 토스 앱 내 │
│ 결제로 안전합니다." │
│ │
│ TextButton("이전 구매 복원") │ ← 복원구매
│ │
│ [기존 구독자 시] │
│ 현재 플랜 Badge + "해지" │ ← Badge + TextButton
│ │
├─────────────────────────┤
│ ┌───────────────────┐ │
│ │ 구독하기 │ │ ← BottomCTA > Button(primary)
│ └───────────────────┘ │ → Toss IAP 결제 플로우
└─────────────────────────┘
사용 컴포넌트: Navbar(.BackButton, .Title), Top, ListHeader, TableRow × 5, Border, SegmentedControl, BoardRow × 2, Badge("인기"), ListFooter, TextButton(복원구매, 해지), BottomCTA, Button
IAP 로직: "구독하기" → Toss IAP SDK → 결제 성공 → Edge Function verify-iap-order → 권한 갱신
복원구매: "이전 구매 복원" → Toss IAP restorePurchases() → 기존 구독 복원
기존 구독자: 현재 플랜 Badge 표시 + "해지" TextButton (→ Toss IAP 해지 플로우)
B2B 자동 전환: v1 기본 숨김. Wave 3(B2B Expansion) 게이트 통과 후 B2B 플랜(훈련사 PRO ₩19,900/월, 센터 PRO ₩49,900/월) 별도 릴리즈
구독 만료: role 유지, 기록/리포트 생성 차단, 기존 데이터 열람 30일 유예
┌─ useBottomSheet ────────┐
│ │
│ ┌───────────────────┐ │
│ │ 반려견 선택 │ │ ← ListHeader
│ └───────────────────┘ │
│ │
│ ┌───────────────────┐ │
│ │ 🐕 뽀삐 │ │ ← ListRow(.Icon, .Texts)
│ │ 비숑 · 3살 │ │ Badge("선택", variant="success")
│ │ Badge: "선택" ✓ │ │
│ ├───────────────────┤ │
│ │ 🐕 초코 │ │ ← ListRow(.Icon, .Texts)
│ │ 푸들 · 5살 │ │
│ ├───────────────────┤ │
│ │ 🐕 루비 │ │ ← ListRow(.Icon, .Texts)
│ │ 골든 · 2살 │ │
│ └───────────────────┘ │
│ │
│ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ │ ← Border
│ │
│ ┌───────────────────┐ │
│ │ + 반려견 추가 │ │ ← ListRow → dog-add 화면
│ └───────────────────┘ │
│ │
└─────────────────────────┘
사용 컴포넌트: useBottomSheet, ListHeader, ListRow(.Icon, .Texts) × N, Badge(variant="success"), Border, ListRow(추가 버튼)
로직: 반려견 선택 → active_dog_id 업데이트 → 바텀시트 닫기 → 대시보드 갱신
추가: "+ 반려견 추가" → dog-add 화면 (survey 축소판: 이름+품종+나이)
최대: 무료 1마리, PRO 최대 5마리
삭제: dog-profile 내 "반려견 삭제" 버튼으로 처리 (switcher에서는 삭제 없음)
┌─────────────────────────┐
│ ← 산책 훈련 Day 3 │ ← Navbar(.BackButton, .Title)
├─────────────────────────┤
│ ■■■■■■□□□□ 60% │ ← ProgressBar(value=0.6)
├─────────────────────────┤
│ ScrollView │
│ │
│ ┌───────────────────┐ │
│ │ [Asset: 가이드] │ │ ← Asset(type="image" 또는 "video")
│ │ │ │ 훈련 가이드 영상/이미지
│ │ ▶ 영상 보기 │ │
│ └───────────────────┘ │
│ │
│ ┌───────────────────┐ │
│ │ 📋 오늘의 미션 │ │ ← ListHeader
│ ├───────────────────┤ │
│ │ ☑ 리드 길이 조절 │ │ ← Checkbox(checked=true)
│ │ 산책 시작 시 │ │
│ ├───────────────────┤ │
│ │ ☑ 앉아 5초 유지 │ │ ← Checkbox(checked=true)
│ │ 교차로에서 │ │
│ ├───────────────────┤ │
│ │ ☐ 다른 강아지 반응 │ │ ← Checkbox(checked=false)
│ │ 관찰 기록 │ │
│ ├───────────────────┤ │
│ │ ☐ 보상 타이밍 연습 │ │ ← Checkbox(checked=false)
│ │ 1초 이내 간식 │ │
│ └───────────────────┘ │
│ │
│ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ │ ← Border
│ │
│ TextButton: │ ← "이 훈련이 어려워요"
│ "이 훈련이 어려워요" │ → 바텀시트(Plan B/C 교체)
│ │
│ ┌─ Plan B/C 바텀시트 ─┐│ ← useBottomSheet
│ │ "대체 미션 제안" ││ Plan B: 정적 데이터
│ │ ││ Plan C: AI 동적 생성(PRO)
│ │ ○ Plan A (현재) ││
│ │ ● Plan B (쉬운 버전) ││ ← Radio selection
│ │ ○ Plan C (AI 맞춤) ││ PRO Badge
│ │ ││
│ │ [적용하기] ││ ← Button
│ └─────────────────────┘│
│ │
│ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ │ ← Border
│ │
│ ┌───────────────────┐ │
│ │ 📝 메모 │ │ ← ListHeader
│ │ ┌─────────────────┐│ │
│ │ │오늘 산책 중에... ││ │ ← TextField(multiline, placeholder=
│ │ │ ││ │ "오늘 훈련 소감을 남겨주세요")
│ │ │ ││ │
│ │ └─────────────────┘│ │
│ └───────────────────┘ │
│ │
├─────────────────────────┤
│ ┌───────────────────┐ │
│ │ 미션 완료 ✓ │ │ ← BottomCTA > Button(primary)
│ └───────────────────┘ │ → training_progress 업데이트
└─────────────────────────┘
사용 컴포넌트: Navbar(.BackButton, .Title), ProgressBar, Asset(image/video), ListHeader × 2, Checkbox × N, Border, TextButton, useBottomSheet, Radio, TextField(multiline), BottomCTA, Button
로직: 체크리스트 체크 → 로컬 상태 관리, "미션 완료" → training_progress 업데이트 + 다음 Day 잠금 해제
알림장 사진: Asset 자리 확보 (서버 아키텍처 결정 후 이미지 업로드 추가)
기존 9-3 와이어프레임에 아래 콘텐츠 블록 명세를 추가한다.
┌─────────────────────────┐
│ 테일로그 [🐕▾] [🔔][⚙️] │ ← Navbar + 반려견 선택(→dog-switcher)
├─────────────────────────┤
│ [기록] [분석] [훈련●] │ ← Tab(3탭, B2B는 +[운영])
├─────────────────────────┤
│ │
│ ┌───────────────────┐ │ ← ① 오늘의 AI 코칭
│ │ 🤖 오늘의 코칭 │ │ ListHeader + Asset
│ │ │ │
│ │ [무료] ┄┄┄┄┄┄┄┄┄ │ │ 무료: Skeleton 블러
│ │ TextButton: │ │ + TextButton("광고 보고 코칭 열기")
│ │ "광고 보고 코칭 │ │ → 토스 Rewarded 시청 → 1회 해제
│ │ 열기" │ │
│ │ ─── 또는 ─── │ │
│ │ [PRO] "오늘은 산책 │ │ PRO: 전체 텍스트 표시
│ │ 시 리드 길이를..." │ │
│ └───────────────────┘ │
│ │
│ ┌───────────────────┐ │ ← ② 연속 기록 스트릭
│ │ 🔥 7일 연속 기록! │ │ Badge(variant="success")
│ │ Badge: "7일 연속" │ │
│ └───────────────────┘ │
│ │
│ ┌───────────────────┐ │ ← ③ 최근 ABC 기록
│ │ 📋 최근 기록 │ │ ListHeader
│ ├───────────────────┤ │
│ │ 짖음 · 산책 중 │ │ ListRow × 5 (최대)
│ │ 14:30 Badge:높음 │ │ Badge(variant="danger"/"info"/"warning")
│ ├───────────────────┤ │
│ │ 점프 · 손님 방문 │ │
│ │ 10:15 Badge:보통 │ │
│ ├───────────────────┤ │
│ │ ... (최대 5건) │ │
│ └───────────────────┘ │
│ │
│ [0건 시: EmptyState] │ ← EmptyState("첫 기록을 남겨보세요")
│ │
├─────────────────────────┤
│ ┌───────────────────┐ │ ← ④ 빠른 기록 CTA
│ │ + 빠른 기록 │ │ BottomCTA > Button(primary)
│ └───────────────────┘ │ → quick-log 바텀시트
└─────────────────────────┘
상태 분기:
| 상태 | 조건 | UI |
|---|---|---|
| 로딩 | 데이터 패칭 중 | Skeleton(pattern="topList") 전체 |
| 0건 | 기록 없음 | EmptyState("첫 기록을 남겨보세요", icon="pencil") |
| 1-2건 | 기록 부족 | 기록 목록 + "3건 이상 기록하면 AI 분석 시작!" 안내 |
| 3건+ | AI 활성 | 전체 4블록 표시 |
| 에러 | API 실패 | ErrorState(retryButton) |
멀티독: 헤더 반려견 이름 탭 → dog-switcher 바텀시트 → 선택 → 대시보드 전체 갱신 [훈련] 탭 Badge: dot ● = 미완료 미션 표시 (오늘의 미션 남아있을 때 활성)
기존 9-4 와이어프레임을 2탭 통합 구조로 보강한다.
┌─ useBottomSheet ────────────────────┐
│ │
│ ┌─────────────────────────────┐ │
│ │ 빠른 기록 │ │ ← ListHeader
│ └─────────────────────────────┘ │
│ │
│ ┌──────────┬──────────┐ │
│ │ [빠른] │ [상세] │ │ ← SegmentedControl(2 segments)
│ └──────────┴──────────┘ │
│ │
│ ═══ 빠른 탭 (기본) ═══ │
│ │
│ ┌─────────────────────────────┐ │
│ │ 🚨 행동 문제 │ │ ← ListHeader
│ │ │ │
│ │ [짖음/울음] [공격성] │ │ ← Chip × 8 (원탭 = 즉시 저장)
│ │ [분리불안] [파괴행동] │ │ intensity=3 고정
│ │ [마운팅] [과잉흥분] │ │ 서베이 카테고리 동일
│ │ [배변문제] [공포/회피] │ │
│ │ [+ 기타] │ │
│ └─────────────────────────────┘ │
│ │
│ ┌─────────────────────────────┐ │
│ │ 📋 일상 활동 │ │ ← ListHeader
│ │ │ │
│ │ [산책] [놀이] [식사] │ │ ← Chip × 6 (탭 시 서브옵션 확장)
│ │ [컨디션] [이상징후] [사회성] │ │
│ │ │ │
│ │ ┌ 산책 서브옵션 (확장) ──┐ │ │ ← 인라인 서브칩 (선택 시 표시)
│ │ │ [10분] [20분] [30분] │ │ │ 서브칩 선택 = 저장
│ │ │ [60분+] │ │ │
│ │ └──────────────────────┘ │ │
│ └─────────────────────────────┘ │
│ │
│ ═══ 상세 탭 ═══ │
│ │
│ ┌─────────────────────────────┐ │
│ │ 행동(B) *필수 │ │ ← TextField(label="행동", required)
│ │ ┌─────────────────────┐ │ │ 항상 표시 (접이식 아님)
│ │ │ 어떤 행동을 했나요? │ │ │
│ │ └─────────────────────┘ │ │
│ └─────────────────────────────┘ │
│ │
│ ┌─────────────────────────────┐ │
│ │ ▶ 선행(A) [펼치기] │ │ ← 접이식(Accordion)
│ │ ┌─────────────────────┐ │ │ 칩 프리셋(설문 기반 동적 로드)
│ │ │ [산책중] [손님방문] │ │ │ + 기타 TextField
│ │ │ [혼자있을때] [기타] │ │ │
│ │ └─────────────────────┘ │ │
│ └─────────────────────────────┘ │
│ │
│ ┌─────────────────────────────┐ │
│ │ ▶ 결과(C) [펼치기] │ │ ← 접이식(Accordion)
│ │ ┌─────────────────────┐ │ │ 칩 프리셋 + 기타 TextField
│ │ │ [진정됨] [계속함] │ │ │
│ │ │ [악화] [기타] │ │ │
│ │ └─────────────────────┘ │ │
│ └─────────────────────────────┘ │
│ │
│ ┌─────────────────────────────┐ │
│ │ ▶ 강도/시간 [펼치기] │ │ ← 접이식(Accordion)
│ │ 강도: ────●──── 7/10 │ │ Slider(min=1, max=10)
│ │ 날짜: 오늘 · 시간: 지금 │ │ ← 자동 기본값
│ │ TextButton("변경") │ │ ← 확장 시:
│ │ [오늘/어제/날짜선택] │ │ SegmentedControl
│ │ 시간 [오전/오후] + 시 │ │ Dropdown + NumericSpinner
│ └─────────────────────────────┘ │
│ │
│ ┌─────────────────────────────┐ │
│ │ 저장 │ │ ← Button(primary)
│ └─────────────────────────────┘ │
│ │
└─────────────────────────────────────┘
사용 컴포넌트: useBottomSheet, ListHeader, SegmentedControl, Badge(Chip 역할), TextField, Slider, Button
빠른 탭 UX:
behavior="산책 20분" 자유 텍스트. type_id(미사용)를 카테고리 구분자로 활용 가능기존 9-6 와이어프레임을 **진단 중심(A 타입)**으로 재정의한다.
┌─────────────────────────┐
│ ← AI 행동 진단 │ ← Navbar(.BackButton, .Title)
├─────────────────────────┤
│ ScrollView │
│ │
│ ┌───────────────────┐ │ ← [상단] 패턴 요약 (insight)
│ │ [Asset: AI 아이콘] │ │ Asset + Text
│ │ │ │
│ │ "뽀삐의 짖음은 │ │
│ │ 분리불안 패턴과 │ │
│ │ 일치합니다. │ │
│ │ 혼자 있을 때 │ │
│ │ 불안이 높아지는 │ │
│ │ 전형적 양상입니다."│ │
│ └───────────────────┘ │
│ │
│ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ │ ← Border
│ │
│ ┌───────────────────┐ │ ← [중단] 교정 프로토콜 (action_plan)
│ │ 📋 3단계 교정 │ │ ListHeader
│ │ 프로토콜 │ │
│ ├───────────────────┤ │
│ │ Step 1 │ │ ListRow + Badge("1단계")
│ │ 탈감작 훈련 │ │ "매일 5분 혼자 있기 연습"
│ │ Badge: "1단계" │ │
│ ├───────────────────┤ │
│ │ Step 2 │ │ ListRow + Badge("2단계")
│ │ 안전 공간 만들기 │ │
│ │ Badge: "2단계" │ │
│ ├───────────────────┤ │
│ │ Step 3 │ │ ListRow + Badge("3단계")
│ │ 보상 체계 확립 │ │
│ │ Badge: "3단계" │ │
│ └───────────────────┘ │
│ │
│ ┌───────────────────┐ │ ← [중단] 반려견 시점 (dog_voice)
│ │ 🐕 뽀삐의 마음 │ │ ListHeader + 말풍선 스타일
│ │ │ │
│ │ ┌─ 말풍선 ──────┐ │ │ Shadow + Border(radius)
│ │ │"혼자 있으면 │ │ │
│ │ │ 불안해요. │ │ │
│ │ │ 보호자가 돌아 │ │ │
│ │ │ 올 거라는 걸 │ │ │
│ │ │ 알려주세요." │ │ │
│ │ └───────────────┘ │ │
│ └───────────────────┘ │
│ │
│ ═══ 잠금 영역 (PRO/광고) ═══ │
│ │
│ ┌───────────────────┐ │ ← ④ [중단] 7일 훈련 계획 (next_7_days_plan)
│ │ 📅 7일 훈련 계획 │ │ ListHeader
│ ├───────────────────┤ │
│ │ Day 1: 5분 혼자 │ │ ListRow × 7
│ │ Day 2: 10분 혼자 │ │
│ │ Day 3: 산책 훈련 │ │
│ │ ... │ │
│ │ Day 7: 종합 테스트 │ │
│ │ ┄┄┄┄┄┄┄┄┄┄┄┄┄┄┄ │ │ ← Skeleton 블러 (무료 유저)
│ └───────────────────┘ │
│ │
│ │ TextButton: │ │ ← "다른 접근 방식 보기"
│ │ "다른 접근 방식 │ │ → Plan B/C 바텀시트
│ │ 보기" │ │ (현재/대안1/대안2)
│ │
│ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ │ ← Border
│ │
│ ┌───────────────────┐ │ ← ⑤ [하단] 위험 신호 (risk_signals)
│ │ ⚠️ 위험 신호 │ │ ListHeader
│ │ │ │
│ │ Badge:"자해 행동" │ │ Badge(variant="danger") × N
│ │ Badge:"공격성 증가"│ │
│ │ │ │
│ │ "아래 신호가 보이면 │ │ Text(muted)
│ │ 즉시 전문가 상담을 │ │
│ │ 권합니다." │ │
│ │ ┄┄┄┄┄┄┄┄┄┄┄┄┄┄┄ │ │ ← Skeleton 블러 (무료 유저)
│ └───────────────────┘ │
│ │
│ ┌───────────────────┐ │ ← ⑥ [하단] 전문가 상담 질문 (consultation_questions)
│ │ 💬 전문가에게 │ │ ListHeader
│ │ 물어보세요 │ │
│ ├───────────────────┤ │
│ │ "분리불안 탈감작 │ │ ListRow × 3
│ │ 속도를 어떻게 │ │
│ │ 조절하나요?" │ │
│ ├───────────────────┤ │
│ │ "약물 치료 병행이 │ │
│ │ 필요한 수준 │ │
│ │ 인가요?" │ │
│ │ ┄┄┄┄┄┄┄┄┄┄┄┄┄┄┄ │ │ ← Skeleton 블러 (무료 유저)
│ └───────────────────┘ │
│ │
│ ┌───────────────────┐ │ ← [무료 유저 전용] 잠금 해제 CTA
│ │ TextButton: │ │ TextButton("광고 보고 오늘의 코칭 열기")
│ │ "광고 보고 오늘의 │ │ → Rewarded Ad → 1회 잠금 해제
│ │ 코칭 열기" │ │
│ └───────────────────┘ │
│ │
├─────────────────────────┤
│ ┌───────────────────┐ │
│ │ 훈련 시작하기 │ │ ← BottomCTA > Button(primary)
│ └───────────────────┘ │ → training-academy
│ TextButton("PDF 리포트 │ ← TextButton → PRO 전용 (무료: subscription)
│ 다운로드(PRO)") │
└─────────────────────────┘
사용 컴포넌트: Navbar(.BackButton, .Title), ScrollView, Asset, ListHeader × 6, ListRow × N, Badge(1단계/2단계/3단계/danger), Shadow, Border, Skeleton(블러), TextButton, BottomCTA, Button
데이터 구조 (Edge Function generate-coaching 응답):
insight: 패턴 요약 텍스트action_plan: 3단계 교정 프로토콜 배열dog_voice: 반려견 시점 메시지next_7_days_plan: 7일 훈련 계획 배열risk_signals: 위험 신호 태그 배열consultation_questions: 전문가 상담 질문 배열잠금 영역: ①insight, ②action_plan, ③dog_voice = 무료 공개 / ④next_7_days_plan, ⑤risk_signals, ⑥consultation_questions = 잠금(Skeleton 블러). 광고 1회 또는 PRO로 해제 Plan B/C: "다른 접근 방식 보기" → 바텀시트(현재 Plan A / 대안1 Plan B / 대안2 Plan C). Plan C = PRO 전용 AI 동적 생성 보상형 광고(R3): "광고 보고 오늘의 코칭 열기" → Rewarded Ad → Skeleton 해제 → 1회 열기 PDF 리포트: PRO 전용. 무료 유저는 TextButton 탭 시 subscription 화면으로 이동
기존 9-10 와이어프레임에 B2B 기록 UX 상세를 추가한다.
┌─────────────────────────┐
│ Ops 대시보드 [👤 역할] │ ← Navbar(.Title) + Badge(role)
├─────────────────────────┤
│ [미기록] [주의필요] │ ← Tab(4개 탭, B2B PRD)
│ [리포트미발송] [내담당] │
├─────────────────────────┤
│ ┌───────────────────┐ │
│ │ 🐕 뽀삐 / 김지영 │ │ ← ListRow(.Icon, .Texts)
│ │ "짖음 문제" │ │ Badge("긴급", variant="danger")
│ │ 14:30 접수 │ │ 탭 → 개별 기록 모달
│ └───────────────────┘ │
│ ┌───────────────────┐ │
│ │ 🐕 초코 / 박민수 │ │
│ │ ... │ │
│ └───────────────────┘ │
│ │
│ FlatList (무한 스크롤) │ ← Loader
│ │
│ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ │ ← Border
│ │
│ [일괄 기록 모드] │ ← TextButton → 벌크 모드 활성화
│ │
│ 총 12건 / 오늘 완료 5건 │ ← BottomInfo
└─────────────────────────┘
═══ 개별 기록 모달 (useBottomSheet) ═══
┌─ useBottomSheet ────────────────────┐
│ │
│ 🐕 뽀삐 · 김지영 │ ← ListRow
│ │
│ ┌──────────┬──────────┐ │
│ │ [프리셋] │ [ABC기록] │ │ ← SegmentedControl
│ └──────────┴──────────┘ │
│ │
│ ═══ 프리셋 탭 ═══ │
│ │
│ [산책] [놀이] [컨디션] │ ← Chip × 5 (원탭 = 즉시 저장)
│ [식사] [투약] │ 키보드 불필요, 3초 완료
│ │
│ ═══ ABC 기록 탭 ═══ │
│ │
│ 선행(A): ┌───────────────┐ │ ← TextField
│ │ │ │
│ └───────────────┘ │
│ 행동(B): ┌───────────────┐ │ ← TextField
│ │ │ │
│ └───────────────┘ │
│ 결과(C): ┌───────────────┐ │ ← TextField
│ │ │ │
│ └───────────────┘ │
│ │
│ 강도: [낮음] [보통] [높음] │ ← SegmentedControl
│ │
│ 행동 이슈 태그 (복수 선택): │ ← Checkbox × N
│ ☑ 짖음 ☐ 점프 ☑ 파괴 │ 문제행동 다중 태깅
│ ☐ 물기 ☐ 배변 ☐ 기타 │
│ │
│ ┌─────────────────────────────┐ │
│ │ 저장 │ │ ← Button(primary)
│ └─────────────────────────────┘ │
└─────────────────────────────────────┘
═══ 벌크 모드 ═══
┌─ useBottomSheet ────────────────────┐
│ │
│ 일괄 기록 │ ← ListHeader
│ │
│ 반려견 선택: │
│ ☑ 뽀삐 ☑ 초코 ☐ 루비 │ ← Checkbox × N (다견 선택)
│ ☑ 몽이 ☐ 하니 │
│ │
│ 카테고리: │
│ [산책] [식사] [컨디션] │ ← Chip (일괄 적용)
│ │
│ ┌─────────────────────────────┐ │
│ │ 일괄 저장 │ │ ← Button(primary)
│ └─────────────────────────────┘ │
│ │
│ 선택 3마리 × 산책 일괄 저장 │ ← BottomInfo
└─────────────────────────────────────┘
사용 컴포넌트: Navbar(.Title), Badge(role), Tab, ListRow, FlatList, Loader, Border, TextButton, BottomInfo, useBottomSheet, SegmentedControl, Badge(Chip), TextField, Checkbox, Button
기록 UX 목표:
role IN ('trainer', 'org_owner', 'org_staff') RLS 정책 필수Result 컴포넌트 기반┌───────────────────────────┐
│ │
│ [Asset] │ ← Asset(icon/lottie)
│ │
│ "아직 기록이 없어요" │ ← Result(title)
│ │
│ "첫 기록을 남기면 │ ← Result(description)
│ AI 분석이 시작돼요" │
│ │
│ ┌───────────────────┐ │
│ │ 기록 시작하기 │ │ ← Button(primary) — 선택적 CTA
│ └───────────────────┘ │
│ │
└───────────────────────────┘
4가지 컨텍스트:
| 컨텍스트 | title | description | CTA |
|---|---|---|---|
| 기록 없음 | "아직 기록이 없어요" | "첫 기록을 남기면 AI 분석이 시작돼요" | "기록 시작하기" → quick-log |
| 분석 부족 | "데이터가 부족해요" | "3건 이상 기록하면 분석이 가능해요" | "기록하러 가기" → quick-log |
| 코칭 없음 | "아직 AI 코칭이 없어요" | "행동 기록을 쌓으면 맞춤 코칭을 받을 수 있어요" | "기록 남기기" → quick-log |
| 훈련 미시작 | "훈련을 시작해보세요" | "AI 코칭 기반 맞춤 훈련 커리큘럼이에요" | "코칭 먼저 받기" → analysis |
사용 컴포넌트: Result(icon, title, description), Button(선택적)
ErrorPage 컴포넌트 기반┌───────────────────────────┐
│ │
│ [Asset] │ ← Asset(error icon)
│ │
│ "연결에 실패했어요" │ ← ErrorPage(title)
│ │
│ "네트워크 상태를 │ ← ErrorPage(description)
│ 확인해주세요" │
│ │
│ ┌───────────────────┐ │
│ │ 다시 시도 │ │ ← ErrorPage(retryButton)
│ └───────────────────┘ │
│ │
└───────────────────────────┘
4가지 에러 타입:
| 에러 | title | description | 액션 |
|---|---|---|---|
| 네트워크 오류 | "연결에 실패했어요" | "네트워크 상태를 확인해주세요" | retryButton("다시 시도") |
| 인증 만료 | "로그인이 필요해요" | "세션이 만료되었습니다" | Button("다시 로그인") → login |
| API 실패 | "일시적인 오류예요" | "잠시 후 다시 시도해주세요" | retryButton("다시 시도") |
| mTLS 장애 | "서비스 점검 중이에요" | "빠르게 복구하겠습니다" | 없음 (자동 재시도) |
사용 컴포넌트: ErrorPage(title, description, retryButton)
모든 화면 전환은 아래 Guard 체인을 순서대로 통과해야 한다:
authGuard → onboardingGuard → featureGuard → roleGuard
| Guard | 검사 대상 | 실패 시 리다이렉트 |
|---|---|---|
authGuard | Supabase 세션 존재 여부 | → login |
onboardingGuard | 설문 완료 여부 (dogs 테이블 존재) | → welcome → survey |
featureGuard | PRO 기능 접근 시 구독 상태 | → subscription (또는 Skeleton 블러) |
roleGuard | B2B 화면 접근 시 역할 검사 | → ErrorPage("권한 없음") |
Smart Message나 외부 링크로 앱에 진입할 때:
| 딥엔트리 | 대상 화면 | Guard 체인 | 설명 |
|---|---|---|---|
quick-log | quick-log 바텀시트 | auth → onboarding | 빠른 기록 직접 진입 |
daily-coach | coaching-result | auth → onboarding → feature | 오늘의 AI 코칭 |
training-today | training-detail | auth → onboarding | 오늘의 훈련 미션 |
| # | 출발 | 도착 | 트리거 | 애니메이션 | Guard |
|---|---|---|---|---|---|
| 1 | login | welcome | 로그인 성공 (첫 방문) | → slide right | auth |
| 2 | login | dashboard | 로그인 성공 (기존) | → slide right | auth + onboarding |
| 3 | welcome | survey | "시작하기" 탭 | → slide right | — |
| 4 | survey | survey (next step) | "다음" 탭 | → slide right | — |
| 5 | survey | survey (prev step) | BackButton | ← slide left | — |
| 6 | survey | survey-result | 7단계 완료 | → slide right | — |
| 7 | survey-result | notification | "기록 시작하기" | → slide right | — |
| 8 | notification | dashboard | "허용" 또는 "나중에" | → slide right | — |
| 9 | dashboard | quick-log | "+ 빠른 기록" CTA | ↑ bottom sheet | onboarding |
| 10 | quick-log | dashboard | 저장 완료 | ↓ close sheet | — |
| 11 | dashboard | analysis | [분석] 탭 | → tab switch | onboarding |
| 12 | dashboard | training-academy | [훈련] 탭 | → tab switch | onboarding |
| 13 | dashboard | ops-today | [운영] 탭 | → tab switch | role(trainer+) |
| 14 | dashboard | dog-switcher | 반려견 이름 탭 | ↑ bottom sheet | — |
| 15 | dashboard | settings | ⚙️ 아이콘 | → slide right | — |
| 16 | dashboard | coaching-result | "오늘의 코칭" 영역 탭 | → slide right | onboarding |
| 17 | analysis | coaching-result | "AI 코칭 보기" | → slide right | feature(3건+) |
| 18 | coaching-result | training-academy | "훈련 시작하기" | → slide right | — |
| 19 | coaching-result | subscription | "PDF 리포트(PRO)" | → slide right | — |
| 20 | training-academy | training-detail | 미션 카드 탭 | → slide right | — |
| 21 | training-detail | training-academy | "미션 완료" 또는 BackButton | ← slide left | — |
| 22 | training-detail | Plan B/C 바텀시트 | "이 훈련이 어려워요" | ↑ bottom sheet | — |
| 23 | coaching-result | Plan B/C 바텀시트 | "다른 접근 방식 보기" | ↑ bottom sheet | — |
| 24 | dog-switcher | dashboard | 반려견 선택 | ↓ close sheet | — |
| 25 | dog-switcher | dog-add | "+ 반려견 추가" | → slide right | — |
| 26 | dog-add | dashboard | 저장 완료 | ← pop to root | — |
| 27 | settings | subscription | "구독 관리" 탭 | → slide right | — |
| 28 | settings | dog-profile | "프로필 편집" 탭 | → slide right | — |
| 29 | settings | login | "로그아웃" 확인 | → replace | — |
| 30 | subscription | dashboard | IAP 결제 성공 | ← pop to root | — |
| 31 | ops-today | 개별 기록 모달 | 반려견 행 탭 | ↑ bottom sheet | role(trainer+) |
| 32 | (어디서든) | PRO 업셀 시트 | Skeleton/잠금 영역 탭 | ↑ bottom sheet | — |
| 33 | PRO 업셀 시트 | subscription | "자세히 보기" | → slide right | — |
| 단계 | 구현 | 화면 |
|---|---|---|
| Trigger (외부/내부) | Smart Message 푸시, 스트릭 알림, 행동 급증 알림 | notification → dashboard |
| Action (최소 행동) | 빠른 탭 원탭 기록 (2초), 서브옵션 포함 5초 | quick-log |
| Variable Reward | AI 코칭 결과 변화, 스트릭 뱃지 갱신, 트렌드 차트 변동 | dashboard, coaching-result |
| Investment (자산 축적) | 기록 데이터 축적, 훈련 진행률, 커스텀 프리셋 | quick-log, training-detail |
배너/전면 광고 없음. 보상형 광고만 사용.
| ID | 터치포인트 | 화면 | CTA 텍스트 | 보상 |
|---|---|---|---|---|
| R1 | 설문 결과 상세 리포트 | survey-result | "광고 보고 전체 분석 보기" | 상세 리포트 1회 잠금 해제 |
| R2 | 오늘의 AI 코칭 | dashboard | "광고 보고 코칭 열기" | 오늘의 코칭 1회 열기 |
| R3 | 심층 행동 분석 | coaching-result | "광고 보고 오늘의 코칭 열기" | 심층 분석 1회 열기 |
광고 SDK: 토스 Ads SDK 2.0 Rewarded 우선. AdMob 폴백은 토스 SDK 공식 지원 범위에서만 허용(미지원 시 무광고 폴백). 테스트 ID: ait-ad-test-rewarded-id
전환 심리: "매번 광고 보기 귀찮다 → 구독하자" → 자연스러운 PRO 전환
| ID | 트리거 | 위치 | 전환 대상 |
|---|---|---|---|
| C1 | 설문 완료 후 Skeleton 노출 | survey-result | PRO 또는 광고(R1) |
| C2 | AI 코칭 잠금 | dashboard | PRO 또는 광고(R2) |
| C3 | 심층 분석 잠금 | coaching-result | PRO 또는 광고(R3) |
| C4 | PDF 리포트 탭 | coaching-result | PRO (구독 전용) |
| C5 | 훈련 커리큘럼 잠금 미션 | training-academy | PRO |
| C6 | 토큰 소진 | (어디서든) | 토큰팩 구매 또는 PRO |
| C7 | 광고 3회+ 시청 후 | (어디서든) | PRO ("광고 없이 이용하세요") |
| 메커니즘 | 설명 | 화면 | 타이밍 |
|---|---|---|---|
| Streak | "🔥 N일 연속 기록 중!" 뱃지 | dashboard | 기록 저장 시 즉시 갱신 |
| 포인트 | Toss Points 연동 (프로모션 API) | dashboard | 주간 목표 달성 시 |
| 급증 알림 | "오늘 짖음이 평소의 2배!" | Smart Message → dashboard | 일일 집계 후 |
| 훈련 리마인더 | "오늘의 훈련: 산책 Day 3" | Smart Message → training-detail | 설정 시간 |
| 비활성 재참여 | "뽀삐가 기다리고 있어요" | Smart Message → dashboard | 3일 미접속 |
| 진행 축하 | "첫 번째 훈련 과정 완료!" | Toast + 뱃지 | 마일스톤 달성 |
| 모드 | 탭 구성 | 활성화 조건 |
|---|---|---|
| B2C (일반 사용자) | [기록] [분석] [훈련] | 기본 |
| B2B (트레이너/관리자) | [기록] [분석] [훈련] [운영] | role IN ('trainer', 'org_owner', 'org_staff') |
| 여정 | 화면 수 | 목표 시간 | 핵심 지표 | 성공 기준 |
|---|---|---|---|---|
| A: Cold Start | 6 | < 3분 | 설문→대시보드 도달률 | > 70% |
| B: Daily Loop | 3 | < 35초 | 일일 기록률, 스트릭 유지 | DAU 기록률 > 40% |
| C: Upgrade | 4 | < 2분 | 무료→PRO 전환율 | > 5% (30일) |
| D: Deep-Dive | 5 | 5-10분 | 분석→코칭→훈련 전환율 | > 30% |
| E: B2B Ops | 6+ | 10-30분 | 일일 기록 처리량, 리포트 발송 | > 10건/일 |
| F: Multi-Dog | 3 | < 10초 | 다견 전환 빈도 | 다견 유저 전환 > 2회/주 |
| 우선순위 | 화면 | Wave | 비고 |
|---|---|---|---|
| P0 | login, welcome, survey, survey-result, dashboard, quick-log | Wave 0-1 | Cold Start + Daily Loop 핵심 |
| P1 | analysis, coaching-result, training-academy, training-detail, notification | Wave 1 | Deep-Dive + 알림 |
| P2 | subscription, dog-profile, dog-switcher, dog-add, settings | Wave 2 | 수익화 + 프로필 관리 |
| P3 | ops-today | Wave 3 | B2B 운영 |
| P4 | EmptyState, ErrorState, 엣지 케이스 | Wave 4 | 폴리싱 + 안정화 |
Wave 간 의존성: