Turn requirements and user stories into professional Figma screens, without design skills or prior Figma experience. Learn how Product, Project, BA and UX teams can transform specifications into polished, developer-ready interfaces using an advanced AI workflow.

What used to take weeks of back-and-forth ping-pong between product, design, and engineering now happens in a single, focused day. This hands-on workshop provides a direct pipeline from specification to production-ready design.

You will learn to take user stories and specification documents and convert them into Design System files in Figma, ready for development, with no prior Figma knowledge and no design background. We will work end-to-end on a real-world scenario: starting from the spec document, moving through a live interactive prototype, defining a design-token-based styling system, and finishing with a complete screen in Figma alongside a structured developer handoff.

At the core of the workshop is a technological breakthrough: the live integration between Claude and Figma, a capability that simply didn’t exist until recently, allowing the entire workflow to happen in one place, directly in your hands.

At the core of the workshop is the technological breakthrough of live integration between Claude and Figma via MCP (Model Context Protocol), an innovative capability that allows the entire workflow to happen in one place, directly in your hands.

Objectives

• Practical Hands-On Execution: Work on a real project and return to your organization with an immediate toolkit and execution capabilities.
• AI-Driven Pipeline Mastery: Lead the full process yourself, from spec document to developer-ready design files.
• Shared Language: Know exactly what to hand off to designers and developers, and when.

Target Audience

• Product Managers: Writers of specs and user stories who want to independently convert them into designed, production-ready screens.
• Project Managers: Leaders of development processes interfacing with design and engineering teams, looking to shorten the path from spec to screen.
• Business Analysts & Specification Writers: Writers of requirements who want to see them translated into live Figma screens.
• UI/UX Designers: Professionals looking to embed advanced AI capabilities into their daily workflows and move from designing screens to leading the entire process.

Prerequisites & Experience

• Laptop with Claude Desktop installed (free; a short setup guide will be sent in advance).
• Claude account: free tier allows participation; Pro recommended for uninterrupted work throughout the day.
• Figma account on a paid plan with a Full Seat: required for the hands-on Figma conversion. Coordinate with your organization’s Figma admin.
• Active use of AI tools at work, and the ability to read a specification document.

Not required: Figma knowledge, development experience, or design background. No paid Figma seat? Let us know in advance, we’ll pair you up for the conversion exercise.

Agenda

From Spec to Design – Without Prior Design Knowledge

• How Claude analyzes a specification document to extract screen architecture and UI components.
• Rapid transition from spec to a live, interactive prototype using prompts and custom skills.

Automated Design Language – Design Systems

• Translating design concepts into a structured Design System without repetitive manual labor in Figma.

Direct Build in Figma via MCP Integration

• Live Claude – Figma integration: the AI constructs the screen in your workspace in real time, right before your eyes.
• Rapid AI-driven Design System generation, saving weeks of tedious work.
• Working with Skills: building a consistent, repeatable, reusable workflow.
• Troubleshooting: handling blockers, correcting deviations, and refining deliverables in real time.

Structured Developer Handoff

• What developers actually need, and which misunderstandings to prevent up front.
• Writing a short, sharp handoff note for the screen you built.

Key Takeaways

At the end of the workshop, you will leave with a real, high-quality Figma screen based on a professional, production-ready Design System, alongside the full pipeline for reuse in your organization: a ready-to-use prompt kit, a customized skill, and a step-by-step guide for setting up the Claude–Figma connection.