Prototype with Variables in Figma | Tips for variable prototyping with four kinds of variables

[@pmedina444]

this is the premium figma tutorials ive been looking for my whole day :D

[@TDSunshine]

yay! ☀️🙏🏻💛

[@xuhain]

I was stuck with old version of variables ui , this video pulled me out, thankyou for making them so interesting, interactive , fun and casual.

[@TDSunshine]

You're welcome! ☀️🙏🏻💛

[@kickassziu]

Your videos are absolutely easy and interesting to follow~~ you explain very clearly the basic logic of designing in figma. thanks so much for your videos!!

[@TDSunshine]

Glad you like them! ☀️🙏🏻💛

[@Rajesh_Dey]

Excellent...you nailed it!! Very few talents can only be shown in such a way that everyone can understand the fundamental part....yes I have noticed your FIGMA T-SHIRT :)

[@TDSunshine]

haha yay! Thank you so much! ☀️🙏🏻💛

[@rishabh117rules]

Such an entertaining tutorial that is easy to follow along. love your energy, and I hope this channel grows super big soon!

[@TDSunshine]

Thanks! ☀️🙏🏻💛

[@vijaysinghthakur8601]

Fruitful!
Thank you for producing intriguing learning lessons.

[@TDSunshine]

You're welcome ☀️🙏🏻💛

[@GryzinskiIshiharaAndradeDias]

I'm learning Figma and that will help me a lot to understand prototyping fundamentals. Thanks!

[@TDSunshine]

You're welcome ☀️🙏🏻💛

[@tutukumarpanda]

These are really awesome, thanks for sharing tips and tricks 👍

[@TDSunshine]

You're welcome! ☀️🙏🏻💛

[@NathanCooper-g3w]

Thank you! Excellent examples, very helpful!

[@TDSunshine]

You're welcome ☀️🙏🏻💛

[@javadobe-sol]

Thank you. I learned so much.

[@TDSunshine]

You're welcome ☀️🙏🏻💛

[@SubayelAhmmed]

This is so cool

[@TDSunshine]

Thanks! ☀️🙏🏻💛

[@iznogud27]

Thank you, you are the best ❤

[@TDSunshine]

You're welcome ☀️🙏🏻💛

[@sweb-h6c]

thanks for this, it was very useful

[@TDSunshine]

You're welcome! ☀️🙏🏻💛

[@afsarux4367]

Really nyc thanks for the wonderful video

[@TDSunshine]

You're welcome ☀️🙏🏻💛

[@MadSkunk]

Great video. Thanks

[@TDSunshine]

You're welcome ☀️🙏🏻💛

[@asvikram1628]

Thats Great, Thank you

[@TDSunshine]

You're welcome ☀️🙏🏻💛

[@ytRap007]

thank you

[@TDSunshine]

You're welcome ☀️🙏🏻💛

[@hannahglasscoe4006]

Can you do a video for an interactive calendar and drop downs that use variables/conditions? 😃

[@TDSunshine]

Great idea! dropdown video coming soon so keep a look out! ☀️🙏🏻💛

[@zootrunner]

Hi TD. I'm having the issue that for the String exercise Figma won't let me set the default input value of the text string as empty.

[@paulguido-g5x]

I'm having the same issue and I think its blocking me from being able to type out the letters in the inputText field in the Presenation view.

[@TDSunshine]

Put a space into the variable value instead of leaving it blank. That should work ☀️🙏🏻💛

[@tornikekokhreidze5950]

Thank you, the video was very helpful, but can you set the grid to pixel perfect? For example, instead of 179.98 px, it will be 180. :D :D

[@TDSunshine]

You're welcome! will try to next time! ☀️🙏🏻💛

[@dhayve]

Hmmm i need boolean variable to control variants visibility

[@dhayve]

Navigate to and then if " "then set visibility based on what was clicked

[@TDSunshine]

Did you manage to fix your issue? ☀️🙏🏻

[@dhayve]

​@@TDSunshineYes, I did position the different variants on the same X,Y coordinates. I connected all variants to boolean variables, initially setting them all to 'true'. Then, I created a prototype to show variant 'A' on click. If 'A' is currently hidden and 'B' is visible, I hide 'B'. I apply the same logic to variants 'C', 'D', and 'E'. If 'A' is already visible, it remains on.

[@weuzeify]

At this point we ll soon have design exported to fully functioning app in figma

[@TDSunshine]

This will be so cool! ☀️🙏🏻💛

[@Join_Inaya]

The variable prototype is not avaiable in free version

[@TDSunshine]

Yes 😔☀️

[@liamfarrell3281]

How about a tut on how to do advanced website scroll effects? zooms, fades, masks etc

[@TDSunshine]

Great idea! Will add to my list ☀️🙏🏻💛