Articles

“Names that hold up describe the decision a designer is making about the interface. Elements get renamed, colors get rebranded. The decision persists.” Murphy Trueman, Director of Design Systems at Baseline Design, calls Donnie’s piece above one of their favorite things written on the middle tier, then turns it into a working method. Walk a wireframe and ask what a designer is deciding at each element. A ​“card” is really ​“this is an elevated surface for grouped content”, so the token becomes ​‘Surface/​Elevated‘ and it survives the rename to ​“panel” next quarter.

“So a good rule of thumb is that semantic tokens do not include a scale.” Donnie D’Amato gives three tests for whether a token is truly semantic: it doesn’t suggest its value, it describes a generic family of components rather than a single one, and it doesn’t depend on its neighbors. That last test is the ​“smedium” problem, and it quietly disqualifies ​‘space-sm‘ and ​‘space-md‘, which is to say most of the space scales shipping today.

His recommended token construction: ‘[purpose]-[priority]-[property]‘. Priority is optional and capped at three levels, because ​“having more than 3 levels is useless for user interpretation within the experience.” The test underneath is the useful part. If you can’t point at the element in a low-fidelity wireframe, it isn’t semantic. That’s why ​‘surface-primary-shadow‘ earns its name and ​‘surface-highest-shadow‘ doesn’t.

Weave is now callable from ChatGPT, Claude, or Cursor. Ask the agent to run the brand mockup tool you built in Weave, and it finds it, runs it, and returns the result in chat.

“MCP gives your AI reach. Skills give it a recipe.” Murphy Trueman compresses two acronyms into one sentence you can actually hold onto. MCP is access: Claude reading your real Figma file, walking every fill on a button set and finding the fourteen layers still on raw hex, all of them on hover and disabled states. A skill is the playbook it follows once it’s in there. Their rule for writing one is the third time you catch yourself explaining the same preference, write it down.

Miggi rounds up ten community skills for the Figma agent, though the real news is in the first line: you can now author skills inside Figma. Ask the agent to draft one using a design frame as reference, preview it, then keep iterating in chat or open the markdown editor for manual changes. Emil Kowalski’s /find-animation-opportunities, which scans a file for places that don’t animate but should, and Jakub Krehel’s /better-interface which catches the details your interface is missing, are the ones I’d install first. 

“I worry a little bit about function following form.” That’s Katarina Batina, VP of Design at Shopify, in the middle of a piece about how completely her team reorganized around AI tooling. Roughly 60% of Shopify’s designers now push code directly to production, up 38% since last September, with over 5,500 live prototype sites built on Quick, the internal hosting platform. Her caveat is the part worth keeping: ​“There’s so much discourse around what tools are in fashion this week versus next week. The problem is we risk losing connection with the questions we’re trying to answer and the people we are building software for.”

Matt Perry, who built Framer Motion and now Motion, opens The Book of Motion with perception rather than code, on the argument that ​“motion is deeply human” and hardwired into how we register that something has changed. The book will have four parts: perception, mechanics, engineering, and practice. The intro chapter is free, the rest is paid early access, published a chapter at a time. And despite the domain, it’s deliberately not a book about the Motion library.

How Grok Bot was designed for agents that persist beyond a single session — from a chat history to a Bot roster, presence, a computer of the Bot’s own, and work that starts without a prompt.

“The more prominent we made the computer, the more the product encouraged users to supervise it.” The team tried four ways to show bot’s computer: floating window, side by side, modal, and full screen. Each one pulled the user into operating the machine. The shipped design has three levels instead – a purple title-bar icon while the computer is active, a pinned preview panel, and a full-screen takeover only when the Bot asks for help.

“Gotta be honest, the hardest part of this whole project was the symbol. (Let’s be real, when is it not?)” Mike Smith on why Calendly’s new mark ended up back at ​“a cool C”. The company doubled down on its name equity, and anything figurative sitting next to the word Calendly just makes you ask why it isn’t a calendar. Dozens of explorations to arrive at the clear answer, then one asymmetrical ripple to make it theirs.

Marek Minor, founder of Amsterdam studio Minor Adventures, spent about a year drawing Cursor’s 600+ icons in two sizes and two styles, every exploration by hand. The rule I keep thinking about: ​“Cursor’s pointer runs from bottom left to top right, and so does every icon that could go either way.” Slashes run the opposite way, because a slash cancels a direction and should cut against it.

Admins can now set a custom AI credit limit for an individual person, and when someone hits that limit they can send a request to their admin to raise it. Design tools now ship with an expense approval flow.

Kaelig Deloumeau-Prigent, co-chair of the W3C Design Tokens Community Group, audited 20 open-source design systems and 6 platforms, logging 187 AI affordances and 157 techniques. 17 ship an official MCP server, 17 ship official agent skills, 14 publish llms.txt. Two ship Figma Code Connect: Carbon and Primer. Design systems are being rebuilt as machine interfaces right now, and the design side of that bridge is the part almost nobody has wired up. Code Connect is still Organization and Enterprise only.

Figma Make now has a properties panel and annotations. Select an element and adjust padding, corner radius, line height, z‑index, or border style with actual controls, or mark a spot on the canvas and describe the change in words, like ​“fade this button in after a 300ms delay”. The quiet part is credits: edits stack up in the chat panel staged and free, and only bill once you apply them. Dragging a slider costs less than explaining the same change to an agent.

“A working demo in your actual codebase beats a Product Requirements Document (PRD) every time.” That’s Software Engineer Ethan Adams on why the nested folders team stopped arguing about permissions in Slack threads and started merging PRs that had to clear one bar: don’t break anything. Imperfect copy, missing functionality, and logical gaps all got fixed later. The making-of companion to the release note above.

Projects are now Folders, and folders finally nest, up to 10 levels deep, each with its own color. Access is inherited from the parent folder unless you explicitly limit it. The catch is in the fine print: Starter gets a single folder and no nesting, and on Professional you can only restrict access on top-level folders, while Organization and Enterprise can lock down any folder at any depth.

(This reminds me how we originally went with ​“servers” instead of ​“folders” in Postmark, and years later had to get creative with UI copy. Still one of my favorite onboarding blocks to this day.)

“Q2 was a record quarter and our first full quarter of AI credit monetization.” CFO Praveer Melwani on $370.1M in revenue, up 48% year-over-year, with Net Dollar Retention at 136% as customers expanded both seats and credit add-ons. Dylan’s line is the same thesis he took to TBPN below: ​“as code gets commoditized and value moves up the stack, the opportunity ahead of us has only grown.”

“Instead of individual assets, you design systems.” Justin Jay Wang, designer at Cursor and before that the person who grew design at OpenAI from 0 to 1, on code as a creative medium for brand work: graphics, charts, posters, logos, animations. Define an idea as a set of rules and you can generate endless variations, dial in parameters, and converge on the strongest one.

“The failure is not in the components; it is in the composition.” Matt Rothenberg, Principal Engineer at Cloudflare, handed three isolated agents the same shadcn/​ui library, the same tokens, the same app shell, and three ordinary settings tickets. Back came tabs, cards, and a long form, all three of which a token linter would happily pass. He then gave the next three runs a named vocabulary and a short page of rules, and they finally read as one product. The agents didn’t cause the drift, they just made it impossible to keep pretending it wasn’t there.

Two criteria do most of the work: cap-centered vertical metrics, and an x‑height at 70–75% of cap height. Hit both and labels optically center in buttons on their own, so a single padding token covers the whole system. Two alternatives are made by this foundry — Unifora and Innovator Grotesk, which I use on my personal website. The other eight are Universal Sans, Plain, SwissNow, Muoto, Aktiv Grotesk, Akkurat, Basier, and CoFo Sans.

Figma reworked auto layout so it behaves like CSS Flexbox at handoff, closing the small gaps that used to force developers into workarounds to match the canvas. The border-box model is now the default: inside strokes count toward layout like a CSS border, outside and center strokes are excluded like an outline, padding is never squeezed below its set value, and auto gap collapses instead of going negative like space-between. New frames get it automatically; existing frames stay on the legacy version until you upgrade, with a revert option through January 2027.