Vercel's Pranati Perry explains that tools like V0 occupy a new space between static design (Figma) and development. They enable designers and PMs to create interactive prototypes that better communicate intent, supplement PRDs, and explore dynamic states without requiring full engineering resources.

AI-powered "vibe coding" is reversing the design workflow. Instead of starting in Figma, designers now build functional prototypes directly with code-generating tools. Figma has shifted from being the first step (exploration) to the last step (fine-tuning the final 20% of pixel-perfect details).

Production code often evolves past design files, creating workflow friction. Figma's MCP tool uses AI to pull live application states directly into design files and push updates back to code, creating a synchronized source of truth.

AI coding agents enable "vibe coding," where non-engineers like designers can build functional prototypes without deep technical expertise. This accelerates iteration by allowing designers to translate ideas directly into interactive surfaces for testing.

To avoid inconsistent or 'vibe coded' documentation, Atlassian's design system team built scripts that crawl their front-end monorepo. These scripts automatically generate structured guideline files for AI consumption by extracting component definitions, types, and usage examples directly from the production source code.

Move beyond basic AI prototyping by exporting your design system into a machine-readable format like JSON. By feeding this into an AI agent, you can generate high-fidelity, on-brand components and code that engineers can use directly, dramatically accelerating the path from idea to implementation.

You can instruct an AI browser to navigate through your product's user flows page-by-page. The agent will document each step and can even include screenshots, automating what is typically a very manual and time-consuming process for product teams.

Leverage Figma's AI not for building entire prototypes, but to accelerate the design process. A PM can take an existing design, use Figma Make to generate variations for edge cases or error states, and then share those layered assets back with the designer, saving significant time.

A practical AI workflow for product teams is to screenshot their current application and prompt an AI to clone it with modifications. This allows for rapid visualization of new features and UI changes, creating an efficient feedback loop for product development.