Before I talk to Figma, I just wanted to see if anyone else is willing to +1 this annoying UI problem I have with Variants.
When I am selecting variants in a group (inside my Design System), I often hit the “+” symbol (Create new variant quick link) and it creates another variant.
The problem is that a lot of the time I don’t realize that I have selected the “+” button and wonder why I have more variants than I wanted. Then I realize that I must have created a new one and it is now not obvious which one was new and redundant? It’s a real problem if you are working fast and wastes a ton of time if you don’t realize for a while that you accidentally selected it.
Here is the “+” symbol I am talking about. It’s relatively new as a feature and I get what they were intending but it is right in the way of my mouse and worse if you are zoomed out.
If you are trying to select that next 'Label" variant, you’ll most probably hit the “+” symbol instead. Does anyone else see this as a problem that slows down their workflow?
Hello @James_Stables
I’m not sure if there is a way to disable it.
But what I do is make all of my Variant components in auto layout an give it. enough space not to make this mistake
Thanks for the reply. I also make my variant groups Auto Layouts too and give 32px around everything, however, it seems like the Plus button seems to then take advantage of that space (if I am zoomed in - which I am most of the time):
Zoomed in (normal working zoom level):
Zoomed Out (when navigating around the design system screen):
As you can see, the Plus button is in the way when I am zoomed in and working, and the Plus button is not in the way when I am not working and just zooming out to navigate around.
My solution is to just get the Plus button out of the way of the surrounding variants when zoomed in.
There is a simple hack, You can set auto layout horizontally in that order Plus button will only send duplicates horizontally and you can manage to select it easily.
Of course, It’s not ideal but its the closet to it
Thank you for the solution. That would work well if there were a small amount of variants, but if you have a lot of them (such as buttons or badges) then it would not be ideal to arrange them all in one horizontal line:
