Reviewing AI-generated interfaces the way a design lead would
Evaluating AI-generated designs for hierarchy, interaction states, accessibility and design-system consistency — and turning each review into feedback that is specific enough to act on.
- Role
- AI Design Analyst
- Through
- micro1
- Focus
- Visual quality, interaction, accessibility, system consistency
- Client
- Confidential
The client and their material are confidential. Every example on this page is a recreation made for this portfolio, clearly labelled as such.
Context
AI tools can now generate whole interfaces. Whether those interfaces are actually good still takes a designer’s eye.
Through micro1, I work as an AI Design Analyst. I evaluate AI-generated designs, test how they behave, and document what works, what doesn’t and why — so the output can get better.
My role
- Evaluate AI-generated designs for visual and structural quality
- Test interaction behaviour and interface states
- Check accessibility
- Check consistency with the design system
- Document findings and write actionable feedback
Evaluation criteria
Every review covers the same five areas, so findings are comparable across designs.
01
Hierarchy & layout
Is the most important thing obvious? Typography, spacing and layout should guide the eye in the right order.
02
Interaction & states
Do controls respond as expected? Hover, focus, active, loading, empty, error and disabled states should all exist and make sense.
03
Accessibility
Contrast, keyboard access, visible focus, labels and target sizes — checked, not assumed.
04
System consistency
Does the design use the system’s tokens and components, or invent near-duplicates?
05
Actionable feedback
Each finding says where, what’s wrong, why it matters and what to change.
How I approach a review
- 01
Read the intent
What was the design asked to do, and for whom?
- 02
Inspect the static design
Hierarchy, type, spacing and layout first.
- 03
Test the interaction
Click, tab and break it. Look for missing states.
- 04
Check access & system
Contrast, focus, labels; tokens and components.
- 05
Document & recommend
Write findings someone can fix without asking me.
Examples
Recreated example
This is not client material. It’s a sample I made to show the format of a review.
| AREA | VERDICT | FINDING |
|---|---|---|
| Hierarchy | Pass | Primary action is the clear focal point. |
| Spacing | Revise | Card padding mixes 12px and 20px; system uses 16/24. |
| States | Missing | No focus, loading or error state on the form. |
| Accessibility | Revise | Placeholder text used as the only label. |
| System | Revise | Custom grey #9A9A9A instead of text.muted token. |
Feedback that can be acted on
VAGUE
“The spacing feels off and the form isn’t accessible.”
ACTIONABLE · RECREATED
- Where
- Email field, sign-up form
- Issue
- Placeholder is the only label; it disappears on input.
- Why
- Screen readers and users with memory load lose context.
- Fix
- Add a persistent visible label using the form-label component.
Completed vs proposed
Completed work
- Evaluated AI-generated designs across the five criteria
- Tested interaction behaviour and interface states
- Documented findings with actionable feedback
Proposed workflow (not yet in use)
- A shared severity scale so findings can be prioritised
- A reusable checklist mapped to design-system tokens
Learnings
- AI-generated layouts often look finished before they behave finished. States are where quality is won or lost.
- Vague feedback (“improve spacing”) teaches nothing. Precise feedback names the element, the rule and the fix.
- A clear design system makes evaluation faster and fairer — it turns taste into criteria.
Next case study
Global Design System