“I haven’t written a single line of front-end code in 3 months”: How Notion’s design team uses Claude Code to prototype

02/23/26
Source: Lenny’s Newsletter by Claire Vo. Read the original article

TL;DR Summary of How Brian Lovin Revolutionized Notion AI’s Design Prototyping with Claude Code

Brian Lovin transformed Notion AI’s design workflow by creating a shared, code-based prototyping environment that enables collaborative and functional prototype development. Leveraging Claude Code’s AI-assisted tools, the team accelerates iteration and moves beyond static designs like Figma. This approach highlights the importance of early reality testing and automation to build more effective AI-powered products.

Optimixed’s Overview: Enhancing Collaborative AI-Driven Prototyping at Notion AI

Introduction to the Prototype Playground Innovation

Brian Lovin, a designer at Notion AI, developed a unique Next.js-based shared application known as the “prototype playground.” This environment allows the entire design team to collaboratively create, share, and iterate on functional prototypes in real-time rather than relying on isolated or static design tools.

Key Benefits of Code-Based Prototyping

  • Early Encounter with Reality: Testing realistic prototypes early in the design cycle leads to better product outcomes.
  • AI-Powered Automation: Claude Code’s “plan mode” and custom slash commands automate repetitive tasks and streamline workflows.
  • Seamless Integration: Designers can convert Figma designs directly into production-ready code with simple AI prompts, bridging design and development gaps.
  • Collaborative Efficiency: The shared environment enhances transparency and team collaboration, accelerating iteration speed.

Practical Demonstrations and Tools

Brian’s demonstrations included building a podcast player prototype and creating custom AI skills such as “find icon” and deploy commands to simplify GitHub workflows. His approach emphasizes teaching AI to self-improve by automating tasks it requests, ensuring continuous workflow enhancement.

Conclusion: The Future of AI-Driven Design at Notion

This code-based prototyping approach challenges traditional static tools like Figma by providing a dynamic and interactive platform tailored for AI-powered product design. Brian’s pioneering work at Notion AI exemplifies how integrating AI-assisted coding into design teams can dramatically accelerate innovation and product quality.