Videos

Carol, a designer at Mercury, walks through how she designed Mercury Command, the AI-powered interface being built into Mercury’s banking dashboard. The interesting part is her argument that agentic design fundamentally breaks the Figma-first workflow. Because the output is non-deterministic, she had to prototype in Cursor with a live system prompt to understand what the experience would actually feel like. ​“The system prompt in a way is the product,” she says.

Ryo Lu, Head of Design at Cursor, gave the standout talk at Cursor’s first conference, Compile. The title is ​“Closer to the Material,” and the core argument lands hard: as AI makes execution cheaper, the real risk is that humans become approvers rather than authors — people who accept or reject outputs without ever being inside the decision. He distinguishes between output (which ends the loop) and material (which invites you back in), and argues that the future he wants is tools that keep people close enough to the work to still have judgment. A sharp and honest take on the AI-design moment, and easy to connect to what Figma is navigating with its own agent features right now.

Figma’s official getting-started tutorial for Motion. The three-part structure covers agent-assisted animation (prompt it, then refine in the timeline), preset animation styles, and manual keyframing. One thing that stands out: animation built on a component automatically propagates to every instance, so you animate the play button once and every media player in the file picks it up. Motion tokens are new variable types for timing and easing, and Dev Mode now shows a Motion panel with ready-to-ship code (JSON, React, CSS) alongside the design.

Ridd digs into everything that launched at Config 2026 with Loredana Crisan, Figma’s Chief Design Officer. The key product philosophy she outlines: AI gets you to 70% — on shader effects, on motion — then you mold the rest. Weave, the node-based tool Figma acquired last year, is the clearest expression of this systems-over-screens direction: you build a workflow that produces a visual system, and the workflow is ​“the special sauce.” The big bet isn’t AI replacing the designer’s hand; it’s making AI a precision tool, which Loredana argues is still ahead of where the technology actually is.

Dylan Field opens Config 2026 by settling the design-vs-code debate once and for all: ​“Code is not the opposite of design. Code is material for design.” The keynote’s headline feature, Code Layers, puts live interactive code directly on the canvas alongside design layers, with a shared agent chat so teams can explore and riff together rather than each going a hundred prompts deep alone. From the same team: Figma Motion in beta, a full timeline-based motion tool with shader effects, 3D transforms, and export to MP4, GIF, and animated SVG. Worth watching in full: the Weave AI tools and custom shader section is genuinely impressive, and the generative plugin demos near the end show where the platform is heading.

Jake Albaugh, Developer Advocate at Figma, walks through setting up Code Connect from scratch — the NPM package, the config file, and mapping design properties to production code properties. The real payoff comes when he shows the before/​after through the MCP server: without Code Connect, an agent sees a flood of raw style data; with it, it sees clean, minimal component code it can actually act on. Unfortunately, Code Connect is still not available on the Pro plan.

Rachel from Figma’s Show Your Work series walks through her file and breaks down three categories where slots reshaped her system: repeating elements like menus and tabs (where she keeps nested subcomponents as default content so system-level edits still propagate), free-form areas like sheets and modals (where she often ships zero default content because designers just delete it anyway), and experimental page-level templates that ​“start to feel a lot more like code.”

Christine Vallaure walks through what ​“agentic design” actually means once an agent is reading your Figma file instead of a developer. The key shift: all the design-system hygiene we used to wave off as optional — primitives, semantic naming, modes, slots, props, and especially the long-neglected component Description field — now becomes load-bearing, because agents read literally and never ask you over coffee what you meant. A solid 10-minute orientation before diving into the more hands-on MCP pieces.

Meaghan Choi, lead designer on Claude Code, walks through her actual daily setup at a Dive Club talk in NYC: always in a worktree so parallel Claudes don’t overwrite each other, always in auto mode so the classifier handles permission prompts, and a custom /prototype skill that spins up five HTML variants of any feature and picks one with reasoning before she even looks. She demos it by asking Claude to add autocomplete to Excalidraw with no design spec, then has it open a PR with a screenshot recorded via Claude in Chrome. Her line that lands: she doesn’t review Claude’s terminal output anymore, she reviews the PR.

A skill is just a markdown file with strict instructions, optionally pointing to scripts the agent can run. Amy Lima and TJ Pitre build one live that round-trips a localhost prototype back into Figma via the use_figma tool, with per-state annotations for engineers and PMs who can’t comfortably leave feedback on a running prototype. They also cover the contribution flow to Figma’s community skills page. A good entry point if you’ve been wondering what the ​“skills ecosystem” around Figma’s MCP actually means in practice.

Linda Dong and Doug Williams, design evangelists at Apple, walk through the eight principles Apple now uses as its design foundation. The framing that stood out is their definition of design as ​“making something with intention” and the reminder that every feature asks for someone’s time, attention, and trust. This is the video companion to the refreshed HIG Design Principles page, and the first time in a while Apple has put this much weight behind articulating its design philosophy publicly.

An official Figma walkthrough of the agent (currently in beta, rolling out since May 20) through three phases of a real design project: exploring directions, processing feedback, and automating repetitive updates. The most practical detail: the agent works with your connected design system from the first prompt, so generated screens use your actual components, variables, and styles rather than placeholders. Also worth trying a prompt like ​“what would a growth-focused PM say about these designs?” to simulate stakeholder pushback before the actual review.

Matt Colyer, Figma’s director of product management for developers, makes the case on Dan Shipper’s AI & I podcast that the SaaS apocalypse narrative has it exactly backwards. He’s been running his own agents for two years and is buying more software subscriptions than ever, because shipping and maintaining a personal agent teaches you fast why people pay for someone else to run it. The more interesting half is about design specifically: chat is linear, which makes it good at converging on a single direction but terrible at generating lots of options. Figma’s on-canvas agent is a first attempt at the divergent side — letting you branch frames in different directions, then bring in a convergent agent to cluster them. He also walks through how the MCP server closes the code-to-design loop, and why ​“review” has quietly become the biggest bottleneck in AI-assisted product work.

Soleio’s guest is Rasmus Andersson: founding designer of Spotify, one of Figma’s first designers, co-creator of GraphQL, and creator of Inter. The part that stayed with me is his description of how Figma operated: one person on one problem for a year, sometimes binned at the end, while shipping something visible every month. He also makes a case that the production side of design — the part AI is eating fastest — was never actually the hard part. What’s left is the intention. The other link in this section is Soleio’s talk on the geometry of luck, making this pair worth watching together.

Leandro Casteel, design manager on Figma’s brand studio, sits with lettering artist Erik Marinovich (Nuform Type) to unpack the Q1 26 earnings posters they made together. Erik traces his approach to type back to apprenticing as a bricklayer under his dad, picking stones from a two-ton pallet to build pathways like a jigsaw puzzle. The same instinct shows up in his letterforms: graphic compositions you’d want to stare at even if you never bothered to read the word.

The on-camera companion to the Make-on-Local-Code launch. The most interesting bits beyond the blog: a Figma editing panel inside Make for direct style changes, multi-element annotations pinned to the rendered screen (including voice mode), and MCP server support for resolving merge conflicts and CI failures. The pitch is that designers get agency to ship the change themselves while the engineer’s review workflow stays untouched – apple for early access.

Lauren Budorick, a software engineer at Figma, walks through six optimizations behind a recent ​“10x faster vector editing” announcement.

A short onboarding walkthrough for the agent beta. Worth watching for the suggested starter prompts: generating alternative layouts, starting from scratch using your design system, working together on canvas, and getting feedback.

“We don’t think designers should generate a one-shot screen and call it a day.” That sentence from the announcement is Figma’s vision for the design agent in a nutshell. The framing is explicitly co-pilot, not auto-pilot: the agent runs in front of you on the canvas, riffs to spark an idea, and then hands it back to your mouse and direct manipulation. Pair that with native access to your libraries, components, and tokens, and the bet is clear – the winning AI design tool is the one that already knows your design system, not the one that generates the prettiest screenshot.

Rolling out gradually in beta over the coming weeks. During beta, the agent won’t consume credits. See also the official announcement at The Figma design agent is here.

“AI designs with you, not instead of you.” Figma’s positioning for useFigma, the new write-capable MCP tool that creates real components, variables, and auto layout on the canvas, not flat images or wireframes. The demo runs the full loop: terminal prompt to first draft, manual polish in Figma, annotations the agent later reads as design context, then back to the terminal to update the codebase. The annotations detail is the most interesting part — they double as machine-readable spec.