bmad-studio 0.1.0 → 0.2.0

package/_bmad/bmm/workflows/2-plan-workflows/bmad-create-ux-design/steps/step-11-component-strategy.md

@@ -1,249 +0,0 @@
-# Step 11: Component Strategy
-
-## 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 defining component library strategy and custom components
-- 🎯 COLLABORATIVE component planning, not assumption-based design
-- ✅ 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 component strategy 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 component insights
-- **P (Party Mode)**: Bring multiple perspectives to define component strategy
-- **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
-- Design system choice from step 6 determines available components
-- User journeys from step 10 identify component needs
-- Focus on defining custom components and implementation strategy
-
-## YOUR TASK:
-
-Define component library strategy and design custom components not covered by the design system.
-
-## COMPONENT STRATEGY SEQUENCE:
-
-### 1. Analyze Design System Coverage
-
-Review what components are available vs. needed:
-"Based on our chosen design system [design system from step 6], let's identify what components are already available and what we need to create custom.
-
-**Available from Design System:**
-[List of components available in chosen design system]
-
-**Components Needed for {{project_name}}:**
-Looking at our user journeys and design direction, we need:
-
-- [Component need 1 from journey analysis]
-- [Component need 2 from design requirements]
-- [Component need 3 from core experience]
-
-**Gap Analysis:**
-
-- [Gap 1 - needed but not available]
-- [Gap 2 - needed but not available]"
-
-### 2. Design Custom Components
-
-For each custom component needed, design thoroughly:
-
-**For each custom component:**
-"**[Component Name] Design:**
-
-**Purpose:** What does this component do for users?
-**Content:** What information or data does it display?
-**Actions:** What can users do with this component?
-**States:** What different states does it have? (default, hover, active, disabled, error, etc.)
-**Variants:** Are there different sizes or styles needed?
-**Accessibility:** What ARIA labels and keyboard support needed?
-
-Let's walk through each custom component systematically."
-
-### 3. Document Component Specifications
-
-Create detailed specifications for each component:
-
-**Component Specification Template:**
-
-```markdown
-### [Component Name]
-
-**Purpose:** [Clear purpose statement]
-**Usage:** [When and how to use]
-**Anatomy:** [Visual breakdown of parts]
-**States:** [All possible states with descriptions]
-**Variants:** [Different sizes/styles if applicable]
-**Accessibility:** [ARIA labels, keyboard navigation]
-**Content Guidelines:** [What content works best]
-**Interaction Behavior:** [How users interact]
-```
-
-### 4. Define Component Strategy
-
-Establish overall component library approach:
-"**Component Strategy:**
-
-**Foundation Components:** (from design system)
-
-- [Foundation component 1]
-- [Foundation component 2]
-
-**Custom Components:** (designed in this step)
-
-- [Custom component 1 with rationale]
-- [Custom component 2 with rationale]
-
-**Implementation Approach:**
-
-- Build custom components using design system tokens
-- Ensure consistency with established patterns
-- Follow accessibility best practices
-- Create reusable patterns for common use cases"
-
-### 5. Plan Implementation Roadmap
-
-Define how and when to build components:
-"**Implementation Roadmap:**
-
-**Phase 1 - Core Components:**
-
-- [Component 1] - needed for [critical flow]
-- [Component 2] - needed for [critical flow]
-
-**Phase 2 - Supporting Components:**
-
-- [Component 3] - enhances [user experience]
-- [Component 4] - supports [design pattern]
-
-**Phase 3 - Enhancement Components:**
-
-- [Component 5] - optimizes [user journey]
-- [Component 6] - adds [special feature]
-
-This roadmap helps prioritize development based on user journey criticality."
-
-### 6. Generate Component Strategy Content
-
-Prepare the content to append to the document:
-
-#### Content Structure:
-
-When saving to document, append these Level 2 and Level 3 sections:
-
-```markdown
-## Component Strategy
-
-### Design System Components
-
-[Analysis of available design system components based on conversation]
-
-### Custom Components
-
-[Custom component specifications based on conversation]
-
-### Component Implementation Strategy
-
-[Component implementation strategy based on conversation]
-
-### Implementation Roadmap
-
-[Implementation roadmap based on conversation]
-```
-
-### 7. Present Content and Menu
-
-Show the generated component strategy content and present choices:
-"I've defined the component strategy for {{project_name}}. This balances using proven design system components with custom components for your unique needs.
-
-**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 component strategy
-[P] Party Mode - Bring technical perspectives on component design
-[C] Continue - Save this to the document and move to UX patterns
-
-### 8. Handle Menu Selection
-
-#### If 'A' (Advanced Elicitation):
-
-- Invoke the `bmad-advanced-elicitation` skill with the current component strategy content
-- Process the enhanced component insights that come back
-- Ask user: "Accept these improvements to the component strategy? (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 component strategy
-- Process the collaborative component insights that come back
-- Ask user: "Accept these changes to the component strategy? (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-12-ux-patterns.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 coverage properly analyzed
-✅ All custom components thoroughly specified
-✅ Component strategy clearly defined
-✅ Implementation roadmap prioritized by user need
-✅ Accessibility considered for all components
-✅ A/P/C menu presented and handled correctly
-✅ Content properly appended to document when C selected
-
-## FAILURE MODES:
-
-❌ Not analyzing design system coverage properly
-❌ Custom components not thoroughly specified
-❌ Missing accessibility considerations
-❌ Component strategy not aligned with user journeys
-❌ Implementation roadmap not prioritized effectively
-❌ 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-12-ux-patterns.md` to define UX consistency patterns.
-
-Remember: Do NOT proceed to step-12 until user explicitly selects 'C' from the A/P/C menu and content is saved!

package/_bmad/bmm/workflows/2-plan-workflows/bmad-create-ux-design/steps/step-12-ux-patterns.md

@@ -1,238 +0,0 @@
-# Step 12: UX Consistency Patterns
-
-## 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 establishing consistency patterns for common UX situations
-- 🎯 COLLABORATIVE pattern definition, not assumption-based design
-- ✅ 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 UX patterns 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 pattern insights
-- **P (Party Mode)**: Bring multiple perspectives to define UX patterns
-- **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
-- Component strategy from step 11 informs pattern decisions
-- User journeys from step 10 identify common pattern needs
-- Focus on consistency patterns for common UX situations
-
-## YOUR TASK:
-
-Establish UX consistency patterns for common situations like buttons, forms, navigation, and feedback.
-
-## UX PATTERNS SEQUENCE:
-
-### 1. Identify Pattern Categories
-
-Determine which patterns need definition for your product:
-"Let's establish consistency patterns for how {{project_name}} behaves in common situations.
-
-**Pattern Categories to Define:**
-
-- Button hierarchy and actions
-- Feedback patterns (success, error, warning, info)
-- Form patterns and validation
-- Navigation patterns
-- Modal and overlay patterns
-- Empty states and loading states
-- Search and filtering patterns
-
-Which categories are most critical for your product? We can go through each thoroughly or focus on the most important ones."
-
-### 2. Define Critical Patterns First
-
-Focus on patterns most relevant to your product:
-
-**For [Critical Pattern Category]:**
-"**[Pattern Type] Patterns:**
-What should users see/do when they need to [pattern action]?
-
-**Considerations:**
-
-- Visual hierarchy (primary vs. secondary actions)
-- Feedback mechanisms
-- Error recovery
-- Accessibility requirements
-- Mobile vs. desktop considerations
-
-**Examples:**
-
-- [Example 1 for this pattern type]
-- [Example 2 for this pattern type]
-
-How should {{project_name}} handle [pattern type] interactions?"
-
-### 3. Establish Pattern Guidelines
-
-Document specific design decisions:
-
-**Pattern Guidelines Template:**
-
-```markdown
-### [Pattern Type]
-
-**When to Use:** [Clear usage guidelines]
-**Visual Design:** [How it should look]
-**Behavior:** [How it should interact]
-**Accessibility:** [A11y requirements]
-**Mobile Considerations:** [Mobile-specific needs]
-**Variants:** [Different states or styles if applicable]
-```
-
-### 4. Design System Integration
-
-Ensure patterns work with chosen design system:
-"**Integration with [Design System]:**
-
-- How do these patterns complement our design system components?
-- What customizations are needed?
-- How do we maintain consistency while meeting unique needs?
-
-**Custom Pattern Rules:**
-
-- [Custom rule 1]
-- [Custom rule 2]
-- [Custom rule 3]"
-
-### 5. Create Pattern Documentation
-
-Generate comprehensive pattern library:
-
-**Pattern Library Structure:**
-
-- Clear usage guidelines for each pattern
-- Visual examples and specifications
-- Implementation notes for developers
-- Accessibility checklists
-- Mobile-first considerations
-
-### 6. Generate UX Patterns Content
-
-Prepare the content to append to the document:
-
-#### Content Structure:
-
-When saving to document, append these Level 2 and Level 3 sections:
-
-```markdown
-## UX Consistency Patterns
-
-### Button Hierarchy
-
-[Button hierarchy patterns based on conversation]
-
-### Feedback Patterns
-
-[Feedback patterns based on conversation]
-
-### Form Patterns
-
-[Form patterns based on conversation]
-
-### Navigation Patterns
-
-[Navigation patterns based on conversation]
-
-### Additional Patterns
-
-[Additional patterns based on conversation]
-```
-
-### 7. Present Content and Menu
-
-Show the generated UX patterns content and present choices:
-"I've established UX consistency patterns for {{project_name}}. These patterns ensure users have a consistent, predictable experience across all interactions.
-
-**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 UX patterns
-[P] Party Mode - Bring different perspectives on consistency patterns
-[C] Continue - Save this to the document and move to responsive design
-
-### 8. Handle Menu Selection
-
-#### If 'A' (Advanced Elicitation):
-
-- Invoke the `bmad-advanced-elicitation` skill with the current UX patterns content
-- Process the enhanced pattern insights that come back
-- Ask user: "Accept these improvements to the UX patterns? (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 UX patterns
-- Process the collaborative pattern insights that come back
-- Ask user: "Accept these changes to the UX patterns? (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-13-responsive-accessibility.md`
-
-## APPEND TO DOCUMENT:
-
-When user selects 'C', append the content directly to the document using the structure from step 6.
-
-## SUCCESS METRICS:
-
-✅ Critical pattern categories identified and prioritized
-✅ Consistency patterns clearly defined and documented
-✅ Patterns integrated with chosen design system
-✅ Accessibility considerations included for all patterns
-✅ Mobile-first approach incorporated
-✅ A/P/C menu presented and handled correctly
-✅ Content properly appended to document when C selected
-
-## FAILURE MODES:
-
-❌ Not identifying the most critical pattern categories
-❌ Patterns too generic or not actionable
-❌ Missing accessibility considerations
-❌ Patterns not aligned with design system
-❌ Not considering mobile differences
-❌ 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-13-responsive-accessibility.md` to define responsive design and accessibility strategy.
-
-Remember: Do NOT proceed to step-13 until user explicitly selects 'C' from the A/P/C menu and content is saved!