Vibe design: the newest fix for AI's generic UI problem
By The WAALEE Team · · 5 min read
Vibe coding's generic-look problem is old news by now: ask Claude, Lovable or v0 for an app with no reference and no tokens, and you get the same rounded cards, the same purple-to-blue gradient, the same Inter typeface everyone else got. The newer twist is a category calling itself "vibe design": tools that design the screen first, before a single line of code gets written, on the theory that the generic look is a prompting problem you can solve earlier in the pipeline instead of patching after the fact. Worth a look, because the theory is half right.
Flowstep's bet: generate the design, not the code
Flowstep, a Tallinn startup that raised $2.6M to build what it calls an "AI-native design platform," frames vibe design as the visual counterpart to vibe coding. You describe a product, optionally paste in a PRD, a reference image or a link, and it generates multiple screens and flows on an infinite canvas you can still edit by hand before anything ships. From there you export to Figma for a design team or straight to code for a dev. The pitch is that a coding agent prompted straight from text has to invent layout, spacing and hierarchy on the spot; a coding agent handed an already-designed screen just has to implement it.
VP0's bet: hand the agent a screen that already exists
VP0 takes a narrower, more mechanical version of the same idea for iOS apps specifically. It's a free library of finished mobile screen designs; you pick one close to what you want, copy its link, and paste that into Cursor, Claude Code or Lovable. Because each screen has a clean, AI-readable source structure, the agent rebuilds it in SwiftUI or React Native instead of guessing at a layout from an adjective-heavy prompt. VP0's own framing is blunt about why this exists: a blank prompt forces the model to invent every visual decision, and the result is the bland default every AI app shares.
- Flowstep: text, images or a PRD in, multiple editable screens and flows out, on a canvas, exportable to Figma or code. General-purpose, web and app.
- VP0: pick an existing, finished iOS screen from a free library and hand its link to your coding agent to rebuild. Narrower, faster, mobile-only.
- Both move the "what should this look like" decision earlier, out of the coding agent's lap and into a design step that happens first.
- Neither one reads an existing brand. Flowstep invents a new look from your prompt; VP0 hands you someone else's already-finished look.
Designing first still isn't the same as designing yours
Here's the gap. Moving the design decision earlier in the pipeline fixes the specific failure mode where a coding agent, given zero visual direction, falls back on training-data averages, the generic look. It doesn't fix the brand problem, because neither tool is pulling from your brand to begin with. Flowstep's canvas still generates a new aesthetic from its own model's sense of good design, which is more intentional than a bare prompt but still not your company's actual palette, type scale or spacing rhythm. VP0's library solves generic in a different way: every app built from the same screen link inherits that screen's look, which is consistent, but it's VP0's look, not yours. A design-first step helps most when the thing it's designing is actually sourced from somewhere real; a screen or flow generated from scratch is just a better-organized version of the same guess.
Where real tokens still matter more
If you already have a brand, a live site, or even just a reference you love, the fastest route to a screen that looks like you isn't a new canvas inventing one from a text prompt, it's handing the coding agent your actual colors, type and spacing up front, the same way VP0 hands it a screen, except the screen is built from your own system instead of a stranger's. Vibe design tools and token extraction aren't competitors so much as two different places to spend the same effort: design a brand-new screen fast, or ground the screen in a brand that already exists.
Three ways to get a less generic screen out of an AI coding tool, depending on whether you're designing from scratch or already have a brand:
- Flowstep: AI-native design canvas. Generates editable multi-screen flows from a prompt, PRD, image or link; exports to Figma or code. Invents a new look, doesn't read an existing brand.
- VP0: Free library of finished iOS screens. Paste a screen's link into Claude Code, Cursor or Lovable and it rebuilds that exact design in SwiftUI or React Native. Mobile-only, and the look is VP0's, not yours.
- WAALEE: Paste your own live URL (or a reference site) and get its real colors, type and spacing back as W3C tokens and AI-ready prompts for Claude, Lovable, v0, Cursor and Bolt, grounded in a brand that actually exists.
Both categories are a real improvement on the "just prompt it and hope" default, and designing before coding is the right instinct regardless of where the design comes from. But if the goal is a site or app that looks like your company and not like a well-made placeholder, the question to ask before opening any of these tools is the same one: where are the actual values coming from. A canvas that invents a fresh look and a library that hands you someone else's both skip that question. Starting from your own real tokens doesn't.