bmad-method 4.2.0 → 4.4.1

package/bmad-core/bmad-core-config.yml

@@ -0,0 +1,60 @@
+agent_file_references:
+  core_docs:
+    - docs/index.md
+    - docs/prd.md
+    - docs/architecture.md
+    - docs/architecture/index.md
+    - 'docs/architecture/coding-standards.md # Required by DEV at startup'
+    - 'docs/architecture/tech-stack.md # Technology stack reference'
+    - 'docs/architecture/unified-project-structure.md # Project structure guide'
+    - 'docs/architecture/testing-strategy.md # Testing requirements'
+  story_files:
+    - 'docs/stories/ # Stories directory (pattern: {epicNum}.{storyNum}.story.md)'
+  epic_locations:
+    primary: docs/
+    secondary: docs/prd/
+  architecture_shards:
+    backend:
+      - 'docs/architecture/backend-architecture.md # Backend service patterns'
+      - 'docs/architecture/rest-api-spec.md # API endpoint specifications'
+      - 'docs/architecture/data-models.md # Data structures and validation'
+      - 'docs/architecture/database-schema.md # Database design'
+      - 'docs/architecture/external-apis.md # Third-party integrations'
+    frontend:
+      - 'docs/architecture/frontend-architecture.md # Frontend patterns'
+      - docs/architecture/components.md
+      - 'docs/architecture/core-workflows.md # User interaction flows'
+      - 'docs/architecture/ui-ux-spec.md # UI/UX specifications'
+    shared:
+      - 'docs/architecture/tech-stack.md # Technology constraints'
+      - 'docs/architecture/unified-project-structure.md # Code organization'
+      - 'docs/architecture/coding-standards.md # Project conventions'
+      - 'docs/architecture/testing-strategy.md # Testing requirements'
+  additional_docs:
+    - 'docs/tech-stack.md # Technology stack (if separate)'
+    - 'docs/data-models.md # Data models (if separate)'
+    - 'docs/api-reference.md # API reference (if separate)'
+    - 'docs/frontend-architecture.md # Frontend arch (if separate)'
+bmad_core_dependencies:
+  tasks:
+    - .bmad-core/tasks/create-next-story.md
+    - .bmad-core/tasks/execute-checklist.md
+    - .bmad-core/tasks/correct-course.md
+    - .bmad-core/tasks/shard-doc.md
+    - .bmad-core/tasks/index-docs.md
+  templates:
+    - .bmad-core/templates/story-tmpl.md
+  checklists:
+    - .bmad-core/checklists/story-draft-checklist.md
+    - .bmad-core/checklists/story-dod-checklist.md
+  utils:
+    - .bmad-core/utils/template-format.md
+file_patterns:
+  story_files: '{epicNum}.{storyNum}.story.md'
+  epic_files: epic-{n}-{description}.md
+story_statuses:
+  - Draft
+  - Approved
+  - In Progress
+  - Review
+  - Done

package/bmad-core/data/bmad-kb.md

@@ -0,0 +1,47 @@
+# BMAD Knowledge Base
+
+## Overview
+
+BMAD-METHOD (Breakthrough Method of Agile AI-driven Development) is a framework that combines AI agents with Agile development methodologies. The v4 system introduces a modular architecture with improved dependency management, bundle optimization, and support for both web and IDE environments.
+
+### Key Features
+
+- **Modular Agent System**: Specialized AI agents for each Agile role
+- **Build System**: Automated dependency resolution and optimization
+- **Dual Environment Support**: Optimized for both web UIs and IDEs
+- **Reusable Resources**: Portable templates, tasks, and checklists
+- **Slash Command Integration**: Quick agent switching and control
+
+## Core Philosophy
+
+### Vibe CEO'ing
+
+You are the "Vibe CEO" - thinking like a CEO with unlimited resources and a singular vision. Your AI agents are your high-powered team, and your role is to:
+
+- **Direct**: Provide clear instructions and objectives
+- **Refine**: Iterate on outputs to achieve quality
+- **Oversee**: Maintain strategic alignment across all agents
+
+### Core Principles
+
+1. **MAXIMIZE_AI_LEVERAGE**: Push the AI to deliver more. Challenge outputs and iterate.
+2. **QUALITY_CONTROL**: You are the ultimate arbiter of quality. Review all outputs.
+3. **STRATEGIC_OVERSIGHT**: Maintain the high-level vision and ensure alignment.
+4. **ITERATIVE_REFINEMENT**: Expect to revisit steps. This is not a linear process.
+5. **CLEAR_INSTRUCTIONS**: Precise requests lead to better outputs.
+6. **DOCUMENTATION_IS_KEY**: Good inputs (briefs, PRDs) lead to good outputs.
+7. **START_SMALL_SCALE_FAST**: Test concepts, then expand.
+8. **EMBRACE_THE_CHAOS**: Adapt and overcome challenges.
+
+## IDE Development Workflow
+
+1. Shard the PRD (And Architecture documents if they exist also based on workflow type) using the Doc Shard task. The BMad-Master agent can help you do this. You will select the task, provide the doc to shard and the output folder. for example: `BMad Master, please Shard the docs/prd.md to the doc/prd/ folder` - this should ask you to use the md-tree-parser which is recommended, but either way shoudl result in multiple documents being created in the folder docs/prd.
+2. If you have fullstack, front end and or back end architecture documents you will want to follow the same thing, but shard all of these to an architecture folder instead of a prd folder.
+3. Ensure that you have at least one epic-n.md file in your prd folder, with the stories in order to develop.
+4. The docs or architecture folder or prd folder should have a source tree document and coding standards at a minimum. These are used by the dev agent, and the many other sharded docs are used by the SM agent.
+5. Use a new chat window to allow the SM agent to `draft the next story`.
+6. If you agree the story is correct, mark it as approved in the status field, and then start a new chat window with the dev agent.
+7. Ask the dev agent to implement the next story. If you draft the story file into the chat it will save time for the dev to have to find what the next one is. The dev should follow the tasks and subtasks marking them off as they are completed. The dev agent will also leave notes potentially for the SM to know about any deviations that might have occured to help draft the next story.
+8. Once complete and you have verified, mark it done, and start a new chat. Ask the SM to draft the next story - repeating the cycle.
+
+With this work flow, there is only 1 story in progress at a time, worked sequentially.

package/bmad-core/tasks/doc-migration-task.md

@@ -0,0 +1,143 @@
+# Document Migration Task
+
+## Purpose
+
+Simple document migration that cleans up heading formats and adds epic structure for PRDs.
+
+## Task Requirements
+
+1. **Input**: User specifies the document to migrate (e.g., `docs/prd.md`)
+2. **Detection**: Automatically determine if it's a PRD or other document type
+3. **Migration**: Apply appropriate transformations
+4. **Backup**: Create backup with `.bak` extension
+
+## Migration Rules
+
+### For PRDs
+
+- Find all level 3 headings that appear to be epics
+- Add a level 2 heading "## Epic #" (incrementing number) before each epic
+- Also apply the heading cleanup rules below
+
+### For All Documents
+
+- Find all level 2 headings (`## ...`)
+- Remove leading numbers and symbols
+- Keep only alphabetic characters and spaces
+- **CRITICAL**: Do not lose any information - preserve all content under appropriate headings
+- Examples:
+  - `## 1. Foo & Bar` → `## Foo Bar`
+  - `## 2.1 Technical Overview` → `## Technical Overview`
+  - `## 3) User Experience` → `## User Experience`
+
+### For Architecture Documents
+
+- **PRIMARY GOAL**: Align level 2 headings to match template level 2 titles exactly
+- **PRESERVE EVERYTHING**: Do not lose any information during migration
+- Map existing content to the closest matching template section
+- If content doesn't fit template sections, create appropriate level 3 subsections
+
+## Detection Logic
+
+A document is considered a PRD if:
+
+- Filename contains "prd" (case insensitive)
+- OR main title contains "Product Requirements" or "PRD"
+- OR contains sections like "User Stories", "Functional Requirements", "Acceptance Criteria"
+
+## Implementation Steps
+
+1. **Backup Original**: Copy `filename.md` to `filename.md.bak`
+2. **Detect Type**: Check if document is a PRD
+3. **Process Headings**:
+   - Clean all level 2 headings
+   - If PRD: Add epic structure before level 3 headings that look like epics
+4. **Write Result**: Overwrite original file with migrated content
+
+## Epic Detection for PRDs
+
+Level 3 headings are treated as epics if they:
+
+- Describe features or functionality
+- Are substantial sections (not just "Overview" or "Notes")
+- Common epic patterns: "User Management", "Payment Processing", "Reporting Dashboard"
+
+The epic numbering starts at 1 and increments for each epic found.
+
+## Example
+
+### Before (PRD):
+
+`````markdown
+# Product Requirements Document
+
+## 1. Executive Summary
+
+Content here...
+
+## 2.1 Functional Requirements & Specs
+
+Content here...
+
+### User Management System
+
+Epic content...
+
+### Payment Processing
+
+Epic content...
+
+## 3) Success Metrics
+
+Content here...
+
+````text
+
+### After (PRD):
+```markdown
+# Product Requirements Document
+
+## Executive Summary
+Content here...
+
+## Functional Requirements Specs
+Content here...
+
+## Epic 1
+### User Management System
+Epic content...
+
+## Epic 2
+### Payment Processing
+Epic content...
+
+## Success Metrics
+Content here...
+```text
+
+### Before (Non-PRD):
+```markdown
+# Architecture Document
+
+## 1. System Overview
+Content...
+
+## 2.1 Technical Stack & Tools
+Content...
+```text
+
+### After (Non-PRD):
+```markdown
+# Architecture Document
+
+## System Overview
+Content...
+
+## Technical Stack Tools
+Content...
+````
+`````
+
+```text
+
+```

package/bmad-core/tasks/document-project.md

@@ -0,0 +1,389 @@
+# Document an Existing Project
+
+## Purpose
+
+Generate comprehensive documentation for existing projects optimized for AI development agents. This task creates structured reference materials that enable AI agents to understand project context, conventions, and patterns for effective contribution to any codebase.
+
+## Task Instructions
+
+### 1. Initial Project Analysis
+
+[[LLM: Begin by conducting a comprehensive analysis of the existing project. Use available tools to:
+
+1. **Project Structure Discovery**: Examine the root directory structure, identify main folders, and understand the overall organization
+2. **Technology Stack Identification**: Look for package.json, requirements.txt, Cargo.toml, pom.xml, etc. to identify languages, frameworks, and dependencies
+3. **Build System Analysis**: Find build scripts, CI/CD configurations, and development commands
+4. **Existing Documentation Review**: Check for README files, docs folders, and any existing documentation
+5. **Code Pattern Analysis**: Sample key files to understand coding patterns, naming conventions, and architectural approaches
+
+Ask the user these elicitation questions to better understand their needs:
+
+- What is the primary purpose of this project?
+- Are there any specific areas of the codebase that are particularly complex or important for agents to understand?
+- What types of tasks do you expect AI agents to perform on this project? (e.g., bug fixes, feature additions, refactoring, testing)
+- Are there any existing documentation standards or formats you prefer?
+- What level of technical detail should the documentation target? (junior developers, senior developers, mixed team)
+  ]]
+
+### 2. Core Documentation Generation
+
+[[LLM: Based on your analysis, generate the following core documentation files. Adapt the content and structure to match the specific project type and context you discovered:
+
+**Core Documents (always generate):**
+
+1. **docs/index.md** - Master documentation index
+2. **docs/architecture/index.md** - Architecture documentation index
+3. **docs/architecture/coding-standards.md** - Coding conventions and style guidelines
+4. **docs/architecture/tech-stack.md** - Technology stack and version constraints
+5. **docs/architecture/unified-project-structure.md** - Project structure and organization
+6. **docs/architecture/testing-strategy.md** - Testing approaches and requirements
+
+**Backend Documents (generate for backend/full-stack projects):**
+
+7. **docs/architecture/backend-architecture.md** - Backend service patterns and structure
+8. **docs/architecture/rest-api-spec.md** - API endpoint specifications
+9. **docs/architecture/data-models.md** - Data structures and validation rules
+10. **docs/architecture/database-schema.md** - Database design and relationships
+11. **docs/architecture/external-apis.md** - Third-party integrations
+
+**Frontend Documents (generate for frontend/full-stack projects):**
+
+12. **docs/architecture/frontend-architecture.md** - Frontend patterns and structure
+13. **docs/architecture/components.md** - UI component specifications
+14. **docs/architecture/core-workflows.md** - User interaction flows
+15. **docs/architecture/ui-ux-spec.md** - UI/UX specifications and guidelines
+
+**Additional Documents (generate if applicable):**
+
+16. **docs/prd.md** - Product requirements document (if not exists)
+17. **docs/architecture/deployment-guide.md** - Deployment and operations info
+18. **docs/architecture/security-considerations.md** - Security patterns and requirements
+19. **docs/architecture/performance-guidelines.md** - Performance optimization patterns
+
+**Optional Enhancement Documents:**
+
+20. **docs/architecture/troubleshooting-guide.md** - Common issues and solutions
+21. **docs/architecture/changelog-conventions.md** - Change management practices
+22. **docs/architecture/code-review-checklist.md** - Review standards and practices
+
+Present each document section by section, using the advanced elicitation task after each major section.]]
+
+### 3. Document Structure Template
+
+[[LLM: Use this standardized structure for each documentation file, adapting content as needed:
+
+```markdown
+# {{Document Title}}
+
+## Overview
+
+{{Brief description of what this document covers and why it's important for AI agents}}
+
+## Quick Reference
+
+{{Key points, commands, or patterns that agents need most frequently}}
+
+## Detailed Information
+
+{{Comprehensive information organized into logical sections}}
+
+## Examples
+
+{{Concrete examples showing proper usage or implementation}}
+
+## Common Patterns
+
+{{Recurring patterns agents should recognize and follow}}
+
+## Things to Avoid
+
+{{Anti-patterns, deprecated approaches, or common mistakes}}
+
+## Related Resources
+
+{{Links to other relevant documentation or external resources}}
+```
+
+Each document should be:
+
+- **Concrete and actionable** - Focus on what agents need to do, not just concepts
+- **Pattern-focused** - Highlight recurring patterns agents can recognize and replicate
+- **Example-rich** - Include specific code examples and real file references
+- **Context-aware** - Reference actual project files, folders, and conventions
+- **Assumption-free** - Don't assume agents know project history or implicit knowledge
+  ]]
+
+### 4. Content Guidelines for Each Document Type
+
+#### Core Architecture Documents
+
+##### docs/architecture/index.md
+
+[[LLM: Create a comprehensive index of all architecture documentation:
+
+- List all architecture documents with brief descriptions
+- Group documents by category (backend, frontend, shared)
+- Include quick links to key sections
+- Provide reading order recommendations for different use cases]]
+
+##### docs/architecture/unified-project-structure.md
+
+[[LLM: Document the complete project structure:
+
+- Root-level directory structure with explanations
+- Where each type of code belongs (backend, frontend, tests, etc.)
+- File naming conventions and patterns
+- Module/package organization
+- Generated vs. source file locations
+- Build output locations]]
+
+##### docs/architecture/coding-standards.md
+
+[[LLM: Capture project-wide coding conventions:
+
+- Language-specific style guidelines
+- Naming conventions (variables, functions, classes, files)
+- Code organization within files
+- Import/export patterns
+- Comment and documentation standards
+- Linting and formatting tool configurations
+- Git commit message conventions]]
+
+##### docs/architecture/tech-stack.md
+
+[[LLM: Document all technologies and versions:
+
+- Primary languages and versions
+- Frameworks and major libraries with versions
+- Development tools and their versions
+- Database systems and versions
+- External services and APIs used
+- Browser/runtime requirements]]
+
+##### docs/architecture/testing-strategy.md
+
+[[LLM: Define testing approaches and requirements:
+
+- Test file locations and naming conventions
+- Unit testing patterns and frameworks
+- Integration testing approaches
+- E2E testing setup (if applicable)
+- Test coverage requirements
+- Mocking strategies
+- Test data management]]
+
+#### Backend Architecture Documents
+
+##### docs/architecture/backend-architecture.md
+
+[[LLM: Document backend service structure:
+
+- Service layer organization
+- Controller/route patterns
+- Middleware architecture
+- Authentication/authorization patterns
+- Request/response flow
+- Background job processing
+- Service communication patterns]]
+
+##### docs/architecture/rest-api-spec.md
+
+[[LLM: Specify all API endpoints:
+
+- Base URL and versioning strategy
+- Authentication methods
+- Common headers and parameters
+- Each endpoint with:
+  - HTTP method and path
+  - Request parameters/body
+  - Response format and status codes
+  - Error responses
+- Rate limiting and quotas]]
+
+##### docs/architecture/data-models.md
+
+[[LLM: Define data structures and validation:
+
+- Core business entities
+- Data validation rules
+- Relationships between entities
+- Computed fields and derivations
+- Data transformation patterns
+- Serialization formats]]
+
+##### docs/architecture/database-schema.md
+
+[[LLM: Document database design:
+
+- Database type and version
+- Table/collection structures
+- Indexes and constraints
+- Relationships and foreign keys
+- Migration patterns
+- Seed data requirements
+- Backup and recovery procedures]]
+
+##### docs/architecture/external-apis.md
+
+[[LLM: Document third-party integrations:
+
+- List of external services used
+- Authentication methods for each
+- API endpoints and usage patterns
+- Rate limits and quotas
+- Error handling strategies
+- Webhook configurations
+- Data synchronization patterns]]
+
+#### Frontend Architecture Documents
+
+##### docs/architecture/frontend-architecture.md
+
+[[LLM: Document frontend application structure:
+
+- Component hierarchy and organization
+- State management patterns
+- Routing architecture
+- Data fetching patterns
+- Authentication flow
+- Error boundary strategies
+- Performance optimization patterns]]
+
+##### docs/architecture/components.md
+
+[[LLM: Specify UI components:
+
+- Component library/design system used
+- Custom component specifications
+- Props and state for each component
+- Component composition patterns
+- Styling approaches
+- Accessibility requirements
+- Component testing patterns]]
+
+##### docs/architecture/core-workflows.md
+
+[[LLM: Document user interaction flows:
+
+- Major user journeys
+- Screen flow diagrams
+- Form handling patterns
+- Navigation patterns
+- Data flow through workflows
+- Error states and recovery
+- Loading and transition states]]
+
+##### docs/architecture/ui-ux-spec.md
+
+[[LLM: Define UI/UX guidelines:
+
+- Design system specifications
+- Color palette and typography
+- Spacing and layout grids
+- Responsive breakpoints
+- Animation and transition guidelines
+- Accessibility standards
+- Browser compatibility requirements]]
+
+### 5. Adaptive Content Strategy
+
+[[LLM: Adapt your documentation approach based on project characteristics:
+
+**For Web Applications:**
+
+- Focus on component patterns, routing, state management
+- Include build processes, asset handling, and deployment
+- Cover API integration patterns and data fetching
+
+**For Backend Services:**
+
+- Emphasize service architecture, data models, and API design
+- Include database interaction patterns and migration strategies
+- Cover authentication, authorization, and security patterns
+
+**For CLI Tools:**
+
+- Focus on command structure, argument parsing, and output formatting
+- Include plugin/extension patterns if applicable
+- Cover configuration file handling and user interaction patterns
+
+**For Libraries/Frameworks:**
+
+- Emphasize public API design and usage patterns
+- Include extension points and customization approaches
+- Cover versioning, compatibility, and migration strategies
+
+**For Mobile Applications:**
+
+- Focus on platform-specific patterns and navigation
+- Include state management and data persistence approaches
+- Cover platform integration and native feature usage
+
+**For Data Science/ML Projects:**
+
+- Emphasize data pipeline patterns and model organization
+- Include experiment tracking and reproducibility approaches
+- Cover data validation and model deployment patterns
+  ]]
+
+### 6. Quality Assurance
+
+[[LLM: Before completing each document:
+
+1. **Accuracy Check**: Verify all file paths, commands, and code examples work
+2. **Completeness Review**: Ensure the document covers the most important patterns an agent would encounter
+3. **Clarity Assessment**: Check that explanations are clear and actionable
+4. **Consistency Verification**: Ensure terminology and patterns align across all documents
+5. **Agent Perspective**: Review from the viewpoint of an AI agent that needs to contribute to this project
+
+Ask the user to review each completed document and use the advanced elicitation task to refine based on their feedback.]]
+
+### 7. Final Integration
+
+[[LLM: After all documents are completed:
+
+1. Ensure all documents are created in the proper BMAD-expected locations:
+
+   - Core docs in `docs/` (index.md, prd.md)
+   - Architecture shards in `docs/architecture/` subdirectory
+   - Create the `docs/architecture/` directory if it doesn't exist
+
+2. Create/update the master index documents:
+
+   - Update `docs/index.md` to reference all documentation
+   - Create `docs/architecture/index.md` listing all architecture shards
+
+3. Verify document cross-references:
+
+   - Ensure all documents link to related documentation
+   - Check that file paths match the actual project structure
+   - Validate that examples reference real files in the project
+
+4. Provide maintenance guidance:
+
+   - Document update triggers (when to update each doc)
+   - Create a simple checklist for keeping docs current
+   - Suggest automated validation approaches
+
+5. Summary report including:
+   - List of all documents created with their paths
+   - Any gaps or areas needing human review
+   - Recommendations for project-specific additions
+   - Next steps for maintaining documentation accuracy
+
+Present a summary of what was created and ask if any additional documentation would be helpful for AI agents working on this specific project.]]
+
+## Success Criteria
+
+- Documentation enables AI agents to understand project context without additional explanation
+- All major architectural patterns and coding conventions are captured
+- Examples reference actual project files and demonstrate real usage
+- Documentation is structured consistently and easy to navigate
+- Content is actionable and focuses on what agents need to do, not just understand
+
+## Notes
+
+- This task is designed to work with any project type, language, or framework
+- The documentation should reflect the project as it actually is, not as it should be
+- Focus on patterns that agents can recognize and replicate consistently
+- Include both positive examples (what to do) and negative examples (what to avoid)

package/bmad-core/tasks/generate-ai-frontend-prompt.md

@@ -0,0 +1,51 @@
+# Create AI Frontend Prompt Task
+
+## Purpose
+
+To generate a masterful, comprehensive, and optimized prompt that can be used with any AI-driven frontend development tool (e.g., Vercel v0, Lovable.ai, or similar) to scaffold or generate significant portions of a frontend application.
+
+## Inputs
+
+- Completed UI/UX Specification (`front-end-spec`)
+- Completed Frontend Architecture Document (`front-end-architecture`) or a full stack combined architecture such as `architecture.md`
+- Main System Architecture Document (`architecture` - for API contracts and tech stack to give further context)
+
+## Key Activities & Instructions
+
+### 1. Core Prompting Principles
+
+Before generating the prompt, you must understand these core principles for interacting with a generative AI for code.
+
+- **Be Explicit and Detailed**: The AI cannot read your mind. Provide as much detail and context as possible. Vague requests lead to generic or incorrect outputs.
+- **Iterate, Don't Expect Perfection**: Generating an entire complex application in one go is rare. The most effective method is to prompt for one component or one section at a time, then build upon the results.
+- **Provide Context First**: Always start by providing the AI with the necessary context, such as the tech stack, existing code snippets, and overall project goals.
+- **Mobile-First Approach**: Frame all UI generation requests with a mobile-first design mindset. Describe the mobile layout first, then provide separate instructions for how it should adapt for tablet and desktop.
+
+### 2. The Structured Prompting Framework
+
+To ensure the highest quality output, you MUST structure every prompt using the following four-part framework.
+
+1. **High-Level Goal**: Start with a clear, concise summary of the overall objective. This orients the AI on the primary task.
+   - _Example: "Create a responsive user registration form with client-side validation and API integration."_
+2. **Detailed, Step-by-Step Instructions**: Provide a granular, numbered list of actions the AI should take. Break down complex tasks into smaller, sequential steps. This is the most critical part of the prompt.
+   - _Example: "1. Create a new file named `RegistrationForm.js`. 2. Use React hooks for state management. 3. Add styled input fields for 'Name', 'Email', and 'Password'. 4. For the email field, ensure it is a valid email format. 5. On submission, call the API endpoint defined below."_
+3. **Code Examples, Data Structures & Constraints**: Include any relevant snippets of existing code, data structures, or API contracts. This gives the AI concrete examples to work with. Crucially, you must also state what _not_ to do.
+   - _Example: "Use this API endpoint: `POST /api/register`. The expected JSON payload is `{ "name": "string", "email": "string", "password": "string" }`. Do NOT include a 'confirm password' field. Use Tailwind CSS for all styling."_
+4. **Define a Strict Scope**: Explicitly define the boundaries of the task. Tell the AI which files it can modify and, more importantly, which files to leave untouched to prevent unintended changes across the codebase.
+   - _Example: "You should only create the `RegistrationForm.js` component and add it to the `pages/register.js` file. Do NOT alter the `Navbar.js` component or any other existing page or component."_
+
+### 3. Assembling the Master Prompt
+
+You will now synthesize the inputs and the above principles into a final, comprehensive prompt.
+
+1. **Gather Foundational Context**:
+   - Start the prompt with a preamble describing the overall project purpose, the full tech stack (e.g., Next.js, TypeScript, Tailwind CSS), and the primary UI component library being used.
+2. **Describe the Visuals**:
+   - If the user has design files (Figma, etc.), instruct them to provide links or screenshots.
+   - If not, describe the visual style: color palette, typography, spacing, and overall aesthetic (e.g., "minimalist", "corporate", "playful").
+3. **Build the Prompt using the Structured Framework**:
+   - Follow the four-part framework from Section 2 to build out the core request, whether it's for a single component or a full page.
+4. **Present and Refine**:
+   - Output the complete, generated prompt in a clear, copy-pasteable format (e.g., a large code block).
+   - Explain the structure of the prompt and why certain information was included, referencing the principles above.
+   - <important_note>Conclude by reminding the user that all AI-generated code will require careful human review, testing, and refinement to be considered production-ready.</important_note>