Brian Feeney
1

Breaking Figma Updates

I've been getting a lot of Figma library updates in my files which weren't triggered by human action. Neither I nor anyone on my team made updates to the libraries, but yet components show 'Updates' which must be accepted — or ignored forever until the end of time. What's causing this? Ghosts in the machine?

I have a guess. It has to do with failing to perfectly use Figma's every feature exactly as intended. Figma is far more technical a tool than they'd like to admit. If you want to use any of their smarter features, you're stepping outside of Design work and entering Engineering Land. The smallest error means your rocket might explode on its way to space.

Figma has a ton of great auto-layout and library features. They're great and they save time and reduce inconsistencies. The catch is that you have to use those features exactly how Figma wants you to. Figma expects you to have read and memorized every line of their documentation and watched every instructional video before you've added a single object to a file. If you start working without fully understanding what a Variant State or Mode is, or how a Hugged Content group with 8px of horizontal padding will behave when stretched, well, you're likely to have broken comps in the near future.

What breaks the comps? Figma updates.

One of my design system components which keeps getting these required ghost updates is my Tab Group. It's a component with an auto-layout group inside an auto-layout group inside an auto-layout group inside an auto-layout group inside an auto-layout group ... with a few variants. And this is a basic UI module. It's just a row of tabs. But multiple times now, this component has for unknown reasons been triggered to update, and after updating, options for it in my comps turn on and margins are broken, etc.

Here's what happened. Figma released an update which subtly changed the rules for which a 'hugged' group behaves when grouped with sibling auto-layout objects that's also inside an auto-layout group which has a variant. Or whatever. Something to that effect, something extremely specific. And it broke my component. The point is that their very explicit rules (likely not clearly written or documented) are so fine-tuned that there is zero curtesy afforded to the user. A component might accidentally be working how the user intended, yet when Figma updates their rules, the component which had been looking great is suddenly upside-down and backwards.

Engineers are used to this. It's a standard part of writing code. Code merges can sometimes have unintended consequences. This kind of thing now comes for designers. The smarter our design tools get, and the more they allow us to do with clever features, the more they're going to break in frustrating, time-consuming, comp-breaking ways.

Figma is great. Sketch is great. I'm really appreciative of both of these tools and how they help me do my job. My takeaway is that I need to focus on the comps I'm currently working on and care less about keeping old comps at 100% fidelity. Design for the current sprint. Design for the current quarter of backlog work. But once those designs are in production, accept that those old comps will slowly rot. Figma will break them as their app changes. Which is fine! Design work for software and the web is ephemeral. It's made easier with great tools, but those tools have no loyalty to you or to the integrity of your designs. They have an app to maintain, and if their updates break your old designs, that's not their concern.

So go ahead and accept those updates, comp-breaks and all. You're already onto the next thing anyway.

December 01, 2022

articles


539