Webflow's AI Design process

👋 Welcome to Sneak Peek with Jay, a series where you will see how top design teams use AI. In this interview Jay chats with Jeff Jean-Baptiste (aka JB) who shows the AI design process at @Webflow!

🔓 Unlock AI Design & Growth Design videos: https://sneakpeek.design/

🧠 Companion videos
• Webflow's Figma File: https://youtu.be/f1engu21G78?si=jnFmkLv2o3qq0TUp

🤝 Connect with JB
• LinkedIn: https://www.linkedin.com/in/jeffjb/

🫶 Connect with Jay
• X: https://x.com/jayneil
• LinkedIn: https://www.linkedin.com/in/jayneil/

✂️ Video edited by Rishabh Tripathi
• X: https://x.com/RishabhxDesign
• LinkedIn: https://www.linkedin.com/in/rishabh-tripathi01/

00:00 Trailer
00:44 Guest intro
01:07 Old design process using Figma
02:11 Figma limitations
04:02 AI Design process using Cursor
07:22 When to use Figma vs Cursor
11:20 Cursor agent mode
13:08 Fixing Cursor errors
13:36 Benefits of using Cursor
15:06 Figma vs AI design tools
17:11 Talking to AI instead of prompting
20:51 Spinning up new agents in Cursor
24:38 Difficult learning curve with Cursor
27:06 ROI from using Cursor
29:04 Using Figma MCP with Cursor
30:54 Stagewise tool
35:40 Tagging Cursor components
38:10 Using AI to communicate with stakeholders
42:30 Using Mobbin for design inspiration
45:50 Advice for designers on how to leverage AI

#aidesign #designprocess #cursor