Vibe Coding
Vibe coding is iterative building with AI coding tools (Cursor, Claude Code, Lovable, etc.) where natural language steers rapid prototypes—“make it feel calmer,” “add citation chips.”
For designers, it shifts deliverables from static mocks to working surfaces that expose real AI states.
Share
What it means
Using agents to generate and refine UI in code with taste and guardrails, not one-shot prompts without design constraints.
Why designers should care
Vibe-coded prototypes surface loading, errors, and trust issues early. Designers who pair vibe coding with patterns ship more realistic AI UX.
Example
A designer prototypes a streaming composer in Cursor, restarts the demo to test interrupt, then links the pattern catalog URL in the PR.
Common mistakes
- • Accepting first AI output without testing edge states.
- • No design system or accessibility constraints in agent context.
- • Treating prototype code as production without review.