วีดีโอ

I think you should spend more time explaining the overall concept behind why things are set up they way they are vs narrating each specific step

magick!

While your ability to show what you know how to do is clear, the lack of explanation of the logic you are using makes this a bit of a head scratcher. People with very little experience with variable or coding logic will be lost and simply move on.

You might want making reels out of those)

Simple and effective. Thank you!

So this version was my introduction to figma but it was pretty confusing following learning material. But I guess that's every software to some extent.

such a useful feature!

Omg, Figma... This person have to got UI3. Thx for the lesson, master

dammmmn thanks bro

So, that was unfortunately too little too fast for me... I feel it's extrmely powerfule, but could not manage to follow through with everything.

Stupid question: How did you edit the images? I am almost ashamed of the privmitiv workaround I had to use 😹

Another crazy good video!

You saved my life! Thanks!!

I've been struggling to find a way to use string variables with animation. Is it possible? For example, using a button to trigger a separate component that's set up as an animation sequence.

Insane! Thank you!

Video 4 here: th-cam.com/video/VXpyZf5nMq0/w-d-xo.html

Video 3 is here: th-cam.com/video/RN3LWTPq68E/w-d-xo.html

2nd video here: th-cam.com/video/ZEW3jx9i10w/w-d-xo.html

I can't thank you enough! One request: it would be great to introduce the Next Video connected to this one in the comments, so that we can jump directly there. Thank you again!

I'll be saving this to my reference library. That's a lot to take in, and it's great how you got it down so concisely. I can only imagine how much time you spent figuring this all out.

Thx dude n you save my day ! You take a suscriber !

It is impractical to require an actual video file. For small animations or clips I suppose it’s fine, but what we all want is to input a URL to a video, and have the video stream inside the container.

Wow, I didn't knew videos could keep their playback state if to use smart animate, nor they can trigger interactions on hitting a certain timeframe/end of the video. Thank you, that's helpful!

Great explanation! Thank you very much!

This is soo cute lol, also thank you for this

This update made Figma’s UX worse for me... what problems does this update even solve? It just caused more problems. The floating tools on the bottom for example. They could have done simple things like a shortcut to hide selection outlines like in Adobe illustrator which is sorely missing.

many folks are watching your videos on laptops and since you're using a larger display is very hard to follow your choices done in the side panel

"Canvas stacking".. damn i would never find that alone. In a similar case I was thinking that auto layout was making my scrolling effect impossible so I start to convert most of my auto-layout group into frame in order to better manage their stacking position. I u see what I mean. God damn it

Nice one, Chris!

Man I was looking for a component button. Feels so strange that they hid that away.

A nice bite on sections would be good too.

Yay! Thanks!!!

thank you! I have been wondering how to make these kinds of interactions!!! Now I need to rewatch it a few times to truly understand. P.S. Did you know you said "Brototypes" at the very end? 🤣

Can’t wait for you to cover the new figma UI. Hard to find some of theses things now

oh my god thank you so much!!! I've been using Figma for years but variables always confused me. this was so clear, I really, really appreciate it!!

Thanks for advancing the concept of contexts here! Also, I don't have the new Figma UI either, LOL!

When I right-click the eyeball icon in order to get the variable tied to visibility, nothing happens. Does this feature still work for you in Figma? Have they moved it somewhere?

Your semantic colors collection has a type size variable.

Just build a state machine in figma. Gonna be really helpful. Steps: 1. Utilize atomic design system structure. 2. Design interactive components. 3. Use key/gamepad interaction with smart animation. 4. Create local variable same as default varient name. (Input) 5. Connect variable to varient. 6. Design trigger area. (Listener) 7. Add if/else condition with interaction to trigger area. 8. Finalize your interactive components (prototype token). 9. Design viewport & insert interactive components. (You can utilize sections to let figma memorize your interaction flow.) 10. Play, test & Iterate ❤

This is GREAT for those extreme wide monitors :D. I found very useful using the prototype in responsive mode, specially for those mobile first designs. Thanks!

God bless yaa man, this simple thing you did help me with my most complex project.

I know this was easy. I love it. It was helpful

Great video showing the power of variable prototyping! I hope to be at this level one day

Cool, thanks!!

I keep getting the message "Pasting inside the current selection is not possible" when trying to use the paste to replace (???)

Great info! Quick question since I saw it happen at the beginning - when you picked that button to swap into the dialogue box it got distorted. Does this mean for components you already made (lets say somewhere else in the design system) you'd have to make a custom local component for this everytime?

I love these sorts of hacks, but also wish Figma would just make interoperability between the apps a little better. Connectors and sticky notes, at the least, should be accessible right inside of Figma.

thank you. this is great

Wow! Thank you so much for this valuable tutorial. I found the channel when was searching the tutorial for auto-layout, but found this treasure lesson. It's necessary for my UI for games.

Jesus Saves, and He loves you all.