Aakash Gupta

Designing With AI With Designers of Figma & Codex

Ed Bayes (Design Staff at OpenAI, leads design on Codex) and Gui Seiz (Director of Product Design for AI at Figma) break down the new design workflow where code and canvas work together seamlessly. Includes a live demo of the Codex-to-Figma MCP integration, behind-the-scenes of how these teams actually ship, and a step-by-step roadmap to adopt this workflow at any company. Full Writeup: https://www.news.aakashg.com/p/ed-bayes-gui-seiz-podcast Transcript: https://www.aakashg.com/bayes-seiz-podcast/ --- Timestamps: 0:00 - Intro 1:33 - Code vs canvas debate 6:00 - When to use which 10:06 - Live demo begins 13:01 - Figma MCP deep dive 16:43 - Ads 18:10 - Lossiness and fidelity limits 23:59 - Behind the scenes 27:52 - Designers in staging 30:53 - Ads 33:13 - Roadmap for traditional teams 39:15 - AI as your tutor 43:29 - Roles blurring not disappearing 45:39 - Total football explained 52:30 - Outro --- 🏆 Thanks to our sponsors: 1. Bolt: Ship AI-powered products 10x faster - https://bolt.new/solutions/product-manager?utm_source=Promoted&utm_medium=email&utm_campaign=aakash-product-growth 2. Amplitude: The market-leader in product analytics - https://amplitude.com/session-replay?utm_campaign=session-replay-launch-2025&utm_source=linkedin&utm_medium=organic-social&utm_content=productgrowthpodcast 3. Pendo: The #1 software experience management platform - http://www.pendo.io/aakash 4. NayaOne: Airgapped cloud-agnostic sandbox - https://nayaone.com/aakash/ 5. Product Faculty: Get $550 off their #1 AI PM Certification with my link - https://maven.com/product-faculty/ai-product-management-certification?promoCode=AAKASH550C7 --- Key Takeaways: 1. Code vs canvas is a false dichotomy - The best designers use both fluidly. Canvas for exploration, collaboration, and pixel-perfect craftsmanship. Code for interactions, responsive testing, and the last mile of polish. The question is what you are trying to learn, not which tool to commit to. 2. High fidelity is no longer expensive - The entire linear design process existed because building something interactive required engineering resources. That constraint is gone. A functional wireframe takes the same time as a paper sketch. 3. The Codex-Figma MCP makes handoff lossless - Import screens from a running React app into Figma with exact pixel values. Border radius, padding, shadows, all one to one. It is not a screenshot. It is a responsive, editable design artifact. 4. The reverse direction works seamlessly - Make changes in Figma, paste a component link into Codex, and it updates your code automatically. No redline spec, no handoff document. 5. Ed spends 70-80% of his time coding and still calls himself a designer - The medium changed but the mandate did not. Designers are still the voice of the user, still upholding craft. The tools expanded, the role stayed. 6. Figma designers are shipping PRs to production - Teams that six months ago were AI curious are now banging down the door. Monetization designers who never wrote code are building technically complex prototypes. 7. "Prototypes, not PRDs" is the emerging norm - PMs at OpenAI bring working prototypes to design reviews. They ship PRs to stress-test ideas before handing off to engineering. 8. You do not need permission to start - Someone from OpenAI's GTM team built an iOS app with zero experience. Download Codex and build something for yourself tonight. 9. Curiosity is the defining skill for this era - Not code proficiency, not design talent. The AI is an infinitely patient tutor. Ask questions. Build understanding alongside output. 10. Total football is the mental model - Every player can play every position. Roles still have natural spikes. But the tool constraints that enforced rigid boundaries are dissolving. --- 👨‍💻 Where to find Ed Bayes: LinkedIn - https://www.linkedin.com/in/edbayes/ OpenAI - https://openai.com X - https://x.com/edbayes 👨‍💻 Where to find Gui Seiz: LinkedIn - https://www.linkedin.com/in/guiseiz/ Figma - https://figma.com X - https://x.com/guiseiz 👨‍💻 Where to find Aakash: Twitter: https://www.x.com/aakashg0 LinkedIn: https://www.linkedin.com/in/aakashgupta/ Newsletter: https://www.news.aakashg.com #codex #figma --- 🧠 About Product Growth: The world's largest podcast focused solely on product + growth, with over 200K+ listeners. 🔔 Subscribe and turn on notifications to get more videos like this.

AGAakash GuptahostGSGui SeizguestEBEd Bayesguest

Apr 10, 2026·53m·Watch on YouTube ↗

📖 CHAPTERS

1. 1

   Designing with AI is shifting fast: roles, speed, and new expectations

   Aakash frames the episode around the accelerating debate of “design in code vs design in canvas,” introducing Ed Bayes (OpenAI Codex) and Gui Seiz (Figma AI). The guests set the context: AI is pushing teams to move faster, changing what designers can ship and how orgs operate.

2. 2

   Code vs canvas: why it’s a false dichotomy

   Gui and Ed argue that “code vs canvas” is the wrong framing—both are tools for different stages of thinking. Canvas excels at rapid lateral exploration; code excels at making ideas real, interactive, and testable quickly.

3. 3

   When to start in code vs start in canvas (and how to weave between them)

   They outline practical decision criteria: the right starting point depends on the problem type, desired fidelity, and collaboration needs. The workflow becomes nonlinear—teams weave between Figma and code instead of a one-way handoff.

4. 4

   Live demo setup: Codex desktop app as a design tool

   Ed opens Codex (desktop app) and explains how it connects to a local project/repo, enabling fast experimentation. He uses an example UI component (“composer system”) already specced in Figma, then built in code to test real interactions.

5. 5

   Figma MCP deep dive: importing code/UI into Figma with high fidelity

   Ed demonstrates sending UI from the running code experience into Figma via Figma MCP integration. Gui adds that you can import entire screens or select specific nodes/components to avoid unnecessary background/layout elements.

6. 6

   Round-trip workflow: edit in Figma, push changes back into code

   After importing into Figma, Ed tweaks design details (e.g., labels/colors) and copies a link to the Figma selection. He pastes that link into Codex to update the code—illustrating a two-way, low-friction loop for designer–engineer collaboration.

7. 7

   Fidelity limits and “lossiness”: what still breaks and how it improves

   They discuss where translation still fails: advanced web effects, shaders, and some transitions don’t map cleanly onto a static canvas. They highlight workarounds (annotations) and the trajectory: models and tooling are steadily improving, especially when aligned to a design system.

8. 8

   Design systems as the bridge: tokens, libraries, and aligned sources of truth

   Gui explains how newer Figma tooling aims to reference your actual design library during import, not just create a visual facsimile. This enables shared truth across Storybook/GitHub/Figma and reduces component drift with AI-assisted diffing/loops.

9. 9

   Behind the scenes: how AI changed building at OpenAI and Figma

   Ed shares how Codex designers are developer-forward, with many spending most time coding, and how dogfooding hit a capability threshold that increased shipping velocity. Gui describes a similar internal shift at Figma: designers increasingly prototype, work in staging, and revisit previously deprioritized ideas because execution is cheaper.

10. 10

    Roadmap for traditional teams: how to adopt the new workflow safely

    Aakash asks for step-by-step guidance for regulated/traditional orgs without full tool access. The advice: start small, build comfort outside work if needed, and use AI as an on-ramp—without immediately jumping to shipping to main in high-compliance environments.

11. 11

    AI as your tutor: learning, curiosity, and engineering hygiene

    Gui and Ed emphasize AI as an always-available tutor that helps people learn by doing. Ed notes that while AI lowers the barrier, good software practices still matter—PR reviews, understanding the codebase, avoiding foot-guns, and respecting data models.

12. 12

    Roles are blurring, not disappearing: designers, PMs, engineers in 2026

    They describe how roles overlap more in practice (designers shipping code, PMs prototyping), yet remain distinct in purpose. Gui explains “spikes” rather than rigid territories; Ed argues the conceptual mandates (user, business, systems) still matter even if tool access converges.

13. 13

    Total football metaphor: cross-functional coverage as the new operating model

    Gui uses “Total football” to describe teams where members can fluidly cover adjacent responsibilities, reducing bottlenecks when someone is unavailable and increasing overall team threat/velocity. The emphasis is on adaptive collaboration enabled by AI, not on everyone becoming the same role.

14. 14

    Wrap-up and calls to action

    Aakash closes by summarizing the core takeaway—fluid movement between code and canvas—and encourages viewers to subscribe/follow and check out sponsor bundles. The episode ends with a final nudge to engage and share to grow the show.