Figma Tutorial: Button Micro Interaction

How to make Button Micro action in Figma⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣
𝗪𝗵𝗮𝘁 𝗮𝗿𝗲 𝘁𝗵𝗲 𝗠𝗶𝗰𝗿𝗼𝗶𝗻𝘁𝗲𝗿𝗮𝗰𝘁𝗶𝗼𝗻𝘀?⁣⁣⁣⁣⁣
Those are the small, everyday events in digital products that can be a great way to enhance the overall experience for your users.⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣
In this tutorial, I'm going to show you another way how to prototype a micro-interaction like Button animation in Figma.⁣⁣⁣
⁣⁣⁣⁣⁣
You'll learn how to make this animation for when a user hovers/clicks on the button to achieve/simulate the connection to the source. It can be used to show actions like “Connecting to your phone or external camera/source”. ⁣⁣⁣
⁣⁣⁣⁣⁣
Now, I know it might not look like much, but that's the whole point. Microinteractions are supposed to be useful, but not intrusive.⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣
Wrap up⁣⁣⁣⁣⁣
This i is just an example of how those button animations can be extended. You can build button animations for whatever state do you need. Connecting, sending emails, adding to carts. Different purposes can be simulated. ⁣⁣⁣
⁣⁣⁣⁣⁣
⁣⁣
Try Figma for FREE
-----------
-----------
Check Figma tutorials - 13 Chapters:

𝗧𝗼 𝗺𝗮𝗸𝗲 𝘁𝗵𝗶𝘀 𝘀𝗲𝗿𝗶𝗲𝘀 𝗼𝗳 𝘁𝘂𝘁𝗼𝗿𝗶𝗮𝗹𝘀 𝗜 𝗵𝗮𝘃𝗲 𝘂𝘀𝗲𝗱 𝗕𝗿𝗮𝗶𝗻𝘀𝘁𝗼𝗿𝗺𝗶𝗻𝗴 𝗨𝗜 𝗦𝘁𝘆𝗹𝗲 𝗞𝗶𝘁.⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣