Back to articles

How I Generate Quality UI Designs with AI in 30 Minutes

Feb 9, 2026Dishant Sharma5 min read
How I Generate Quality UI Designs with AI in 30 Minutes

Most designers hate AI-generated UI. The layouts look like they're from 2021. The spacing is off. Everything feels generic.

But i found a workflow that actually works. Not perfect. But good enough that i stopped opening Figma for first drafts.

The problem with AI design tools

Google launched Stitch in May 2025. It's supposed to turn text prompts into UI designs in minutes. Sounds great.

Except when you try it, you get basic layouts. Generic buttons. Colors that look like every SaaS landing page you've ever seen.

The issue isn't the tool. It's how we use it.

AI doesn't understand why you put a button at the bottom of a form. It just knows that's where buttons usually go. Feed it a vague prompt and you'll get vague results.

So i tried something different.

Start with research, not prompts

Here's what i did. Opened Perplexity. Turned on Claude Sonnet 4.5 with thinking mode. This matters because thinking mode gives longer, more detailed responses.

i gave it everything about my app idea. Not just "i want a dashboard." i explained the problem it solves. Who uses it. What they need to do. What features matter most.

Added social search too. This pulls from Reddit and other platforms. Real people talking about real problems.

Perplexity gave me a 20-page document.

Not fluff. Actual research. User problems. Competitor analysis. Feature breakdowns. Things i hadn't thought about.

This took maybe 15 minutes.

The wireframe prompt

Most people go straight to Stitch with "make me a dashboard." Then wonder why it looks terrible.

i went back to Perplexity. Same settings. New prompt.

Told it i hired a UI designer. Needed a detailed wireframe doc. Described the basic user flow in my own words. Listed the features.

Key part: i said "this is the basic flow, there can be many changes and features added."

Why this works: you're not asking for final designs. You're asking for a structure. A foundation.

The output was 35 pages of wireframes using ASCII art.

Phase 1, phase 2, phase 3. User flows mapped out. Every screen documented. Features explained in context.

Took another 15 minutes.

Feeding it to Stitch

This is where it gets good.

Opened Stitch. Pasted the section for phase 1. Just that part. Not everything.

Asked it to generate UI for phase 1.

And the designs were actually decent. Clean layouts. Proper hierarchy. Made sense for the use case.

Why? Because Stitch had context. Real context. Not "make a dashboard" but "here's a 3-page wireframe explaining what this dashboard needs to do and why."

After phase 1, i asked if it should move to phase 2. It did. Then phase 3.

When it started deviating, i pasted the wireframe doc again. Boom. Back on track.

This happened a few times. Stitch would add random features or change the layout structure. i'd paste the relevant section from the 35-page doc. It would correct itself.

The zoom-in method

There's a Reddit post about this. Someone who built 10+ projects with AI.

They call it the zoom-in method. Start at 50% with a rough draft. Then 75% refining page by page. Then 99% focusing on small details.

That's exactly what this workflow does. Except you're doing the planning before touching the design tool.

The 20-page research doc is your 0-25%. Understanding the problem space.

The 35-page wireframe doc is your 25-50%. Mapping the structure.

Stitch takes you from 50% to 75%. Maybe 80% if you're lucky.

The boring part nobody talks about

You know what's annoying? Keeping track of all these docs.

i had the 20-page research doc in one tab. The 35-page wireframe in another. Stitch in a third. Copying and pasting sections back and forth.

My friend builds everything in Notion. Has this whole system with databases and linked pages. Spends more time organizing than building.

i just use a text file. One massive text file with headers. Ctrl+F to find what i need.

Not elegant. But it works.

Sometimes i think about tools that are supposed to make this easier. Figma plugins. Design systems. Component libraries.

Then i remember i'm just trying to get a first draft done. Not build the next Airbnb.

What this won't do

This workflow won't make you a designer. If you don't understand basic UI principles, you'll still end up with bad designs.

Stitch can't save you from yourself.

Also, the designs aren't production-ready. You'll need to tweak spacing. Fix colors. Add your brand. Handle edge cases.

This is for speed, not perfection.

If you're building a portfolio piece, don't use this. If you need pixel-perfect designs that'll impress clients, don't use this.

But if you're a developer who needs a decent UI to start coding? This works.

If you're a founder who wants to show investors something that doesn't look like 2010? This works.

The honest truth: most AI tools suck at UI because they're trained on bad examples. Dribbble designs that look pretty but don't work. Old websites from 2015. Generic templates.

Stitch is the same. But giving it detailed context helps it avoid the worst patterns.

You're basically doing the designer's job upfront. Then letting AI handle the visual execution.

One more thing

i still tweak everything after. Move buttons around. Change colors. Fix that weird spacing Stitch always adds to headers.

But now i'm tweaking something that exists. Not staring at a blank Figma canvas trying to figure out where to start.

That's the real win. Not that AI made perfect designs. But that it got me past the blank page.

Started using this workflow a month ago. Haven't opened Figma for initial designs since.

Still feels weird.

Recent posts

View all posts