Hi!
I just read this post about conditional variant properties, which is a related issue but not quite the same thing, so I decided to create a new thread.
To clarify what I’m sharing as an idea and the differences between this post and the above linked one, let me give some context. I came to the above linked post because I’m in the following specific situation :
I need to display elements of the periodic table in a design. I want to have a property that indicates the type of the element represented (gaz, metal, …), and use this property to display the element in a certain style corresponding to its type, like in a normal representation of a periodic table.
The components look like the following:
The thing is, I also need to override this sometimes, and override the default display style of a particular instance, regardless of its type value, to give it the display style of another type.
For example, if an instance, by its type, should be displayed in green, I can tell it to display in blue like another type while keeping the semantic property of type intact (I do not want to assign the wrong type just because of colors).
Hoped solution
Here is what I wish I could do.
Have two variables with following values:
- Type
- Alkali Metal
- Alkaline Earth
- …
- Theme
- Default
- Green
- Blue
- …
If the theme is set to default, then the instance is displayed according to its type’s display style. But if the theme is set to either green, blue or any other value I implemented, the display would follow this scheme and not the default type’s one.
I know it is technically doable by creating every possible instance and setting the right colors, but I think there could be some simplification here.
In fact, I’ll have to create a gigantic matrix of variants. For each value of the property Theme I would have to create a variant for each value of Type, which would result in an 66 variants matrix in my case, that could get bigger overtime if I add new themes.
But there would be massive redundancy, for example the following variants would be the same:
- Element/Alkali Metal/Green
- Element/Alkaline Earth/Green
- … (for all remaining types, 11 in total)
There comes the idea
Rather than creating these variants individually, it would be really useful to have a way of creating all of them at once, by specifying a special value in the property editor, such as “All values”. This would tell Figma that no matter what this property’s value is, if the other property is a given value we use this variant.
This would also allow grouping multiple useless variants in one that really represents what I meant by creating it.
Conclusion
Thank you for reading to this point, it was a real book that I wrote here. Thanks for your time!