bd495be965
- Sidebar: dynamic brand-accent colors, brainstorm section restyled - AI chat general: popup panel with expand/collapse, hides when contextual AI open - AI chat contextual: tabs reordered (Actions first), X close button, height fix - Settings: all tabs restyled, 6 new color presets (sage, terracotta, iron, etc.) - Global color cleanup: emerald/orange hardcoded → brand-accent dynamic - Brainstorm page: orange → brand-accent throughout - PageEntry animation component added to key pages - Floating AI button: bg-brand-accent instead of hardcoded black - i18n: all 15 locales updated with new AI/billing keys - Billing: freemium quota tracking, BYOK, stripe subscription scaffolding - Admin: integrated into new design - AGENTS.md + CLAUDE.md project rules added
3.7 KiB
name, description, nextStepFile
| name | description | nextStepFile |
|---|---|---|
| step-04-generate | Craft detailed prompts and generate full page design compositions | ./step-05-review.md |
Step 4: Generate Page Designs
STEP GOAL:
Craft comprehensive prompts and generate full page design compositions, generating desktop first then mobile, using approved results as references for batch consistency.
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 a creative production partner executing page design generation
- ✅ If you already have been given a name, communication_style and identity, continue to use those while playing this new role
- ✅ We engage in collaborative dialogue, not command-response
- ✅ You bring comprehensive prompt crafting expertise, user brings approval decisions
Step-Specific Rules:
- 🎯 Generate desktop first, then mobile using desktop as reference
- 🚫 FORBIDDEN to batch-generate without per-page approval
- 💬 Include wireframe reference when available
- 📋 Track progress per page and view
EXECUTION PROTOCOLS:
- 🎯 Follow the Sequence of Instructions exactly
- 💾 Track progress per page/view
- 📖 Use approved pages as reference for subsequent generations
- 🚫 FORBIDDEN to skip per-page approval
CONTEXT BOUNDARIES:
- Available context: Inventory (Step 2), style (Step 3), wireframes, specs
- Focus: Prompt crafting and page design generation
- Limits: Generate only — full set review in Step 5
- Dependencies: Confirmed style and scoped inventory
Sequence of Instructions (Do not deviate, skip, or optimize)
1. Build Page Design Prompt
For each page: layout (from wireframe or spec), color palette (hex from design system), typography (font families, sizes), style keywords, content (real headlines and body text), components, image areas, dimensions.
2. Include Wireframe Reference
Attach wireframe as structural reference when available. Note: "Follow layout structure, add full visual design."
3. Select Service
[G] Generate via MCP or [E] Export prompts.
4. Generate Sequentially
For each page: desktop first, present for approval, use approved desktop as mobile reference, chain approved pages for batch consistency.
5. Track Progress
Display progress per page and view (desktop/mobile).
6. Present MENU OPTIONS
Display: "Select an Option: [C] Continue"
Menu Handling Logic:
- IF C: Save generated designs, 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'
CRITICAL STEP COMPLETION NOTE
ONLY WHEN C is selected and all scoped pages are generated will you load {nextStepFile} to begin reviewing the design set.
🚨 SYSTEM SUCCESS/FAILURE METRICS
✅ SUCCESS:
- Prompts crafted with all context
- Desktop generated before mobile
- Reference chaining for consistency
- Progress tracked per page/view
❌ SYSTEM FAILURE:
- Batch-generating without approval
- Not using wireframe references
- Generating mobile before desktop
- Not waiting for user input at menu
Master Rule: Skipping steps, optimizing sequences, or not following exact instructions is FORBIDDEN and constitutes SYSTEM FAILURE.