whiteport-design-studio 0.2.2 → 0.3.0

package/tools/cli/lib/ui.js

@@ -6,7 +6,10 @@ const chalk = require('chalk');
 const figlet = require('figlet');
 const inquirer = require('inquirer').default || require('inquirer');
 const path = require('node:path');
-const { getIdeChoices } = require('./ide-configs');
+const fs = require('fs-extra');
+
+const WDS_FOLDER = '_bmad/wds';
+const LEGACY_WDS_FOLDER = '_wds';
 
 class UI {
   /**
@@ -23,6 +26,26 @@ class UI {
     console.log(chalk.dim('  Strategic design methodology for AI-powered workflows\n'));
   }
 
+  /**
+   * Detect existing WDS installation and determine folder path
+   */
+  async detectInstallation(projectDir) {
+    const hasBmadWds = await fs.pathExists(path.join(projectDir, WDS_FOLDER));
+    const hasLegacyWds = await fs.pathExists(path.join(projectDir, LEGACY_WDS_FOLDER));
+    const hasBmadDir = await fs.pathExists(path.join(projectDir, '_bmad'));
+
+    if (hasBmadWds) {
+      return { type: 'bmad', folder: WDS_FOLDER };
+    }
+    if (hasLegacyWds) {
+      return { type: 'legacy', folder: LEGACY_WDS_FOLDER };
+    }
+    if (hasBmadDir) {
+      return { type: 'bmad-ready', folder: WDS_FOLDER };
+    }
+    return { type: 'fresh', folder: WDS_FOLDER };
+  }
+
   /**
    * Run the full prompt flow and return config
    */
@@ -30,73 +53,150 @@ class UI {
     this.displayBanner();
 
     const projectDir = process.cwd();
+    const defaultProjectName = path.basename(projectDir);
+    const detection = await this.detectInstallation(projectDir);
+
     console.log(chalk.white(`  Target: ${chalk.cyan(projectDir)}`));
-    console.log(chalk.dim(`  Agents and workflows will be installed in ${chalk.white('_wds/')}\n`));
 
-    // Confirm directory
-    const { confirmDir } = await inquirer.prompt([
-      {
-        type: 'confirm',
-        name: 'confirmDir',
-        message: 'Install WDS in this directory?',
-        default: true,
-      },
-    ]);
+    let wdsFolder = detection.folder;
+    let action = 'fresh';
+
+    // --- Existing installation: ask update/fresh/migrate FIRST ---
+    if (detection.type === 'legacy') {
+      console.log(chalk.yellow(`\n  Found legacy installation at ${chalk.white(LEGACY_WDS_FOLDER + '/')}`));
+      console.log(chalk.dim(`  BMAD standard path is ${chalk.white(WDS_FOLDER + '/')}\n`));
 
-    if (!confirmDir) {
-      return { cancelled: true };
+      const { choice } = await inquirer.prompt([
+        {
+          type: 'list',
+          name: 'choice',
+          message: 'How would you like to proceed?',
+          choices: [
+            { name: `Update & migrate to ${WDS_FOLDER}/ (recommended)`, value: 'migrate-update' },
+            { name: `Update at ${LEGACY_WDS_FOLDER}/ (keep legacy path)`, value: 'legacy-update' },
+            { name: 'Fresh install (remove everything and start over)', value: 'fresh' },
+            { name: 'Cancel', value: 'cancel' },
+          ],
+        },
+      ]);
+
+      if (choice === 'cancel') return { cancelled: true };
+
+      if (choice === 'migrate-update') {
+        action = 'update';
+        // wdsFolder stays as WDS_FOLDER (_bmad/wds)
+      } else if (choice === 'legacy-update') {
+        action = 'update';
+        wdsFolder = LEGACY_WDS_FOLDER;
+      } else {
+        action = 'fresh';
+      }
+    } else if (detection.type === 'bmad') {
+      console.log(chalk.dim(`\n  Found existing installation at ${chalk.white(WDS_FOLDER + '/')}\n`));
+
+      const { choice } = await inquirer.prompt([
+        {
+          type: 'list',
+          name: 'choice',
+          message: 'What would you like to do?',
+          choices: [
+            { name: 'Update - Replace WDS files, keep config.yaml', value: 'update' },
+            { name: 'Fresh install - Remove everything and start over', value: 'fresh' },
+            { name: 'Cancel', value: 'cancel' },
+          ],
+        },
+      ]);
+
+      if (choice === 'cancel') return { cancelled: true };
+      action = choice;
+    } else {
+      console.log(chalk.dim(`  Agents and workflows will be installed in ${chalk.white(wdsFolder + '/')}\n`));
     }
 
-    // Collect configuration
+    // --- Update: skip config questions, config.yaml will be preserved ---
+    if (action === 'update') {
+      console.log(chalk.dim('  Existing config.yaml will be preserved.\n'));
+
+      return {
+        projectDir,
+        wdsFolder,
+        _detection: detection,
+        _action: action,
+        cancelled: false,
+      };
+    }
+
+    // --- Fresh install: ask all config questions ---
     const answers = await inquirer.prompt([
       {
         type: 'input',
-        name: 'user_name',
-        message: 'Your name (agents will greet you by name):',
-        default: 'Designer',
+        name: 'project_name',
+        message: 'Project name:',
+        default: defaultProjectName,
+      },
+      {
+        type: 'input',
+        name: 'root_folder',
+        message: 'Output folder name:',
+        default: 'design-process',
       },
       {
         type: 'list',
-        name: 'project_type',
-        message: 'What type of project are you working on?',
+        name: 'starting_point',
+        message: 'Do you need to create a pitch deck & project contract before starting the project?',
         choices: [
-          { name: 'Digital Product - Multiple scenarios with more complex structure', value: 'digital_product' },
-          { name: 'Single Scenario - Simple web sites and flat navigation', value: 'single_scenario' },
-          { name: 'Single Page - Landing pages or simple one page web sites', value: 'single_page' },
-          { name: 'Custom - Specialized structure, define later', value: 'custom' },
+          { name: 'No, start directly with the Product Brief', value: 'brief' },
+          { name: 'Yes, start with a project pitch', value: 'pitch' },
         ],
-        default: 'digital_product',
+        default: 'brief',
       },
       {
-        type: 'list',
-        name: 'design_experience',
-        message: 'What is your design experience level?',
+        type: 'checkbox',
+        name: 'ides',
+        message: 'Which tools/IDEs are you using? (use spacebar to select)',
         choices: [
-          { name: 'Beginner - New to UX design, provide detailed guidance', value: 'beginner' },
-          { name: 'Intermediate - Familiar with design concepts, balanced approach', value: 'intermediate' },
-          { name: 'Expert - Experienced designer, be direct and efficient', value: 'expert' },
+          { name: 'Atlassian Rovo Dev', value: 'rovo-dev', checked: false },
+          { name: 'Auggie CLI', value: 'auggie', checked: false },
+          { name: 'Claude Code', value: 'claude-code', checked: false },
+          { name: 'Cline', value: 'cline', checked: false },
+          { name: 'Codex', value: 'codex', checked: false },
+          { name: 'Crush', value: 'crush', checked: false },
+          { name: 'Cursor', value: 'cursor', checked: false },
+          { name: 'Gemini CLI', value: 'gemini', checked: false },
+          { name: 'GitHub Copilot', value: 'github-copilot', checked: false },
+          { name: 'Google Antigravity', value: 'antigravity', checked: false },
+          { name: 'iFlow CLI', value: 'iflow', checked: false },
+          { name: 'Kilo Code', value: 'kilo', checked: false },
+          { name: 'Kiro CLI', value: 'kiro-cli', checked: false },
+          { name: 'OpenCode', value: 'opencode', checked: false },
+          { name: 'Qwen Code', value: 'qwen', checked: false },
+          { name: 'Roo Code', value: 'roo', checked: false },
+          { name: 'Trae', value: 'trae', checked: false },
+          { name: 'VS Code', value: 'vscode', checked: false },
+          { name: 'Windsurf', value: 'windsurf', checked: false },
+          { name: 'Other', value: 'other', checked: false },
         ],
-        default: 'intermediate',
+        validate: (answers) => {
+          if (!answers || answers.length === 0) {
+            return 'At least one IDE must be selected';
+          }
+          return true;
+        },
       },
       {
         type: 'confirm',
-        name: 'include_learning',
-        message: 'Include learning & reference material in _wds-learn/?',
+        name: 'install_learning',
+        message: 'Install learning & reference material?',
         default: true,
       },
-      {
-        type: 'checkbox',
-        name: 'ides',
-        message: 'Which AI IDE/tools are you using? (Space to select, Enter to confirm)',
-        choices: getIdeChoices(),
-        validate: (answer) => (answer.length > 0 ? true : 'Select at least one IDE.'),
-      },
     ]);
 
     return {
       projectDir,
       ...answers,
-      wdsFolder: '_wds',
+      wdsFolder,
+      _detection: detection,
+      _action: action,
       cancelled: false,
     };
   }
@@ -104,23 +204,60 @@ class UI {
   /**
    * Display success message with next steps
    */
-  displaySuccess(wdsFolder) {
+  displaySuccess(wdsFolder, ides = ['windsurf']) {
+    const ideNames = {
+      'rovo-dev': 'Atlassian Rovo Dev',
+      auggie: 'Auggie CLI',
+      'claude-code': 'Claude Code',
+      cline: 'Cline',
+      codex: 'Codex',
+      crush: 'Crush',
+      cursor: 'Cursor',
+      gemini: 'Gemini CLI',
+      'github-copilot': 'GitHub Copilot',
+      antigravity: 'Google Antigravity',
+      iflow: 'iFlow CLI',
+      kilo: 'Kilo Code',
+      'kiro-cli': 'Kiro CLI',
+      opencode: 'OpenCode',
+      qwen: 'Qwen Code',
+      roo: 'Roo Code',
+      trae: 'Trae',
+      vscode: 'VS Code',
+      windsurf: 'Windsurf',
+      other: 'your IDE',
+    };
+
+    // Format IDE list for display
+    let ideDisplay;
+    if (!ides || ides.length === 0) {
+      ideDisplay = 'your IDE';
+    } else if (ides.length === 1) {
+      ideDisplay = ideNames[ides[0]] || 'your IDE';
+    } else {
+      const names = ides.map((ide) => ideNames[ide] || ide);
+      ideDisplay = names.join(' or ');
+    }
+
+    console.log('');
+    console.log(chalk.green.bold('  ✨ Installation complete!'));
+    console.log('');
+    console.log(chalk.white.bold('  Get Started with Your Product Brief'));
+    console.log('');
+    console.log(chalk.white(`  1. Open this folder in ${ideDisplay}`));
+    console.log('');
+    console.log(chalk.white('  2. Locate the chat window in your IDE and type:'));
     console.log('');
-    console.log(chalk.green.bold('  Installation complete!'));
+    console.log(chalk.cyan(`     "Read and activate ${wdsFolder}/agents/saga-analyst.md"`));
     console.log('');
-    console.log(chalk.white('  Getting started:'));
-    console.log(chalk.dim(`  1. Open your project in your AI IDE`));
-    console.log(chalk.dim(`  2. Tell the AI:`));
-    console.log(chalk.cyan(`     "Read and activate the agent in ${wdsFolder}/agents/mimir-orchestrator.md"`));
-    console.log(chalk.dim(`  3. Mimir will greet you and guide you through project setup`));
+    console.log(chalk.white(`  3. Saga (your AI analyst) will greet you by name and`));
+    console.log(chalk.white(`     guide you through creating your Product Brief`));
     console.log('');
-    console.log(chalk.white(`  Agents in ${chalk.cyan(wdsFolder + '/agents/')}:`));
-    console.log(chalk.dim(`  - Mimir (Orchestrator) - Your guide. Start here.`));
-    console.log(chalk.dim(`  - Saga  (Analyst)      - Product Brief & Trigger Mapping`));
-    console.log(chalk.dim(`  - Idunn (PM)           - Platform Requirements & Deliveries`));
-    console.log(chalk.dim(`  - Freya (Designer)     - UX Design & Testing`));
+    console.log(chalk.dim('  ─────────────────────────────────────────────────'));
     console.log('');
-    console.log(chalk.dim('  https://github.com/whiteport-collective/whiteport-design-studio'));
+    console.log(chalk.dim(`  Available agents: Saga (Analyst), Freya (Designer)`));
+    console.log(chalk.dim(`  Need development? Install BMM: npx bmad-builder install`));
+    console.log(chalk.dim('  Docs: https://github.com/whiteport-collective/whiteport-design-studio'));
     console.log('');
   }
 }

package/docs/getting-started/agent-activation/wds-mimir.md

@@ -1,78 +0,0 @@
-# Mimir - WDS Orchestrator Agent
-
-## 🧙 Who I Am
-
-I'm Mimir, your wise guide and orchestrator of the entire WDS journey. Named after the Norse god of wisdom and knowledge, I'm often the first agent you'll meet - I see the big picture and help you navigate the complete methodology. Think of me as your safety net and strategic advisor, ensuring nothing falls through the cracks as you move from idea to polished product.
-
-I coordinate your journey through WDS, assess your skills and emotional state, check your environment setup, and route you to the specialist agents when you're ready. I provide perspective when you need it, teach WDS principles through practice, and make sure you always know where you are and what comes next. I'm here to make you feel supported and confident throughout your entire design journey.
-
-## 🎯 What I Help You Create
-
-**My Role is Different** - I don't create specific deliverables, but I:
-- Welcome you to WDS and assess your needs
-- Check your environment and setup
-- Analyze your project state and guide next steps
-- Route you to specialist agents (Saga, Freya, Idunn)
-- Provide methodology training and best practices
-- Offer perspective when you're stuck or uncertain
-
-**My Expertise:**
-- WDS methodology and workflow orchestration
-- Skill assessment and learning path guidance
-- Environment setup and troubleshooting
-- Project analysis and phase routing
-- Emotional support and confidence building
-- Cross-phase coordination and quality assurance
-
-**I route you to:**
-- **Saga** - When starting with strategy and research
-- **Freya** - When beginning design work
-- **Idunn** - When planning technical architecture or handoff
-
-**I'm your constant companion** - Call me anytime you need guidance, perspective, or just want to understand where you are in the journey.
-
----
-
-# Mimir WDS Orchestrator Agent - Quick Launcher
-
-**Purpose**: Activate Mimir with a short, memorable command
-
----
-
-## Agent Activation
-
-You are **Mimir WDS Orchestrator Agent**.
-
-**Activation Flow**: Follow these steps sequentially. Each step loads the next instruction file.
-
-**Start here**: `src/modules/wds/getting-started/agent-activation/activation/step-01-load-agent-definition.md`
-
-**Note**: Mimir uses the standard activation flow but has additional steps for skill assessment and environment check. These are handled after the standard activation sequence.
-
-**Activation Sequence**:
-1. Load agent definition
-2. Check for active conversations
-3. Check activation context (handoff or standard)
-4. Show presentation
-5. Execute project analysis (if standard) OR acknowledge task (if handoff)
-6. Skill & Emotional Assessment (Mimir-specific)
-7. Environment Check (Mimir-specific)
-8. Ready for guidance
-
----
-
-## Your Role
-
-You are Mimir, the wise advisor and orchestrator specializing in:
-
-- **Welcome & Guidance** - First point of contact, making users feel supported
-- **Skill Assessment** - Understanding user's technical level and emotional state
-- **Environment Setup** - Ensuring WDS is properly installed and configured
-- **Project Analysis** - Understanding project state and routing to specialists
-- **Methodology Training** - Teaching WDS principles through practice
-- **Agent Routing** - Connecting users with Freya, Idunn, or Saga when ready
-
----
-
-**Begin now with the activation flow.**
-

package/docs/learn-wds/00-course-overview.md

@@ -1,211 +0,0 @@
-# WDS Course: From Designer to Linchpin
-
-**Master the complete WDS methodology and become indispensable as a designer in the AI era**
-
-[Watch the Course Introduction Video](https://www.youtube.com/watch?v=CQ5Aai_r-uo)
-
----
-
-## Welcome to the WDS Course
-
-This comprehensive course teaches you the complete WDS workflow through **practical modules** that transform how you design products.
-
-**The paradigm shift:**
-
-- The design becomes the specification
-- The specification becomes the product
-- The code is just the printout
-
-**What you'll become:**
-
-- The linchpin designer who makes things happen
-- The gatekeeper between business goals and user needs
-- The irreplaceable designer in the AI era
-
-**Time investment:** ~10 hours total
-**Result:** Complete mastery of WDS methodology from project brief to AI-ready specifications
-
----
-
-## Who Created WDS?
-
-**Mårten Angner** is a UX designer and founder of Whiteport, a design and development agency based in Sweden. After years of working with AI tools, Mårten observed that traditional design handoffs were breaking down. Designers would create beautiful mockups, hand them off to developers, and watch their creative intent get lost in translation.
-
-Mårten developed WDS to solve this problem - a methodology where design thinking is preserved and amplified through AI implementation, not diluted and lost.
-
-**The Mission:** WDS is completely free and open-source. Mårten created it as a **plugin module for BMad Method** - an open-source AI-augmented development framework - to give designers everywhere the tools they need to thrive in the AI era.
-
----
-
-## Before You Start
-
-**[→ Getting Started Guide](00-getting-started/overview.md)**
-
-Review prerequisites, choose your learning path, and get support:
-
-- **Prerequisites** - Skills, tools, time investment
-- **Learning Paths** - Full immersion, quick start, or self-paced
-- **Support** - Testimonials, FAQ, community
-
-**Reading time:** ~15 minutes
-
----
-
-## Course Structure
-
-Each module contains:
-
-- **Lessons** - Theory and concepts (with NotebookLM audio support)
-- **Tutorial** - Step-by-step hands-on guide (for practical modules)
-- **Practice** - Apply to your own project
-
-**Learning format:**
-
-- **Lessons** - Read as documentation or generate audio with NotebookLM
-- **Tutorials** - Follow step-by-step guides with AI support
-- **Practice** - Apply to real projects as you learn
-- **Workshops** - Use for team training
-
----
-
-## Course Modules
-
-### Foundation
-
-- [Module 01: Why WDS Matters](module-01-why-wds-matters/module-01-overview.md)
-- [Module 02: Installation & Setup](module-02-installation-setup/module-02-overview.md) • [Tutorial →](module-02-installation-setup/tutorial-02.md)
-
-### Pre-Phase 1: Alignment & Signoff (Optional)
-
-- [Module 03: Alignment & Signoff](module-03-alignment-signoff/module-03-overview.md) • [Tutorial →](module-03-alignment-signoff/tutorial-03.md)  
-  *Skip if doing it yourself - go straight to Project Brief*
-
-### Phase 1: Project Brief
-
-- [Module 04: Create Project Brief](module-04-project-brief/) • [Tutorial →](module-04-project-brief/tutorial-04.md)
-
-### Phase 2: Trigger Mapping
-
-- [Module 04: Identify Target Groups](module-04-identify-target-groups/)
-- [Module 05: Map Triggers & Outcomes](module-05-map-triggers-outcomes/) • [Tutorial →](module-05-map-triggers-outcomes/tutorial-05.md)
-- [Module 06: Prioritize Features](module-06-prioritize-features/)
-
-### Phase 3: Platform Requirements
-
-- [Module 07: Platform Requirements](module-07-platform-requirements/)
-- [Module 08: Functional Requirements](module-08-functional-requirements/)
-
-### Phase 4: Conceptual Design (UX Design)
-
-- [Module 09: Initialize Scenario](module-09-initialize-scenario/) • [Tutorial →](module-09-initialize-scenario/tutorial-09.md)
-- [Module 10: Sketch Interfaces](module-10-sketch-interfaces/)
-- [Module 11: Analyze with AI](module-11-analyze-with-ai/)
-- [Module 12: Decompose Components](module-12-decompose-components/)
-- [Module 13: Conceptual Specifications](module-13-conceptual-specs/) • [Tutorial →](module-13-conceptual-specs/tutorial-13.md)
-- [Module 14: Validate Specifications](module-14-validate-specifications/)
-
-### Phase 5: Design System
-
-- [Module 15: Extract Design Tokens](module-15-extract-design-tokens/)
-- [Module 16: Component Library](module-16-component-library/)
-
-### Phase 6: Development Integration
-
-- [Module 17: UI Roadmap](module-17-ui-roadmap/)
-
----
-
-## Learning Paths
-
-**Complete Course:** All 17 modules (~12 hours)
-
-**Quick Start:** Modules 1, 2, 5, 9, 13 (~4 hours)
-
-**Phase-Specific:** Jump to any phase as needed
-
----
-
-## NotebookLM Integration
-
-Each module has matching content for NotebookLM:
-
-- Feed module lessons to NotebookLM
-- Generate audio podcasts for learning on the go
-- Generate video presentations for team training
-- Create study guides and summaries
-
-**All modules are optimized for AI-assisted learning.**
-
----
-
-## Module Structure
-
-Every module follows the same pattern:
-
-**1. Inspiration (10 min)**
-
-- Why this step matters
-- The transformation you'll experience
-- Real-world impact
-
-**2. Teaching (20 min)**
-
-- How to do it with confidence
-- AI support at each step
-- Dog Week example walkthrough
-
-**3. Practice (10 min)**
-
-- Apply to your own project
-- Step-by-step instructions
-- Success criteria
-
-**4. Tutorial (optional)**
-
-- Quick step-by-step guide
-- "Just show me how to do it"
-- For practical modules only
-
----
-
-## After the Course
-
-Once you've completed the modules:
-
-1. **[Workflows Guide](../workflows/WDS-WORKFLOWS-GUIDE.md)** - Reference documentation
-2. **[Quick Start](../getting-started/quick-start.md)** - Try WDS with agent
-3. **[Community](https://discord.gg/whiteport)** - Get help and share your work
-
----
-
-## Prerequisites
-
-**What you need:**
-
-- Basic design thinking and UX principles
-- Ability to sketch interfaces (hand-drawn or digital)
-- Understanding of user needs and business goals
-- Willingness to think deeply about WHY
-
-**What you DON'T need:**
-
-- ❌ Coding skills
-- ❌ Advanced technical knowledge
-- ❌ Experience with AI tools
-- ❌ Formal design education
-
-**If you can design interfaces and explain your thinking, you're ready to start.**
-
----
-
-## Ready to Begin?
-
-Ten hours of learning. A lifetime of being indispensable.
-
-**[Start with Module 01: Why WDS Matters →](module-01-why-wds-matters/module-01-overview.md)**
-
----
-
-**This course is free and open-source**
-**Created by Mårten Angner and the Whiteport team**
-**Integrated with BMad Method for seamless design-to-development workflow**