Halloween landing page in Figma
Halloween si avvicina..devi realizzare un sito web in stile Halloween?
Mi è capitato molto spesso in questi anni di disegnare landing page in stile halloween e purtroppo facevo fatica a trovare qualcosa che facesse al caso mio.
Così ho deciso di realizzarci un tutorial..spero di esservi d’aiuto.
In questo tutorial realizzeremo insieme un animazione all’ingresso in stile parallax con Figma.
Avevo già pubblicato due tutorial per la creazione di pagine con effetto parallax con Adobe Xd (parallax auto animate con adobe xd e parallax auto animate in 5 min)
Alla fine del tutorial sarete in grado di creare questa landing page in stile Halloween e creare l’animazione di apertura.
Per prima scarica tutti gli assets utili per il tutorial
Scarica gli assets https://www.dropbox.com/scl/fo/v0kf9r…
Darkmode font download https://www.fontspace.com/darkmode-fo…
Pipistrello gif https://lottiefiles.com/35978-bat-hal…
Background vector file credit https://www.freepik.com/free-vector/h…
File audio
Credits 1 https://pixabay.com/music/scary-child…
Credits 2 https://pixabay.com/music/scary-child…
Capitoli:
00:00 Intro
00:47 Frame download degli assets
01:45 Prepariamo il frame e posizioniamo i layers
03:53 Inseriamo il title ed inseriamola nel frame
04:49 Creiamo la barra di navigazione
07:05 Inseriamo i pipistrelli
07:59 Duplichiamo i frame prima di prototipare
12:40 Animiamo i frame con la funzione prototype
13:16 Conclusioni
Iscriviti al canale se vuoi imparare ad utilizzare Figma e Adobe Xd come un PRO