Figma Interactive Components | Figma Variants Tutorial

Figma Components:
https://www.youtube.com/watch?v=S3uQTNUtczY

Figma Smart Animate Tutorials:
https://www.youtube.com/watch?v=C8m0_QnKQ6Y
https://www.youtube.com/watch?v=8-EDTrJJZNA

In this video I go over how to create Interactive Components in Figma. Interactive Components is a new feature that is currently in beta (see beta link below). With this feature enabled you can add interactivity to components at the variant level, instead of relying on page level animations and transitions. In this tutorial I show you how I streamline my process of prototyping a Settings page, by replacing 8 frames to show all the possible states with only 1 frame. I create a switch component, create variant states and then add interactivity between these two states.

Enjoying this tutorial? Subscribe to stay up to date with my latest content: https://www.youtube.com/channel/UC_TjoSnaI3CTgIgmSn3rruA?sub_confirmation=1

Figma Beta Program:
https://help.figma.com/hc/en-us/articles/360061175334-Create-interactive-components-with-variants

In this video I show you:
0:00 - Intro
0:15 - Starting Project
2:35 - Creating Variants
4:12 - Creating Interactive Components
5:46 - Using Interactive Components

Want to improve designer to development handoff? View my Sketch to Zeplin workflow here: https://www.youtube.com/watch?v=D3ZF2...

--

Let's Connect
Dribbble: https://dribbble.com/angeladelise
Blog: https://medium.com/@angeladelise