whiteport-design-studio 0.1.0

package/src/workflows/2-trigger-mapping/mermaid-diagram/workflow.md

@@ -0,0 +1,70 @@
+---
+name: Trigger Map Mermaid Diagram
+description: Generate mermaid flowchart diagram from trigger map YAML data
+web_bundle: true
+---
+
+# Trigger Map Mermaid Diagram Workflow
+
+**Goal:** Transform trigger map YAML data into visual mermaid flowchart diagram
+
+**Your Role:** Automated diagram generator that systematically creates a styled mermaid flowchart from trigger map structure.
+
+---
+
+## WORKFLOW ARCHITECTURE
+
+This uses **step-file architecture** for disciplined execution:
+
+### Core Principles
+
+- **Micro-file Design**: Each step is a self-contained instruction file
+- **Just-In-Time Loading**: Only current step file is in memory
+- **Sequential Enforcement**: Steps must be completed in order
+- **Automated Generation**: No user interaction during diagram generation
+- **Quality Validation**: Final step validates generated diagram
+
+### Step Processing Rules
+
+1. **READ COMPLETELY**: Always read entire step file before taking any action
+2. **FOLLOW SEQUENCE**: Execute all sections in order, never deviate
+3. **AUTO-PROCEED**: Generate diagram without waiting for user input
+4. **LOAD NEXT**: When directed, load, read entire file, then execute next step
+
+### Critical Rules (NO EXCEPTIONS)
+
+- 🛑 **NEVER** load multiple step files simultaneously
+- 📖 **ALWAYS** read entire step file before execution
+- 🚫 **NEVER** skip steps or optimize the sequence
+- 🎯 **ALWAYS** follow the exact instructions in step file
+- 🤖 **ALWAYS** auto-proceed through diagram generation
+
+---
+
+## INITIALIZATION SEQUENCE
+
+### 1. Input Requirement
+
+**Required:** Trigger map YAML file path
+- User must provide path to trigger map YAML file
+- File must be valid trigger map structure
+
+### 2. First Step Execution
+
+Load, read full file and then execute `steps-c/step-01-initialize-structure.md` to begin workflow.
+
+---
+
+## OUTPUT
+
+**Generated Diagram:**
+- Mermaid flowchart code (`00-trigger-map-diagram.mermaid`)
+- Visual representation of trigger map showing:
+  - Business goals
+  - Platform/solution
+  - Target groups (personas)
+  - Driving forces
+  - Connections and flow
+  - Professional styling
+
+The diagram can be rendered in markdown files or mermaid visualization tools.

package/src/workflows/2-trigger-mapping/micro-instructions-mermaid-diagram.md

@@ -0,0 +1,262 @@
+# Micro Instructions: Generate Mermaid Trigger Map Diagram
+
+**Purpose:** Create visually appealing, professional Mermaid flowchart diagrams for trigger maps
+
+---
+
+## Format Requirements
+
+### 1. Mermaid Configuration
+```
+%%{init: {'theme':'base', 'themeVariables': { 'fontFamily':'Inter, system-ui, sans-serif', 'fontSize':'14px'}}}%%
+```
+- Always use Inter/system-ui font
+- Set fontSize to 14px
+- Use base theme
+
+### 2. Flowchart Direction
+```
+flowchart LR
+```
+- Always use left-to-right (LR) direction
+- Business goals on left → Platform center → Target groups → Driving forces on right
+
+### 3. Node Content Formatting
+
+**Every node must:**
+- Start with `<br/>` for top padding
+- End with `<br/><br/>` for bottom padding
+- Use `<br/>` for line breaks (not multiple spaces)
+- Include emoji at the start of the title
+
+**Example node structure:**
+```
+NodeID["<br/>🎯 TITLE<br/><br/>Line 1<br/>Line 2<br/>Line 3<br/><br/>"]
+```
+
+### 4. Business Goals Nodes (Left Column)
+
+**Structure:**
+```
+BG1["<br/>🌟 WDS VISION<br/><br/>Point 1<br/>Point 2<br/>Point 3<br/><br/>"]
+BG2["<br/>📊 CORE OBJECTIVES<br/><br/>Point 1<br/>Point 2<br/>Point 3<br/><br/>"]
+```
+
+**Rules:**
+- Use BG0, BG1, BG2, etc. as node IDs
+- Include relevant emoji (🌟 for vision, 📊 for objectives, 🚀 for growth, etc.)
+- List 3-5 key points per goal
+- Keep titles in ALL CAPS
+
+### 5. Platform Node (Center)
+
+**Structure:**
+```
+PLATFORM["<br/>🎨 PLATFORM NAME<br/><br/>Tagline or category<br/><br/>Transformation statement<br/>that spans multiple lines<br/>describing the core change<br/><br/>"]
+```
+
+**Rules:**
+- Single node ID: PLATFORM
+- Include platform emoji
+- Show tagline/category
+- Include transformation/value statement
+- Break long text into multiple lines
+
+### 6. Target Group Nodes
+
+**Structure:**
+```
+TG1["<br/>🎯 PERSONA NAME<br/>PRIORITY LEVEL<br/><br/>Trait 1<br/>Trait 2<br/>Trait 3<br/><br/>"]
+```
+
+**Rules:**
+- Use TG0, TG1, TG2, etc. as node IDs
+- Include persona-specific emoji
+- Show priority (PRIMARY TARGET, SECONDARY TARGET, etc.)
+- List 3-4 key profile traits
+- Keep persona name in ALL CAPS
+
+### 7. Driving Forces Nodes
+
+**Structure:**
+```
+DF1["<br/>🎯 PERSONA'S DRIVERS<br/><br/>WANTS<br/>✅ Positive driver 1<br/>✅ Positive driver 2<br/>✅ Positive driver 3<br/><br/>FEARS<br/>❌ Negative driver 1<br/>❌ Negative driver 2<br/>❌ Negative driver 3<br/><br/>"]
+```
+
+**Rules:**
+- Use DF0, DF1, DF2, etc. matching TG IDs
+- Use same emoji as corresponding persona
+- Add "PERSONA'S DRIVERS" in ALL CAPS
+- Section headers: "WANTS" and "FEARS" (no emojis on headers)
+- ✅ emoji before each positive driver
+- ❌ emoji before each negative driver
+- Exactly 3 drivers per category (top 3 only)
+- Blank line between sections
+
+### 8. Connections
+
+**Required connections:**
+```
+%% Business Goals to Platform
+BG0 --> PLATFORM
+BG1 --> PLATFORM
+BG2 --> PLATFORM
+
+%% Platform to Target Groups
+PLATFORM --> TG0
+PLATFORM --> TG1
+PLATFORM --> TG2
+
+%% Target Groups to Driving Forces
+TG0 --> DF0
+TG1 --> DF1
+TG2 --> DF2
+```
+
+**Rules:**
+- All business goals connect to platform
+- Platform connects to all target groups
+- Each target group connects to its driving forces
+- Use simple arrows (-->), no fancy styling
+
+### 9. Styling Classes
+
+**Required classes:**
+```css
+classDef businessGoal fill:#f3f4f6,color:#1f2937,stroke:#d1d5db,stroke-width:2px
+classDef platform fill:#e5e7eb,color:#111827,stroke:#9ca3af,stroke-width:3px
+classDef targetGroup fill:#f9fafb,color:#1f2937,stroke:#d1d5db,stroke-width:2px
+classDef drivingForces fill:#f3f4f6,color:#1f2937,stroke:#d1d5db,stroke-width:2px
+```
+
+**Application:**
+```
+class BG0,BG1,BG2 businessGoal
+class PLATFORM platform
+class TG0,TG1,TG2 targetGroup
+class DF0,DF1,DF2 drivingForces
+```
+
+**Rules:**
+- Always use these exact colors (light grays with dark text)
+- Business goals: lightest gray (#f3f4f6)
+- Platform: medium gray (#e5e7eb) with thicker border (3px)
+- Target groups: near white (#f9fafb)
+- Driving forces: light gray (#f3f4f6)
+- Text color: dark gray (#1f2937 or #111827)
+- Borders: light gray (#d1d5db or #9ca3af)
+
+---
+
+## Complete Example Template
+
+```mermaid
+%%{init: {'theme':'base', 'themeVariables': { 'fontFamily':'Inter, system-ui, sans-serif', 'fontSize':'14px'}}}%%
+flowchart LR
+    %% Business Goals
+    BG0["<br/>🌟 VISION<br/><br/>Vision statement line 1<br/>Vision statement line 2<br/>Vision statement line 3<br/><br/>"]
+    BG1["<br/>📊 OBJECTIVES<br/><br/>Objective 1<br/>Objective 2<br/>Objective 3<br/><br/>"]
+    
+    %% Platform
+    PLATFORM["<br/>🎨 PRODUCT NAME<br/><br/>Product category or tagline<br/><br/>Transformation statement<br/>describing the change<br/><br/>"]
+    
+    %% Target Groups
+    TG0["<br/>🎯 PERSONA ONE<br/>PRIMARY TARGET<br/><br/>Profile trait 1<br/>Profile trait 2<br/>Profile trait 3<br/><br/>"]
+    TG1["<br/>💼 PERSONA TWO<br/>SECONDARY TARGET<br/><br/>Profile trait 1<br/>Profile trait 2<br/>Profile trait 3<br/><br/>"]
+    
+    %% Driving Forces
+    DF0["<br/>🎯 PERSONA ONE'S DRIVERS<br/><br/>WANTS<br/>✅ Positive driver 1<br/>✅ Positive driver 2<br/>✅ Positive driver 3<br/><br/>FEARS<br/>❌ Negative driver 1<br/>❌ Negative driver 2<br/>❌ Negative driver 3<br/><br/>"]
+    
+    DF1["<br/>💼 PERSONA TWO'S DRIVERS<br/><br/>WANTS<br/>✅ Positive driver 1<br/>✅ Positive driver 2<br/>✅ Positive driver 3<br/><br/>FEARS<br/>❌ Negative driver 1<br/>❌ Negative driver 2<br/>❌ Negative driver 3<br/><br/>"]
+    
+    %% Connections
+    BG0 --> PLATFORM
+    BG1 --> PLATFORM
+    PLATFORM --> TG0
+    PLATFORM --> TG1
+    TG0 --> DF0
+    TG1 --> DF1
+
+    %% Styling
+    classDef businessGoal fill:#f3f4f6,color:#1f2937,stroke:#d1d5db,stroke-width:2px
+    classDef platform fill:#e5e7eb,color:#111827,stroke:#9ca3af,stroke-width:3px
+    classDef targetGroup fill:#f9fafb,color:#1f2937,stroke:#d1d5db,stroke-width:2px
+    classDef drivingForces fill:#f3f4f6,color:#1f2937,stroke:#d1d5db,stroke-width:2px
+    
+    class BG0,BG1 businessGoal
+    class PLATFORM platform
+    class TG0,TG1 targetGroup
+    class DF0,DF1 drivingForces
+```
+
+---
+
+## Emoji Selection Guide
+
+### Business Goals
+- 🌟 Vision
+- 📊 Objectives/Metrics
+- 🚀 Growth/Expansion
+- 💰 Revenue/Business
+- 🤝 Partnerships/Community
+- 🎯 Goals/Targets
+
+### Personas
+- 🎯 Strategic/Primary personas
+- 💼 Business/Leadership personas
+- 💻 Technical/Developer personas
+- 👥 Team/Group personas
+- 🎨 Creative/Designer personas
+- 📱 User/Customer personas
+
+### Platform
+- 🎨 Design/Creative products
+- 💻 Software/Tech products
+- 📱 Mobile/App products
+- 🛠️ Tools/Utilities
+- 📊 Analytics/Data products
+- 🤖 AI/Automation products
+
+---
+
+## Quality Checklist
+
+Before finalizing diagram, verify:
+
+- [ ] Mermaid config includes custom font and fontSize
+- [ ] All nodes start with `<br/>` and end with `<br/><br/>`
+- [ ] All titles are in ALL CAPS
+- [ ] Each persona has matching emoji in both TG and DF nodes
+- [ ] Exactly 3 positive drivers per persona (with ✅)
+- [ ] Exactly 3 negative drivers per persona (with ❌)
+- [ ] "WANTS" and "FEARS" headers have no emojis
+- [ ] All connections are present (goals→platform→groups→forces)
+- [ ] Light gray styling with dark text applied
+- [ ] Platform has thicker border (3px)
+- [ ] No syntax errors or missing brackets
+
+---
+
+## Common Mistakes to Avoid
+
+❌ **Don't:**
+- Use multiple spaces for alignment (use `<br/>` only)
+- Mix HTML tags (bold, italic) - keep plain text
+- Forget padding (`<br/>`) at top and bottom
+- Use colors other than light grays
+- Add emojis to "WANTS" and "FEARS" headers
+- Include more than 3 drivers per category
+- Use lowercase in titles
+
+✅ **Do:**
+- Use `<br/>` for all line breaks
+- Keep consistent spacing (blank lines between sections)
+- Match emojis between personas and their drivers
+- Use exactly 3 drivers per category
+- Apply consistent styling to all nodes
+- Test diagram renders correctly
+
+---
+
+**This format creates professional, scannable trigger maps that clearly communicate strategic insights at a glance.**
+

package/src/workflows/2-trigger-mapping/templates/feature-impact.template.md

@@ -0,0 +1,47 @@
+# Feature Impact Analysis: {{project_name}}
+
+## Scoring
+
+**Primary Persona (⭐):** High = 5 pts | Medium = 3 pts | Low = 1 pt  
+**Other Personas:** High = 3 pts | Medium = 1 pt | Low = 0 pts
+
+**Max Possible Score:** {{max_score}} (with {{persona_count}} personas)  
+**Must Have Threshold:** {{must_have_threshold}}+ or Primary High (5)
+
+---
+
+## Prioritized Features
+
+| Rank | Feature | Score | Decision |
+| ---- | ------- | ----- | -------- |
+
+{{#each sorted_features}}
+| {{this.rank}} | {{this.name}} | {{this.score}} | {{this.decision}} |
+{{/each}}
+
+---
+
+## Decisions
+
+**Must Have MVP (Primary High OR Top Tier Score):**
+{{#each must_have}}
+
+- {{this.name}} ({{this.score}})
+  {{/each}}
+
+**Consider for MVP:**
+{{#each consider}}
+
+- {{this.name}} ({{this.score}})
+  {{/each}}
+
+**Defer (Nice-to-Have or Low Strategic Value):**
+{{#each defer}}
+
+- {{this.name}} ({{this.score}})
+  {{/each}}
+
+---
+
+_Generated with Whiteport Design Studio framework_  
+_Strategic input for Phase 4: UX Design and Phase 6: PRD/Development_

package/src/workflows/2-trigger-mapping/templates/trigger-map.template.md

@@ -0,0 +1,169 @@
+# Trigger Map Poster: {{project_name}}
+
+> Visual overview connecting business goals to user psychology
+
+**Created:** {{date}}
+**Author:** {{user_name}}
+**Methodology:** Based on Effect Mapping (Balic & Domingues), adapted for WDS framework
+
+---
+
+## Strategic Documents
+
+This is the visual overview. For detailed documentation, see:
+
+- **01-Business-Goals.md** - Full vision statements and SMART objectives
+- **02-Target-Groups.md** - All personas with complete driving forces
+- **03-Feature-Impact-Analysis.md** - Prioritized features with impact scores
+- **04-08-\*.md** - Individual persona detail files
+
+---
+
+## Vision
+
+{{vision_statement}}
+
+---
+
+## Business Objectives
+
+{{#each objectives}}
+
+### Objective {{@index + 1}}: {{this.statement}}
+
+- **Metric:** {{this.metric}}
+- **Target:** {{this.target}}
+- **Timeline:** {{this.timeline}}
+  {{/each}}
+
+---
+
+## Target Groups (Prioritized)
+
+{{#each prioritized_groups}}
+
+### {{@index + 1}}. {{this.name}}
+
+**Priority Reasoning:** {{this.reasoning}}
+
+> {{this.persona_summary}}
+
+**Key Positive Drivers:**
+{{#each this.positive_drivers}}
+
+- {{this}}
+  {{/each}}
+
+**Key Negative Drivers:**
+{{#each this.negative_drivers}}
+
+- {{this}}
+  {{/each}}
+
+{{/each}}
+
+---
+
+## Trigger Map Visualization
+
+```mermaid
+%%{init: {'theme':'base', 'themeVariables': { 'fontFamily':'Inter, system-ui, sans-serif', 'fontSize':'14px'}}}%%
+flowchart LR
+    %% Business Goals (Left)
+    {{#each business_goals}}
+    BG{{@index}}["<br/>{{this.emoji}} {{this.title}}<br/><br/>{{#each this.points}}{{this}}<br/>{{/each}}<br/>"]
+    {{/each}}
+    
+    %% Central Platform
+    PLATFORM["<br/>{{platform_emoji}} {{platform_name}}<br/><br/>{{platform_tagline}}<br/><br/>{{platform_transformation}}<br/><br/>"]
+    
+    %% Target Groups
+    {{#each target_groups}}
+    TG{{@index}}["<br/>{{this.emoji}} {{this.name}}<br/>{{this.priority}}<br/><br/>{{#each this.profile}}{{this}}<br/>{{/each}}<br/>"]
+    {{/each}}
+    
+    %% Driving Forces
+    {{#each target_groups}}
+    DF{{@index}}["<br/>{{this.emoji}} {{this.name}}'S DRIVERS<br/><br/>WANTS<br/>{{#each this.positive_drivers}}✅ {{this}}<br/>{{/each}}<br/>FEARS<br/>{{#each this.negative_drivers}}❌ {{this}}<br/>{{/each}}<br/>"]
+    {{/each}}
+    
+    %% Connections
+    {{#each business_goals}}
+    BG{{@index}} --> PLATFORM
+    {{/each}}
+    {{#each target_groups}}
+    PLATFORM --> TG{{@index}}
+    TG{{@index}} --> DF{{@index}}
+    {{/each}}
+
+    %% Light Gray Styling with Dark Text
+    classDef businessGoal fill:#f3f4f6,color:#1f2937,stroke:#d1d5db,stroke-width:2px
+    classDef platform fill:#e5e7eb,color:#111827,stroke:#9ca3af,stroke-width:3px
+    classDef targetGroup fill:#f9fafb,color:#1f2937,stroke:#d1d5db,stroke-width:2px
+    classDef drivingForces fill:#f3f4f6,color:#1f2937,stroke:#d1d5db,stroke-width:2px
+    
+    {{#each business_goals}}
+    class BG{{@index}} businessGoal
+    {{/each}}
+    class PLATFORM platform
+    {{#each target_groups}}
+    class TG{{@index}} targetGroup
+    class DF{{@index}} drivingForces
+    {{/each}}
+```
+
+---
+
+## Design Focus Statement
+
+{{focus_statement}}
+
+**Primary Design Target:** {{top_group.name}}
+
+**Must Address:**
+{{#each must_address_drivers}}
+
+- {{this}}
+  {{/each}}
+
+**Should Address:**
+{{#each should_address_drivers}}
+
+- {{this}}
+  {{/each}}
+
+---
+
+## Cross-Group Patterns
+
+### Shared Drivers
+
+{{shared_drivers}}
+
+### Unique Drivers
+
+{{unique_drivers}}
+
+{{#if conflicts}}
+
+### Potential Tensions
+
+{{conflicts}}
+{{/if}}
+
+---
+
+## Next Steps
+
+This Trigger Map Poster provides a quick reference. For detailed work:
+
+- [ ] **Review detailed docs** - See 01-Business-Goals.md, 02-Target-Groups.md, 03-Feature-Impact-Analysis.md
+- [ ] **Use for Feature Prioritization** - Reference feature impact scores
+- [ ] **Guide UX Design** - Ensure designs address priority drivers
+- [ ] **Validate with Users** - Test assumptions with real target group members
+- [ ] **Update as Learnings Emerge** - This is a living document
+
+---
+
+_Generated with Whiteport Design Studio framework_
+_Trigger Mapping methodology credits: Effect Mapping by Mijo Balic & Ingrid Domingues (inUse), adapted with negative driving forces_

package/src/workflows/2-trigger-mapping/workflow.yaml

@@ -0,0 +1,55 @@
+---
+name: trigger-mapping
+description: "Map business goals to user psychology through structured workshops"
+author: "Whiteport Design Studio"
+phase: 2
+web_bundle: true
+standalone: true
+primary_agent: "saga-analyst"
+
+# Based on Effect Mapping by Mijo Balic & Ingrid Domingues (inUse)
+# Adapted by WDS: simplified (no features), enhanced with negative driving forces
+
+# Critical variables from config
+config_source: "{project-root}/{bmad_folder}/wds/config.yaml"
+output_folder: "{config_source}:output_folder"
+user_name: "{config_source}:user_name"
+project_name: "{config_source}:project_name"
+communication_language: "{config_source}:communication_language"
+document_output_language: "{config_source}:document_output_language"
+date: system-generated
+
+# Workflow components
+installed_path: "{project-root}/{bmad_folder}/wds/workflows/2-trigger-mapping"
+instructions: "{installed_path}/instructions.md"
+
+# Workshop micro-workflows
+workshops:
+  business-goals:
+    instructions: "{installed_path}/workshops/1-business-goals/instructions.md"
+    output: "Vision and SMART objectives"
+  target-groups:
+    instructions: "{installed_path}/workshops/2-target-groups/instructions.md"
+    output: "Personas with descriptions"
+  driving-forces:
+    instructions: "{installed_path}/workshops/3-driving-forces/instructions.md"
+    output: "Positive and negative drivers per group"
+  prioritization:
+    instructions: "{installed_path}/workshops/4-prioritization/instructions.md"
+    output: "Ranked groups and drivers"
+  feature-impact:
+    instructions: "{installed_path}/workshops/5-feature-impact/instructions.md"
+    output: "Features scored against priorities"
+
+# Templates
+templates:
+  trigger_map: "{installed_path}/templates/trigger-map.template.md"
+  feature_impact: "{installed_path}/templates/feature-impact.template.md"
+
+# Output configuration
+output_folder_name: "B-Trigger-Map"
+output_files:
+  - "trigger-map.md"
+  - "personas/"
+  - "feature-impact-analysis.md"
+---