00:00 Intro
00:33 Why I started
01:43 Building a workflow with no tutorial for your situation
02:46 What I actually built
04:15 The real costs and my setup
05:05 What nobody tells you upfront
05:47 6 tips that actually saved me
I spent 30 days learning vibe coding as a UI/UX designer — no dev background, no shortcuts. Here's what I actually built, what broke, and why I think designers have an edge most people aren't talking about.
Most vibe coding tutorials are made by developers. This one isn't. I cover my full workflow (ideation → validation → Figma + PRD → Claude Code in Cursor), the two Chrome extensions I shipped, what it actually costs, and the stuff nobody tells you going in — like how much you'll still need to learn, and why that's not a bad thing.
If you're a product designer, UX designer, or just someone who's been watching the vibe coding space and wondering if it's for you — this is the video I wish existed when I started.
TOOLS AND RESOURCES
→ Hexly (CSS inspector + color/font tool): https://chromewebstore.google.com/det...
→ PaneShot (website screenshot to mockup):
https://chromewebstore.google.com/det...
→ Claude — https://claude.ai
→ Cursor — https://cursor.com
→ Vercel (free hosting) — https://vercel.com
Website: https://kevinkwok.design/
Linkedin / kevinnkwok
Instagram / kevinkwok.design
TikTok / kevinkwokdesign
.
#figma #uxdesigner #uxdesign #ux #ui #tutorial #appdesign #vibecoding #claudecode #uidesign #claude #cursor