@su-record/vibe 2.9.2 → 2.9.3

package/skills/vibe.interview/checklists/mobile.md

@@ -0,0 +1,89 @@
+# Discovery Checklist: Mobile App
+
+> iOS/Android/크로스플랫폼 **네이티브 앱**. React Native, Flutter, Swift, Kotlin 등.
+
+## Required
+
+### R1. purpose
+**Q**: 이 모바일 앱으로 어떤 문제를 해결하시려 하나요?
+
+### R2. platforms
+**Q**: 어떤 플랫폼을 지원하나요?
+**힌트**: iOS만 / Android만 / 둘 다 / 웹+앱.
+**follow-up**: "우선 개발 플랫폼은?"
+
+### R3. target-users
+**Q**: 주요 사용자는 누구이며 언제 앱을 사용하나요?
+**힌트**: 사용 맥락(출퇴근, 운동 중, 여가, 업무 등)이 중요.
+
+### R4. core-features
+**Q**: 핵심 기능(Must)은 무엇인가요?
+**힌트**: 3-7개. MVP 범위로 압축.
+
+### R5. auth-method
+**Q**: 인증 방식은?
+**힌트**: 소셜 로그인, 애플 로그인(iOS 필수), 전화번호, 게스트 모드, 인증 없음.
+
+### R6. backend-need
+**Q**: 백엔드가 필요한가요?
+**힌트**: 100% 로컬 / BaaS(Firebase/Supabase) / 자체 백엔드 / 기존 API 사용.
+
+### R7. store-plan
+**Q**: 앱스토어 배포 계획이 있나요?
+**힌트**: App Store, Play Store, 사내 배포, TestFlight만.
+
+### R8. success-metric
+**Q**: 성공 기준은? (DAU, 리텐션, 리뷰 점수, 특정 액션 N회)
+
+## Optional
+
+### O1. offline-mode
+**Q**: 오프라인 동작이 필요한가요?
+**힌트**: 완전 오프라인 / 일부 기능 / 온라인 필수.
+
+### O2. push-notifications
+**Q**: 푸시 알림이 필요한가요?
+**힌트**: APNs, FCM, OneSignal.
+
+### O3. native-features
+**Q**: 어떤 네이티브 기능을 사용하나요?
+**힌트**: 카메라, 위치, 생체인증, HealthKit, 연락처, 블루투스, NFC.
+
+### O4. deep-linking
+**Q**: 딥링크/유니버설 링크가 필요한가요?
+
+### O5. in-app-purchase
+**Q**: 인앱 결제가 필요한가요?
+**힌트**: IAP(구독/소비성), 외부 결제 링크.
+
+### O6. analytics
+**Q**: 분석 도구는?
+**힌트**: Firebase Analytics, Amplitude, Mixpanel, PostHog.
+
+### O7. crash-reporting
+**Q**: 크래시 리포팅은?
+**힌트**: Sentry, Crashlytics, Bugsnag.
+
+### O8. accessibility
+**Q**: 접근성 요구사항은?
+**힌트**: VoiceOver(iOS), TalkBack(Android), Dynamic Type.
+
+### O9. dark-mode
+**Q**: 다크 모드 지원이 필요한가요?
+
+### O10. i18n
+**Q**: 다국어 지원이 필요한가요?
+
+### O11. device-orientation
+**Q**: 지원 디바이스 방향은?
+**힌트**: 세로 전용 / 가로 전용 / 둘 다 / 태블릿.
+
+### O12. min-os-version
+**Q**: 지원 최소 OS 버전은?
+
+### O13. app-size
+**Q**: 앱 용량 제한이 있나요?
+
+### O14. build-distribution
+**Q**: 빌드/배포 방식은?
+**힌트**: EAS, Fastlane, Xcode Cloud, CI/CD.

package/skills/vibe.interview/checklists/webapp.md

@@ -0,0 +1,97 @@
+# Discovery Checklist: Webapp
+
+> 대시보드, SaaS, 관리자 도구, 내부 도구 등 **상호작용/상태 기반 웹 애플리케이션**.
+
+## Required (반드시 수집)
+
+### R1. purpose
+**Q**: 이 웹앱으로 어떤 문제를 해결하시려고 하나요?
+**힌트**: 구체적 사용 시나리오 1개 이상.
+
+### R2. user-roles
+**Q**: 어떤 종류의 사용자가 있나요? (역할/권한 구분)
+**힌트**: 예) 관리자/일반사용자, 호스트/게스트, 판매자/구매자. 단일 역할이면 "단일".
+**follow-up**: 각 역할이 할 수 있는 일을 간단히.
+
+### R3. core-features
+**Q**: 핵심 기능을 우선순위 순으로 나열해주세요.
+**힌트**: Must/Should/Could로 구분. 최소 3개.
+**follow-up**: "첫 버전(MVP)에 반드시 있어야 할 것만 고르면 몇 개인가요?"
+
+### R4. data-model
+**Q**: 주요 데이터는 무엇인가요? (엔티티와 관계 대략)
+**힌트**: 예) User → Project → Task. ERD 수준의 정밀도는 불필요.
+
+### R5. auth-method
+**Q**: 인증 방식은?
+**힌트**: 이메일/비밀번호, 소셜(Google/Apple/GitHub), 매직 링크, Passkey, SSO, 인증 없음.
+**follow-up**: "MFA 필요하신가요?"
+
+### R6. tech-stack
+**Q**: 기술 스택 선호가 있나요?
+**힌트**: Frontend/Backend/DB. 기존 프로젝트면 그대로 유지.
+
+### R7. hosting-runtime
+**Q**: 어디서 실행되나요? (호스팅/런타임)
+**힌트**: Vercel, Fly, Railway, AWS, 자체 서버. Serverless vs 항상-on.
+
+### R8. success-metric
+**Q**: 성공 기준은? (DAU, 리텐션, 핵심 액션 N회 등)
+**힌트**: 측정 가능한 숫자.
+
+## Optional
+
+### O1. realtime-requirement
+**Q**: 실시간 기능이 필요한가요? (채팅, 알림, 협업 등)
+**힌트**: WebSocket/SSE/Polling 중 어느 수준.
+
+### O2. offline-support
+**Q**: 오프라인 지원이 필요한가요? (PWA, 로컬 동기화)
+
+### O3. notifications
+**Q**: 알림은 어떤 방식으로? (in-app, 이메일, 푸시, SMS)
+
+### O4. integrations
+**Q**: 외부 서비스 통합이 필요한가요?
+**힌트**: 결제(Stripe), 이메일(SendGrid/Resend), SMS(Twilio), 스토리지(S3), 검색(Algolia), AI(OpenAI).
+
+### O5. permission-model
+**Q**: 권한 모델이 복잡한가요? (RBAC, ABAC, 리소스 소유권)
+**힌트**: 예) "팀 단위 권한, 관리자가 역할 지정"
+
+### O6. data-retention
+**Q**: 데이터 보존/삭제 정책이 있나요?
+**힌트**: GDPR, 사용자 요청 삭제, 보관 기간.
+
+### O7. i18n
+**Q**: 다국어 지원이 필요한가요?
+
+### O8. accessibility
+**Q**: 접근성 목표는? (WCAG 레벨)
+
+### O9. performance-slo
+**Q**: 성능 목표(SLO)가 있나요?
+**힌트**: 예) p95 API 응답 < 300ms, 페이지 로드 < 2s.
+
+### O10. monitoring
+**Q**: 모니터링/로깅 도구는?
+**힌트**: Sentry, Datadog, Logflare, OpenTelemetry.
+
+### O11. analytics
+**Q**: 사용자 분석 도구가 필요한가요?
+**힌트**: PostHog, Mixpanel, Amplitude.
+
+### O12. test-strategy
+**Q**: 테스트 전략 선호가 있나요?
+**힌트**: unit/integration/e2e 중 어디에 무게.
+
+### O13. ci-cd
+**Q**: CI/CD 환경은?
+**힌트**: GitHub Actions, GitLab CI, Vercel Auto, 수동 배포.
+
+### O14. budget
+**Q**: 월 인프라 예산은?
+
+### O15. compliance
+**Q**: 법적/컴플라이언스 요구사항이 있나요?
+**힌트**: GDPR, HIPAA, SOC2, 개인정보보호법.

package/skills/vibe.interview/checklists/website.md

@@ -0,0 +1,99 @@
+# Discovery Checklist: Website
+
+> 랜딩, 포트폴리오, 프로모션, 브랜드, 회사 소개 등 **정보 전달형 웹사이트**.
+
+## Required (반드시 수집)
+
+### R1. purpose
+**Q**: 이 웹사이트를 왜 만드시나요? 어떤 목적인가요?
+**힌트**: 예) 신제품 런칭 프로모션, 개인 포트폴리오, 회사 소개, 이벤트 안내, 에이전시 showcase
+**follow-up**: 목적이 구체적이지 않으면 "런칭/브랜딩/전환/정보제공 중 어디에 가까운가요?"
+
+### R2. target-users
+**Q**: 주요 타깃 사용자는 누구인가요? (나이/관심사/상황 등)
+**힌트**: "누구나"는 지양. 구체적 페르소나 1-2명 확보.
+**follow-up**: "그분들은 보통 어떤 상황에서 이 사이트를 방문하게 되나요?"
+
+### R3. core-message
+**Q**: 방문자가 사이트를 떠날 때 단 한 문장만 기억한다면, 그건 무엇이어야 하나요?
+**힌트**: USP/핵심 가치제안.
+
+### R4. required-sections
+**Q**: 어떤 섹션이 필수인가요?
+**힌트**: 예) Hero, About, Features, Gallery, Testimonials, Contact, FAQ, CTA
+**follow-up**: 각 섹션이 달성해야 할 목적도 함께 확인.
+
+### R5. brand-tone
+**Q**: 브랜드 톤/무드는 어떻게 가고 싶으신가요?
+**힌트**: 예) 미니멀·시네마틱, 따뜻·아날로그, 모던·고급, 친근·활기, 전문·신뢰
+**follow-up**: "비슷한 느낌의 사이트가 있다면 URL 공유 가능한가요?"
+
+### R6. tech-constraints
+**Q**: 기술 제약이 있나요? (지원 브라우저, 성능 목표, 디바이스 등)
+**힌트**: 예) 최신 브라우저만, LCP < 2.5s, 모바일 우선, IE 지원 불필요
+**follow-up**: 기존 프로젝트면 CLAUDE.md/config.json 스택 확인.
+
+### R7. launch-timeline
+**Q**: 언제까지 런칭이 필요한가요?
+**힌트**: 정확한 날짜 또는 상대적 기간 (2주/1달/분기 내).
+
+### R8. success-metric
+**Q**: 이 웹사이트가 "성공했다"고 판단할 기준은 무엇인가요?
+**힌트**: 예) 월 방문자 N명, 이메일 수집 N건, 전환율 X%, 특정 버튼 클릭 N회
+
+## Optional (시간이 있으면 수집)
+
+### O1. reference-sites
+**Q**: 참고하고 싶은 레퍼런스 사이트가 있나요? (좋아하는 디자인/인터랙션)
+**힌트**: URL 2-3개.
+
+### O2. color-direction
+**Q**: 컬러 방향이 있나요? (다크/라이트, 주요 색상, 피해야 할 색)
+**힌트**: 브랜드 컬러가 있으면 HEX 값. 없으면 키워드.
+
+### O3. typography-preference
+**Q**: 타이포그래피 선호가 있나요? (serif/sans, 한글 폰트 등)
+
+### O4. animation-level
+**Q**: 애니메이션/인터랙션 강도는?
+**힌트**: 1-5 스케일. 1=정적, 3=가벼운 스크롤 효과, 5=풀스크린 인터랙티브.
+
+### O5. responsive-strategy
+**Q**: 디바이스 우선순위가 어떻게 되나요?
+**힌트**: desktop-first / mobile-first / equal priority.
+
+### O6. accessibility-level
+**Q**: 접근성 수준은?
+**힌트**: WCAG A / AA / AAA. 공공/의료 분야면 AA 이상 권장.
+
+### O7. seo-importance
+**Q**: SEO가 중요한가요?
+**힌트**: 검색 유입이 주 채널인가? 타깃 키워드는?
+
+### O8. i18n
+**Q**: 다국어 지원이 필요한가요?
+**힌트**: 지원할 언어 목록.
+
+### O9. analytics
+**Q**: 분석 도구 연동이 필요한가요?
+**힌트**: 예) Google Analytics 4, Plausible, Hotjar, Mixpanel
+
+### O10. cms-need
+**Q**: 콘텐츠를 나중에 직접 수정해야 하나요? (CMS 필요)
+**힌트**: Sanity, Contentful, Notion, Headless CMS 등.
+
+### O11. hosting-preference
+**Q**: 호스팅 선호가 있나요?
+**힌트**: Vercel, Netlify, Cloudflare Pages, GitHub Pages, 자체 호스팅.
+
+### O12. budget
+**Q**: 월 운영 예산은 어느 수준인가요?
+**힌트**: $0 (free tier) / $10 이하 / $50 이하 / 제약 없음.
+
+### O13. maintenance-plan
+**Q**: 런칭 후 유지보수는 누가 하나요?
+**힌트**: 본인 / 외주 / 자동화만 / 미정.
+
+### O14. content-author
+**Q**: 콘텐츠(카피, 이미지, 영상)는 누가 준비하나요?
+**힌트**: 클라이언트가 준비 / 이 프로젝트에서 함께 작성 / AI로 생성.

package/skills/vibe.plan/SKILL.md

@@ -0,0 +1,216 @@
+---
+name: vibe.plan
+tier: core
+description: "Refine a vibe.interview result into a human-readable markdown 기획서 (planning document). The plan is a vision document that downstream skills/commands use: /vibe.spec consumes it for code implementation, /vibe.figma uses it for UI storyboards. Must use this skill after vibe.interview completes, or when the user has raw interview notes and wants a structured plan document."
+triggers: [기획서, 기획서 작성, plan document, 기획 정리, "interview 정리", refine plan]
+priority: 90
+chain-next: [vibe.spec, vibe.figma]
+---
+
+# vibe.plan — Interview → Plan Document Refinement
+
+> **Principle**: Refine the raw Q&A from the interview into a **human-readable vision document**. AI execution structures like PTCF/EARS/Phase are the responsibility of `/vibe.spec`.
+
+## When to Use
+
+- `vibe.interview` has just completed and `.claude/vibe/interviews/{feature}.md` exists
+- The user requests "write me a plan document" or "clean up the interview"
+- Need to convert an external PRD/wireframe into the vibe plan document format
+
+**Skip condition**:
+- If this skill is called directly without an interview → chain to `vibe.interview` first (no chain-prev; inform the user)
+
+## Core Flow
+
+```
+1. Read interview file
+   .claude/vibe/interviews/{feature}.md
+     ↓
+2. Load template
+   ~/.claude/vibe/templates/plan-template.md
+     ↓
+3. Refine per section
+   - Required responses → body sections
+   - Optional responses → body + "Assumptions"
+   - TBD items → "Open Questions"
+   - Discovered → merged into relevant sections
+     ↓
+4. Conditionally include UI sections
+   type ∈ {website, webapp, mobile} → include Look&Feel / layout / responsive
+   type ∈ {api, library, feature-data} → omit
+     ↓
+5. Save plan document
+   .claude/vibe/plans/{feature}.md
+     ↓
+6. Handoff guidance
+   Next steps: /vibe.spec, /vibe.figma, parallel
+```
+
+## Step 1: Read Interview File
+
+```
+Read .claude/vibe/interviews/{feature-name}.md
+```
+
+Extract `type`, `status`, `requiredCollected`, `optionalCollected`, etc. from the frontmatter.
+
+**Validation**:
+- `status: partial` + Required items incomplete → warn the user:
+  ```
+  ⚠️ Interview is partially complete (N Required items not collected).
+  Those items will appear as "TBD" in the plan document.
+  Continue? (y/N)
+  ```
+- If the file does not exist → guide the user to run `vibe.interview` first.
+
+### `.last-feature` Pointer Update
+
+```
+Write ".claude/vibe/.last-feature" ← feature-name (one line)
+Run immediately after extracting the feature name from the interview file.
+No-op if the value is already the same.
+```
+
+## Step 2: Load Template
+
+```
+Read ~/.claude/vibe/templates/plan-template.md
+```
+
+The template has a 12-section structure:
+
+| # | Section | All Types | UI Types Only |
+|---|---------|-----------|---------------|
+| 1 | Overview | ✅ | |
+| 2 | Background (Why) | ✅ | |
+| 3 | Target Users (Who) | ✅ | |
+| 4 | Goals & Success Criteria | ✅ | |
+| 5 | Core Features/Sections | ✅ | |
+| 6 | Scope & Out-of-Scope | ✅ | |
+| 7 | Look & Feel | | ✅ |
+| 8 | Layout/Section Structure | | ✅ |
+| 9 | Responsive Strategy | | ✅ |
+| 10 | Tech Stack & Constraints | ✅ | |
+| 11 | Assumptions & Risks | ✅ | |
+| 12 | Next Steps (Handoff) | ✅ | |
+
+### Template Fallback
+
+If `~/.claude/vibe/templates/plan-template.md` is not found:
+1. Check `{{VIBE_PATH}}/vibe/templates/plan-template.md` (package source)
+2. If neither exists, use the built-in section list from this skill as the template structure
+3. Never fail silently — always inform the user which template source was used
+
+## Step 3: Per-Section Refinement Mapping
+
+Interview items → plan document section mapping rules:
+
+### Common Mapping
+
+| Interview Item | Plan Section |
+|----------------|--------------|
+| `R1. purpose` | §2 Background (Why) |
+| `R2. target-users` | §3 Target Users |
+| `R3. core-message` / `R3. core-features` / `R3. core-endpoints` | §5 Core Features/Sections |
+| `R4. required-sections` / `R4. data-model` / `R4. core-api` | §5 Core Features/Sections |
+| `R7/R8. success-metric` | §4 Goals & Success Criteria |
+| `R6/R7. tech-constraints` / `tech-stack` | §10 Tech Stack & Constraints |
+
+### UI Types (website/webapp/mobile) Additional Mapping
+
+| Interview Item | Plan Section |
+|----------------|--------------|
+| `R5. brand-tone` + `O1. reference-sites` + `O2. color-direction` + `O3. typography-preference` + `O4. animation-level` | §7 Look & Feel |
+| `R4. required-sections` (website) / `R4. core-features` (webapp) | §8 Layout/Section Structure |
+| `O5. responsive-strategy` + `O6/O8. accessibility-level` | §9 Responsive Strategy |
+
+### Common Post-Processing
+
+- `interview.TBD[]` → §11 "Assumptions & Risks" or "Open Questions" at the end of the document
+- `interview.discovered[]` → merged into relevant sections + "Discovered during interview" note
+- All uncollected Optional items → recorded as defaults in §11 "Assumptions" (e.g., "Accessibility: WCAG AA assumed")
+
+## Step 4: Conditionally Include UI Sections
+
+```python
+if interview.type in {"website", "webapp", "mobile"}:
+    include_sections = [1..12]  # all sections
+else:  # api, library, feature-data
+    include_sections = [1..6, 10..12]  # omit §7-9 (Look&Feel/Layout/Responsive)
+    # note in §5: "No UI — API/Library project"
+```
+
+## Step 5: Save Plan Document
+
+**Output path**: `.claude/vibe/plans/{feature-name}.md`
+
+**Frontmatter**:
+
+```yaml
+---
+feature: {feature-name}
+type: {website | webapp | mobile | api | library | feature}
+status: draft
+createdAt: {ISO-timestamp}
+lastUpdated: {ISO-timestamp}
+source: .claude/vibe/interviews/{feature-name}.md
+downstream: [spec, figma]  # or [spec] for non-UI
+---
+```
+
+**Body**: Template structure + refined content.
+
+**Quality criteria**:
+- Each section takes 30 seconds or less to read
+- Compressed to 3-7 bullets per section
+- Minimize technical jargon (this is a human-readable vision document)
+- Mark "TBD" in bold to make it clear that a follow-up decision is needed
+
+## Step 6: Handoff Guidance
+
+After saving the plan document, guide the user on next steps:
+
+```
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+✅ Plan document complete!
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+📄 .claude/vibe/plans/{feature-name}.md
+   Sections: {N} written
+   TBD: {M} (to be decided later)
+
+Type: {type}
+
+Next steps:
+
+  [UI project: website/webapp/mobile]
+  1. /vibe.spec ".claude/vibe/plans/{feature-name}.md"
+     → Write code spec → /vibe.run implementation
+  2. /vibe.figma
+     → Figma design → FE UI code
+  3. Run in parallel (recommended)
+     → Feature + Design → website prototype
+
+  [Non-UI: api/library]
+  1. /vibe.spec ".claude/vibe/plans/{feature-name}.md"
+     → Code spec → /vibe.run implementation
+
+Where would you like to start?
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+```
+
+## Anti-Patterns
+
+- Do not write in PTCF structure (that is /vibe.spec's responsibility)
+- Do not use EARS format (WHEN/THEN)
+- Do not include file lists, Phase splits, or Acceptance Criteria
+- Do not over-specify the Tech Stack — high-level only
+- Do not hide TBD items — they must be surfaced explicitly so they can be decided in the next step
+- Do not run this skill without an interview (no raw information)
+- Do not force-fill a Look&Feel section for non-UI projects
+
+## Related
+
+- **Prev**: `vibe.interview` — requirements collection (implicit chain-prev)
+- **Next**: `/vibe.spec` (code spec), `/vibe.figma` (UI design)
+- **Template**: `~/.claude/vibe/templates/plan-template.md`