Create a TOGGLE BUTTON (Option Switcher) With a HOVER Functionality (Figma Tutorial)

Publicado em: 16 Maio 2022
no canal de: Mavi Design
122,902
2.5k

Need personalized help? Book a 1:1 LIVE SESSION with me: https://bit.ly/mavi-private-lessons
Visit my STORE: https://bit.ly/mavi-design-store
Explore Mavi Design COURSES : https://bit.ly/mavi-design-courses
Explore Mavi Design WALLPAPERS: https://bit.ly/mavi-design-wallpapers

In this video I'm going to show you how to design a Toggle Button / Option Switcher with a hover functionality in Figma.

0:00 – The Result
0:13 – Structure of this tutorial / process
0:40 – Creating the OPTION component
4:14 – Crearing the OPTION SWITCHER (Container) component
5:08 – Result so far – only hover functionality
5:45 – Defining toggle button (option switcher) states
6:58 – Why nesting components is a great way to design User Interfaces
8:10 – Defining interactions (actual functionality)
9:44 – The Result

How to design (create) an interactive Toggle Button (Option Switcher) Component Prototype from scratch in Figma (Step-by-step explanation and clarification of the design process)

————
© 2022 Mavi Design


Nesta página do site você pode assistir ao vídeo on-line Create a TOGGLE BUTTON (Option Switcher) With a HOVER Functionality (Figma Tutorial) duração hora minuto segundo em boa qualidade , que foi baixado pelo usuário Mavi Design 16 Maio 2022, compartilhe o link com seus amigos e conhecidos, no youtube este vídeo já foi visto 122,902 vezes e gostou 2.5 mil espectadores. Boa visualização!