✨ Vibe Orchestrator Skill
name: vibe-orchestrator description: Transform natural language descriptions into complete, working applications through AI orchestration
🎯 Purpose
Take a simple description and orchestrate multiple skills/agents to build a complete, production-ready application.
📋 When to Use
- "Build me a [type of app]"
- "Create a [description] system"
- Rapid prototyping from ideas
- MVP development
🔧 Orchestration Flow
User: "Create an e-commerce store"
│
▼
┌─────────────────────────────────────────────────┐
│ VIBE ORCHESTRATOR │
└─────────────────────────────────────────────────┘
│
┌─────────┼─────────┬─────────┬─────────┐
▼ ▼ ▼ ▼ ▼
┌───────┐ ┌───────┐ ┌───────┐ ┌───────┐ ┌───────┐
│ Plan │ │ UI │ │ Dev │ │ Test │ │Deploy │
│ Agent │ │ Agent │ │ Agent │ │ Agent │ │ Agent │
└───────┘ └───────┘ └───────┘ └───────┘ └───────┘
│
▼
Working App! 🎉
📝 Vibe Process
Phase 1: Understand (📐 Plan)
Input: "Create a coffee shop ordering system"
Analysis:
- Domain: Food & Beverage / Ordering
- Users: Customers, Staff
- Core Features:
- [ ] Menu display
- [ ] Cart management
- [ ] Order placement
- [ ] Order tracking
- Tech Stack: React + Node.js + DB
Phase 2: Design (🎨 UI)
Pages to create:
1. Home - Menu display
2. Cart - Order items
3. Checkout - Payment
4. Orders - Track orders
Components:
- MenuCard
- CartItem
- OrderSummary
- Header/Footer
Phase 3: Build (⚙️ Dev)
Implementation order:
1. Project setup (Vite + React)
2. Create components
3. Add routing
4. Connect state management
5. Add API integration
Phase 4: Test (🧪 Test)
Testing:
1. Component tests
2. Integration tests
3. E2E flow tests
4. Mobile responsiveness
Phase 5: Polish (✨ Design)
Final touches:
1. Animations
2. Loading states
3. Error handling
4. Performance optimization
Phase 6: Ship (🚀 Deploy)
Deployment:
1. Build production bundle
2. Run final tests
3. Deploy to hosting
4. Verify live site
🎯 Vibe Commands
| Command | Action |
|---|---|
/vibe [description] |
Create full app |
/vibe-ui [description] |
UI only |
/vibe-api [description] |
API only |
/vibe-fix [issue] |
Fix and continue |
📊 Agent Coordination
Parallel Execution
Phase 1: Planning (sequential - needed for others)
│
▼
Phase 2: UI + API (parallel - independent)
│
▼
Phase 3: Integration (sequential - needs both)
│
▼
Phase 4: Testing + Docs (parallel - independent)
Agent Announcements
[📐 Planner] Starting: Analyze requirements
[📐 Planner] ✅ Complete: 5 features identified
[🎨 UI Builder] Starting: Create HomePage
[⚙️ Dev Agent] Starting: Setup API routes
[🎨 UI Builder] ✅ Complete: HomePage with 3 sections
[⚙️ Dev Agent] ✅ Complete: 4 API endpoints
[🧪 Tester] Starting: Run test suite
[🧪 Tester] ✅ Complete: 12/12 tests passed
💡 Example Vibes
E-commerce
/vibe Online store with products, cart, and checkout
SaaS Dashboard
/vibe Analytics dashboard with charts, filters, and export
Social App
/vibe Twitter clone with posts, likes, and comments
Management System
/vibe Project management tool with tasks, teams, and deadlines
✅ Vibe Checklist
- Requirements understood
- Features prioritized
- UI designed and built
- Logic implemented
- Tests passing
- Design polished
- Ready for deployment
🔧 Error Recovery
If agent fails:
1. Identify failure point
2. Log error details
3. Attempt auto-fix
4. If can't fix: pause and report
5. After fix: continue from checkpoint
🔗 Related Skills
business-context- Understand requirementsui-first-builder- Build UItesting- Test applicationdeployment- Deploy resultmemory-system- Track progress