How to Fix AI Slop in Your App Designs (My Workflow)

AI WORKFLOWS & MORE: https://uicollective.co/
https://x.com/KirkMDesign
Learn AI Design: https://youtu.be/r-MPiu0E4W4

I take a generic, vibe-coded app and give it a design upgrade using AI workflows and free, open-source skills. From typography and color to layouts and animation, I show you what I changed, why it works, and how to apply it to your own app.

⭐️ Save 20% on the Annual Mobbin plan: http://mobbin.com/uicollective

🔗 OTHER VIDEOS TO WATCH
Senior AI Design Workflows: https://youtu.be/Oo-5AWdQAt8
Learn Design Systems: https://youtu.be/lsgVRCJ4fko
Build a Design System: https://youtu.be/opTANvl9G1g
Complex Design System & Figma Variable Setup: https://youtu.be/L-tpK7Eeuow
Train Claude on Your Design System: https://youtu.be/VezxOhvoXqU

🚨Open Source Skills Shown
Better colors: https://github.com/jakubkrehel/skills/blob/main/skills/better-colors/SKILL.md
Color Expert: https://github.com/meodai/skill.color-expert
Impeccable: https://impeccable.style/
Stageshow: https://x.com/benjitaylor/status/2116593247854453244
Animation skill: https://github.com/emilkowalski/skills/blob/main/skills/animate/SKILL.md

🔗 MORE LINKS
Designer Smash: https://designersmash.com/
➡️ WORK WITH US: We help enterprises make their Design Systems AI ready: https://designsystemlabs.co/
Need a design system? (also included in the academy): https://collectivekit.co/
kirkland@uicollective.co

0:38 Intro to the Vibe-Coded App
1:25 Adjusting Type
4:44 Polishing Colors
7:20 Open Source Skills to Use
13:26 Adjusting Layouts
16:24 Use This MCP
20:41 Refining UI’s
22:33 Open Source Skills For Powerful Visuals
26:26 Adjusting Layouts
30:05 Animations and Motion
32:43 Wrapping Up