A Lottie è un formato di dati di animazione con sede a JSON che può essere utilizzato facilmente come risorse statiche su qualsiasi piattaforma. Sono file compatti che possono essere aumentati su e giù senza pixelation e operare su qualsiasi dispositivo. La parte migliore è che le animazioni di Lottie non richiedono alcuna abilità di codifica!
Come può l'animazione di Lottie semplificarti la vita?
Lottie's può essere utilizzato su quasi tutte le piattaforme, incluso il Web e il cellulare. Di conseguenza, puoi semplicemente incorporarli in app e siti online.
Le animazioni di Lottie possono anche essere utilizzate come adesivi della piattaforma di chat. I file JSON sono compatti anziché file GIF e PNG; Pertanto, l'uso di un file Lottie aumenta la velocità di download e minimizza l'uso dello spazio del disco.
È possibile fondere vettori e componenti raster con Lottie e, a tempo di esecuzione, applicare trasformazioni. Fare animazione e utilizzare le animazioni di Lottie in Itg.Digital ti aiuterà a capire meglio.
I file Lottie vengono utilizzati in animazioni entusiasmanti sulla maggior parte delle pagine di destinazione del sito Web.
Qual è il modo migliore per creare animazioni di Lottie?
Design (Passaggio 1)
Innanzitutto, devi completare e preparare il tuo design di animazione. Mi viene in mente un'illustrazione di una ragazza con un cane. Avevi bisogno di regolare la posizione per accogliere il pesante sospiro della ragazza e toccare i piedi. Dopo aver cambiato la postura, disegna diverse alternative di trama per l'abito della ragazza.
Se scegli di animare usando le trame, dovresti essere consapevole di quanto segue:
L'uso delle trame vettoriali è preferibile perché il file risultante sarà più breve.
Ricorda quando si disegna la trama che più punti e pezzi minori hai, più semplice dovrebbe essere animarlo. È inoltre possibile ridurre le dimensioni del file di animazione completato mantenendo la texturing minima.
Se possibile, evitare di usare maschere nell'animazione; Altrimenti, potrebbero sorgere problemi in alcuni browser.
Animate (Passaggio 2)
L'animazione è la fase successiva. Dovrai animare alcuni disegni e trasformarli in JSON per creare un file Lottie.
Mantenere le cose semplici è il consiglio più sfumato che puoi ottenere per quella fase. Invece di usare gli effetti, animare le proprietà primarie del livello: posizione, rotazione, scala e opacità. Anche l'animazione del percorso sarà impeccabile.
Le tue animazioni potrebbero essere riprodotte o suonate una volta quando le integra.
Assicurati che la tua animazione abbia un ciclo impeccabile prima di esportare da After Effects se si desidera un ciclo perfetto sul sito Web/app.
Animazioni di esportazione (Passaggio 3)
È ora di pubblicare animazioni una volta che hai finito l'animazione.
1. Lancia BodyMovin e cerca la composizione che si desidera produrre.
2. Apporta le regolazioni ai parametri.
3. Fai clic su Render e hai finito!
4. Dai un'occhiata all'animazione sul sito dei file Lottie o in BodyMovin.
5. Fai clic su "Demo" nel rendering se si desidera visualizzare la tua animazione a qualcuno che non ha familiarità con Lottie.
Conclusione
Ottieni le animazioni finali proprio nel modo in cui le vuoi con l'animazione di Lottie. Rispetto alle animazioni JavaScript, l'animazione in After Effects è più accessibile e versatile. Sarai in grado di essere più fantasioso nel processo di progettazione dopo aver appreso l'animazione di Lottie da siti Web di fiducia come Seahawk Media .