Videos

Four Figma Motion files from Figma’s own motion designers, each with one technique worth reusing: Fabien Rousseau’s tarot cards built from nested components (with a trim-path waterfall), Brett McMillin’s rotating rings under a pile of shaders, Gilles Desmadrille’s brand animation pulling colors from library styles, and an agent-built menu.

“Weave tools turn creative workflows into simple tools anyone can run from the Figma canvas. In this video, you’ll learn how to create a Weave tool from a workflow and publish it to the Figma community.”

Shaders apply either as fills that generate patterns, gradients, and textures, or as effects that modify how a layer looks, and both animate on keyframes. The last 10 seconds are the interesting part: you can describe the motion to the Figma agent and have it apply the shader with a first set of keyframes for you to adjust.

Soleio interviews Joel Lewenstein, Head of Design at Anthropic. Their roadmap comes from internal traction on half-baked vibe-coded prototypes rather than top-down planning, and new designers figure that out by pattern matching on who gets respect. Claude Design is a wrapper over Claude Code with a friendlier front end, and his own designers keep going back to the terminal, because the production codebase is the source of truth for the design system and the rules of how things work while Claude Design has to rummage through Google docs that aren’t.

Ridd and Tommy spend two and a half hours on what Dive’s own talent network data actually shows: designers with 10+ years of experience account for about 45% of hires while 0 to 2 years accounts for about 7%, expected salaries at signup run around $200,000 against a bit over $215,000 actually paid, and the median from first meeting to hire is 38.4 days. The most uncomfortable stretch is the case that a FAANG résumé is no longer a positive signal on its own, with Decimals founder Danny confirming that people are ​“almost allergic to the big company logos.”

Anthony DiSpezio, Designer Advocate at Figma, builds a Make kit from an npm package. Make auto-generates a starting version of the guidelines, and Anthony offers a few rules for making them more effective – assume the agent knows nothing, split guidelines into categories so it doesn’t drown in context, include real usage examples, and spell out the gotchas. Before publishing your kit, calibrate against the model’s pre-training biases and test how it actually reads your UI.

Piers Cowburn opens his shaders file for Show Your Work series. The interesting trick: regular Figma effects apply after shaders, so to blur something before the shader reads it, you have to wrap it in a frame. Those soft gray fringes are exactly what his mosaic shader converts into color and shape.

The detail I keep thinking about: ​“We found buttons are tough to tap when they land right in the fold.” So Apple built fold avoidance into sheets, alerts, menus, and toolbar buttons, all of which nudge themselves aside whenever iPhone Duo is partially folded, while scrollable content stays where it is. Adopt the system components and you get the behavior for free.

Jamie Haberman, Education Designer at Figma, builds a kinetic type plugin with the Figma agent.

Comments attach to a moment on the timeline, and a single comment can carry several timestamps, so one note can flag three separate problems in one pass.

“Path trim lets you create animated lines by controlling how much of a path is visible at specific points in time. You can use path trim to create draw-on or erase effects, handwriting animations, and looping spinners.”

Two tiers of preset – basic animations move a single property, composite ones bundle several plus custom easing out of the box. Once applied, an animation shows up as a blue track on the timeline, where you drag the track itself to set delay and drag its handles to set duration.

The first of four new short official tutorials on Figma Motion explains easing. The detail worth taking away is that custom easing curves can be saved as variables, reusable across your entire design system.

Jake Albaugh, Developer Advocate at Figma, points a fleet of agents at an entire component library, then reuses the same agents as validators: each file re-fetches from Figma and surfaces what drifted after a property rename. His real argument for Code Connect is context economy – without it the MCP server hands the agent every style value it might need, and compaction is lossy.

The post above shows the skills, this one shows the plumbing. Miggi builds 3 skills: a type scale generator that also writes the variables, an image audit that drops a DPI card beside every image, and Shader Starter, which pairs neatly with the shaders update below.

The skills demo is the one to watch. Rodrigo calls a slash command for a skill his teammate Tammy wrote in plain English, carrying her own design-review conventions, and the agent returns the critique as annotations right on the canvas. Team practice becomes a callable command.

An hour with Miggi covering the full surface of Figma Motion: keyframes and eases, anchor points, easing and timing variables, loop tracks, motion paths, trim path on strokes, shader effects and fills, and a first look at 3D transforms. If the playlist above is the primer, this is the deep end, and there’s a community file to follow along in. One EDU caveat worth knowing: the Figma agent isn’t available on Education, so students work with the prebuilt shader presets instead of prompting their own.

Figma’s official intro series for Figma Motion, three short videos covering the timeline, keyframes, and motion paths. Start with the keyframes one, which quietly makes the biggest point: any layer property with a diamond icon can be animated, and that includes fills, effects, and shaders.

Diane Hu, a performance engineer at Figma, breaks down three fixes to the copy-paste path. The big one is state group rehydration: copying a single variant used to copy every variant in the component along with it. Now copy writes only the variants you actually use, and paste refills the rest in the background from the file’s published copy in S3. On a component with over a thousand states, copy went from 700+ ms to about 50, and paste from 2 seconds to 400 ms.

Laura Fehre, Designer Advocate at Figma, demos three plugins she generated for herself: one that updates a component description and drops a changelog onto the canvas after a variant change, a print preflight that checks for 300 DPI and maps RGB to CMYK with die and safety lines, and a translation pass that duplicates screens into German, Dutch, and Japanese to catch overflow before shipping. The print one is the standout, since Figma has never handled prepress natively.