Figma Hover | Figma Button Hover Effect with Smart Animate

Gpt suggest this😅❤

Really great tutorial. Thank you

this video was very helpful, thank you

I like that you get right to the point without a lot of fluff. Thank you!!

and how do i use this now in a layout?

Still doesn't explain HOW to use this. Like, how can you drag the animated button to your website if its already in a frame.

Thank you !

great easy to follow intro

Hi great tutorial! thanks for record it! Can it work in components? Is there a way to reuse this hover effect of buton in my product prototype ?

Nice. Zhanks. But, are there also tutorials, if i already have a button(auto layout) with variants (hover, pressed ...) and now i want to insert animations between the states? E.g. a color bar that floats in from left to right

Hi I need help, is there anyway to do the following below when clicking a button
When click button A, I want button B to change colors

Thanks, Really amazing

Create variations in components, then in Prototype/Select Interactions/Select While Hovering.

XD is way easier!

Can this button animate save to SVG format?

New to FIGMA. This is the best button tutorial I've found. TY

Thank you so much. I find this software amazing. It has saved me so much time and it has almost no learning curve considering how much we can do with it.

Well I guess XD had to be way better at something

You don't need to drag layers by mouse, just press ] or [ to move them up or down.

Why does my buttons move when I enable the smart animate? It just makes an annoying tiny jump up and then back to its original position.

Thank you for sharing !

this is so stupid.

Sounded like I just watched a tutorial by a Disney princess. Thanks for the tut btw :)

Hi and thanks for the tutorial! I am working with components and of course trying to put the Hover circle into an Auto Layout does not work well. What alternative is there when working with Auto Layout to still get the circle effect on hover?

HI. It Really helped me, Thanks this video!

Okay so now how do you use it on a different screen? Everyone stops there, but I haven't seen a tutorial of how to put it on an already designed screen.

Can you do these things with auto layout? Cuz I really have a hard time playing with auto layout.

thanks
i need scroll in page for one part of page content
can you help me?

This has been a great tutorial, doing this right now!

Great, and thanks ....

How would you incorporate these frames into an entire page, so that you could get the animation effect just on the button? Or would you need to create an entire duplicate page just to animate the button hover?

I have several frames now with the interactions (1 for buttons, 1 for accordions, 1 for forms) but when I select Present it only shows me 1 interaction (the buttons one). Do you know why this is? It only worked when I moved the new frames to a new page. All seperate animations have the be on separate pages to work? So annoying :(

Hi i have a doubt i am trying to build a
Social network platform i designed in figma so i need to code in html css
Pls reply mee

Hey your channel is pretty cool. But do you consider about changing its name because it's hard for us to search.

what about interactive components

We can set the background colors on the frame.

Hi Angela, What was the key command that u used to hide those sidebars while showing both buttons

Hey, ❤️