Refactor to 5-step workflow (new → mvp → ui → policy → visualize)
- Remove old commands: spec, customer, sales, merge, design - Add new commands: ui, policy, visualize - Update mvp to include landing page generation - Add templates for mockup, policy, and UI documents - Simplify output path (remove [project] subfolder) - Rewrite README focused on usage 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -1,404 +1,493 @@
|
||||
# appkit.mvp
|
||||
|
||||
**최소한의 기능으로 최대한의 검증을 하는 MVP 범위 정의 명령어**
|
||||
|
||||
---
|
||||
description: MVP 범위 정하기 - 최소한의 기능으로 최대한의 검증 + 랜딩페이지 생성
|
||||
---
|
||||
|
||||
## User Input
|
||||
|
||||
```text
|
||||
$ARGUMENTS
|
||||
```
|
||||
|
||||
User input **may** contain constraints like "2-week validation", "budget: 500만원" etc.
|
||||
|
||||
## Overview
|
||||
|
||||
**This is Step 5 of the logical thinking 7-step workflow**:
|
||||
**논리적 사고 5단계 워크플로우**:
|
||||
|
||||
```
|
||||
논리적 사고 7단계:
|
||||
1. /appkit.new → 아이디어 스케치 (어떤 서비스인지?)
|
||||
2. /appkit.spec → 기능 구체화 (뭐가 필요할까? 누가 쓸까?)
|
||||
3. /appkit.customer → 고객 스토리 (고객의 하루, 고민, 해결)
|
||||
4. /appkit.sales → 세일즈 랜딩 구성 (어떻게 설득할까?)
|
||||
5. /appkit.mvp → MVP 범위 정하기 (최소한으로 검증하려면?) ← YOU ARE HERE
|
||||
6. /appkit.merge → 기획 정돈 (흩어진 기획 통합)
|
||||
7. /appkit.design → 개발 준비 (API, ERD, 기술 스펙)
|
||||
1. /appkit.new → 아이디어 스케치 (어떤 서비스인지?)
|
||||
2. /appkit.mvp → MVP 범위 정하기 + 랜딩페이지 ← YOU ARE HERE
|
||||
3. /appkit.ui → 화면설계서 (라우터, 화면, 컴포넌트)
|
||||
4. /appkit.policy → 정책설계서 (비즈니스 규칙)
|
||||
5. /appkit.visualize → 목업 생성 (HTML 프로토타입)
|
||||
```
|
||||
|
||||
**출력 디렉토리**: `/Users/taesupyoon/sideProjects/rovel.ai/docs/appkit/ui/works`
|
||||
|
||||
## Purpose
|
||||
|
||||
핵심 가치만 구현하여 빠르게 시장 검증을 하기 위한 MVP 범위를 정의합니다.
|
||||
"있으면 좋은" 기능을 제외하고 "없으면 안되는" 기능만 선별합니다.
|
||||
**추가로, MVP 검증을 위한 랜딩페이지를 HTML로 생성합니다.**
|
||||
|
||||
**핵심 질문**: "최소한으로 검증하려면 뭐가 필요할까?"
|
||||
|
||||
---
|
||||
|
||||
## When to Use
|
||||
## Pre-requisite
|
||||
|
||||
- `/appkit.sales`로 가치 제안을 정의한 후 (Step 4 완료 후)
|
||||
- 개발 시작 전 범위를 정해야 할 때
|
||||
- 리소스가 제한적일 때
|
||||
- 빠른 시장 검증이 필요할 때
|
||||
- `/appkit.new`로 서비스 컨셉이 정의되어 있어야 함
|
||||
- `concept.md` 파일이 존재해야 함
|
||||
|
||||
---
|
||||
|
||||
## Usage
|
||||
## Execution Flow
|
||||
|
||||
```bash
|
||||
/appkit.mvp
|
||||
/appkit.mvp "2-week validation"
|
||||
/appkit.mvp "budget: 500만원"
|
||||
/appkit.mvp "target: early adopters only"
|
||||
```
|
||||
### 1. 기존 기획 읽기
|
||||
|
||||
---
|
||||
Read files from `/Users/taesupyoon/sideProjects/rovel.ai/docs/appkit/ui/works/`:
|
||||
- `concept.md` - 서비스 컨셉
|
||||
|
||||
## What I'll Do
|
||||
### 2. MVP 정의 대화
|
||||
|
||||
### 1. MVP 정의 프레임워크
|
||||
**Step 1: 핵심 가치 파악**
|
||||
|
||||
```markdown
|
||||
## MVP Definition Framework
|
||||
## MVP 분석
|
||||
|
||||
### The ONE Thing Test
|
||||
"만약 딱 하나의 기능만 만들 수 있다면?"
|
||||
→ 그것이 진짜 핵심 가치
|
||||
→ [핵심 기능 도출]
|
||||
|
||||
### Concierge MVP vs Product MVP
|
||||
- Concierge: 수동으로 서비스 제공 (검증용)
|
||||
- Product: 자동화된 제품 (확장용)
|
||||
### 기능 분류
|
||||
|
||||
### MLP (Minimum Lovable Product)
|
||||
- Minimum: 최소 기능
|
||||
- Viable: 사용 가능
|
||||
- Lovable: 사랑받을 만한
|
||||
→ MVP도 완성도는 있어야 함
|
||||
```
|
||||
|
||||
### 2. Phase별 기능 분류
|
||||
|
||||
```markdown
|
||||
## MVP Phases
|
||||
|
||||
### Phase 0: Core MVP (2주)
|
||||
**Phase 0: Core MVP (2주)**
|
||||
"없으면 서비스가 성립 안 되는 기능"
|
||||
|
||||
#### Must Have (핵심)
|
||||
✅ 코트 검색/조회
|
||||
✅ 실시간 예약
|
||||
✅ 간단 결제
|
||||
✅ 예약 확인
|
||||
✅ Must Have (핵심):
|
||||
- [기능 1]: [이유]
|
||||
- [기능 2]: [이유]
|
||||
|
||||
#### 구현 수준
|
||||
- UI: 기본 모바일 웹 (앱 개발 X)
|
||||
- 백엔드: 최소 API (5-7개)
|
||||
- 결제: 간편결제 1종 (카드)
|
||||
- 인증: 소셜 로그인 1종 (카카오)
|
||||
❌ 제외할 것:
|
||||
- [기능 A]: [Phase 1으로]
|
||||
- [기능 B]: [Phase 2로]
|
||||
|
||||
#### 제외할 것
|
||||
❌ 회원 등급 시스템
|
||||
❌ 리뷰/평점
|
||||
❌ 쿠폰/포인트
|
||||
❌ 푸시 알림
|
||||
❌ 커뮤니티
|
||||
|
||||
#### 검증 목표
|
||||
- 주간 예약 10건 달성
|
||||
- 사용자 10명 확보
|
||||
- 핵심 플로우 검증
|
||||
|
||||
|
||||
### Phase 1: Enhanced MVP (1개월)
|
||||
**Phase 1: Enhanced MVP (1개월)**
|
||||
"사용자 만족도를 높이는 기능"
|
||||
|
||||
#### Should Have (개선)
|
||||
✅ 할인/쿠폰 시스템
|
||||
✅ 사용자 리뷰
|
||||
✅ 예약 변경/취소
|
||||
✅ 다중 결제 수단
|
||||
- [기능 A]
|
||||
- [기능 C]
|
||||
|
||||
#### 검증 목표
|
||||
- 재방문율 30%
|
||||
- 주간 예약 50건
|
||||
- NPS 40 이상
|
||||
|
||||
|
||||
### Phase 2: Growth (3개월)
|
||||
**Phase 2: Growth (3개월)**
|
||||
"성장과 확장을 위한 기능"
|
||||
|
||||
#### Nice to Have (확장)
|
||||
✅ 커뮤니티 기능
|
||||
✅ 코칭 매칭
|
||||
✅ 토너먼트 개최
|
||||
✅ 장비 대여
|
||||
- [기능 B]
|
||||
- [기능 D]
|
||||
|
||||
#### 검증 목표
|
||||
- MAU 1,000명
|
||||
- 월 매출 1,000만원
|
||||
- 바이럴 계수 1.2
|
||||
---
|
||||
|
||||
이 MVP 범위가 맞나요? 조정하고 싶은 부분이 있나요?
|
||||
```
|
||||
|
||||
### 3. MVP 검증 지표 설정
|
||||
**Step 2: 사용자 피드백**
|
||||
|
||||
- "좋아", "Yes" → MVP 문서 + 랜딩페이지 생성
|
||||
- 조정 요청 → 업데이트 후 재제시
|
||||
|
||||
### 3. MVP 문서 생성
|
||||
|
||||
**File**: `/Users/taesupyoon/sideProjects/rovel.ai/docs/appkit/ui/works/mvp-scope.md`
|
||||
|
||||
```markdown
|
||||
## MVP Metrics
|
||||
# MVP Scope Definition
|
||||
|
||||
### 1️⃣ Success Metrics (성공 지표)
|
||||
"목표 달성 여부"
|
||||
## Overview
|
||||
- **서비스명**: [서비스명]
|
||||
- **MVP 목표**: [목표 한 줄 정의]
|
||||
- **검증 기간**: 2주
|
||||
|
||||
#### Quantitative (정량)
|
||||
- 주간 활성 사용자 (WAU): 10명
|
||||
- 주간 예약 건수: 10건
|
||||
- 전환율: 방문자의 10% 예약
|
||||
- 결제 성공률: 90%
|
||||
---
|
||||
|
||||
#### Qualitative (정성)
|
||||
- "편리하다" 피드백 70%
|
||||
- "다시 쓸 것" 응답 80%
|
||||
- 추천 의향 (NPS): 30+
|
||||
## Phase 0: Core MVP (2주)
|
||||
|
||||
### Must Have
|
||||
| 기능 | 설명 | 우선순위 |
|
||||
|------|------|----------|
|
||||
| [기능1] | [설명] | P0 |
|
||||
| [기능2] | [설명] | P0 |
|
||||
|
||||
### 2️⃣ Learning Metrics (학습 지표)
|
||||
"무엇을 배울 것인가"
|
||||
### 구현 수준
|
||||
- UI: [기본 모바일 웹 / 앱 등]
|
||||
- 백엔드: [최소 API 개수]
|
||||
- 결제: [결제 방식]
|
||||
- 인증: [인증 방식]
|
||||
|
||||
#### User Behavior
|
||||
- 이탈 구간: 어디서 포기하나?
|
||||
- 사용 시간대: 언제 가장 활발한가?
|
||||
- 검색 패턴: 뭘 찾고 있나?
|
||||
- 실패 케이스: 왜 예약 안 하나?
|
||||
### 제외 항목
|
||||
| 기능 | 이유 | 예정 Phase |
|
||||
|------|------|------------|
|
||||
| [기능A] | [이유] | Phase 1 |
|
||||
| [기능B] | [이유] | Phase 2 |
|
||||
|
||||
#### Product-Market Fit Signals
|
||||
- Organic Growth: 자연 유입 있나?
|
||||
- Retention: 다시 오나?
|
||||
- Referral: 추천하나?
|
||||
- Payment: 돈을 내나?
|
||||
---
|
||||
|
||||
## Phase 1: Enhanced MVP (1개월)
|
||||
|
||||
### 3️⃣ Pivot Indicators (피벗 신호)
|
||||
"방향 전환이 필요한 시점"
|
||||
### Should Have
|
||||
| 기능 | 설명 |
|
||||
|------|------|
|
||||
| [기능A] | [설명] |
|
||||
|
||||
🚨 Danger Signals
|
||||
- 2주 후 WAU < 5명
|
||||
- 전환율 < 3%
|
||||
- NPS < 0
|
||||
- 일일 사용 시간 < 1분
|
||||
### 검증 목표
|
||||
- [지표 1]
|
||||
- [지표 2]
|
||||
|
||||
→ Action: 가치 제안 재검토
|
||||
```
|
||||
---
|
||||
|
||||
### 4. MVP 개발 우선순위 매트릭스
|
||||
## Phase 2: Growth (3개월)
|
||||
|
||||
```markdown
|
||||
## Priority Matrix
|
||||
### Nice to Have
|
||||
| 기능 | 설명 |
|
||||
|------|------|
|
||||
| [기능B] | [설명] |
|
||||
|
||||
High Impact ↑
|
||||
---
|
||||
|
||||
[P0: 코트 예약] | [P1: 할인 시스템]
|
||||
Must Do Now | Do Next
|
||||
__________________|__________________
|
||||
|
|
||||
[P3: 푸시 알림] | [P2: 리뷰 시스템]
|
||||
Don't Do | Do Later
|
||||
|
|
||||
→ High Effort
|
||||
## 검증 지표
|
||||
|
||||
### Priority Scoring
|
||||
Impact (영향도) x Confidence (확신도) / Effort (노력)
|
||||
### Success Metrics (성공 지표)
|
||||
- [정량 지표 1]
|
||||
- [정량 지표 2]
|
||||
|
||||
예시:
|
||||
- 코트 예약: 10 x 10 / 3 = 33.3 (P0)
|
||||
- 커뮤니티: 5 x 3 / 8 = 1.9 (P3)
|
||||
```
|
||||
### Learning Metrics (학습 지표)
|
||||
- [학습할 것 1]
|
||||
- [학습할 것 2]
|
||||
|
||||
### 5. MVP 실행 로드맵
|
||||
### Pivot Indicators (피벗 신호)
|
||||
- 🚨 [위험 신호 1]
|
||||
- 🚨 [위험 신호 2]
|
||||
|
||||
```markdown
|
||||
## Execution Roadmap
|
||||
---
|
||||
|
||||
### Week 1-2: Build Phase 0
|
||||
Day 1-3: 기본 UI/UX
|
||||
- 검색 화면
|
||||
- 예약 화면
|
||||
- 확인 화면
|
||||
|
||||
Day 4-7: 핵심 백엔드
|
||||
- 예약 API
|
||||
- 결제 연동
|
||||
- 알림 발송
|
||||
|
||||
Day 8-10: 통합 테스트
|
||||
- End-to-end 테스트
|
||||
- 결제 테스트
|
||||
- 부하 테스트
|
||||
|
||||
Day 11-14: Soft Launch
|
||||
- 베타 사용자 10명
|
||||
- 피드백 수집
|
||||
- 긴급 수정
|
||||
|
||||
|
||||
### Week 3-4: Validate & Iterate
|
||||
- 지표 측정
|
||||
- 사용자 인터뷰
|
||||
- 개선사항 반영
|
||||
- Phase 1 결정
|
||||
|
||||
|
||||
### Week 5-8: Build Phase 1
|
||||
(If Phase 0 validated)
|
||||
- 할인 시스템
|
||||
- 리뷰 기능
|
||||
- UX 개선
|
||||
```
|
||||
|
||||
### 6. MVP 체크리스트
|
||||
|
||||
```markdown
|
||||
## MVP Checklist
|
||||
|
||||
### Before Launch
|
||||
□ 핵심 가치 명확한가?
|
||||
□ 타겟 사용자 명확한가?
|
||||
□ 성공 지표 정의했나?
|
||||
□ 실패 기준 정의했나?
|
||||
□ 2주 안에 가능한가?
|
||||
- [ ] 핵심 가치 명확한가?
|
||||
- [ ] 타겟 사용자 명확한가?
|
||||
- [ ] 성공 지표 정의했나?
|
||||
- [ ] 2주 안에 가능한가?
|
||||
|
||||
### During Development
|
||||
□ Scope creep 발생하지 않았나?
|
||||
□ "하나 더" 유혹 거부했나?
|
||||
□ 핵심 플로우만 집중했나?
|
||||
- [ ] Scope creep 발생하지 않았나?
|
||||
- [ ] 핵심 플로우만 집중했나?
|
||||
|
||||
### After Launch
|
||||
□ 정량 지표 달성했나?
|
||||
□ 정성 피드백 긍정적인가?
|
||||
□ 다음 단계 명확한가?
|
||||
- [ ] 정량 지표 달성했나?
|
||||
- [ ] 다음 단계 명확한가?
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Output Files
|
||||
### 4. 랜딩페이지 생성
|
||||
|
||||
### 생성될 파일들:
|
||||
**Template 참조**: `.specify/templates/sales-landing-template.html`
|
||||
|
||||
1. **`docs/appkit/mvp-scope.md`**
|
||||
- Phase별 기능 목록
|
||||
- 포함/제외 기능
|
||||
- 우선순위 매트릭스
|
||||
**File**: `/Users/taesupyoon/sideProjects/rovel.ai/docs/appkit/ui/works/landing.html`
|
||||
|
||||
2. **`docs/appkit/mvp-metrics.md`**
|
||||
- 성공 지표
|
||||
- 학습 지표
|
||||
- 피벗 기준
|
||||
랜딩페이지는 다음 섹션을 포함해야 합니다:
|
||||
|
||||
---
|
||||
#### 4-1. 랜딩페이지 구조
|
||||
|
||||
## Integration Points
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
### 다른 명령어와의 연계:
|
||||
<!-- SEO Meta Tags -->
|
||||
<title>[서비스명] - [한 줄 슬로건]</title>
|
||||
<meta name="description" content="[서비스 설명 2-3문장]">
|
||||
<meta name="keywords" content="[키워드1], [키워드2], [키워드3]">
|
||||
|
||||
- **From `/appkit.customer`**: Primary 페르소나의 핵심 문제
|
||||
- **From `/appkit.sales`**: 검증할 핵심 가치
|
||||
- **To `/appkit.merge`**: MVP Phase 0 기능의 구현 준비
|
||||
<!-- Open Graph -->
|
||||
<meta property="og:title" content="[서비스명] - [슬로건]">
|
||||
<meta property="og:description" content="[서비스 설명]">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
---
|
||||
<!-- Fonts & Styles -->
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800&display=swap" rel="stylesheet">
|
||||
|
||||
## Examples
|
||||
<style>
|
||||
/* 템플릿 스타일 적용 */
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!-- 1. Hero Section -->
|
||||
<section class="hero">
|
||||
<div class="hero-content">
|
||||
<span class="badge">[배지 텍스트 - 예: 🚀 사전 등록 중]</span>
|
||||
<h1>[메인 헤드라인]<br>[서브 헤드라인]</h1>
|
||||
<p class="tagline">[2-3문장의 핵심 가치 설명]</p>
|
||||
<a href="#cta" class="cta-button">[CTA 버튼 텍스트]</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
### Example 1: 2주 검증 MVP
|
||||
```bash
|
||||
$ /appkit.mvp "2-week validation"
|
||||
<!-- 2. Problem Section: 공감 유도 -->
|
||||
<section class="problem">
|
||||
<div class="container">
|
||||
<h2 class="section-title">[문제 제기 질문]</h2>
|
||||
<ul class="problem-list">
|
||||
<li>[고객 Pain Point 1]</li>
|
||||
<li>[고객 Pain Point 2]</li>
|
||||
<li>[고객 Pain Point 3]</li>
|
||||
</ul>
|
||||
<div class="highlight-box">
|
||||
<p>[문제 요약]</p>
|
||||
<p class="key">[핵심 메시지/솔루션 티저]</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
🎯 MVP Scope Defined
|
||||
<!-- 3. Solution Section: 해결책 제시 -->
|
||||
<section class="solution">
|
||||
<div class="container">
|
||||
<h2 class="section-title">[솔루션 헤드라인]</h2>
|
||||
<p class="section-subtitle">[솔루션 설명]</p>
|
||||
<div class="feature-grid">
|
||||
<div class="feature-card">
|
||||
<span class="feature-icon">[이모지]</span>
|
||||
<h3>[기능 1]</h3>
|
||||
<p>[기능 1 설명]</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<span class="feature-icon">[이모지]</span>
|
||||
<h3>[기능 2]</h3>
|
||||
<p>[기능 2 설명]</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<span class="feature-icon">[이모지]</span>
|
||||
<h3>[기능 3]</h3>
|
||||
<p>[기능 3 설명]</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Phase 0 (2 weeks):
|
||||
✅ Search (location-based)
|
||||
✅ Booking (real-time)
|
||||
✅ Payment (simple)
|
||||
✅ Confirmation (email)
|
||||
<!-- 4. How It Works: 작동 방식 -->
|
||||
<section class="how-it-works">
|
||||
<div class="container">
|
||||
<h2 class="section-title">어떻게 이용하나요?</h2>
|
||||
<div class="steps">
|
||||
<div class="step">
|
||||
<span class="step-number">1</span>
|
||||
<h3>[단계 1]</h3>
|
||||
<p>[설명]</p>
|
||||
</div>
|
||||
<div class="step">
|
||||
<span class="step-number">2</span>
|
||||
<h3>[단계 2]</h3>
|
||||
<p>[설명]</p>
|
||||
</div>
|
||||
<div class="step">
|
||||
<span class="step-number">3</span>
|
||||
<h3>[단계 3]</h3>
|
||||
<p>[설명]</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Excluded:
|
||||
❌ Reviews (Phase 1)
|
||||
❌ Discounts (Phase 1)
|
||||
❌ Community (Phase 2)
|
||||
<!-- 5. Social Proof (Optional): 신뢰 요소 -->
|
||||
<section class="social-proof">
|
||||
<div class="container">
|
||||
<h2 class="section-title">이런 분들이 사용합니다</h2>
|
||||
<div class="testimonials">
|
||||
<!-- 후기 또는 사용자 유형 -->
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Success Criteria:
|
||||
- 10 bookings/week
|
||||
- 10 active users
|
||||
- NPS > 30
|
||||
<!-- 6. Pricing (Optional): 가격 -->
|
||||
<section class="pricing">
|
||||
<div class="container">
|
||||
<h2 class="section-title">합리적인 가격</h2>
|
||||
<div class="pricing-cards">
|
||||
<!-- 가격 카드 -->
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
✅ Generated mvp-scope.md
|
||||
✅ Generated mvp-metrics.md
|
||||
<!-- 7. FAQ Section -->
|
||||
<section class="faq">
|
||||
<div class="container">
|
||||
<h2 class="section-title">자주 묻는 질문</h2>
|
||||
<div class="faq-list">
|
||||
<div class="faq-item">
|
||||
<h3 class="faq-question">[질문 1]</h3>
|
||||
<p class="faq-answer">[답변 1]</p>
|
||||
</div>
|
||||
<!-- 더 많은 FAQ -->
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 8. Final CTA -->
|
||||
<section class="final-cta" id="cta">
|
||||
<div class="container">
|
||||
<h2>[최종 CTA 헤드라인]</h2>
|
||||
<p>[마지막 설득 문구]</p>
|
||||
<a href="[링크]" class="cta-button cta-large">[CTA 버튼]</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer>
|
||||
<p>© 2024 [서비스명]. All rights reserved.</p>
|
||||
</footer>
|
||||
|
||||
<script>
|
||||
// Scroll Animation
|
||||
const observer = new IntersectionObserver((entries) => {
|
||||
entries.forEach(entry => {
|
||||
if (entry.isIntersecting) {
|
||||
entry.target.classList.add('visible');
|
||||
}
|
||||
});
|
||||
}, { threshold: 0.1 });
|
||||
|
||||
document.querySelectorAll('.animate-on-scroll').forEach(el => {
|
||||
observer.observe(el);
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
### Example 2: 예산 제약 MVP
|
||||
```bash
|
||||
$ /appkit.mvp "budget: 500만원"
|
||||
#### 4-2. 스타일 가이드 (템플릿 참조)
|
||||
|
||||
💰 Budget-Constrained MVP
|
||||
```css
|
||||
:root {
|
||||
--primary: #7C3AED; /* 메인 컬러 (보라) */
|
||||
--primary-light: #8B5CF6;
|
||||
--primary-dark: #6D28D9;
|
||||
--bg-white: #FFFFFF;
|
||||
--bg-gray: #F5F7FA;
|
||||
--text-primary: #1F2937;
|
||||
--text-secondary: #6B7280;
|
||||
--border: #E5E7EB;
|
||||
}
|
||||
|
||||
Concierge MVP Approach:
|
||||
- Manual booking process
|
||||
- WhatsApp/Kakao for communication
|
||||
- Google Forms for payment
|
||||
- Spreadsheet for management
|
||||
/* 반응형 브레이크포인트 */
|
||||
/* Mobile: default */
|
||||
/* Tablet: @media (min-width: 768px) */
|
||||
/* Desktop: @media (min-width: 912px) */
|
||||
```
|
||||
|
||||
Tech Investment: Phase 1
|
||||
- After validation
|
||||
- 500만원 = 2 developer weeks
|
||||
#### 4-3. 랜딩페이지 생성 원칙
|
||||
|
||||
✅ Updated mvp-scope.md
|
||||
**Do's**:
|
||||
- ✅ 고객의 Pain Point로 시작
|
||||
- ✅ 명확한 CTA (Call to Action)
|
||||
- ✅ 모바일 퍼스트 디자인
|
||||
- ✅ 스크롤 애니메이션 적용
|
||||
- ✅ SEO 메타태그 완성
|
||||
- ✅ 3-5개 핵심 기능만 강조
|
||||
|
||||
**Don'ts**:
|
||||
- ❌ 기능 나열식 설명
|
||||
- ❌ 전문 용어 남발
|
||||
- ❌ CTA 없는 섹션
|
||||
- ❌ 과도한 정보량
|
||||
|
||||
---
|
||||
|
||||
### 5. 완료 리포트
|
||||
|
||||
```
|
||||
✅ MVP 범위 정의 + 랜딩페이지 생성 완료!
|
||||
|
||||
📁 생성된 파일:
|
||||
- ui/works/mvp-scope.md
|
||||
- ui/works/landing.html
|
||||
|
||||
📊 MVP 요약:
|
||||
- Phase 0 기능: [N개]
|
||||
- Phase 1 기능: [N개]
|
||||
- Phase 2 기능: [N개]
|
||||
|
||||
🌐 랜딩페이지:
|
||||
- 섹션: [N개]
|
||||
- CTA: [N개]
|
||||
- 브라우저에서 확인: file:///...landing.html
|
||||
|
||||
📝 다음 단계:
|
||||
|
||||
**Step 3 - 화면설계서 (/appkit.ui)**
|
||||
/appkit.ui
|
||||
|
||||
**Step 4 - 정책설계서 (/appkit.policy)**
|
||||
/appkit.policy
|
||||
|
||||
**Step 5 - HTML 목업 (/appkit.visualize)**
|
||||
/appkit.visualize all
|
||||
|
||||
📍 현재 위치: Step 2/5 완료
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Key Principles
|
||||
## MVP 원칙
|
||||
|
||||
### MVP 원칙:
|
||||
### Do's
|
||||
- ✅ **Maximize Learning**: 최소 투자로 최대 학습
|
||||
- ✅ **Ship Fast**: 완벽보다 속도
|
||||
- ✅ **Core Value Only**: 핵심 가치만 구현
|
||||
- ✅ **Real Users**: 실제 사용자로 검증
|
||||
- ✅ **Metrics-Driven**: 감이 아닌 데이터로 결정
|
||||
|
||||
1. **Maximize Learning**: 최소 투자로 최대 학습
|
||||
2. **Ship Fast**: 완벽보다 속도
|
||||
3. **Core Value Only**: 핵심 가치만 구현
|
||||
4. **Real Users**: 실제 사용자로 검증
|
||||
5. **Metrics-Driven**: 감이 아닌 데이터로 결정
|
||||
|
||||
### MVP Anti-Patterns:
|
||||
|
||||
❌ **Feature Creep**: "이것도 있으면 좋겠는데..."
|
||||
❌ **Perfectionism**: "조금만 더 다듬고..."
|
||||
❌ **Assumption**: "사용자는 당연히..."
|
||||
❌ **Vanity Metrics**: 의미 없는 지표 추적
|
||||
❌ **Premature Scaling**: 검증 전 확장
|
||||
### Don'ts
|
||||
- ❌ **Feature Creep**: "이것도 있으면 좋겠는데..."
|
||||
- ❌ **Perfectionism**: "조금만 더 다듬고..."
|
||||
- ❌ **Assumption**: "사용자는 당연히..."
|
||||
- ❌ **Premature Scaling**: 검증 전 확장
|
||||
|
||||
---
|
||||
|
||||
## Tips
|
||||
|
||||
### 성공적인 MVP를 위해:
|
||||
|
||||
1. **Time Box**: 2주를 넘기지 마라
|
||||
2. **User Cap**: 10-100명으로 시작
|
||||
3. **Manual First**: 자동화는 나중에
|
||||
4. **Talk to Users**: 매일 사용자와 대화
|
||||
5. **Kill Features**: 과감하게 빼라
|
||||
|
||||
### MVP 실패 신호:
|
||||
|
||||
- 2주 지나도 출시 못함
|
||||
- 기능이 계속 추가됨
|
||||
- 사용자 피드백 없음
|
||||
- 지표 측정 안 함
|
||||
- "좀 더 완벽하게" 반복
|
||||
- **Time Box**: 2주를 넘기지 마라
|
||||
- **User Cap**: 10-100명으로 시작
|
||||
- **Manual First**: 자동화는 나중에
|
||||
- **Talk to Users**: 매일 사용자와 대화
|
||||
- **Kill Features**: 과감하게 빼라
|
||||
- **Landing First**: 랜딩페이지로 관심도 먼저 검증
|
||||
|
||||
---
|
||||
|
||||
## Next Steps
|
||||
## Example
|
||||
|
||||
### 이 명령어 실행 후:
|
||||
```
|
||||
$ /appkit.mvp
|
||||
|
||||
**📍 다음 단계: Step 6 - `/appkit.merge`** (기획 정돈)
|
||||
- MVP 범위가 정해졌으니 이제 기획 정돈 단계로
|
||||
- 용어 통일, 기능 중복 제거
|
||||
- 고객 가치 일관성 확보
|
||||
🎯 MVP Scope 정의
|
||||
|
||||
---
|
||||
Phase 0 (2주):
|
||||
✅ 검색 (위치 기반)
|
||||
✅ 예약 (실시간)
|
||||
✅ 결제 (간단)
|
||||
|
||||
## Version
|
||||
❌ 제외:
|
||||
- 리뷰 (Phase 1)
|
||||
- 커뮤니티 (Phase 2)
|
||||
|
||||
- **Version**: 1.0.0
|
||||
- **Created**: 2025-11-19
|
||||
- **Philosophy**: "If you're not embarrassed by v1, you launched too late"
|
||||
검증 목표:
|
||||
- 주간 10건 예약
|
||||
- 10명 활성 사용자
|
||||
|
||||
✅ mvp-scope.md 생성 완료
|
||||
✅ landing.html 생성 완료
|
||||
|
||||
🌐 랜딩페이지 미리보기:
|
||||
file:///Users/.../ui/works/landing.html
|
||||
```
|
||||
|
||||
Reference in New Issue
Block a user