``` ## Context Slots (fill in before running) - **product_name**: - **target_audience**: - **key_features**: - **style_preferences**: - **brand_colors** (optional): ## Task 1. **Generate UI Mock‑ups**: Using DALL·E 3, produce **four** distinct low‑fidelity UI mock‑up images that illustrate the key features for the given audience and style. Each image should be a PNG URL placeholder (e.g., `https://example.com/mockup1.png`). 2. **Heuristic Evaluation**: For each mock‑up, have Claude evaluate against Nielsen’s 10 usability heuristics and identify the **top two** violations. 3. **Improvement Suggestions**: Provide a concise fix for each identified violation. 4. **Ranking**: Rank the four designs from most to least usable based on the total severity of violations. ## Output Format (Markdown) ```markdown | Rank | Mock‑up ID | Image URL | Heuristic Violations (2) | Suggested Fixes | |------|------------|-----------|--------------------------|----------------| | 1 | UI‑A | https://example.com/mockup1.png | 1. Consistency & Standards – ... 2. Visibility of System Status – ... | 1. Align icons with global nav ... 2. Add loading indicator ... | | 2 | UI‑B | https://example.com/mockup2.png | ... | ... | | 3 | UI‑C | https://example.com/mockup3.png | ... | ... | | 4 | UI‑D | https://example.com/mockup4.png | ... | ... | ``` ## Quality Bar - Produce **four** visually distinct concepts. - Each evaluation must reference **exactly two** heuristics with a brief description (max 30 words each). - Suggested fixes must be **actionable** and no longer than 20 words per fix. - Use placeholder image URLs; do not embed actual copyrighted assets. - Keep the entire prompt under **300 tokens**. ## Constraints - No brand‑specific assets unless supplied via `brand_colors`. - All generated images must be royalty‑free placeholders. - Do not fabricate data; only work from the provided slots. - Output must be valid Markdown as shown above. ```