Will it be possible to import a CSV to set variables? I've been doing a lot of data entry since the launch and it would be neat if I could flow content in eventually. :)
SO true! Managing variables in the current UI is very manual and slow. Esp when I realize I should move a set of variables from one collection to another.
Thanks for the video! All the information is clear and well explained! I have a doubt about this: If I use variables instead of variants, how a developer would know that the component have several versions? Example, like Figma did at config, 9 buttons became 3 because of variables and changes were applied on padding basically
It really advances prototyping, though - when text inputs are implemented, it's going to be a lot easier to create realistic prototypes with actual interactivity rather than faking static states.
Hey Roman, my understanding is that Figma is actively working on making variables compatible with the types of inputs you listed! Hopefully we'll see them by the end of 2023. I don't work for Figma so I can't say why they chose to release what they did, but my best guess as an outsider is they wanted to ease customers into this new feature with a limited set of options: color vars on just fills and strokes, but not yet shadow colors or gradient stops... numbers for dimension values and auto layout, but not yet typographic attributes like font size... and booleans and strings for prototyping and mode switching, but not yet direct binding to variants (there's a workaround with strings but i don't fully trust it's stability). This probably also allowed them to ship an open beta in time for Config, so there's no doubt a "hype" aspect too.
See the config 23 of figma, the ceo Dylan Field literally said they are working on the typography and much more will be coming at the end of this year. One day, Styles might become obsolete, thats my two cents.
Thank you for clear and concise lesson 👍
I spent an entire day trying to figure this out, thank you for the amazing demo.
Omg, thank you! I was really confused until now.
So helpful! Thanks so much!
I've been struggling for days i don't know how to reach the Variants
I don't have the tool bar up there and with these options
@Figma i hope we can set variable also for stroke and effects.
Will it be possible to import a CSV to set variables? I've been doing a lot of data entry since the launch and it would be neat if I could flow content in eventually. :)
Great question to post on the Figma Community Forum, I guess. 🙃
SO true! Managing variables in the current UI is very manual and slow. Esp when I realize I should move a set of variables from one collection to another.
really really helpful thanks for making this amazing video
Please share the file ! that would even more helpful
added a community file! www.figma.com/community/file/1284206072590997466/Variants-vs-variables
Thank you! And thanks for the snack :D
Thanks for the video! All the information is clear and well explained! I have a doubt about this: If I use variables instead of variants, how a developer would know that the component have several versions? Example, like Figma did at config, 9 buttons became 3 because of variables and changes were applied on padding basically
"There's and easy-ish answer, sometimes". LMAO. Great video and explanation!
how you even have the tool bar up there and with these options
I've been struggling for days i don't know how to reach the Variants
Really helpful! Do you mind sharing the file?
added a community file! www.figma.com/community/file/1284206072590997466/Variants-vs-variables
Unless the endgame is turning Figma into a no-code tool, it's adding unnecessary levels of complexity for a tool that still requires manual coding.
It really advances prototyping, though - when text inputs are implemented, it's going to be a lot easier to create realistic prototypes with actual interactivity rather than faking static states.
Why don't you combine them together?
thank you!
Thank you!!🎉 ❤🔥
love you Figma
Totally unrelated question… how do you achieve the custom mask shape for your headshot in the video? OBS?
1:50 Is Variants the same as Instances of Components?
Variants are properties in components. (different versions of the component)
Variables are global properties.
My understanding is that Variants can be used used on Instances of Components
Can you please explain for mortal ones why I can’t use variables for 80% of properties like font name, font size, stroke width, shadow attrs etc?
Hey Roman, my understanding is that Figma is actively working on making variables compatible with the types of inputs you listed! Hopefully we'll see them by the end of 2023. I don't work for Figma so I can't say why they chose to release what they did, but my best guess as an outsider is they wanted to ease customers into this new feature with a limited set of options: color vars on just fills and strokes, but not yet shadow colors or gradient stops... numbers for dimension values and auto layout, but not yet typographic attributes like font size... and booleans and strings for prototyping and mode switching, but not yet direct binding to variants (there's a workaround with strings but i don't fully trust it's stability). This probably also allowed them to ship an open beta in time for Config, so there's no doubt a "hype" aspect too.
@@AlicePackard Yes, makes sense.
See the config 23 of figma, the ceo Dylan Field literally said they are working on the typography and much more will be coming at the end of this year. One day, Styles might become obsolete, thats my two cents.
Why didn’t they just call “variables” “values” instead?
Only 4 modes are allowed, unless you pay for enterprise, which is ridiculous. Shame on you Figma.