Crea un interruttore interattivo con sfocatura progressiva e gradienti

HanaPrincipiante4 min

In questo tutorial ti mostriamo come creare un interruttore interattivo realizzato al 100% in Hana usando sfocatura progressiva e gradienti, con un evento Mouse Hover per l’interazione. È un design interessante che si può usare in tanti progetti, e ti accompagniamo passo dopo passo.

Remixa questa demo qui: https://app.spline.design/ui/f7cc3864-707e-492a-8148-0e1ea37be1d3

Cosa imparerai

  1. 0:00Introduzione
  2. 0:15Creare la forma di base
  3. 0:39Aggiungere un gradiente
  4. 1:04Aggiungere un effetto di sfocatura del livello
  5. 1:46Creare i trigger
  6. 1:57Aggiungere l’evento Mouse Hover e le transizioni
  7. 2:24Creare il tratto bianco e aggiungere gli stati
  8. 3:07Impostare le transizioni del tratto
  9. 3:35Conclusione

Risorse correlate

Tutorial correlati

Tutti i tutorial