Тёмный

Variants 

Figma
Подписаться 560 тыс.
Просмотров 94 тыс.
50% 1

In this tip, we talk about what variants are and how to create them, including how to easily update variant naming.
To understand variants, you'll first need to understand components, and we've broken that down in this video: • Creating components
Once you understand variants, check our our video on component properties to learn how you can elevate your components even more! • Component properties
Figma is free to use. Sign up here: bit.ly/3msp0OV
____________________________________________________
Find us on ⬇️
Twitter: / figma
Instagram: / figma
LinkedIn: / figma
Figma forum: forum.figma.com/
____________________________________________________
#Figma #Config #FigJam #Tutorial #NothingGreatIsMadeAlone #design #tips #DesignSystems

Наука

Опубликовано:

 

1 июл 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 49   
@praveenpsg77
@praveenpsg77 4 месяца назад
Somebody give this lady every award there is for teaching.
@loveworksinc.5025
@loveworksinc.5025 Год назад
I believe tutorial videos should be this simple and coincise. Thanks
@lavanyavasisht9408
@lavanyavasisht9408 3 месяца назад
I really love how well this lady explains everything so easily. I had watched a lot of videos regarding variants and had a hard time using it but this video helped me a lot to understand the variant tool.
@remy9240
@remy9240 10 месяцев назад
Thanks for this! Really well explained. Didn't over complicate everything and so concise. I hate when it feels like a teacher is trying to sound smarter by making things more complicated than they are. THANKYOU!
@johnemorton
@johnemorton Год назад
Relearning after a bit of an absence from Figma. Thanks for the refresher!
@heytraile
@heytraile 7 месяцев назад
Love your style of delivery. Awesome!
@PoojaParmar-rw5kl
@PoojaParmar-rw5kl 26 дней назад
Very well explained, thank you!
@Alchooris
@Alchooris 9 месяцев назад
This tutorial is absolutely outstanding and incredibly clear! It's hands down the best Figma tutorial I've ever come across. I especially love how you explain 'variants' by creating buttons as both 'Components' and 'Variants.' Unlike many others who only scratch the surface of concepts and leave you hanging, your approach is systematic, tidy, easy to understand, and truly enlightening. I'm impressed! Thank you for sharing this fantastic tutorial. You are the ultimate Figma expert!🥰💖💖
@GeriBelll
@GeriBelll 7 месяцев назад
Can't agree more! Thank you for this amazing tutorial!
@eugeniat5460
@eugeniat5460 5 месяцев назад
The clearest by far, agree.
@intervention_w_myself
@intervention_w_myself 13 дней назад
You are a great teacher and explain things in the very context the helps me learn efficiently.. Please keep making videos like this!
@kamyarrastegarnia4154
@kamyarrastegarnia4154 Год назад
Thanks for the subtitles, I can note more efficiently.
@imstevencraig
@imstevencraig 10 месяцев назад
So good. Such a great video. Solid information and a great presentation style! Thanks!
@florencekey9898
@florencekey9898 10 месяцев назад
You’ve changed my life
@michellerodriguez310
@michellerodriguez310 Месяц назад
I love you so much, best Figma teacher ever!
@SamiHattab-iq4wv
@SamiHattab-iq4wv Месяц назад
Thank you so much, amazing tutorial
@narendraprasath3712
@narendraprasath3712 Год назад
Nice explanation by the way👏. It's been almost 7 months since I started using nested components and implemented them in all design libraries (iOS, Android, and Web). A small request: during the selection of nested components, it would be helpful if there was also an option to select the (variant) properties. Text properties are sometimes all that is needed, but when it has more properties (nested components), it makes a mess.
@Middollo
@Middollo 6 месяцев назад
Just what i was looking for. Thanks!
@nicole_flowing
@nicole_flowing 7 месяцев назад
Omg, mind blown. So handy!! Thank you
@TheWebCoder
@TheWebCoder 4 месяца назад
It's one thing to know a tool well for your own use, but the ability to teach others how to use it is an another skill entirely. That is why I love each video this person does, because she has mastered both.
@emerlander
@emerlander 10 месяцев назад
This is amazing. And thanks for the great video!
@vineetboyle
@vineetboyle 9 месяцев назад
Lovely video. So nicely explained.
@benetnasch_alkaid
@benetnasch_alkaid 10 месяцев назад
Excelente y al grano! 😁
@albertozerpa6785
@albertozerpa6785 3 месяца назад
Coolest and best teacher ever!!!!!!👏😊
@nikhilgoyal007
@nikhilgoyal007 11 месяцев назад
excellent! thank you!
@bradmacdonald6591
@bradmacdonald6591 5 месяцев назад
Great presentation, thanks. What would be a simple visual metaphor or analogy to help explain variants?
@julieloichot7673
@julieloichot7673 6 месяцев назад
Hi this is an amazing tutorial ! I have a question, I love using components and variants but sometimes I need/ want to keep an historic of the design to come back and see how it looked before. Is there a best practice to have in mind ? copy it somewhere ? detach components ?
@CarlosAndresVelasquez
@CarlosAndresVelasquez 6 месяцев назад
If I need to rename the layer to also include boolean properties (like icon yes/no) what would be the best approach?
@mingsirakowit3316
@mingsirakowit3316 11 месяцев назад
Thank you
@djhaulix1581
@djhaulix1581 9 месяцев назад
till 7 min it was clear but after that I lost my track and its really soo confusing. Probably my learning capabilities are low what I believe
@kwamebuanyinaohemeng919
@kwamebuanyinaohemeng919 11 месяцев назад
Thanks for a great video. Is it possible to create a functionality whereby when checkboxes are selected / unselected, it toggles a button between disabled and enabled with variants? Thanks in advance.
@sylvanusandrew8668
@sylvanusandrew8668 10 месяцев назад
Yes, it is possible to create selected/unselected radio buttons, checkboxes, buttons with variants.
@ioriii_k
@ioriii_k 4 месяца назад
4:40 The fastforward song😂
@user-xh5ik5pf5p
@user-xh5ik5pf5p 7 месяцев назад
Im having an issue which I will explain using this button example (my situation is a bit different). Let's say my primary button has an additional size, called medium. None of the other button types have a medium size. When I go to use an instance of this component, even when selecting a secondary or tertiary button, the size Medium still shows up in the variant selection drop down, even though none of those types of buttons should have a Medium option. When I select medium, it defaults to a primary button. How can I have it so only the options that match the requirements show up in the variant drop downs?
@imrankhan.uininja
@imrankhan.uininja 11 месяцев назад
You are funny! Loved the way you did dududududu...
@cmmoney
@cmmoney Год назад
I've still yet to see Figma address changes to a "universal" button style such as border radius. What if, on that new button you made, you decide you want to change the border radius of all of them? Or font family? You have to select all the buttons to make a change which is ineffective
@zumzer
@zumzer Год назад
Why not start with a “master button”, and create components from instances of that master? That would reflect all the changes to the master, correct?
@urchinsify
@urchinsify 5 месяцев назад
I felt like I went from lvl 3 crook to lvl 99 mafia boss real quick after learning this variants.
@jahanvisingla5669
@jahanvisingla5669 11 месяцев назад
nicee
@scribbleface
@scribbleface 9 месяцев назад
this is confusing and i can't see the text in the corner of my components and i don't know why.
@Thimiie
@Thimiie 9 месяцев назад
Why do you use "/" instead of "-" or "_" ? Is there a reason why?
@web3Terry
@web3Terry Год назад
Almost easier to make all your components separate label them and then make em variants
@Djerique
@Djerique 3 месяца назад
So basically Variants are Component sets?
@alkesh482
@alkesh482 8 месяцев назад
Guys say again to turu to, to turu to
@jhances
@jhances Месяц назад
I like her.
@TheBaltLT
@TheBaltLT 2 месяца назад
what is the reason for talking distracting head in tutorial? as far as i know in education eliminating distractions is one of the key objectives.
@ritaornelas7866
@ritaornelas7866 7 месяцев назад
The Figma isn't intuitive at all. It's very confusing, and on top of that, it's always changing everything!🥴
@scampercom
@scampercom Год назад
This is useful, especially coming from XD. Side note: I never realized that some people pronounce “buttons” as “buh'ins” (without Ts).
@daviddonovan425
@daviddonovan425 9 месяцев назад
PLEASE don't swirl your mouse around the screen... It's annoying and unprofessional! Otherwise great job!
Далее
Component properties
6:29
Просмотров 57 тыс.
Variants vs variables
15:11
Просмотров 33 тыс.
Highlights: Spanje - Gjeorgji
06:17
Просмотров 552 тыс.
Config 2024: Figma product launch keynote
1:07:34
Просмотров 185 тыс.
Figma Tutorial: Variants
14:16
Просмотров 1 млн
Master Figma Variants | The Complete Guide (2024)
22:00
STOP doing DROPDOWNS like this - Figma variables 2023
15:35
Figma for Education: Learning Auto layout
1:13:39
Просмотров 116 тыс.
Build it in Figma: Create a Design System - Foundations
55:27
Самый СТРАННЫЙ смартфон!
0:57
Просмотров 35 тыс.