An Introduction to Boolean Variables in Figma

Поділитися
Вставка
  • Опубліковано 2 лис 2024

КОМЕНТАРІ • 64

  • @Kevin-wg2cd
    @Kevin-wg2cd 2 дні тому

    Super helpful, thanks for the tutorial! I figured that's what can be done with Boolean variables but you made it so simple. I just used this to trigger an item showing up in a list of favorite items after being added.

  • @StoriesMails
    @StoriesMails Рік тому +6

    Please more videos on these new features and how to use them, super valuable stuff, thanks for starting making videos on this!

    • @UICollectiveDesign
      @UICollectiveDesign  Рік тому

      Lots more have been introduced since :) Please share with your network!

  • @kevinvanlinthout8017
    @kevinvanlinthout8017 11 місяців тому +5

    Thanks, I've been looking all over the place for a good explanation on this...two finger tab is what other explanations leave out, I didn't even know this was a thing 😀

    • @UICollectiveDesign
      @UICollectiveDesign  11 місяців тому

      Glad it helped! Please subscribe and share our video :)

  • @juansebastianuseche7950
    @juansebastianuseche7950 Рік тому +3

    Thanks! this is the first video I see where I get the concept! I made appear and dessapear things 💪

  • @EnesKab
    @EnesKab Рік тому +11

    I tried boolean for a similar scenario on my own and couldn't find the way of assigning the variable to the layer. Right clicking on the eye icon seems like a terrible UX.

    • @Shahraman
      @Shahraman Рік тому +5

      It is terrible. All the other variables are assigned with a specific button that has the variable icon, but this one doesn't make sense

    • @doity
      @doity Рік тому +3

      Same I had the same situation. Terrible UX

    • @UICollectiveDesign
      @UICollectiveDesign  Рік тому +1

      Agreed - It seems as if they did not think through variables very well. Especially not having text variants from the very beginning

    • @shimomiaizo
      @shimomiaizo 9 місяців тому +2

      you know they did NOT do a good job designing their own DESIGN software when 3 designers on the same team ran into this exact same problem in three different occasions

  • @liohaan
    @liohaan Рік тому +1

    Hey, I liked the use case to just explaining the new Figma feature.Many thx!

  • @maelysjuttier4576
    @maelysjuttier4576 5 місяців тому +1

    Omggg i've veeb trying to assign it for 30 mins, thanks

    • @UICollectiveDesign
      @UICollectiveDesign  5 місяців тому

      Happy to help! Please subscribe and share this vid where you can :)

  • @jaycamacho2021
    @jaycamacho2021 10 місяців тому +1

    Thank you buddy!

  • @0DR4CUL4
    @0DR4CUL4 Рік тому +1

    Thanks so much man! 🙌

  • @hackwithharsha
    @hackwithharsha Рік тому +1

    Thank You !! What’s the difference between local and global variable ?

    • @UICollectiveDesign
      @UICollectiveDesign  Рік тому

      Local is in the individual file only. Global is not... such as subscribing to a design system

  • @madhavidegapudi08
    @madhavidegapudi08 9 місяців тому +1

    Thank you for this example. I would like to toggle div visibility using button in multiple places. How to use same variable for multiple components and button which is outside component show toggle visibility

    • @UICollectiveDesign
      @UICollectiveDesign  9 місяців тому

      Sorry can you elaborate?

    • @madhavidegapudi08
      @madhavidegapudi08 9 місяців тому +1

      @@UICollectiveDesign how to create accordion component with boolean variables

    • @madhavidegapudi08
      @madhavidegapudi08 9 місяців тому +1

      I could create variants with figma, if I want to make use of only boolean variables and create accordian .is it possible?

    • @UICollectiveDesign
      @UICollectiveDesign  9 місяців тому

      It depends on your use case and how your component is built. Unfortunately, I can't describe via UA-cam comments.@@madhavidegapudi08

  • @herrschultz7413
    @herrschultz7413 Рік тому +2

    Helpful! The only problem is that when I click my eye icon, it just hides the component instead of listing the variables to set...

  • @rohitjadhav8744
    @rohitjadhav8744 Рік тому +1

    Explained well!!

  • @casperblue
    @casperblue Місяць тому +1

    what's the two fingers tap means?

    • @UICollectiveDesign
      @UICollectiveDesign  Місяць тому

      It's how you access the ability to turn on or off boolean

  • @annepattrice3393
    @annepattrice3393 Рік тому

    Hi! whitch tips can you give me about change boolean variables in different components? like an input that changes for focus state and active a button for enable that previously was disable

    • @UICollectiveDesign
      @UICollectiveDesign  Рік тому

      I can do a lesson on this. Will add it to my list :) You can also join our Slack channel to chat with us directly for specific questions.

    • @annepattrice3393
      @annepattrice3393 Рік тому +1

      @@UICollectiveDesign thanks! i can't wait for it

  • @benjamincranwell
    @benjamincranwell Рік тому +1

    Brilliant video

  • @wayofMANI
    @wayofMANI Рік тому +1

    thanks bro, i don't have any idea why figma puted this option there :) i though it's not available...

  • @samduss4193
    @samduss4193 3 місяці тому +1

    can not find the link of how to build alert component.

    • @UICollectiveDesign
      @UICollectiveDesign  3 місяці тому

      Now a free offer for approved community members

    • @ThefutureofhistoryCoUkTV
      @ThefutureofhistoryCoUkTV Місяць тому

      @@UICollectiveDesign I signed up to the website, how do I access the alert tutorial?

  • @eduardoassuncao3670
    @eduardoassuncao3670 6 місяців тому +1

    I'm the only one that was blocked by the hidden UX in the eye icon? Plus, how would I do it with a toggle that already has a click variant interaction

    • @UICollectiveDesign
      @UICollectiveDesign  6 місяців тому

      Can you elaborate on what you're looking to achieve?

    • @eduardoassuncao3670
      @eduardoassuncao3670 6 місяців тому +1

      @@UICollectiveDesign I have a toggle on the design system that already has its hover/on/off interactions. I want a toggle to switch on a part of graph, but when I add the click interaction it breaks the whole thing. I wonder if there's an easier workaround than detaching the toggle component and duplicating it without the interactions. Thank you!

    • @UICollectiveDesign
      @UICollectiveDesign  6 місяців тому

      @@eduardoassuncao3670 Now that you're in the community, can you send me a screen recording of this?

  • @Israël_arme
    @Israël_arme 3 місяці тому +1

    Please i Can't find my boolean tools on figma, Can someone please help😢 i have selected two differents shapes, and they are overlapping each other

    • @UICollectiveDesign
      @UICollectiveDesign  3 місяці тому

      Are the elements inside a frame?

    • @Israël_arme
      @Israël_arme 3 місяці тому

      @@UICollectiveDesign yeah, i'm trying on a New file and its now showing i still figure out why its wasn't working.

  • @mynameismiyya
    @mynameismiyya Рік тому +1

    Please! Can you create a tutorial on how to use variables to add items to a cart and have the prices change in tandem?

  • @cassysmithies3977
    @cassysmithies3977 15 днів тому

    How does this work with figma's new UI?

  • @hkyoyo
    @hkyoyo Рік тому +2

    Using a boolean to show/hide a component is counter intuitive. A boolean value should be watched by linked components and certain actions can be performed when a value changes. Thats how its supposed to be used.

    • @UICollectiveDesign
      @UICollectiveDesign  11 місяців тому +1

      Great call out! Lot's of different ways these can be used for various use cases for sure.

  • @Sun-kc2cx
    @Sun-kc2cx Рік тому

    i don't see any boolean option on the layer dropdown. do you know why??

    • @yoko007-q2v
      @yoko007-q2v 2 місяці тому

      right click the eye button

  • @LizzieHart-z5s
    @LizzieHart-z5s Рік тому

    When I click on the eye nothing happens and it doesn't show the boolean property, seems very strange and like I have a bug?

    • @UICollectiveDesign
      @UICollectiveDesign  Рік тому

      Try right clicking or making sure the component is inside a frame

    • @Sun-kc2cx
      @Sun-kc2cx Рік тому

      @@UICollectiveDesign OMG. RIGHT CLICKING........ IT MADE ME TRY HUNDREDS TIMES

  • @TheRiteHand
    @TheRiteHand 5 місяців тому +1

    👉1:36

  • @rjabrm
    @rjabrm Рік тому +1

    Very complex and inconvenient all that vars ... dont get it.