MCP Server. From Make to layers. Cursor.
Vibe code prototypes at Shopify
Max Stoiber notes how traditional design handoffs are a thing of the past at Shopify. Agree with this: “the hard part of making prototypes real is not “turning static drawings in Figma into HTML & CSS” anymore. AI can do that perfectly in seconds. What’s left is: backend implementations, wiring up the data fetching, handling state… None of which is “handoff.”
For most of my career, I owned both design and front-end code on products I worked on. This combination of skills used to be a (somewhat) rare differentiator, but became ubiquitous with AI. That said, for AI to work “perfectly in seconds” requires an extensive setup with an advanced design system shared between Figma and code. Without this foundation, prototyping designs for real apps still requires some technical knowledge. These days, I often use Figma Make for quick experiments and proofs of concepts before switching to the actual codebase and prototyping the final version with Cursor (fully adopted by the design team at Shopify as well).
Cursor Learn
Speaking of Cursor, Lee Robinson recorded a six-part video series on AI foundations. It’s designed for beginners to learn concepts like tokens, context, and agents. The entire course is free and just 1 hour long.
From Design to Code with Claude Code in 40 Minutes
Peter Yang interviews Meaghan Choi, a design lead for Claude Code, about her Figma-to-code workflow and the top 3 design use cases for Claude Code.