Agentic workflows / Practical guide # A UI review checklist for AI-generated apps A practical review checklist for your next release. [By CRRT](/)·November 2, 2026·4 min read [← All resources](/resources) ## The short answer Review an AI-generated app by completing one real user journey, then checking its narrow layout, empty and error states, keyboard access, and design-system consistency. Record each issue with its context, prioritize blockers, and verify accepted fixes in the running product before merging. ## 1\. Complete the job the screen promises Choose the task your user came to complete: create a project, invite a teammate, or update billing details. Start from the actual entry point rather than opening a polished middle screen. Use realistic content and complete the flow through its success state. Write down where you hesitated, where the next step was unclear, and where the app failed to preserve your input. A convincing first screen can hide a dead-end button, a missing permission state, or a confirmation that never reflects saved data. * Confirm the primary action has a working destination. * Check validation and whether input survives a correctable error. * Complete the success path and verify the result persists where expected. * Use browser back and reload to expose hidden navigation assumptions. ## 2\. Use content that stretches the layout Test a narrow phone viewport and a wide desktop viewport. Use a long project name, an empty list, several rows, and a realistic error message. Check intermediate widths if the layout changes significantly between phone and desktop. Look for clipped actions, accidental horizontal scrolling, text placed over other text, and controls that require precision tapping. Set the browser zoom to 200% and confirm the main task remains usable. A screenshot at one resolution cannot establish responsive quality. ## 3\. Review interaction and accessibility Navigate the task using the keyboard. Focus should be visible and follow a useful order. Open and close dialogs, reach their actions, and confirm focus returns to a sensible place. Controls need accessible names, and fields need labels that remain available after typing. Use WCAG as a reference rather than treating a short checklist as certification. For example, normal text generally needs a contrast ratio of at least 4.5:1, while qualifying large text has a 3:1 threshold. Automated checks help find some failures; they do not replace manual review of the task. * Check loading, disabled, error, empty, and success states. * Verify important status changes are communicated beyond color alone. * Check text contrast and visible focus against their actual backgrounds. * Use reduced-motion settings and confirm content remains available. ## 4\. Fix blockers, then review the correction Classify each issue by its effect: blocks the task, creates a likely mistake, or affects polish. Fix blockers before low-impact visual differences. Use one comment per issue, with the route, state, viewport, and a clear expected result. When reviewing an agent’s fix, repeat the original steps and inspect the changed files. If a shared field component changed, check another consumer as well. Record what was checked and anything still unverified. CRRT can connect accepted visual feedback to the implementation handoff; your team retains the decision to ship. Copy & adapt ``` Release review [ ] Core task completes from entry to saved result [ ] Narrow and wide layouts keep actions reachable [ ] Empty, loading, error, and success states are understandable [ ] Keyboard focus and labels support the task [ ] Contrast and reduced-motion behavior checked [ ] Accepted fixes rechecked in their original context [ ] Remaining issues and review owner recorded ``` ## Common questions ### Is this checklist enough to certify accessibility? No. It is a focused product review. Formal conformance requires evaluating the relevant WCAG success criteria across the applicable content and interactions. ### Should the same agent implement and approve a fix? An agent can implement changes and run checks. Keep a person responsible for reviewing the visible result and authorizing the merge. ## Sources & further reading * [W3C: WCAG 2.2 quick reference](https://www.w3.org/WAI/WCAG22/quickref/) * [W3C: understanding minimum text contrast](https://www.w3.org/WAI/WCAG22/Understanding/contrast-minimum.html) * [CRRT: scoped agent handoffs](https://crrt.ai/docs/agent-handoff) Written with AI assistance. Tool references checked against the linked documentation on November 2, 2026. Examples are starter templates to adapt and review in your own project. Keep going ## Put the next piece in place. [ Practical guide · 3 min read ### Design tokens for AI prototypes: start with one screen A small token file and a prompt your builder can reuse. ](/resources/design-tokens-for-ai-prototypes)[ Practical guide · 3 min read ### How to write visual feedback a coding agent can act on A copyable feedback template and a complete worked example. ](/resources/visual-feedback-for-coding-agents) ## See something off? Ship the fix. Pin the feedback. Give your coding agent the context. Review what comes back. [Try CRRT](/docs/install)