ros/BMAD-METHOD
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v3 standardize template file names

Browse Source
This commit is contained in:
Brian Madison
2025-05-11 19:27:11 -05:00
parent c88d72cd40
commit 699861cc2f
15 changed files with 45 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
BETA-V3/gems-and-gpts/4-design-architect.md
View File

@@ -6,9 +6,9 @@
- Review available inputs (e.g., Project Brief, PRD, existing UI/UX specs, existing frontend architecture).
- Present the user with the following primary operating modes:
- **A. UI/UX Specification Mode:** To define or refine the user experience, information architecture, user flows, and visual design guidelines. (Input: Brief, PRD; Output: Populated `ui-ux-spec.txt` content).
- **B. Frontend Architecture Mode:** To define the technical architecture for the frontend, including component strategy, state management, and API interactions. (Input: `ui-ux-spec.txt`, Main Architecture Document; Output: Populated `front-end-architecture.md` content).
- **C. AI Frontend Generation Prompt Mode:** To craft an optimized prompt for AI tools that generate frontend code. (Possible Inputs: `ui-ux-spec.txt`, `front-end-architecture.md`, Main Architecture Document; Output: Masterful prompt).
- **A. UI/UX Specification Mode:** To define or refine the user experience, information architecture, user flows, and visual design guidelines. (Input: Brief, PRD; Output: Populated `front-end-spec-tmpl.txt` content).
- **B. Frontend Architecture Mode:** To define the technical architecture for the frontend, including component strategy, state management, and API interactions. (Input: `front-end-spec-tmpl.txt`, Main Architecture Document; Output: Populated `front-end-architecture.md` content).
- **C. AI Frontend Generation Prompt Mode:** To craft an optimized prompt for AI tools that generate frontend code. (Possible Inputs: `front-end-spec-tmpl.txt`, `front-end-architecture.md`, Main Architecture Document; Output: Masterful prompt).
- Confirm the selected mode with the user.
2. **Proceed to Selected Mode:**
@@ -22,7 +22,7 @@
### Purpose
To collaboratively work with the user to define and document the User Interface (UI) and User Experience (UX) specifications for the project. This involves understanding user needs, defining information architecture, outlining user flows, and ensuring a solid foundation for visual design and frontend development. The output will populate the `ui-ux-spec.txt` template.
To collaboratively work with the user to define and document the User Interface (UI) and User Experience (UX) specifications for the project. This involves understanding user needs, defining information architecture, outlining user flows, and ensuring a solid foundation for visual design and frontend development. The output will populate the `front-end-spec-tmpl.txt` template.
### Phase Persona
@@ -31,8 +31,8 @@ To collaboratively work with the user to define and document the User Interface
### Inputs
- Project Brief (`project-brief.txt` or equivalent)
- Product Requirements Document (PRD) (`prd.txt` or equivalent)
- Project Brief (`project-brief-tmpl.txt` or equivalent)
- Product Requirements Document (PRD) (`prd-tmpl.txt` or equivalent)
- User feedback or research (if available)
### Key Activities & Instructions
@@ -40,38 +40,38 @@ To collaboratively work with the user to define and document the User Interface
1. **Understand Core Requirements:**
- Review Project Brief and PRD to grasp project goals, target audience, key features, and any existing constraints.
- Ask clarifying questions about user needs, pain points, and desired outcomes.
2. **Define Overall UX Goals & Principles (for `ui-ux-spec.txt`):**
2. **Define Overall UX Goals & Principles (for `front-end-spec-tmpl.txt`):**
- Collaboratively establish and document:
- Target User Personas (elicit details or confirm existing ones).
- Key Usability Goals.
- Core Design Principles for the project.
3. **Develop Information Architecture (IA) (for `ui-ux-spec.txt`):**
3. **Develop Information Architecture (IA) (for `front-end-spec-tmpl.txt`):**
- Work with the user to create a Site Map or Screen Inventory.
- Define the primary and secondary Navigation Structure.
- Use Mermaid diagrams or lists as appropriate for the template.
4. **Outline Key User Flows (for `ui-ux-spec.txt`):**
4. **Outline Key User Flows (for `front-end-spec-tmpl.txt`):**
- Identify critical user tasks from the PRD/brief.
- For each flow:
- Define the user's goal.
- Collaboratively map out the steps (use Mermaid diagrams or detailed step-by-step descriptions).
- Consider edge cases and error states.
5. **Discuss Wireframes & Mockups Strategy (for `ui-ux-spec.txt`):**
- Clarify where detailed visual designs will be created (e.g., Figma, Sketch) and ensure the `ui-ux-spec.txt` correctly links to these primary design files.
5. **Discuss Wireframes & Mockups Strategy (for `front-end-spec-tmpl.txt`):**
- Clarify where detailed visual designs will be created (e.g., Figma, Sketch) and ensure the `front-end-spec-tmpl.txt` correctly links to these primary design files.
- If low-fidelity wireframes are needed first, offer to help conceptualize layouts for key screens.
6. **Define Component Library / Design System Approach (for `ui-ux-spec.txt`):**
6. **Define Component Library / Design System Approach (for `front-end-spec-tmpl.txt`):**
- Discuss if an existing design system will be used or if a new one needs to be developed.
- If new, identify a few foundational components to start with (e.g., Button, Input, Card) and their key states/behaviors at a high level. Detailed technical specs will be in `front-end-architecture.md`.
7. **Establish Branding & Style Guide Basics (for `ui-ux-spec.txt`):**
7. **Establish Branding & Style Guide Basics (for `front-end-spec-tmpl.txt`):**
- If a style guide exists, link to it.
- If not, collaboratively define placeholders for: Color Palette, Typography, Iconography, Spacing.
8. **Specify Accessibility (AX) Requirements (for `ui-ux-spec.txt`):**
8. **Specify Accessibility (AX) Requirements (for `front-end-spec-tmpl.txt`):**
- Determine the target compliance level (e.g., WCAG 2.1 AA).
- List any known specific AX requirements.
9. **Define Responsiveness Strategy (for `ui-ux-spec.txt`):**
9. **Define Responsiveness Strategy (for `front-end-spec-tmpl.txt`):**
- Discuss and document key Breakpoints.
- Describe the general Adaptation Strategy.
10. **Output Generation:**
- Incrementally populate the sections of the `BETA-V3/gems-and-gpts/templates/ui-ux-spec.txt` file based on the discussions.
- Incrementally populate the sections of the `BETA-V3/gems-and-gpts/templates/front-end-spec-tmpl.txt` file based on the discussions.
- Present sections to the user for review and confirmation.
- Ensure all placeholder links and references are correctly noted.
@@ -81,7 +81,7 @@ To collaboratively work with the user to define and document the User Interface
### Purpose
To define the technical architecture for the frontend application. This includes selecting appropriate patterns, structuring the codebase, defining component strategy, planning state management, outlining API interactions, and setting up testing and deployment approaches, all while adhering to the guidelines in `front-end-architecture.md` template.
To define the technical architecture for the frontend application. This includes selecting appropriate patterns, structuring the codebase, defining component strategy, planning state management, outlining API interactions, and setting up testing and deployment approaches, all while adhering to the guidelines in `front-end-architecture-tmpl.txt` template.
### Phase Persona
@@ -90,8 +90,8 @@ To define the technical architecture for the frontend application. This includes
### Inputs
- Product Requirements Document (PRD) (`prd.txt` or equivalent)
- Completed UI/UX Specification (`docs/ui-ux-spec.txt` or equivalent)
- Product Requirements Document (PRD) (`prd-tmpl.txt` or equivalent)
- Completed UI/UX Specification (`docs/front-end-spec-tmpl.txt` or equivalent)
- Main System Architecture Document (`docs/architecture.md` or equivalent) - The Design Architect should particularly note the overall system structure (Monorepo/Polyrepo, backend service architecture) detailed here, as it influences frontend patterns.
- Primary Design Files (Figma, Sketch, etc., linked from UI/UX Spec)
@@ -138,7 +138,7 @@ To define the technical architecture for the frontend application. This includes
- List key frontend-specific performance strategies to be employed.
12. **Output Generation:**
- Incrementally populate the sections of the `BETA-V3/gems-and-gpts/templates/front-end-architecture.md` file.
- Incrementally populate the sections of the `BETA-V3/gems-and-gpts/templates/front-end-architecture-tmpl.txt` file.
- Present sections for user review and confirmation.
13. **Checklist Review and Finalization:**
@@ -169,7 +169,7 @@ To generate a masterful, comprehensive, and optimized prompt that can be used wi
### Inputs
- Completed UI/UX Specification (`ui-ux-spec.txt`)
- Completed UI/UX Specification (`front-end-spec-tmpl.txt`)
- Completed Frontend Architecture Document (`front-end-architecture.md`)
- Main System Architecture Document (`architecture.md` - for API contracts and tech stack)
- Primary Design Files (Figma, Sketch, etc. - for visual context if the tool can accept it or if descriptions are needed)
@@ -186,13 +186,13 @@ To generate a masterful, comprehensive, and optimized prompt that can be used wi
- Mention the styling approach (e.g., Tailwind CSS, CSS Modules).
- **Design System & Visuals:**
- Reference the primary design files (e.g., Figma link).
- If the tool doesn't directly ingest design files, describe the overall visual style, color palette, typography, and key branding elements (from `ui-ux-spec.txt`).
- If the tool doesn't directly ingest design files, describe the overall visual style, color palette, typography, and key branding elements (from `front-end-spec-tmpl.txt`).
- List any global UI components or design tokens that should be defined or adhered to.
- **Application Structure & Routing:**
- Describe the main pages/views and their routes (from `front-end-architecture.md` - Routing Strategy).
- Outline the navigation structure (from `ui-ux-spec.txt`).
- Outline the navigation structure (from `front-end-spec-tmpl.txt`).
- **Key User Flows & Page-Level Interactions:**
- For a few critical user flows (from `ui-ux-spec.txt`):
- For a few critical user flows (from `front-end-spec-tmpl.txt`):
- Describe the sequence of user actions and expected UI changes on each relevant page.
- Specify API calls to be made (referencing API endpoints from the main `architecture.md`) and how data should be displayed or used.
- **Component Generation Instructions (Iterative or Key Components):**