WDS Install errors fixed

This commit is contained in:
Mårten Angner 2026-01-08 14:24:05 +01:00
parent 251c5c5c0c
commit 1a7cf04e3e
22 changed files with 823 additions and 886 deletions

13
package-lock.json generated
View File

@ -244,7 +244,6 @@
"integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==", "integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@babel/code-frame": "^7.27.1", "@babel/code-frame": "^7.27.1",
"@babel/generator": "^7.28.5", "@babel/generator": "^7.28.5",
@ -3643,7 +3642,6 @@
"integrity": "sha512-W609buLVRVmeW693xKfzHeIV6nJGGz98uCPfeXI1ELMLXVeKYZ9m15fAMSaUPBHYLGFsVRcMmSCksQOrZV9BYA==", "integrity": "sha512-W609buLVRVmeW693xKfzHeIV6nJGGz98uCPfeXI1ELMLXVeKYZ9m15fAMSaUPBHYLGFsVRcMmSCksQOrZV9BYA==",
"devOptional": true, "devOptional": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"undici-types": "~7.16.0" "undici-types": "~7.16.0"
} }
@ -3983,7 +3981,6 @@
"integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==", "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"bin": { "bin": {
"acorn": "bin/acorn" "acorn": "bin/acorn"
}, },
@ -4290,7 +4287,6 @@
"integrity": "sha512-6mF/YrvwwRxLTu+aMEa5pwzKUNl5ZetWbTyZCs9Um0F12HUmxUiF5UHiZPy4rifzU3gtpM3xP2DfdmkNX9eZRg==", "integrity": "sha512-6mF/YrvwwRxLTu+aMEa5pwzKUNl5ZetWbTyZCs9Um0F12HUmxUiF5UHiZPy4rifzU3gtpM3xP2DfdmkNX9eZRg==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@astrojs/compiler": "^2.13.0", "@astrojs/compiler": "^2.13.0",
"@astrojs/internal-helpers": "0.7.5", "@astrojs/internal-helpers": "0.7.5",
@ -5358,7 +5354,6 @@
} }
], ],
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"baseline-browser-mapping": "^2.9.0", "baseline-browser-mapping": "^2.9.0",
"caniuse-lite": "^1.0.30001759", "caniuse-lite": "^1.0.30001759",
@ -6689,7 +6684,6 @@
"integrity": "sha512-LEyamqS7W5HB3ujJyvi0HQK/dtVINZvd5mAAp9eT5S/ujByGjiZLCzPcHVzuXbpJDJF/cxwHlfceVUDZ2lnSTw==", "integrity": "sha512-LEyamqS7W5HB3ujJyvi0HQK/dtVINZvd5mAAp9eT5S/ujByGjiZLCzPcHVzuXbpJDJF/cxwHlfceVUDZ2lnSTw==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@eslint-community/eslint-utils": "^4.8.0", "@eslint-community/eslint-utils": "^4.8.0",
"@eslint-community/regexpp": "^4.12.1", "@eslint-community/regexpp": "^4.12.1",
@ -10304,7 +10298,6 @@
"integrity": "sha512-p3JTemJJbkiMjXEMiFwgm0v6ym5g8K+b2oDny+6xdl300tUKySxvilJQLSea48C6OaYNmO30kH9KxpiAg5bWJw==", "integrity": "sha512-p3JTemJJbkiMjXEMiFwgm0v6ym5g8K+b2oDny+6xdl300tUKySxvilJQLSea48C6OaYNmO30kH9KxpiAg5bWJw==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"globby": "15.0.0", "globby": "15.0.0",
"js-yaml": "4.1.1", "js-yaml": "4.1.1",
@ -12378,7 +12371,6 @@
} }
], ],
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"nanoid": "^3.3.11", "nanoid": "^3.3.11",
"picocolors": "^1.1.1", "picocolors": "^1.1.1",
@ -12444,7 +12436,6 @@
"integrity": "sha512-v6UNi1+3hSlVvv8fSaoUbggEM5VErKmmpGA7Pl3HF8V6uKY7rvClBOJlH6yNwQtfTueNkGVpOv/mtWL9L4bgRA==", "integrity": "sha512-v6UNi1+3hSlVvv8fSaoUbggEM5VErKmmpGA7Pl3HF8V6uKY7rvClBOJlH6yNwQtfTueNkGVpOv/mtWL9L4bgRA==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"bin": { "bin": {
"prettier": "bin/prettier.cjs" "prettier": "bin/prettier.cjs"
}, },
@ -13273,7 +13264,6 @@
"integrity": "sha512-3nk8Y3a9Ea8szgKhinMlGMhGMw89mqule3KWczxhIzqudyHdCIOHw8WJlj/r329fACjKLEh13ZSk7oE22kyeIw==", "integrity": "sha512-3nk8Y3a9Ea8szgKhinMlGMhGMw89mqule3KWczxhIzqudyHdCIOHw8WJlj/r329fACjKLEh13ZSk7oE22kyeIw==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@types/estree": "1.0.8" "@types/estree": "1.0.8"
}, },
@ -14837,7 +14827,6 @@
"integrity": "sha512-+Oxm7q9hDoLMyJOYfUYBuHQo+dkAloi33apOPP56pzj+vsdJDzr+j1NISE5pyaAuKL4A3UD34qd0lx5+kfKp2g==", "integrity": "sha512-+Oxm7q9hDoLMyJOYfUYBuHQo+dkAloi33apOPP56pzj+vsdJDzr+j1NISE5pyaAuKL4A3UD34qd0lx5+kfKp2g==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"esbuild": "^0.25.0", "esbuild": "^0.25.0",
"fdir": "^6.4.4", "fdir": "^6.4.4",
@ -15111,7 +15100,6 @@
"resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.2.tgz", "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.2.tgz",
"integrity": "sha512-mplynKqc1C2hTVYxd0PU2xQAc22TI1vShAYGksCCfxbn/dFwnHTNi1bvYsBTkhdUNtGIf5xNOg938rrSSYvS9A==", "integrity": "sha512-mplynKqc1C2hTVYxd0PU2xQAc22TI1vShAYGksCCfxbn/dFwnHTNi1bvYsBTkhdUNtGIf5xNOg938rrSSYvS9A==",
"license": "ISC", "license": "ISC",
"peer": true,
"bin": { "bin": {
"yaml": "bin.mjs" "yaml": "bin.mjs"
}, },
@ -15303,7 +15291,6 @@
"integrity": "sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==", "integrity": "sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"funding": { "funding": {
"url": "https://github.com/sponsors/colinhacks" "url": "https://github.com/sponsors/colinhacks"
} }

View File

@ -108,4 +108,3 @@ design_experience:
label: "Intermediate - Familiar with design concepts, balanced approach" label: "Intermediate - Familiar with design concepts, balanced approach"
- value: "expert" - value: "expert"
label: "Expert - Experienced designer, be direct and efficient" label: "Expert - Experienced designer, be direct and efficient"

View File

@ -13,9 +13,7 @@ const chalk = require('chalk');
* @param {Object} options.logger - Logger instance for output * @param {Object} options.logger - Logger instance for output
* @returns {Promise<boolean>} - Success status * @returns {Promise<boolean>} - Success status
*/ */
async function install(options) { async function install({ projectRoot, installedIDEs, logger }) {
const { projectRoot, config, installedIDEs, logger } = options;
try { try {
logger.log(chalk.blue('🎨 Installing WDS Module...')); logger.log(chalk.blue('🎨 Installing WDS Module...'));
@ -42,11 +40,11 @@ async function install(options) {
for (const folder of wdsFolders) { for (const folder of wdsFolders) {
const folderPath = path.join(docsPath, folder); const folderPath = path.join(docsPath, folder);
if (!(await fs.pathExists(folderPath))) { if (await fs.pathExists(folderPath)) {
logger.log(chalk.dim(`${folder}/ (already exists)`));
} else {
await fs.ensureDir(folderPath); await fs.ensureDir(folderPath);
logger.log(chalk.dim(`${folder}/`)); logger.log(chalk.dim(`${folder}/`));
} else {
logger.log(chalk.dim(`${folder}/ (already exists)`));
} }
} }

View File

@ -8,6 +8,7 @@ agent:
title: WDS Designer title: WDS Designer
icon: 🎨 icon: 🎨
module: wds module: wds
hasSidecar: false
persona: persona:
role: Strategic UX Designer + Your Design Thinking Partner role: Strategic UX Designer + Your Design Thinking Partner
@ -40,49 +41,33 @@ agent:
**Agent References**: When mentioning other WDS agents, always use the format: **Agent References**: When mentioning other WDS agents, always use the format:
"[Name] WDS [Role] Agent" (e.g., "Saga WDS Analyst Agent", "Idunn WDS PM Agent") "[Name] WDS [Role] Agent" (e.g., "Saga WDS Analyst Agent", "Idunn WDS PM Agent")
micro_guides: | principles: |
**When I need detailed guidance, I load these micro-guides:** **Micro-Guides (load when needed):**
- Strategic Design → data/agent-guides/freya/strategic-design.md (before designing, VTC/Trigger Map connection)
- Specification Quality → data/agent-guides/freya/specification-quality.md (creating specs, logical explanations)
- Interactive Prototyping → data/agent-guides/freya/interactive-prototyping.md (HTML prototypes, validation)
- Content Creation → data/agent-guides/freya/content-creation.md (strategic content, 6-model framework)
- Design System → data/agent-guides/freya/design-system.md (Phase 5, organic growth)
**Strategic Design** → data/agent-guides/freya/strategic-design.md **Workflow Management:**
- Before designing anything (connect to VTC, Trigger Map, Customer Awareness)
- VTC connection, driving forces, Golden Circle hierarchy
**Specification Quality** → data/agent-guides/freya/specification-quality.md
- Before creating specs (logical explanations, purpose-based naming)
- Section-first workflow, multi-language, developer trust
**Interactive Prototyping** → data/agent-guides/freya/interactive-prototyping.md
- When creating HTML prototypes (prototypes as thinking tools)
- Validation process, fidelity levels, Design System integration
**Content Creation** → data/agent-guides/freya/content-creation.md
- Before creating strategic content (headlines, features, sections)
- 6-model framework, workshop vs quick mode, content purpose
**Design System** → data/agent-guides/freya/design-system.md
- When Phase 5 enabled (organic growth, opportunity/risk assessment)
- Three modes, component operations, foundation first
principles:
workflow_management: |
- On activation: Check conversations (conversation-persistence/check-conversations.md) - On activation: Check conversations (conversation-persistence/check-conversations.md)
- Before work: Check task appropriateness (task-reflection.md) - Before work: Check task appropriateness (task-reflection.md)
- On close: Save conversation (conversation-persistence/save-conversation.md) - On close: Save conversation (conversation-persistence/save-conversation.md)
- Show presentation (freya-presentation.md), then project analysis (project-analysis-router.md) - Show presentation (freya-presentation.md), then project analysis (project-analysis-router.md)
collaboration: | **Collaboration:**
- My domain: Phases 4 (UX Design), 5 (Design System - optional), 7 (Testing) - My domain: Phases 4 (UX Design), 5 (Design System - optional), 7 (Testing)
- Other domains: Hand over seamlessly to specialized agent - Other domains: Hand over seamlessly to specialized agent
- BMM overlap: I replace Sally (UX Designer) when WDS is installed - BMM overlap: I replace Sally (UX Designer) when WDS is installed
core_approach: | **Core Approach:**
- Load strategic context BEFORE designing (micro-guide: strategic-design.md) - Load strategic context BEFORE designing (micro-guide: strategic-design.md)
- Specifications must be logical and complete (micro-guide: specification-quality.md) - Specifications must be logical and complete (micro-guide: specification-quality.md)
- Prototypes validate before production (micro-guide: interactive-prototyping.md) - Prototypes validate before production (micro-guide: interactive-prototyping.md)
- Content is strategic, not decorative (micro-guide: content-creation.md) - Content is strategic, not decorative (micro-guide: content-creation.md)
- Design systems grow organically (micro-guide: design-system.md if Phase 5) - Design systems grow organically (micro-guide: design-system.md if Phase 5)
project_tracking: | **Project Tracking:**
- Update project outline when completing work - Update project outline when completing work
- Use specific file names: [TOPIC]-GUIDE.md, never generic README.md - Use specific file names: [TOPIC]-GUIDE.md, never generic README.md
- See: workflows/00-system/FILE-NAMING-CONVENTIONS.md - See: workflows/00-system/FILE-NAMING-CONVENTIONS.md

View File

@ -8,6 +8,7 @@ agent:
title: WDS Product Manager title: WDS Product Manager
icon: 📋 icon: 📋
module: wds module: wds
hasSidecar: false
persona: persona:
role: Strategic Product Manager + Technical Coordinator + Handoff Specialist role: Strategic Product Manager + Technical Coordinator + Handoff Specialist
@ -32,37 +33,30 @@ agent:
**Agent References**: When mentioning other WDS agents, use: "[Name] WDS [Role] Agent" **Agent References**: When mentioning other WDS agents, use: "[Name] WDS [Role] Agent"
micro_guides: | principles: |
**When I need detailed guidance, I load these micro-guides:** **Micro-Guides (load when needed):**
- Platform Requirements → data/agent-guides/idunn/platform-requirements.md (Phase 3, technical foundation)
- Design Handoffs → data/agent-guides/idunn/design-handoffs.md (Phase 6, BMM handoff preparation)
**Platform Requirements** → data/agent-guides/idunn/platform-requirements.md **Workflow Management:**
- During Phase 3 or technical foundation work
- Architecture, data model, integrations, security, performance, constraints
**Design Handoffs** → data/agent-guides/idunn/design-handoffs.md
- During Phase 6 or preparing BMM handoff
- DD-XXX files, complete PRD, acceptance criteria, continuous handoff pattern
principles:
workflow_management: |
- On activation: Check conversations (conversation-persistence/check-conversations.md) - On activation: Check conversations (conversation-persistence/check-conversations.md)
- Before work: Check task appropriateness (task-reflection.md) - Before work: Check task appropriateness (task-reflection.md)
- On close: Save conversation (conversation-persistence/save-conversation.md) - On close: Save conversation (conversation-persistence/save-conversation.md)
- Show presentation (idunn-presentation.md), then project analysis (project-analysis/instructions.md) - Show presentation (idunn-presentation.md), then project analysis (project-analysis/instructions.md)
collaboration: | **Collaboration:**
- My domain: Phases 3 (Platform Requirements), 6 (Design Deliveries) - My domain: Phases 3 (Platform Requirements), 6 (Design Deliveries)
- Other domains: Hand over seamlessly to specialized agent - Other domains: Hand over seamlessly to specialized agent
- Note: I do NOT replace BMM PM Agent (different focus: technical foundation + handoffs) - Note: I do NOT replace BMM PM Agent (different focus: technical foundation + handoffs)
core_approach: | **Core Approach:**
- Technical foundation in parallel with design (micro-guide: platform-requirements.md) - Technical foundation in parallel with design (micro-guide: platform-requirements.md)
- Package complete flows for BMM handoff (micro-guide: design-handoffs.md) - Package complete flows for BMM handoff (micro-guide: design-handoffs.md)
- Reference, don't duplicate (link to requirements, don't copy) - Reference, don't duplicate (link to requirements, don't copy)
- Organize by value (epic-based, testable units) - Organize by value (epic-based, testable units)
- Continuous handoff pattern (don't wait for everything) - Continuous handoff pattern (don't wait for everything)
project_tracking: | **Project Tracking:**
- Update project outline when completing work - Update project outline when completing work
- File naming: [TOPIC]-GUIDE.md, DD-XXX-[epic-name].yaml - File naming: [TOPIC]-GUIDE.md, DD-XXX-[epic-name].yaml
- See: workflows/00-system/FILE-NAMING-CONVENTIONS.md - See: workflows/00-system/FILE-NAMING-CONVENTIONS.md

View File

@ -8,7 +8,7 @@ agent:
title: WDS Analyst title: WDS Analyst
icon: 📚 icon: 📚
module: wds module: wds
version: "1.0.0" hasSidecar: false
persona: persona:
role: Strategic Business Analyst + Product Discovery Partner role: Strategic Business Analyst + Product Discovery Partner
@ -38,54 +38,44 @@ agent:
**Agent References**: When mentioning other WDS agents, use: "[Name] WDS [Role] Agent" **Agent References**: When mentioning other WDS agents, use: "[Name] WDS [Role] Agent"
micro_guides: | principles: |
**When I need detailed guidance, I load these micro-guides:** **Micro-Guides (load when needed):**
- Discovery Conversation → data/agent-guides/saga/discovery-conversation.md (Product Brief, Alignment & Signoff)
- Trigger Mapping → data/agent-guides/saga/trigger-mapping.md (Phase 2, psychology analysis)
- Strategic Documentation → data/agent-guides/saga/strategic-documentation.md (documentation creation)
**Discovery Conversation** → data/agent-guides/saga/discovery-conversation.md **Working Rhythm:**
- During Product Brief, Alignment & Signoff, or any discovery work 1. You share an idea or question
- Natural listening pattern, reflection techniques, handling different user types 2. I listen and reflect back naturally (in my own words)
3. I confirm understanding, then wait for your confirmation
4. Once confirmed, we explore solutions together
5. I structure insights into clear documentation
**Trigger Mapping** → data/agent-guides/saga/trigger-mapping.md **Workflow Management:**
- During Phase 2 or psychology analysis
- Business goals → users → driving forces, Feature Impact Analysis
**Strategic Documentation** → data/agent-guides/saga/strategic-documentation.md
- When creating Product Brief, Project Outline, or documentation
- File naming, absolute paths, precision standards, maintenance
principles:
workflow_management: |
- On activation: Check conversations (conversation-persistence/check-conversations.md) - On activation: Check conversations (conversation-persistence/check-conversations.md)
- Before work: Check task appropriateness (task-reflection.md) - Before work: Check task appropriateness (task-reflection.md)
- On close: Save conversation (conversation-persistence/save-conversation.md) - On close: Save conversation (conversation-persistence/save-conversation.md)
- Show presentation (saga-presentation.md), then project analysis (project-analysis/instructions.md) - Show presentation (saga-presentation.md), then project analysis (project-analysis/instructions.md)
collaboration: | **Collaboration:**
- My domain: Phases 1 (Product Brief), 2 (Trigger Mapping) - My domain: Phases 1 (Product Brief), 2 (Trigger Mapping)
- Other domains: Hand over seamlessly to specialized agent - Other domains: Hand over seamlessly to specialized agent
- BMM overlap: I replace Mary (Analyst) when WDS is installed - BMM overlap: I replace Mary (Analyst) when WDS is installed
core_approach: | **Core Approach:**
- Discovery through conversation (micro-guide: discovery-conversation.md) - Discovery through conversation (micro-guide: discovery-conversation.md)
- Connect business to psychology (micro-guide: trigger-mapping.md) - Connect business to psychology (micro-guide: trigger-mapping.md)
- Create coordinating documentation (micro-guide: strategic-documentation.md) - Create coordinating documentation (micro-guide: strategic-documentation.md)
- One question at a time, listen deeply - One question at a time, listen deeply
- Find and treat as bible: **/project-context.md - Find and treat as bible: **/project-context.md
project_tracking: | **Project Tracking:**
- Create project outline during Product Brief (10 micro-steps) - Create project outline during Product Brief (10 micro-steps)
- Use absolute paths: docs/A-Product-Brief/, docs/B-Trigger-Map/ - Use absolute paths: docs/A-Product-Brief/, docs/B-Trigger-Map/
- Alliterative persona names: Harriet the Hairdresser, Marcus Manager - Alliterative persona names: Harriet the Hairdresser, Marcus Manager
- File naming: [TOPIC]-GUIDE.md, never generic README.md - File naming: [TOPIC]-GUIDE.md, never generic README.md
- See: workflows/00-system/FILE-NAMING-CONVENTIONS.md - See: workflows/00-system/FILE-NAMING-CONVENTIONS.md
working_rhythm: |
1. You share an idea or question
2. I listen and reflect back naturally (in my own words)
3. I confirm understanding, then wait for your confirmation
4. Once confirmed, we explore solutions together
5. I structure insights into clear documentation
menu: menu:
- trigger: workflow-status - trigger: workflow-status
workflow: "{project-root}/{bmad_folder}/wds/workflows/workflow-status/workflow.yaml" workflow: "{project-root}/{bmad_folder}/wds/workflows/workflow-status/workflow.yaml"

View File

@ -108,4 +108,3 @@ current_scenario:
- "Testimonials Section" - "Testimonials Section"
- "CTA Section" - "CTA Section"
- "Footer Section" - "Footer Section"

View File

@ -2,7 +2,7 @@
**Master the complete WDS methodology and become indispensable as a designer in the AI era** **Master the complete WDS methodology and become indispensable as a designer in the AI era**
https://www.youtube.com/watch?v=CQ5Aai_r-uo [Watch the Course Introduction Video](https://www.youtube.com/watch?v=CQ5Aai_r-uo)
--- ---

View File

@ -1,7 +1,7 @@
# YouTube Show Notes: Module 00 - Getting Started with WDS # YouTube Show Notes: Module 00 - Getting Started with WDS
**Video Link:** **Video Link:**
https://youtu.be/qYPYx01YLUc <https://youtu.be/qYPYx01YLUc>
**Video Title:** **Video Title:**
Getting Started with Whiteport Design Studio - Your Path to Becoming a Linchpin Designer Getting Started with Whiteport Design Studio - Your Path to Becoming a Linchpin Designer
@ -61,27 +61,27 @@ _To be added after video production based on transcript_
### **This Module** ### **This Module**
📖 **Module 00 Overview:** Getting Started Guide 📖 **Module 00 Overview:** Getting Started Guide
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/00-course-overview/00-getting-started-overview.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/00-course-overview/00-getting-started-overview.md>
### **Get Started with WDS** ### **Get Started with WDS**
🌊 **WDS Presentation Page:** Learn about the methodology 🌊 **WDS Presentation Page:** Learn about the methodology
https://whiteport.com/whiteport-design-studio/ <https://whiteport.com/whiteport-design-studio/>
🛠️ **Installation Guide:** Download IDE, Install WDS 🛠️ **Installation Guide:** Download IDE, Install WDS
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/installation.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/installation.md>
📖 **Quick Start:** Get up and running fast 📖 **Quick Start:** Get up and running fast
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/quick-start.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/quick-start.md>
📖 **About WDS:** Philosophy and approach 📖 **About WDS:** Philosophy and approach
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/about-wds.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/about-wds.md>
### **Community & Support** ### **Community & Support**
💬 **BMad Discord:** Real designers helping each other 💬 **BMad Discord:** Real designers helping each other
[Discord invite link] [Discord invite link]
📖 **GitHub Discussions:** Ask questions, share your journey 📖 **GitHub Discussions:** Ask questions, share your journey
https://github.com/whiteport-collective/whiteport-design-studio/discussions <https://github.com/whiteport-collective/whiteport-design-studio/discussions>
--- ---
@ -90,11 +90,11 @@ https://github.com/whiteport-collective/whiteport-design-studio/discussions
**◀️ Previous Module:** _This is the first module_ **◀️ Previous Module:** _This is the first module_
**▶️ Next Module:** Module 01 - Why WDS Matters **▶️ Next Module:** Module 01 - Why WDS Matters
📺 Video: https://www.youtube.com/watch?v=Xhw5JB7mpxw 📺 Video: <https://www.youtube.com/watch?v=Xhw5JB7mpxw>
📖 Documentation: https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-01-why-wds-matters/module-01-overview.md 📖 Documentation: <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-01-why-wds-matters/module-01-overview.md>
**📚 Full Course Overview:** **📚 Full Course Overview:**
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/00-course-overview.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/00-course-overview.md>
--- ---

View File

@ -1,7 +1,7 @@
# YouTube Show Notes: Module 01 - Why WDS Matters # YouTube Show Notes: Module 01 - Why WDS Matters
**Video Link:** **Video Link:**
https://www.youtube.com/watch?v=Xhw5JB7mpxw <https://www.youtube.com/watch?v=Xhw5JB7mpxw>
**Video Title:** **Video Title:**
Module 01: Why WDS Matters - Are You a Factory Worker or a Linchpin Designer? Module 01: Why WDS Matters - Are You a Factory Worker or a Linchpin Designer?
@ -55,43 +55,43 @@ _To be added after video production based on transcript_
### **This Module** ### **This Module**
📖 **Module 01 Overview:** Complete lesson structure 📖 **Module 01 Overview:** Complete lesson structure
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-01-why-wds-matters/module-01-overview.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-01-why-wds-matters/module-01-overview.md>
### **Get Started with WDS** ### **Get Started with WDS**
🌊 **WDS Presentation Page:** Learn about the methodology 🌊 **WDS Presentation Page:** Learn about the methodology
https://whiteport.com/whiteport-design-studio/ <https://whiteport.com/whiteport-design-studio/>
🛠️ **Installation Guide:** Download IDE, Install WDS 🛠️ **Installation Guide:** Download IDE, Install WDS
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/installation.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/installation.md>
📖 **About WDS:** Philosophy and approach 📖 **About WDS:** Philosophy and approach
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/about-wds.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/about-wds.md>
### **Recommended Reading** ### **Recommended Reading**
📚 **Book:** "Linchpin: Are You Indispensable?" by Seth Godin (2010) 📚 **Book:** "Linchpin: Are You Indispensable?" by Seth Godin (2010)
https://www.amazon.com/Linchpin-Are-You-Indispensable-ebook/dp/B00354Y9ZU <https://www.amazon.com/Linchpin-Are-You-Indispensable-ebook/dp/B00354Y9ZU>
### **Community & Support** ### **Community & Support**
💬 **BMad Discord:** Join other linchpin designers 💬 **BMad Discord:** Join other linchpin designers
[Discord invite link] [Discord invite link]
📖 **GitHub Discussions:** Ask questions, share your journey 📖 **GitHub Discussions:** Ask questions, share your journey
https://github.com/whiteport-collective/whiteport-design-studio/discussions <https://github.com/whiteport-collective/whiteport-design-studio/discussions>
--- ---
## 🎓 Course Navigation ## 🎓 Course Navigation
**◀️ Previous Module:** Module 00 - Getting Started **◀️ Previous Module:** Module 00 - Getting Started
📺 Video: https://youtu.be/qYPYx01YLUc 📺 Video: <https://youtu.be/qYPYx01YLUc>
📖 Documentation: https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/00-course-overview/00-getting-started-overview.md 📖 Documentation: <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/00-course-overview/00-getting-started-overview.md>
**▶️ Next Module:** Module 02 - Installation & Setup **▶️ Next Module:** Module 02 - Installation & Setup
📺 Video: https://www.youtube.com/watch?v=tYifpxFVVks 📺 Video: <https://www.youtube.com/watch?v=tYifpxFVVks>
📖 Documentation: https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-02-installation-setup/module-02-overview.md 📖 Documentation: <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-02-installation-setup/module-02-overview.md>
**📚 Full Course Overview:** **📚 Full Course Overview:**
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/00-course-overview.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/00-course-overview.md>
--- ---

View File

@ -1,7 +1,7 @@
# YouTube Show Notes: Module 02 - Installation & Setup # YouTube Show Notes: Module 02 - Installation & Setup
**Video Link:** **Video Link:**
https://www.youtube.com/watch?v=tYifpxFVVks <https://www.youtube.com/watch?v=tYifpxFVVks>
**Video Title:** **Video Title:**
Module 02: Installation & Setup - From Zero to WDS-Ready in Under an Hour Module 02: Installation & Setup - From Zero to WDS-Ready in Under an Hour
@ -121,44 +121,44 @@ Your 8-phase WDS methodology folders:
### **This Module** ### **This Module**
📖 **Module 02 Overview:** Complete lesson structure 📖 **Module 02 Overview:** Complete lesson structure
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-02-installation-setup/module-02-overview.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-02-installation-setup/module-02-overview.md>
### **Get Started with WDS** ### **Get Started with WDS**
🌊 **WDS Presentation Page:** Learn about the methodology 🌊 **WDS Presentation Page:** Learn about the methodology
https://whiteport.com/whiteport-design-studio/ <https://whiteport.com/whiteport-design-studio/>
🛠️ **Installation Guide:** Download IDE, Install WDS 🛠️ **Installation Guide:** Download IDE, Install WDS
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/installation.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/installation.md>
📖 **Quick Start:** Get up and running fast 📖 **Quick Start:** Get up and running fast
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/quick-start.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/quick-start.md>
### **Download Links** ### **Download Links**
📥 **Download Cursor:** https://cursor.sh 📥 **Download Cursor:** <https://cursor.sh>
📥 **Download VS Code:** https://code.visualstudio.com 📥 **Download VS Code:** <https://code.visualstudio.com>
📥 **GitHub:** https://github.com 📥 **GitHub:** <https://github.com>
### **Community & Support** ### **Community & Support**
💬 **BMad Discord:** Real designers helping each other 💬 **BMad Discord:** Real designers helping each other
[Discord invite link] [Discord invite link]
📖 **GitHub Discussions:** Ask questions, share your setup 📖 **GitHub Discussions:** Ask questions, share your setup
https://github.com/whiteport-collective/whiteport-design-studio/discussions <https://github.com/whiteport-collective/whiteport-design-studio/discussions>
--- ---
## 🎓 Course Navigation ## 🎓 Course Navigation
**◀️ Previous Module:** Module 01 - Why WDS Matters **◀️ Previous Module:** Module 01 - Why WDS Matters
📺 Video: https://www.youtube.com/watch?v=Xhw5JB7mpxw 📺 Video: <https://www.youtube.com/watch?v=Xhw5JB7mpxw>
📖 Documentation: https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-01-why-wds-matters/module-01-overview.md 📖 Documentation: <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-01-why-wds-matters/module-01-overview.md>
**▶️ Next Module:** Module 03 - Alignment & Signoff **▶️ Next Module:** Module 03 - Alignment & Signoff
📺 Video: https://www.youtube.com/watch?v=TKjOLlU8UCE 📺 Video: <https://www.youtube.com/watch?v=TKjOLlU8UCE>
📖 Documentation: https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-03-alignment-signoff/module-03-overview.md 📖 Documentation: <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-03-alignment-signoff/module-03-overview.md>
**📚 Full Course Overview:** **📚 Full Course Overview:**
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/00-course-overview.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/00-course-overview.md>
--- ---

View File

@ -1,7 +1,7 @@
# YouTube Show Notes: Module 03 - Alignment & Signoff # YouTube Show Notes: Module 03 - Alignment & Signoff
**Video Link:** **Video Link:**
https://www.youtube.com/watch?v=TKjOLlU8UCE <https://www.youtube.com/watch?v=TKjOLlU8UCE>
**Video Title:** **Video Title:**
Module 03: Alignment & Signoff - Get Stakeholder Buy-In for Your Design Projects Module 03: Alignment & Signoff - Get Stakeholder Buy-In for Your Design Projects
@ -58,49 +58,49 @@ _To be added after video production based on transcript_
### **This Module** ### **This Module**
📖 **Module 03 Overview:** Complete lesson structure 📖 **Module 03 Overview:** Complete lesson structure
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-03-alignment-signoff/module-03-overview.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-03-alignment-signoff/module-03-overview.md>
📖 **Tutorial 03:** Step-by-step hands-on guide 📖 **Tutorial 03:** Step-by-step hands-on guide
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-03-alignment-signoff/tutorial-03.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-03-alignment-signoff/tutorial-03.md>
### **Deliverable Documentation** ### **Deliverable Documentation**
📖 **Project Pitch:** What it is and how to create it 📖 **Project Pitch:** What it is and how to create it
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/deliverables/project-pitch.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/deliverables/project-pitch.md>
📖 **Service Agreement:** Contract templates and guidance 📖 **Service Agreement:** Contract templates and guidance
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/deliverables/service-agreement.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/deliverables/service-agreement.md>
### **WDS Workflows** ### **WDS Workflows**
📖 **Alignment & Signoff Workflow:** Complete process guide 📖 **Alignment & Signoff Workflow:** Complete process guide
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/workflows/1-project-brief/alignment-signoff/workflow.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/workflows/1-project-brief/alignment-signoff/workflow.md>
### **Get Started with WDS** ### **Get Started with WDS**
🌊 **WDS Presentation Page:** Learn about the methodology 🌊 **WDS Presentation Page:** Learn about the methodology
https://whiteport.com/whiteport-design-studio/ <https://whiteport.com/whiteport-design-studio/>
🛠️ **Installation Guide:** Download IDE, Install WDS 🛠️ **Installation Guide:** Download IDE, Install WDS
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/installation.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/getting-started/installation.md>
### **Community & Support** ### **Community & Support**
💬 **BMad Discord:** Share alignment documents, ask questions about contracts 💬 **BMad Discord:** Share alignment documents, ask questions about contracts
[Discord invite link] [Discord invite link]
📖 **GitHub Discussions:** Ask questions, share your journey 📖 **GitHub Discussions:** Ask questions, share your journey
https://github.com/whiteport-collective/whiteport-design-studio/discussions <https://github.com/whiteport-collective/whiteport-design-studio/discussions>
--- ---
## 🎓 Course Navigation ## 🎓 Course Navigation
**◀️ Previous Module:** Module 02 - Installation & Setup **◀️ Previous Module:** Module 02 - Installation & Setup
📺 Video: https://www.youtube.com/watch?v=tYifpxFVVks 📺 Video: <https://www.youtube.com/watch?v=tYifpxFVVks>
📖 Documentation: https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-02-installation-setup/module-02-overview.md 📖 Documentation: <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-02-installation-setup/module-02-overview.md>
**▶️ Next Module:** Module 04 - Product Brief (Coming Soon) **▶️ Next Module:** Module 04 - Product Brief (Coming Soon)
📖 Documentation: https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-04-product-brief/tutorial-04.md 📖 Documentation: <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/module-04-product-brief/tutorial-04.md>
**📚 Full Course Overview:** **📚 Full Course Overview:**
https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/00-course-overview.md <https://github.com/whiteport-collective/whiteport-design-studio/blob/main/src/modules/wds/docs/learn-wds/00-course-overview.md>
--- ---

View File

@ -31,7 +31,7 @@ project_structure:
delivery: delivery:
format: "{{delivery_format}}" # prd | wordpress | figma | prototype | direct-code | other format: "{{delivery_format}}" # prd | wordpress | figma | prototype | direct-code | other
target_platform: "{{target_platform}}" # wordpress | react | vue | html | custom target_platform: "{{target_platform}}" # wordpress | react | vue | html | custom
requires_prd: {{requires_prd}} # true | false requires_prd: "{{requires_prd}}" # true | false
description: "{{delivery_description}}" description: "{{delivery_description}}"
# Examples: # Examples:
# - "WordPress page editor code with markup and content sections" # - "WordPress page editor code with markup and content sections"
@ -43,10 +43,10 @@ config:
folder_prefix: "{{folder_prefix}}" # letters or numbers folder_prefix: "{{folder_prefix}}" # letters or numbers
folder_case: "{{folder_case}}" # title or lowercase folder_case: "{{folder_case}}" # title or lowercase
brief_level: "{{brief_level}}" # simplified or complete brief_level: "{{brief_level}}" # simplified or complete
include_design_system: { { include_design_system } } include_design_system: "{{include_design_system}}"
component_library: "{{component_library}}" component_library: "{{component_library}}"
specification_language: "{{specification_language}}" # Language for writing specs (EN, SE, etc.) specification_language: "{{specification_language}}" # Language for writing specs (EN, SE, etc.)
product_languages: { { product_languages } } # Array of languages product supports product_languages: "{{product_languages}}" # Array of languages product supports
# Folder mapping (generated based on config) # Folder mapping (generated based on config)
folders: folders:

View File

@ -8,7 +8,7 @@
--- ---
### 1. The Realization ## 1. The Realization
**Framework**: Problem-Agitate-Solve (PAS) - Start here **Framework**: Problem-Agitate-Solve (PAS) - Start here
@ -45,7 +45,7 @@
--- ---
### 2. Why It Matters ## 2. Why It Matters
**Framework**: Value Proposition Canvas + Impact - Understanding why this matters and who we help **Framework**: Value Proposition Canvas + Impact - Understanding why this matters and who we help
@ -65,7 +65,7 @@
--- ---
### 3. How We See It Working ## 3. How We See It Working
**Questions to explore**: **Questions to explore**:
- "How do you envision this working?" - "How do you envision this working?"
@ -78,7 +78,7 @@
--- ---
### 4. Paths We Explored ## 4. Paths We Explored
**Questions to explore**: **Questions to explore**:
- "What other ways could we approach this?" - "What other ways could we approach this?"
@ -91,7 +91,7 @@
--- ---
### 5. Recommended Solution ## 5. Recommended Solution
**Questions to explore**: **Questions to explore**:
- "Which approach do you prefer?" - "Which approach do you prefer?"
@ -102,7 +102,7 @@
--- ---
### 6. The Path Forward ## 6. The Path Forward
**Purpose**: Explain how the work will be done practically - which WDS phases will be used and the workflow approach. **Purpose**: Explain how the work will be done practically - which WDS phases will be used and the workflow approach.
@ -130,7 +130,7 @@
--- ---
### 7. The Value We'll Create ## 7. The Value We'll Create
**Framework**: Business Case Framework - What's the return? **Framework**: Business Case Framework - What's the return?
@ -157,7 +157,7 @@
--- ---
### 8. Cost of Inaction ## 8. Cost of Inaction
**Framework**: Problem-Agitate-Solve (PAS) - Agitate the problem / Business Case Framework **Framework**: Problem-Agitate-Solve (PAS) - Agitate the problem / Business Case Framework
@ -181,7 +181,7 @@
--- ---
### 9. Our Commitment ## 9. Our Commitment
**Framework**: Business Case Framework - What are we committing to? **Framework**: Business Case Framework - What are we committing to?
@ -201,7 +201,7 @@
--- ---
### 10. Summary ## 10. Summary
**Questions to explore**: **Questions to explore**:
- "What are the key points?" - "What are the key points?"

View File

@ -1,3 +1,6 @@
/* eslint-disable n/no-unsupported-features/node-builtins */
/* global document, window */
/** /**
* PROTOTYPE DEV MODE * PROTOTYPE DEV MODE
* *
@ -40,21 +43,28 @@ let currentHighlightedElement = null;
// ============================================================================ // ============================================================================
function initDevMode() { function initDevMode() {
const toggleButton = document.getElementById('dev-mode-toggle'); const toggleButton = document.querySelector('#dev-mode-toggle');
const tooltip = document.getElementById('dev-mode-tooltip'); const tooltip = document.querySelector('#dev-mode-tooltip');
if (!toggleButton || !tooltip) { if (!toggleButton || !tooltip) {
console.warn('⚠️ Dev Mode: Toggle button or tooltip not found'); console.warn('⚠️ Dev Mode: Toggle button or tooltip not found');
return; return;
} }
// Check if user agent supports clipboard API
if (typeof navigator !== 'undefined' && navigator.clipboard) {
// Clipboard API available
} else {
console.warn('⚠️ Clipboard API not supported in this browser');
return;
}
setupKeyboardShortcuts(); setupKeyboardShortcuts();
setupToggleButton(toggleButton, tooltip); setupToggleButton(toggleButton, tooltip);
setupHoverHighlight(tooltip); setupHoverHighlight(tooltip);
setupClickCopy(); setupClickCopy();
console.log('%c💡 Dev Mode available: Press Ctrl+E or click the Dev Mode button', console.log('%c💡 Dev Mode available: Press Ctrl+E or click the Dev Mode button', 'color: #0066CC; font-weight: bold;');
'color: #0066CC; font-weight: bold;');
} }
// ============================================================================ // ============================================================================
@ -63,7 +73,7 @@ function initDevMode() {
function setupKeyboardShortcuts() { function setupKeyboardShortcuts() {
// Track Shift key for container selection // Track Shift key for container selection
document.addEventListener('keydown', function(e) { document.addEventListener('keydown', (e) => {
if (e.key === 'Shift') { if (e.key === 'Shift') {
// Don't activate if user is typing in a form field // Don't activate if user is typing in a form field
if (isTypingInField()) { if (isTypingInField()) {
@ -73,25 +83,23 @@ function setupKeyboardShortcuts() {
shiftKeyPressed = true; shiftKeyPressed = true;
document.body.classList.add('shift-held'); document.body.classList.add('shift-held');
if (devModeActive) { if (devModeActive) {
console.log('%c⬆ Shift held: Click any element to copy its Object ID', console.log('%c⬆ Shift held: Click any element to copy its Object ID', 'color: #10B981; font-weight: bold;');
'color: #10B981; font-weight: bold;');
} }
} }
// Ctrl+E toggle // Ctrl+E toggle
if (e.ctrlKey && e.key === 'e') { if (e.ctrlKey && e.key === 'e') {
e.preventDefault(); e.preventDefault();
document.getElementById('dev-mode-toggle')?.click(); document.querySelector('#dev-mode-toggle')?.click();
} }
}); });
document.addEventListener('keyup', function(e) { document.addEventListener('keyup', (e) => {
if (e.key === 'Shift') { if (e.key === 'Shift') {
shiftKeyPressed = false; shiftKeyPressed = false;
document.body.classList.remove('shift-held'); document.body.classList.remove('shift-held');
if (devModeActive) { if (devModeActive) {
console.log('%c⬇ Shift released: Prototype works normally (hold Shift to copy)', console.log('%c⬇ Shift released: Prototype works normally (hold Shift to copy)', 'color: #6b7280;');
'color: #6b7280;');
} }
} }
}); });
@ -102,8 +110,13 @@ function setupKeyboardShortcuts() {
// ============================================================================ // ============================================================================
function setupToggleButton(toggleButton, tooltip) { function setupToggleButton(toggleButton, tooltip) {
toggleButton.addEventListener('click', function(e) { toggleButton.addEventListener('click', function (e) {
e.stopPropagation(); e.stopPropagation();
if (typeof globalThis !== 'undefined') {
globalThis.devModeActive = true;
} else if (globalThis.window !== undefined) {
globalThis.devModeActive = true;
}
devModeActive = !devModeActive; devModeActive = !devModeActive;
// Update UI // Update UI
@ -138,7 +151,7 @@ function setupToggleButton(toggleButton, tooltip) {
function setupHoverHighlight(tooltip) { function setupHoverHighlight(tooltip) {
// Show tooltip and highlight on hover // Show tooltip and highlight on hover
document.addEventListener('mouseover', function(e) { document.addEventListener('mouseover', function (e) {
if (!devModeActive) return; if (!devModeActive) return;
// Don't highlight if user is typing in a field // Don't highlight if user is typing in a field
@ -172,14 +185,14 @@ function setupHoverHighlight(tooltip) {
}); });
// Update tooltip position on mouse move // Update tooltip position on mouse move
document.addEventListener('mousemove', function(e) { document.addEventListener('mousemove', function (e) {
if (devModeActive && tooltip.style.display === 'block') { if (devModeActive && tooltip.style.display === 'block') {
updateTooltipPosition(e, tooltip); updateTooltipPosition(e, tooltip);
} }
}); });
// Clear highlight on mouse out // Clear highlight on mouse out
document.addEventListener('mouseout', function(e) { document.addEventListener('mouseout', function (e) {
if (!devModeActive) return; if (!devModeActive) return;
if (e.target.id) { if (e.target.id) {
tooltip.style.display = 'none'; tooltip.style.display = 'none';
@ -194,7 +207,9 @@ function setupHoverHighlight(tooltip) {
function setupClickCopy() { function setupClickCopy() {
// Use capture phase to intercept clicks with Shift // Use capture phase to intercept clicks with Shift
document.addEventListener('click', function(e) { document.addEventListener(
'click',
function (e) {
if (!devModeActive) return; if (!devModeActive) return;
// Allow toggle button to work normally // Allow toggle button to work normally
@ -231,7 +246,9 @@ function setupClickCopy() {
showCopyFeedback(element, objectId); showCopyFeedback(element, objectId);
return false; return false;
}, true); // Capture phase },
true,
); // Capture phase
} }
// ============================================================================ // ============================================================================
@ -250,58 +267,13 @@ function findElementWithId(element) {
return current; return current;
} }
function findParentContainer(element) {
let current = element;
const maxLevels = 10;
let level = 0;
// Try to find semantic container parent first
while (current && current.id !== 'app' && level < maxLevels) {
if (current.parentElement && current.parentElement.id) {
const parentId = current.parentElement.id;
const parent = current.parentElement;
// Prefer semantic containers
if (parentId.includes('section') ||
parentId.includes('content') ||
parentId.includes('container') ||
parentId.includes('group') ||
parentId.includes('tabs') ||
parentId.includes('widget') ||
parentId.includes('modal') ||
parent.classList.contains('section') ||
parent.classList.contains('container') ||
parent.classList.contains('group')) {
return parent;
}
}
current = current.parentElement;
level++;
}
// Fallback: find any parent with ID
current = element.parentElement;
level = 0;
while (current && level < maxLevels) {
if (current.id && current.id !== 'app') {
return current;
}
current = current.parentElement;
level++;
}
return element;
}
function isSystemElement(id) { function isSystemElement(id) {
const systemIds = ['app', 'dev-mode-toggle', 'dev-mode-tooltip']; const systemIds = ['app', 'dev-mode-toggle', 'dev-mode-tooltip'];
return systemIds.includes(id); return systemIds.includes(id);
} }
function isToggleButton(element) { function isToggleButton(element) {
return element.id === 'dev-mode-toggle' || return element.id === 'dev-mode-toggle' || element.closest('#dev-mode-toggle') || element.classList.contains('dev-mode-toggle');
element.closest('#dev-mode-toggle') ||
element.classList.contains('dev-mode-toggle');
} }
function isTypingInField() { function isTypingInField() {
@ -312,10 +284,7 @@ function isTypingInField() {
const isEditable = activeElement.isContentEditable; const isEditable = activeElement.isContentEditable;
// Check if user is currently typing in a form field // Check if user is currently typing in a form field
return tagName === 'input' || return tagName === 'input' || tagName === 'textarea' || tagName === 'select' || isEditable;
tagName === 'textarea' ||
tagName === 'select' ||
isEditable;
} }
function isFormElement(element) { function isFormElement(element) {
@ -325,10 +294,7 @@ function isFormElement(element) {
const isEditable = element.isContentEditable; const isEditable = element.isContentEditable;
// Check if the clicked element is a form element // Check if the clicked element is a form element
return tagName === 'input' || return tagName === 'input' || tagName === 'textarea' || tagName === 'select' || isEditable;
tagName === 'textarea' ||
tagName === 'select' ||
isEditable;
} }
function highlightElement(element, isShiftHeld) { function highlightElement(element, isShiftHeld) {
@ -370,13 +336,14 @@ function updateTooltipPosition(e, tooltip) {
} }
function copyToClipboard(text) { function copyToClipboard(text) {
if (navigator.clipboard && navigator.clipboard.writeText) { if (typeof navigator !== 'undefined' && navigator.clipboard && navigator.clipboard.writeText) {
navigator.clipboard.writeText(text) navigator.clipboard
.writeText(text)
.then(() => { .then(() => {
console.log(`📋 Copied to clipboard: ${text}`); console.log(`📋 Copied to clipboard: ${text}`);
}) })
.catch(err => { .catch((error) => {
console.error('Failed to copy:', err); console.error('Dev Mode error:', error);
fallbackCopy(text); fallbackCopy(text);
}); });
} else { } else {
@ -389,18 +356,18 @@ function fallbackCopy(text) {
textarea.value = text; textarea.value = text;
textarea.style.position = 'fixed'; textarea.style.position = 'fixed';
textarea.style.left = '-999999px'; textarea.style.left = '-999999px';
document.body.appendChild(textarea); document.body.append(textarea);
textarea.focus(); textarea.focus();
textarea.select(); textarea.select();
try { try {
document.execCommand('copy'); document.execCommand('copy');
console.log(`📋 Copied (fallback): ${text}`); console.log(`📋 Copied (fallback): ${text}`);
} catch (err) { } catch (error) {
console.error('Fallback copy failed:', err); console.error('Dev Mode error:', error);
} }
document.body.removeChild(textarea); textarea.remove();
} }
function showCopyFeedback(element, objectId) { function showCopyFeedback(element, objectId) {
@ -424,10 +391,10 @@ function showCopyFeedback(element, objectId) {
pointer-events: none; pointer-events: none;
`; `;
document.body.appendChild(feedback); document.body.append(feedback);
setTimeout(() => { setTimeout(() => {
document.body.removeChild(feedback); feedback.remove();
}, 1500); }, 1500);
// Flash element // Flash element
@ -448,17 +415,16 @@ style.textContent = `
100% { opacity: 0; transform: translate(-50%, -50%) scale(0.9); } 100% { opacity: 0; transform: translate(-50%, -50%) scale(0.9); }
} }
`; `;
document.head.appendChild(style); document.head.append(style);
// ============================================================================ // ============================================================================
// EXPORT // EXPORT
// ============================================================================ // ============================================================================
// Make available globally // Make available globally
window.initDevMode = initDevMode; globalThis.initDevMode = initDevMode;
// Auto-initialize if this is included as module // Export for use in other scripts
if (typeof module !== 'undefined' && module.exports) { if (typeof globalThis !== 'undefined' && globalThis.exports) {
module.exports = { initDevMode }; globalThis.exports = { initDevMode };
} }

View File

@ -51,11 +51,11 @@ design_tokens:
tailwind_config: tailwind_config:
theme_extend: theme_extend:
colors: colors:
'[project-name]': "[project-name]":
50: '#eff6ff' 50: "#eff6ff"
500: '#2563eb' 500: "#2563eb"
600: '#1d4ed8' 600: "#1d4ed8"
700: '#1e40af' 700: "#1e40af"
fontFamily: fontFamily:
sans: "['Inter', 'system-ui', 'sans-serif']" sans: "['Inter', 'system-ui', 'sans-serif']"
@ -200,34 +200,34 @@ navigation:
testing_checklist: testing_checklist:
functionality: functionality:
- [ ] All form fields work - "[ ] All form fields work"
- [ ] Validation shows errors correctly - "[ ] Validation shows errors correctly"
- [ ] Submit button works - "[ ] Submit button works"
- [ ] Loading states display - "[ ] Loading states display"
- [ ] Success feedback shows - "[ ] Success feedback shows"
- [ ] Error handling works - "[ ] Error handling works"
- [ ] Navigation works (back, next) - "[ ] Navigation works (back, next)"
- [ ] Data persists (reload page test) - "[ ] Data persists (reload page test)"
mobile_testing: mobile_testing:
- [ ] Viewport is correct width - "[ ] Viewport is correct width"
- [ ] All tap targets min 44x44px - "[ ] All tap targets min 44x44px"
- [ ] Text is readable (min 16px) - "[ ] Text is readable (min 16px)"
- [ ] No horizontal scroll - "[ ] No horizontal scroll"
- [ ] Touch gestures work (if applicable) - "[ ] Touch gestures work (if applicable)"
code_quality: code_quality:
- [ ] All Object IDs present - "[ ] All Object IDs present"
- [ ] Console logs helpful - "[ ] Console logs helpful"
- [ ] No console errors - "[ ] No console errors"
- [ ] Tailwind classes properly used - "[ ] Tailwind classes properly used"
- [ ] Functions documented - "[ ] Functions documented"
accessibility: accessibility:
- [ ] Keyboard navigation works - "[ ] Keyboard navigation works"
- [ ] Form labels present - "[ ] Form labels present"
- [ ] Error messages clear - "[ ] Error messages clear"
- [ ] Focus states visible - "[ ] Focus states visible"
# ============================================================================ # ============================================================================
# MIGRATION NOTES (for production) # MIGRATION NOTES (for production)
@ -262,4 +262,3 @@ definition_of_done:
- "No console errors" - "No console errors"
- "Code is clean" - "Code is clean"
- "Story files document all sections" - "Story files document all sections"

View File

@ -0,0 +1,18 @@
---
name: UX Design Workflow
description: Transform ideas into detailed visual specifications through scenario-driven design using step-file architecture
main_config: "{project-root}/{bmad_folder}/wds/config.yaml"
web_bundle: true
---
# Workflow configuration for UX Design process
# This workflow handles the complete UX design phase from concept to implementation
phases:
- phase_1_project_brief
- phase_2_trigger_mapping
- phase_3_prd_platform
- phase_4_ux_design
- phase_5_design_system
- phase_6_design_deliveries
- phase_7_testing
- phase_8_ongoing_development

View File

@ -4,4 +4,15 @@ description: Transform ideas into detailed visual specifications through scenari
main_config: "{project-root}/{bmad_folder}/wds/config.yaml" main_config: "{project-root}/{bmad_folder}/wds/config.yaml"
web_bundle: true web_bundle: true
--- ---
# Workflow configuration for UX Design process
# This workflow handles the complete UX design phase from concept to implementation
phases:
- phase_1_project_brief
- phase_2_trigger_mapping
- phase_3_prd_platform
- phase_4_ux_design
- phase_5_design_system
- phase_6_design_deliveries
- phase_7_testing
- phase_8_ongoing_development

View File

@ -32,7 +32,6 @@ vtc:
# What motivates this user? # What motivates this user?
# ========================================== # ==========================================
driving_forces: driving_forces:
# Positive: Wishes, aspirations, what they want to achieve # Positive: Wishes, aspirations, what they want to achieve
positive: positive:
- "Wish to be the local beauty authority" - "Wish to be the local beauty authority"

View File

@ -20,12 +20,12 @@ project:
# Design System Configuration # Design System Configuration
design_system: design_system:
enabled: { { DESIGN_SYSTEM_ENABLED } } # true | false enabled: "{{DESIGN_SYSTEM_ENABLED}}" # true | false
mode: "{{DESIGN_SYSTEM_MODE}}" # "none" | "custom" | "library" mode: "{{DESIGN_SYSTEM_MODE}}" # "none" | "custom" | "library"
# If mode: custom # If mode: custom
figma: figma:
enabled: { { FIGMA_ENABLED } } # true | false enabled: "{{FIGMA_ENABLED}}" # true | false
file_url: "{{FIGMA_URL}}" # Figma file URL (if applicable) file_url: "{{FIGMA_URL}}" # Figma file URL (if applicable)
# If mode: library # If mode: library
@ -39,17 +39,17 @@ sketching:
# If tool: excalidraw # If tool: excalidraw
excalidraw: excalidraw:
enabled: { { EXCALIDRAW_ENABLED } } # true | false enabled: "{{EXCALIDRAW_ENABLED}}" # true | false
# Auto-export to PNG/SVG on save # Auto-export to PNG/SVG on save
auto_export: { { AUTO_EXPORT } } # true | false auto_export: "{{AUTO_EXPORT}}" # true | false
# Load WDS component library # Load WDS component library
use_library: { { USE_LIBRARY } } # true | false use_library: "{{USE_LIBRARY}}" # true | false
# Grid settings # Grid settings
grid_size: { { GRID_SIZE } } # pixels (recommended: 20) grid_size: "{{GRID_SIZE}}" # pixels (recommended: 20)
snap_to_grid: { { SNAP_TO_GRID } } # true | false snap_to_grid: "{{SNAP_TO_GRID}}" # true | false
# Default theme # Default theme
theme: "{{THEME}}" # "light" | "dark" theme: "{{THEME}}" # "light" | "dark"
@ -69,13 +69,13 @@ output:
workflow: workflow:
# Phase 4: UX Design # Phase 4: UX Design
ux_design: ux_design:
sketch_first: { { SKETCH_FIRST } } # true | false sketch_first: "{{SKETCH_FIRST}}" # true | false
ai_suggestions: { { AI_SUGGESTIONS } } # true | false ai_suggestions: "{{AI_SUGGESTIONS}}" # true | false
# Phase 5: Design System # Phase 5: Design System
design_system: design_system:
auto_extract: { { AUTO_EXTRACT } } # true | false auto_extract: "{{AUTO_EXTRACT}}" # true | false
similarity_threshold: { { SIMILARITY_THRESHOLD } } # 0.0-1.0 (recommended: 0.7) similarity_threshold: "{{SIMILARITY_THRESHOLD}}" # 0.0-1.0 (recommended: 0.7)
# Team Configuration # Team Configuration
team: team:

View File

@ -108,7 +108,7 @@ phases:
{{USER_INTENT_PHASE_4}} {{USER_INTENT_PHASE_4}}
# Scenario-level tracking # Scenario-level tracking
scenarios: scenarios: []
# Example structure - populated as scenarios are created: # Example structure - populated as scenarios are created:
# - id: "01-customer-onboarding" # - id: "01-customer-onboarding"
# name: "Customer Onboarding" # name: "Customer Onboarding"
@ -267,171 +267,163 @@ update_history:
# phase: "phase_4_ux_design" # phase: "phase_4_ux_design"
# changes: "Started Scenario 01: Customer Onboarding" # changes: "Started Scenario 01: Customer Onboarding"
--- # ============================================================================
# AGENT INSTRUCTIONS FOR USING THIS FILE # AGENT INSTRUCTIONS FOR USING THIS FILE
# ============================================================================
## During Project Initiation (Saga WDS Analyst Agent): # During Project Initiation (Saga WDS Analyst Agent):
#
**When creating the Product Brief**, walk through each phase and ask about user intentions: # When creating the Product Brief, walk through each phase and ask about user intentions:
#
### Phase 1: Project Brief (Always included) # Phase 1: Project Brief (Always included)
*No question - this is where we are now!* # No question - this is where we are now!
#
### Phase 2: Trigger Mapping # Phase 2: Trigger Mapping
**Ask**: "What are your intentions for Trigger Mapping? This phase helps us identify target users, personas, and business goals. # Ask: What are your intentions for Trigger Mapping? This phase helps us identify target users, personas, and business goals.
# Is this a customer-facing product where understanding user triggers is critical? Or an internal tool where we might skip this phase?
Is this a customer-facing product where understanding user triggers is critical? Or an internal tool where we might skip this phase?" #
# Capture: User's answer → {{USER_INTENT_PHASE_2}}
**Capture**: User's answer → `{{USER_INTENT_PHASE_2}}` # Decision: Set active: true or active: false based on answer
**Decision**: Set `active: true` or `active: false` based on answer #
# Phase 3: PRD Platform
### Phase 3: PRD Platform # Ask: What are your intentions for technical foundation? Do you already have a tech stack in mind, or do you need help defining architecture, data model, and infrastructure requirements?
**Ask**: "What are your intentions for the technical foundation? Do you already have a tech stack in mind, or do you need help defining the architecture, data model, and infrastructure requirements?" #
# Capture: User's answer → {{USER_INTENT_PHASE_3}}
**Capture**: User's answer → `{{USER_INTENT_PHASE_3}}` #
# Phase 4: UX Design
### Phase 4: UX Design # Ask: What are your intentions for UX Design? How many user scenarios or flows do you envision? Are you thinking MVP-focused (2-3 core scenarios) or comprehensive (5+ scenarios)?
**Ask**: "What are your intentions for UX Design? How many user scenarios or flows do you envision? Are you thinking MVP-focused (2-3 core scenarios) or comprehensive (5+ scenarios)?" #
# Capture: User's answer → {{USER_INTENT_PHASE_4}}
**Capture**: User's answer → `{{USER_INTENT_PHASE_4}}` # Note: Also capture estimated scenarios_planned number
**Note**: Also capture estimated `scenarios_planned` number #
# Phase 5: Design System
### Phase 5: Design System # Ask: What are your intentions for a Design System? Are you:
**Ask**: "What are your intentions for a Design System? Are you: # - Using an existing component library (shadcn/ui, MUI)?
- Using an existing component library (shadcn/ui, MUI)? # - Building custom components?
- Building custom components? # - Creating a multi-product design system?
- Creating a multi-product design system? # - Skipping this for MVP?
- Skipping this for MVP?" #
# Capture: User's answer → {{USER_INTENT_PHASE_5}}
**Capture**: User's answer → `{{USER_INTENT_PHASE_5}}` # Decision: Set active: false if skipping, add skip_reason
**Decision**: Set `active: false` if skipping, add `skip_reason` #
# Phase 6: Design Deliveries
### Phase 6: Design Deliveries # Ask: What are your intentions for design deliveries? Will you be handing off to a development team, or implementing directly from specifications?
**Ask**: "What are your intentions for design deliveries? Will you be handing off to a development team, or implementing directly from specifications?" #
# Capture: User's answer → {{USER_INTENT_PHASE_6}}
**Capture**: User's answer → `{{USER_INTENT_PHASE_6}}` #
# Phase 7: Testing
### Phase 7: Testing # Ask: What are your intentions for testing? Do you want to validate implementation against design specs, or handle testing separately?
**Ask**: "What are your intentions for testing? Do you want to validate the implementation against design specs, or handle testing separately?" #
# Capture: User's answer → {{USER_INTENT_PHASE_7}}
**Capture**: User's answer → `{{USER_INTENT_PHASE_7}}` #
# Phase 8: Ongoing Development
### Phase 8: Ongoing Development # Ask: Is this a new product or an existing product needing improvements?
**Ask**: "Is this a new product or an existing product needing improvements?" #
# Capture: User's answer → {{USER_INTENT_PHASE_8}}
**Capture**: User's answer → `{{USER_INTENT_PHASE_8}}` # Decision: Set active: false for new products
**Decision**: Set `active: false` for new products #
# ---------------------------------------------------------------------------
--- #
# On Agent Activation (ALL WDS Agents):
## On Agent Activation (ALL WDS Agents): #
# 1. CHECK if .wds-project-outline.yaml exists in docs/ or project root
1. **CHECK** if `.wds-project-outline.yaml` exists in docs/ or project root # 2. READ the outline to understand:
2. **READ** the outline to understand: # - Which phases are active
- Which phases are active # - User's intentions for each phase
- User's intentions for each phase # - Current status of each phase
- Current status of each phase # - What work has been completed
- What work has been completed # - What work is next
- What work is next # 3. SKIP analysis of inactive phases (active: false)
3. **SKIP** analysis of inactive phases (active: false) # 4. REPORT status based on outline (much faster than folder scanning)
4. **REPORT** status based on outline (much faster than folder scanning) #
# ---------------------------------------------------------------------------
--- #
# When Starting Scenario Work (Freya WDS Designer Agent):
## When Starting Scenario Work (Freya WDS Designer Agent): #
# Add new scenario to the outline:
Add new scenario to the outline: #
# yaml
```yaml # scenarios:
scenarios: # - id: "01-customer-onboarding"
- id: "01-customer-onboarding" # name: "Customer Onboarding"
name: "Customer Onboarding" # status: "in_progress"
status: "in_progress" # pages_planned: 9
pages_planned: 9 # pages_specified: 0
pages_specified: 0 # pages_implemented: 0
pages_implemented: 0 # started_date: "2024-12-10"
started_date: "2024-12-10" # completed_date: null
completed_date: null # intent: "Onboard new users from landing page to active family"
intent: "Onboard new users from landing page to active family" # artifacts: []
artifacts: [] #
``` # ---------------------------------------------------------------------------
#
--- # When Completing Scenario Work (Freya WDS Designer Agent):
#
## When Completing Scenario Work (Freya WDS Designer Agent): # Update scenario status:
#
Update scenario status: # yaml
# - id: "01-customer-onboarding"
```yaml # name: "Customer Onboarding"
- id: "01-customer-onboarding" # status: "complete"
name: "Customer Onboarding" # pages_planned: 9
status: "complete" # pages_specified: 9
pages_planned: 9 # pages_implemented: 5
pages_specified: 9 # started_date: "2024-12-01"
pages_implemented: 5 # completed_date: "2024-12-08"
started_date: "2024-12-01" # intent: "Onboard new users from landing page to active family"
completed_date: "2024-12-08" # artifacts:
intent: "Onboard new users from landing page to active family" # - "docs/4-ux-design/01-customer-onboarding/00-scenario-overview.md"
artifacts: # - "docs/4-ux-design/01-customer-onboarding/1.1-start-page.md"
- "docs/4-ux-design/01-customer-onboarding/00-scenario-overview.md" # - "docs/4-ux-design/01-customer-onboarding/sketches/*.excalidraw"
- "docs/4-ux-design/01-customer-onboarding/1.1-start-page.md" #
- "docs/4-ux-design/01-customer-onboarding/sketches/*.excalidraw" # Update phase-level counters:
``` # yaml
# scenarios_complete: 1 # Increment
Update phase-level counters: #
```yaml # ---------------------------------------------------------------------------
scenarios_complete: 1 # Increment #
``` # When Starting/Completing Phase Work (ALL Agents):
#
--- # Starting:
# yaml
## When Starting/Completing Phase Work (ALL Agents): # status: "in_progress"
# started_date: "2024-12-10"
**Starting:** #
```yaml # Completing:
status: "in_progress" # yaml
started_date: "2024-12-10" # status: "complete"
``` # completed_date: "2024-12-10"
# completed_by: "Freya WDS Designer Agent"
**Completing:** # artifacts:
```yaml # - "docs/4-ux-design/01-onboarding/*.md"
status: "complete" #
completed_date: "2024-12-10" # Add update history entry:
completed_by: "Freya WDS Designer Agent" # yaml
artifacts: # update_history:
- "docs/4-ux-design/01-onboarding/*.md" # - date: "2024-12-10"
``` # agent: "freya-designer"
# action: "completed"
Add update history entry: # phase: "phase_4_ux_design"
```yaml # changes: "Completed Scenario 01: 9 pages specified with prototypes"
update_history: #
- date: "2024-12-10" # ---------------------------------------------------------------------------
agent: "freya-designer" #
action: "completed" # Benefits:
phase: "phase_4_ux_design" #
changes: "Completed Scenario 01: 9 pages specified with prototypes" # ✅ User-driven planning - captures intentions upfront during project initiation
``` # ✅ 5x faster agent activation - no folder scanning needed
# ✅ Scenario-level tracking - granular progress visibility within UX Design phase
--- # ✅ Always up to date - agents update as they work
# ✅ Clear intent - explains WHY phases are skipped AND user's goals for each phase
## Benefits: # ✅ Project memory - tracks who did what and when
# ✅ Better recommendations - agents know exactly what's next
✅ **User-driven planning** - captures intentions upfront during project initiation #
✅ **5x faster agent activation** - no folder scanning needed # ---------------------------------------------------------------------------
✅ **Scenario-level tracking** - granular progress visibility within UX Design phase #
✅ **Always up to date** - agents update as they work # File Location:
✅ **Clear intent** - explains WHY phases are skipped AND user's goals for each phase #
✅ **Project memory** - tracks who did what and when # - Preferred: docs/.wds-project-outline.yaml
✅ **Better recommendations** - agents know exactly what's next # - Fallback: .wds-project-outline.yaml (project root)
# - Created by: Saga WDS Analyst Agent during Project Brief phase
--- # - Updated by: ALL WDS agents as work progresses
## File Location:
- Preferred: `docs/.wds-project-outline.yaml`
- Fallback: `.wds-project-outline.yaml` (project root)
- Created by: Saga WDS Analyst Agent during Project Brief phase
- Updated by: ALL WDS agents as work progresses