AI gave a bad result – how to notice it before the customer sees it

## Why is it important right now

Experienced designer Gary Simon — 20 years at UI/UX, a million YouTube subscribers — tested the revamped Google Stitch right after it was released in March 2026. I gave the tool the task: to generate landing by PRD. Generation took a minute. He described the result as "still mediocre": blurred color scheme, flat hierarchy, controversial decisions at the section level.

It's not a special case. This is a systemic feature of AI design: the tool optimizes for “generally normal” rather than “good for a specific context.” The difference between these two states should be noticed by the designer himself.

## Signal 1. The Hierarchy Is Flat - The Look Doesn't Know Where to Go

In the first three seconds you don’t know what to look at. Everything is about the same weight: headlines are not much larger than subheadings, buttons do not stand out among the cards, accents are placed everywhere - and therefore nowhere.

AI builds the default hierarchy: H1 is larger than H2, H2 is larger than the body – and that’s it. That's not enough. A good hierarchy makes the user’s next move obvious without explanation.

How to check. Wash the screen to blurry or look at it from arm’s length. What stands out? If there is nothing concrete, the hierarchy does not work.

** How to fix it.** Give a refining prompt: “Increased visual contrast between the main title and the rest of the elements. The main button should be the most prominent interactive element on the screen.” Or fix the dimensions and weights manually in Figma.

## Signal 2. Colors look 'normal' but don't work for task

AI chooses colors that look harmoniously together, which it does well. But harmony and functionality are different things.

A typical situation: accent color is used for buttons, and for icons, and for accents, and for badges. As a result, it stops being an accent - it's just the color of the interface. The button does not stand out, the CTA is lost.

Another pattern is a muted, “airy” palette that looks stylish on a screenshot, but on a real screen in daylight loses contrast and becomes unreadable.

Look at the screen and say, where do you need to click? If the accent color does not lead to action, it is decorative, not functional. Separately check text contrast with Contrast Checker – a minimum of 4.5:1 for the main text.

**Reserve accent color only for the main CTA. Everything else is neutral shades of the main palette.

## Signal 3. Icons from different visual languages

One of the most common artifacts of AI generation, which is not noticed at first sight.

Stitch or Figma Make take icons from what is available - and in one screen can be outline icons next to filled, thin icons next to bold, icons with different rounded corners. Each individually looks normal. Together, the interface looks unassembled, even if you can’t immediately articulate why.

The customer feels this as “something is wrong,” although he cannot name it specifically. The designer should name specifically.

**Write down all the icons on one screen. Are they from the same library? Same style (all outline or all filled) Same thickness of lines? Same rounding?

Select one icon library on the full screen and replace all icons with it. In Figma it is quick through the Iconify plugin.

## Signal 4. The text is not verified on real data

AI fills the interface with perfect stubs: names of exactly the same length, descriptions fit exactly into the block, numbers are beautiful and round. Real data doesn't work that way.

The user name may be “Alexandra Petrovskaya-Vorontsov” and it will not fit into the card. The product description can be one-line or eight-line. The amount can be “1 234 567.89 ни” and break the alignment.

If you do not check this before the display, the customer will check for himself - insert real data and see that the layout crumbles.

Replace all stubs with real or realistic data: long name, short description, zero state (empty list), very long number. Look what's going on with the leaut.

How to fix. Auto Layout with the right parameters - min/max width on text blocks, text truncation where necessary, numerical fields with sufficient width for real values.

## Signal 5. Generic visual without connection to the product

AI doesn’t know what product you’re making. He knows what similar products look like on the internet. And it generates the average.

The result: The financial application looks like any other financial application. Health care is like any other medical service. All the rounded cards, all the pastel colors, all the illustrations in one modern style - and no individuality.

This is especially noticeable when the customer looks at the competition and sees that its interface looks like their interface, only worse done.

**Remove the logo and product name from the layout. Do you know what the product is and for whom? If not, the design is too general.

How to fix it. Before the next iteration, add specific distinctive characteristics to the prompt: audience specificity, tonality, what visual clichés you want to get away from. AI works well with constraints – it just needs to set them.

## Signal 6. Departures inconsistent

Look at the screen and it’s a little rough. There are different gaps between the cards. The internal indentations of similar blocks are different. The elements are not arranged in one grid.

This is one of the most characteristic artifacts of AI generation. The model understands the concept of indentations, but does not always stand the system. Retreats can vary by 2-4px – imperceptibly during a cursory viewing, very noticeable when looking closely or when transferring to development.

The developer will catch it and either ask or make it as convenient to him.

How to check. Turn on the grid in Figma (Shift+G) and see if the elements follow it. Check the indentations between similar elements – they should be the same.

How to fix. Lock the indentation system multiples 8px (8, 16, 24, 32, 48) and walk around the screen, aligning the elements manually. On a complex screen takes 10-15 minutes — but this makes the difference between “drawing” and “ready to develop”.

## Signal 7. Happy Path and nothing else

AI generates the perfect scenario: the data is uploaded, the user is authorized, the list is filled, everything went well. This is one of the four real interface states.

The other three – download, error, empty state – AI doesn’t cover unless you ask for it. And a customer who tries to imagine what a blank list or download error looks like will not get a response from the layout.

It's not just a pass. It’s a signal that the designer wasn’t thinking about the product dynamically – just as a static picture.

How to check. ** For each key screen, ask three questions: What does it look like when you load? What does the user see if the list is empty? What happens when you make a mistake?

How to fix. Add to the prompt explicitly: "Show also the empty state for this screen - when the list is empty and the data is not yet available." Or make these states separate frames in Figma – it takes 15-20 minutes, but radically changes the perception of the layout.

## Checklist before showing to the customer

Quick check before sending or before demo. Five minutes is enough.

Hierarchy
● In 3 seconds, you know what to look at and where to press.
● The main CTA visually stands out from the other elements.

Colour
Accent color is used only for actions, not decoratively
Contrast text ≥ 4.5:1 (check through Contrast Checker)

Consistency
● All icons from one library, one style
The gaps between similar elements are the same
● Typography uses styles, not arbitrary sizes

Real data
● Long name/name fits into the block
● Empty state checked.
Numbers with a real number of characters do not break the leyout

Conditions
● At least an empty state is shown for lists.
● Load status for key blocks shown

Product context
● Without a logo, it is clear what the product is and for whom

## How to build a check in the workflow

Verification should not be a separate stage that can be missed under the deadline. It is more convenient to embed it at the end of each iteration – literally as the last step before sending a link.

Hang the checklist directly in the Figma file - a separate frame next to the layout. Or keep it as a saved prompt for Claude: “Here’s the layout, check these criteria and tell me what needs improvement.” It works – the model sees problems of hierarchy, consistency and indentations in the description or screenshot.

The goal is not to perfect every screen before the first screening. The goal is for the customer to see the problems you already know and control, not the ones you didn’t know about.