# Web Environment Quick Start Guide

## 5-Minute Setup for v0 UX/UI Architect

### Prerequisites
- Access to ChatGPT, Gemini, or Claude web interface
- BMAD Method web build files (from running `node build-web-agent.js`)

### Step 1: Set Up Your Web Agent
1. **Copy the agent prompt**: Use content from `web-build-sample/agent-prompt.txt`
2. **Attach the build files**: Upload all `.txt` files from the `web-build-sample/` directory
3. **Name your agent**: "BMAD Agent" or similar
4. **Save the configuration**

### Step 2: Activate Veronica
\`\`\`
I need Veronica, the v0 UX/UI Architect, to help me create a modern dashboard component.
\`\`\`

### Step 3: Provide Your Requirements
\`\`\`
I'm building a SaaS application dashboard that needs:
- A sidebar navigation with menu items
- A main content area for widgets
- A top header with user profile and notifications
- Responsive design for mobile and desktop
- Modern, clean aesthetic using a blue and white color scheme
\`\`\`

### Step 4: Review the Output
Veronica will provide:
- Detailed component specification
- Visual design description
- Implementation guidelines
- Accessibility considerations

### Step 5: Iterate and Refine
\`\`\`
Can you modify the sidebar to be collapsible and add a dark mode variant?
\`\`\`

## Common Web Environment Workflows

### Design Exploration
\`\`\`
Veronica, I need to explore different design directions for a product landing page. 
Can you create 3 different layout concepts with different visual styles?
\`\`\`

### Component Specification
\`\`\`
I need a detailed specification for a data table component that includes:
- Sortable columns
- Row selection
- Pagination
- Search functionality
- Export options
\`\`\`

### Design System Planning
\`\`\`
Veronica, help me plan a design system for a fintech application. 
I need core components, color palette, typography scale, and spacing tokens.
\`\`\`

## Tips for Success
- Be specific about your technical requirements
- Mention your preferred frameworks and styling approaches
- Provide examples of designs you like
- Ask for accessibility considerations
- Request responsive design specifications