⭐ Get 40% OFF for MalCare: https://www.malcare.com/pricing/?utm_source=youtube&utm_medium=ccgs In this video, I’ll show you how to stop building generic AI websites by using a smarter workflow with Stitch and Claude Code. We’ll use Stitch to define the visual direction first layout, typography, colors, and style and then use Claude to turn it into a polished, production-ready website. You’ll learn how to start with strong references, build a clean design system, and then bring it into Claude to add interactions, animations, and real product features. By the end, you’ll have a clear workflow for turning good design into a real website. Design Credits: 1) https://dribbble.com/emon_pixels 2) https://dribbble.com/subash_chandra Prompts: https://docs.google.com/document/d/1DQDImKPZEwipBNeCihpqCa-udF2OF06qZ1xcCxjT6dk/edit?usp=sharing 00:00 Why AI websites look generic 01:11 Use Stitch instead of Claude for design 01:28 Find strong design references first 02:27 Turn references into a design with Stitch 04:11 Build a clean design system 04:52 Bring the design into Claude Code 06:18 Add polish, motion, and features 07:20 Turn it into a real website and deploy #webdesign #claudecode #StitchAI #aiwebdesign #wordpress
ADVERTISEMENT
David Attenborough of design
I used claude to help me define my idea better and enhance it. It really did an amazing job and I directed my design with button affects and layout I was envisioning. I had it make prompts with which I went to cursor to edit and create the necessary files for my site idea. Using verbal to see the website before it becomes real and supabase for data storage/ auth. It sure does take a while and im far from finished hahah. Inspiration and time planning on whiteboards helped me visualize what I was wanting and what was not necessary... im no pro so thanks for your vid
I use a huge MD file whith a lot of the design there, leaving little room for it to "create". I ask it to deliver a json copy of everything as well.
Thanks, now I know how to use stitch perfectly
Love it, thank you
Wonderfull content man! Straight to the point, congratulation. Keep going!!!
Tbh that first point is very bad. The works presented are simply what newbies can do.
blind leading the blind.
if you dont want your website looking like AI, design it on figma or adobe illustrator, and then ask claude to recreate it, if claude does not make it perfect, modify it by yourself manually. Doing this theres literally no way your website look like AI made it since you designed it, unless you take inspiration from other AI websites to design yours lol.
Just import a desgin from a template monster template
question : at the last step ( install website as a theme on wordpress ) you can edit or modify text, images ,etc ? or that´s something we've to do on stich before export ? thanks for the vid
bro is so good in communication!
DID you just said "Turn this Nextjs project and convert it to wordpress"??
How have you found Stitch to work with? After building the first slide for a pitch deck, I asked it to move on to the next slide and it just butchers everything. It's not very good at understanding continuity in design between single frames to the next.
I have one question everyone is talking about to make a site via but I want to know how to manage and maintain the site which is made by AI. Hope we can get video on it?
honestly, stitch isn't as good as you're claiming it is. it makes so many mistakes and you can barely guide it. you can't reference multiple designs it gets confused (form my experience)
90% of the generic Websites look better than those created by designers. Anyway great video. 👍
Just what I was looking for
Damn. Super clean delivery, never boring, straight to the point, great information, no overhype, felt like sitting and drinking a coffee with you! 10/10.
I thought THIS was the standard 😩😩 yall move too fast in this industry