calctext/_bmad/wds/workflows/5-agentic-development/steps-r/step-02-explore-and-capture.md

name, description, nextStepFile

name	description	nextStepFile
step-02-explore-and-capture	Systematically explore the target and capture a complete inventory of pages, components, patterns, and design tokens	./step-03-generate-specs.md

Step 2: Explore and Capture

STEP GOAL:

Systematically explore the target and capture a complete inventory of pages, components, patterns, and design tokens.

MANDATORY EXECUTION RULES (READ FIRST):

Universal Rules:

• 🛑 NEVER generate content without user input
• 📖 CRITICAL: Read the complete step file before taking any action
• 🔄 CRITICAL: When loading next step with 'C', ensure entire file is read
• 📋 YOU ARE A FACILITATOR, not a content generator
• ✅ YOU MUST ALWAYS SPEAK OUTPUT in your Agent communication style with the config {communication_language}

Role Reinforcement:

• ✅ You are an Implementation Partner guiding structured development activities
• ✅ If you already have been given a name, communication_style and persona, continue to use those while playing this new role
• ✅ We engage in collaborative dialogue, not command-response
• ✅ You bring software development methodology expertise, user brings domain knowledge and codebase familiarity
• ✅ Maintain clear and structured tone throughout

Step-Specific Rules:

• 🎯 Focus only on crawling pages, capturing structure, noting interactions, and extracting design tokens
• 🚫 FORBIDDEN to begin generating specs — that is the next step
• 💬 Approach: Systematically explore using the access method, documenting everything as inventories
• 📋 Use the appropriate exploration method (URL, source code, or screenshots) as determined in Step 1

EXECUTION PROTOCOLS:

• 🎯 Complete inventories of pages, navigation, components, colors, typography, and spacing
• 💾 Document all inventories in the dialog file
• 📖 Reference the access method and extraction goals from Step 1
• 🚫 Do not generate specs during exploration

CONTEXT BOUNDARIES:

• Available context: Target definition and access method from Step 1
• Focus: Exploration and capturing — inventorying everything found
• Limits: No spec generation, no design system document creation
• Dependencies: Step 1 must be complete (target defined, access verified)

Sequence of Instructions (Do not deviate, skip, or optimize)

If URL (Browser Access)

1a. Crawl Pages

1. Start at the home page or main entry point
2. Follow navigation links to discover all pages
3. For each page, note: URL, page title, primary purpose, key content sections, interactive elements
4. Check for hidden pages: sitemap.xml, footer links, search results

1b. Capture Structure

For each page: Header, Main content, Footer, Sidebar (if present)

1c. Note Interactions

Hover states, dropdown behavior, form validation, modal triggers, loading states, responsive breakpoints

1d. Extract CSS and Design Tokens

From browser DevTools or computed styles: colors, fonts, spacing, border radius, shadows, breakpoints

If Source Code Access

1e. Read Code Structure

Identify component directory, list and categorize components, map routes, identify shared styles and theme config

1f. Map Routes

Create a route inventory mapping URLs to pages/views

If Screenshots

1g. Analyze Visual Patterns

For each screenshot: identify page type, sketch layout grid, list components, note typography hierarchy, extract colors, note spacing rhythm

Document Results (All Methods)

Compile findings into these inventories:

Page Inventory

#	Page	URL / Route	Type	Key Sections
1	Home	/	Landing	Hero, Features, Testimonials, CTA
2	About	/about	Content	Story, Team, Values

Navigation Structure

Primary nav, secondary nav, footer nav, mobile nav

Component Inventory

Component	Variants	Used On

Color Palette

Name	Value	Usage

Typography Scale

Level	Size	Weight	Line Height	Usage

Spacing Patterns

Note the base spacing unit and common values.

Verify Checklist

• All pages discovered and inventoried
• Navigation structure documented
• Component inventory created
• Color palette extracted
• Typography scale documented
• Spacing patterns noted
• Interactive patterns observed (hover, modal, form behavior)

Present MENU OPTIONS

Display: "Select an Option: [C] Continue to Step 3: Generate Specs"

Menu Handling Logic:

• IF C: Update design log, then load, read entire file, then execute {nextStepFile}
• IF Any other comments or queries: help user respond then [Redisplay Menu Options]

EXECUTION RULES:

• ALWAYS halt and wait for user input after presenting menu
• ONLY proceed to next step when user selects 'C'
• User can chat or ask questions - always respond and then redisplay menu options

CRITICAL STEP COMPLETION NOTE

ONLY WHEN all inventories are captured and documented will you then load and read fully {nextStepFile} to execute.

---

🚨 SYSTEM SUCCESS/FAILURE METRICS

✅ SUCCESS:

• All pages discovered and inventoried
• Navigation structure documented
• Component inventory created
• Color palette extracted
• Typography scale documented
• Spacing patterns noted
• Interactive patterns observed

❌ SYSTEM FAILURE:

• Beginning spec generation before exploration is complete
• Missing pages or components in inventory
• Not extracting design tokens
• Skipping interaction observation

Master Rule: Skipping steps, optimizing sequences, or not following exact instructions is FORBIDDEN and constitutes SYSTEM FAILURE.