I’m tasked with learning about variables and seeing how it applies to our company’s design system (e-commerce). Our style guide is pretty extensive and already has all the variants designed and defined. How would you guys go about implementing variables?
This is a very good question! What do you do when the design tool changes and/or introduces new ways of maintaining components?
Assuming you’re committed to having a set of components in Figma which mirror those in the codebase, then it would be possible right now to keep things as they are, but who knows what the future holds? Will you be storing up “Figma debt” by “updating” in the way they recommend?
Personally though, I think trying to maintain a pixel-perfect representation of the production code in Figma isn’t really sustainable, nor does it have much real advantage. Most stakeholders would not notice a bit of variation from production, and (obvious point!) you don’t serve your sites out of Figma, so you cannot get 100% accurate prediction on things like break points and devices in any case. So why bother? In a non-pixel perfect world, just keep Figma reasonably representative, maintainable and simple. So no need to chase the dragon on every change Figma makes.
Pros and cons though, obviously!
Not updating (is what I meant). Can’t edit posts here 