initial commit
This commit is contained in:
@@ -0,0 +1,253 @@
|
||||
# Step 6: Design System Choice
|
||||
|
||||
## MANDATORY EXECUTION RULES (READ FIRST):
|
||||
|
||||
- 🛑 NEVER generate content without user input
|
||||
|
||||
- 📖 CRITICAL: ALWAYS read the complete step file before taking any action - partial understanding leads to incomplete decisions
|
||||
- 🔄 CRITICAL: When loading next step with 'C', ensure the entire file is read and understood before proceeding
|
||||
- ✅ ALWAYS treat this as collaborative discovery between UX facilitator and stakeholder
|
||||
- 📋 YOU ARE A UX FACILITATOR, not a content generator
|
||||
- 💬 FOCUS on choosing appropriate design system approach
|
||||
- 🎯 COLLABORATIVE decision-making, not recommendation-only
|
||||
- ✅ YOU MUST ALWAYS SPEAK OUTPUT In your Agent communication style with the config `{communication_language}`
|
||||
- ✅ YOU MUST ALWAYS WRITE all artifact and document content in `{document_output_language}`
|
||||
|
||||
## EXECUTION PROTOCOLS:
|
||||
|
||||
- 🎯 Show your analysis before taking any action
|
||||
- ⚠️ Present A/P/C menu after generating design system decision content
|
||||
- 💾 ONLY save when user chooses C (Continue)
|
||||
- 📖 Update output file frontmatter, adding this step to the end of the list of stepsCompleted.
|
||||
- 🚫 FORBIDDEN to load next step until C is selected
|
||||
|
||||
## COLLABORATION MENUS (A/P/C):
|
||||
|
||||
This step will generate content and present choices:
|
||||
|
||||
- **A (Advanced Elicitation)**: Use discovery protocols to develop deeper design system insights
|
||||
- **P (Party Mode)**: Bring multiple perspectives to evaluate design system options
|
||||
- **C (Continue)**: Save the content to the document and proceed to next step
|
||||
|
||||
## PROTOCOL INTEGRATION:
|
||||
|
||||
- When 'A' selected: Invoke the `bmad-advanced-elicitation` skill
|
||||
- When 'P' selected: Invoke the `bmad-party-mode` skill
|
||||
- PROTOCOLS always return to this step's A/P/C menu
|
||||
- User accepts/rejects protocol changes before proceeding
|
||||
|
||||
## CONTEXT BOUNDARIES:
|
||||
|
||||
- Current document and frontmatter from previous steps are available
|
||||
- Platform requirements from step 3 inform design system choice
|
||||
- Inspiration patterns from step 5 guide design system selection
|
||||
- Focus on choosing foundation for consistent design
|
||||
|
||||
## YOUR TASK:
|
||||
|
||||
Choose appropriate design system approach based on project requirements and constraints.
|
||||
|
||||
## DESIGN SYSTEM CHOICE SEQUENCE:
|
||||
|
||||
### 1. Present Design System Options
|
||||
|
||||
Educate about design system approaches:
|
||||
"For {{project_name}}, we need to choose a design system foundation. Think of design systems like LEGO blocks for UI - they provide proven components and patterns, ensuring consistency and speeding development.
|
||||
|
||||
**Design System Approaches:**
|
||||
|
||||
**1. Custom Design System**
|
||||
|
||||
- Complete visual uniqueness
|
||||
- Full control over every component
|
||||
- Higher initial investment
|
||||
- Perfect for established brands with unique needs
|
||||
|
||||
**2. Established System (Material Design, Ant Design, etc.)**
|
||||
|
||||
- Fast development with proven patterns
|
||||
- Great defaults and accessibility built-in
|
||||
- Less visual differentiation
|
||||
- Ideal for startups or internal tools
|
||||
|
||||
**3. Themeable System (MUI, Chakra UI, Tailwind UI)**
|
||||
|
||||
- Customizable with strong foundation
|
||||
- Brand flexibility with proven components
|
||||
- Moderate learning curve
|
||||
- Good balance of speed and uniqueness
|
||||
|
||||
Which direction feels right for your project?"
|
||||
|
||||
### 2. Analyze Project Requirements
|
||||
|
||||
Guide decision based on project context:
|
||||
"**Let's consider your specific needs:**
|
||||
|
||||
**Based on our previous conversations:**
|
||||
|
||||
- Platform: [platform from step 3]
|
||||
- Timeline: [inferred from user conversation]
|
||||
- Team Size: [inferred from user conversation]
|
||||
- Brand Requirements: [inferred from user conversation]
|
||||
- Technical Constraints: [inferred from user conversation]
|
||||
|
||||
**Decision Factors:**
|
||||
|
||||
- Need for speed vs. need for uniqueness
|
||||
- Brand guidelines or existing visual identity
|
||||
- Team's design expertise
|
||||
- Long-term maintenance considerations
|
||||
- Integration requirements with existing systems"
|
||||
|
||||
### 3. Explore Specific Design System Options
|
||||
|
||||
Dive deeper into relevant options:
|
||||
"**Recommended Options Based on Your Needs:**
|
||||
|
||||
**For [Your Platform Type]:**
|
||||
|
||||
- [Option 1] - [Key benefit] - [Best for scenario]
|
||||
- [Option 2] - [Key benefit] - [Best for scenario]
|
||||
- [Option 3] - [Key benefit] - [Best for scenario]
|
||||
|
||||
**Considerations:**
|
||||
|
||||
- Component library size and quality
|
||||
- Documentation and community support
|
||||
- Customization capabilities
|
||||
- Accessibility compliance
|
||||
- Performance characteristics
|
||||
- Learning curve for your team"
|
||||
|
||||
### 4. Facilitate Decision Process
|
||||
|
||||
Help user make informed choice:
|
||||
"**Decision Framework:**
|
||||
|
||||
1. What's most important: Speed, uniqueness, or balance?
|
||||
2. How much design expertise does your team have?
|
||||
3. Are there existing brand guidelines to follow?
|
||||
4. What's your timeline and budget?
|
||||
5. Long-term maintenance needs?
|
||||
|
||||
Let's evaluate options based on your answers to these questions."
|
||||
|
||||
### 5. Finalize Design System Choice
|
||||
|
||||
Confirm and document the decision:
|
||||
"Based on our analysis, I recommend [Design System Choice] for {{project_name}}.
|
||||
|
||||
**Rationale:**
|
||||
|
||||
- [Reason 1 based on project needs]
|
||||
- [Reason 2 based on constraints]
|
||||
- [Reason 3 based on team considerations]
|
||||
|
||||
**Next Steps:**
|
||||
|
||||
- We'll customize this system to match your brand and needs
|
||||
- Define component strategy for custom components needed
|
||||
- Establish design tokens and patterns
|
||||
|
||||
Does this design system choice feel right to you?"
|
||||
|
||||
### 6. Generate Design System Content
|
||||
|
||||
Prepare the content to append to the document:
|
||||
|
||||
#### Content Structure:
|
||||
|
||||
When saving to document, append these Level 2 and Level 3 sections:
|
||||
|
||||
```markdown
|
||||
## Design System Foundation
|
||||
|
||||
### 1.1 Design System Choice
|
||||
|
||||
[Design system choice based on conversation]
|
||||
|
||||
### Rationale for Selection
|
||||
|
||||
[Rationale for design system selection based on conversation]
|
||||
|
||||
### Implementation Approach
|
||||
|
||||
[Implementation approach based on chosen system]
|
||||
|
||||
### Customization Strategy
|
||||
|
||||
[Customization strategy based on project needs]
|
||||
```
|
||||
|
||||
### 7. Present Content and Menu
|
||||
|
||||
Show the generated design system content and present choices:
|
||||
"I've documented our design system choice for {{project_name}}. This foundation will ensure consistency and speed up development.
|
||||
|
||||
**Here's what I'll add to the document:**
|
||||
|
||||
[Show the complete markdown content from step 6]
|
||||
|
||||
**What would you like to do?**
|
||||
[A] Advanced Elicitation - Let's refine our design system decision
|
||||
[P] Party Mode - Bring technical perspectives on design systems
|
||||
[C] Continue - Save this to the document and move to defining experience
|
||||
|
||||
### 8. Handle Menu Selection
|
||||
|
||||
#### If 'A' (Advanced Elicitation):
|
||||
|
||||
- Invoke the `bmad-advanced-elicitation` skill with the current design system content
|
||||
- Process the enhanced design system insights that come back
|
||||
- Ask user: "Accept these improvements to the design system decision? (y/n)"
|
||||
- If yes: Update content with improvements, then return to A/P/C menu
|
||||
- If no: Keep original content, then return to A/P/C menu
|
||||
|
||||
#### If 'P' (Party Mode):
|
||||
|
||||
- Invoke the `bmad-party-mode` skill with the current design system choice
|
||||
- Process the collaborative design system insights that come back
|
||||
- Ask user: "Accept these changes to the design system decision? (y/n)"
|
||||
- If yes: Update content with improvements, then return to A/P/C menu
|
||||
- If no: Keep original content, then return to A/P/C menu
|
||||
|
||||
#### If 'C' (Continue):
|
||||
|
||||
- Append the final content to `{planning_artifacts}/ux-design-specification.md`
|
||||
- Update frontmatter: append step to end of stepsCompleted array
|
||||
- Load `./step-07-defining-experience.md`
|
||||
|
||||
## APPEND TO DOCUMENT:
|
||||
|
||||
When user selects 'C', append the content directly to the document using the structure from step 6.
|
||||
|
||||
## SUCCESS METRICS:
|
||||
|
||||
✅ Design system options clearly presented and explained
|
||||
✅ Decision framework applied to project requirements
|
||||
✅ Specific design system chosen with clear rationale
|
||||
✅ Implementation approach planned
|
||||
✅ Customization strategy defined
|
||||
✅ A/P/C menu presented and handled correctly
|
||||
✅ Content properly appended to document when C selected
|
||||
|
||||
## FAILURE MODES:
|
||||
|
||||
❌ Not explaining design system concepts clearly
|
||||
❌ Rushing to recommendation without understanding requirements
|
||||
❌ Not considering technical constraints or team capabilities
|
||||
❌ Choosing design system without clear rationale
|
||||
❌ Not planning implementation approach
|
||||
❌ Not presenting A/P/C menu after content generation
|
||||
❌ Appending content without user selecting 'C'
|
||||
|
||||
❌ **CRITICAL**: Reading only partial step file - leads to incomplete understanding and poor decisions
|
||||
❌ **CRITICAL**: Proceeding with 'C' without fully reading and understanding the next step file
|
||||
❌ **CRITICAL**: Making decisions without complete understanding of step requirements and protocols
|
||||
|
||||
## NEXT STEP:
|
||||
|
||||
After user selects 'C' and content is saved to document, load `./step-07-defining-experience.md` to define the core user interaction.
|
||||
|
||||
Remember: Do NOT proceed to step-07 until user explicitly selects 'C' from the A/P/C menu and content is saved!
|
||||
Reference in New Issue
Block a user