Built as working context, not shelfware.
This resource is meant to be useful inside the tools where product work now happens: your codebase, your notes, and your AI-assisted workflow.
01
Paste the markdown into Claude, ChatGPT, Cursor, Codex, Gemini, or another AI agent as reusable project context.
02
Use it before a planning, implementation, review, or audit session so the agent has constraints, criteria, and working structure up front.
03
Adapt the sections to your product, team, or repo before asking the agent to execute against it.
Markdown previewprompt-library-ui-critique.md
# Prompt Library For UI Critique Use these prompts to get sharper AI feedback on product interfaces. Replace bracketed sections with your context. ## 1. Layout Hierarchy Review ```text Act as a senior product designer reviewing this interface for hierarchy and scanability. Context: - Product: [product] - Audience: [audience] - Primary user goal: [goal] - Screen or flow: [screen] Review the UI for: 1. Whether the primary action is visually obvious. 2. Whether the information order matches user intent. 3. Elements that compete for attention. 4. Content that should be removed, grouped, or renamed. 5. Mobile risks. Give findings in priority order. Be specific and avoid generic design advice. ``` ## 2. Copy Clarity Review ```text Review this interface copy for clarity, trust, and actionability. Audience: [audience] User state: [new user / returning user / admin / buyer] Desired action: [action] Identify: 1. Vague or overpromising language. 2. Labels that do not describe the action. 3. Missing reassurance or next-step copy. 4. Error-prone wording. 5. Shorter alternatives. Return a table with current copy, issue, and suggested replacement. ``` ## 3. Accessibility Risk Review ```text Audit this UI for likely accessibility issues before implementation. Focus on: 1. Keyboard navigation. 2. Focus states. 3. Screen-reader naming. 4. Color contrast. 5. Motion and dynamic updates. 6. Form errors. 7. Icon-only controls. Prioritize issues that would block usage. Include implementation notes where useful. ``` ## 4. Responsive Behavior Review ```text Review this screen for responsive design risks. Breakpoints to consider: - 360px mobile - 768px tablet - 1280px desktop - Wide desktop Look for: 1. Text overflow risks. 2. Controls that become too dense. 3. Cards or grids that should collapse differently. 4. Sticky or fixed elements that may hide content. 5. Images or charts that need aspect-ratio rules. Give concrete layout recommendations. ``` ## 5. Implementation Risk Review ```text Act as a senior frontend engineer reviewing this design before build. Stack: [stack] Existing design system: [brief description] Data source: [API/CMS/static/local] Identify: 1. Components that already likely exist. 2. Components that should be new. 3. State management risks. 4. Data-shape questions. 5. Edge cases. 6. Testing priorities. 7. Accessibility implementation details. Keep recommendations scoped and practical. ``` ## 6. AI Feature Critique ```text Review this AI-powered feature for UX trust and failure handling. Feature: [feature] User: [user] AI output: [summary] Risk level: [low/medium/high] Evaluate: 1. Whether the user understands what AI is doing. 2. Whether uncertainty is visible. 3. Whether generated output can be reviewed, edited, undone, or rejected. 4. Failure and fallback states. 5. Safety or privacy concerns. 6. Metrics that would prove usefulness. Return prioritized findings and suggested UI changes. ``` ## 7. Final Pre-Ship Review ```text Do a pre-ship review of this interface. Assume the product team is close to launch and only high-signal changes should be made. Find: 1. Bugs or confusing behavior. 2. Missing states. 3. Copy that could cause user mistakes. 4. Layout issues on mobile or desktop. 5. Accessibility blockers. 6. Analytics or QA gaps. Group findings by severity: must fix, should fix, nice to have. ```