So Google quietly dropped a free design tool that basically lets you skip the entire design phase of building a website or app. You describe what you want in plain text, and it hands you back polished UI screens you can edit, preview, and even export straight into code. The creator behind this walkthrough is a well-known AI educator who put Stitch through its paces across multiple use cases, and the results are honestly worth paying attention to.
Here’s the twist: this isn’t just another “type and pray” AI tool. Stitch doesn’t jump straight to pixels. In ideate mode, it first builds a full product requirement document, maps out the user experience, defines color palettes, font selections, button styles, and page hierarchy. It plans before it designs. That’s the part that caught my eye, because it mirrors what good human designers actually do.
How the workflow breaks down
The expert walked through a clean step-by-step process that’s easy to follow:
- Pick your mode: Stitch offers four: Ideate (planning-first), Flash (fast prototyping), Thinking with Gemini 3.1 (highest quality), and Redesign (upload a screenshot of an existing site).
- Choose your format: mobile app or web app. This determines the canvas and preview options.
- Write your prompt: describe what you want. Colors, layout, vibe, functionality. The author used Gemini itself to polish the prompt beforehand, which is a smart move.
- Review the plan: in ideate mode, Stitch generates a product requirement doc with visual direction, core user flows, and page descriptions before touching any design.
- Approve and generate: click “go ahead” and Stitch creates your first set of screens.
- Edit directly on canvas: every element is clickable. Change text, move components, ask AI to modify specific sections. No need to retype everything in the prompt box.
- Preview across devices: check how it looks on phone, tablet, and desktop with one click.
- Export to Google AI Studio: this is the big one. Stitch packages your design as images plus a markdown file and sends it to AI Studio, which writes the actual code and gives you a publishable website.
Flash vs. Thinking: when to use which
This is where the practical nuance lives, and the original poster did a solid job explaining the tradeoff.
- Flash mode is built for speed. You get decent-looking screens in under 60 seconds. It’s perfect for internal tools, SaaS dashboards, or when you just want to see three or four variations of the same concept quickly. You can generate multiple variations at once and pick the direction you like best. Think of it as your brainstorming mode.
- Thinking mode (Gemini 3.1) takes a couple of minutes but produces noticeably better results. The typography is sharper, spacing is more intentional, and the overall aesthetic feels closer to something a professional designer would ship. The expert recommends this for anything customer-facing: landing pages, marketing sites, products you’re taking to market. The extra wait time pays off in polish.
- Ideate mode can be paired with either model. Start in ideate to get the plan, then switch to the pro model on the next page for the best output quality.
Live mode is surprisingly useful
Stitch includes a live mode where you literally talk to the AI designer through your microphone. The creator demonstrated this by asking it to fix text readability on a dark background. The AI suggested brighter text, made the change, and showed the updated screen, all in near real-time conversation. It’s the same live interaction feature that’s been in Google AI Studio, but applied specifically to design. For people who think faster out loud than they type, this could seriously speed things up.
From design to live website in minutes
The part that ties everything together is the export pipeline. Once you’re happy with your Stitch design, you hit export, choose “Build with AI Studio,” and it uploads your screens plus a structured prompt. AI Studio writes the code, renders the site, and lets you preview it on desktop and mobile. The author published a full coffee company landing page this way without writing a single line of code or doing any manual design work.
🔧 Pro tip: Don’t skip the ideate step. Having Stitch generate the product requirement document first gives you a clear map of pages, user flows, and design tokens. That structure carries forward into everything else, including the AI Studio export. It’s tempting to jump straight to visuals, but planning first consistently produces better results.
🔧 Pro tip: Use Gemini to write your Stitch prompts. The more specific you are about color schemes, layout preferences, and functionality, the less back-and-forth you’ll need. The expert’s habit tracking app prompt included dark mode, neon accents, gamification, and minimalistic style, and the first output was already close to final.
As of right now, Stitch is completely free. That probably won’t last forever, so it’s worth experimenting with while there’s no barrier to entry. Check out the full video for the live demos and side-by-side comparisons of each mode in action.