Introduzione all'animazione con Hype Record

• Aprile 20, 2024

Hype ha una funzione molto bella per l'animatore iniziale, chiamata funzione Registra. Per utilizzare questa funzione, fai clic sul grande pulsante rosso Registra. Questo è ciò che faremo in questo tutorial.

Come abbiamo appreso, per creare un'animazione, abbiamo solo bisogno di un frame di inizio e fine. Ad esempio, per ridurre la dimensione di un rettangolo mentre si sposta sullo schermo, diremmo a Hype su quale frame avviare l'animazione e su quale frame interrompere. Poiché stiamo lavorando con l'animazione basata sulla sequenza temporale, possiamo parlare con Hype utilizzando i fotogrammi chiave sulla linea temporale. E, avete indovinato, posizioneremo questi fotogrammi chiave su quei due frame di avvio e arresto speciali.

Quando Hype vede un fotogramma chiave, prende nota delle proprietà di un oggetto, come un rettangolo, sullo schermo. Alcune delle proprietà che Hype prenderà in considerazione sono Opacità, Origine a sinistra, Origine a destra, Altezza dimensioni e Larghezza dimensioni. Queste proprietà corrispondono alle proprietà dello stile CSS in un documento HTML5. Hype memorizza i valori di queste proprietà insieme alla posizione o al fotogramma corrispondente sulla linea temporale.

Il nostro primo passo nella creazione di questa animazione di esempio è comunicare a Hype quali dimensioni devono essere realizzate per il rettangolo e dove posizionarlo sullo schermo all'inizio e alla fine dell'animazione. Possiamo fare tutto questo con il pulsante Registra.

1. Fai clic su File - Nuovo per avviare un nuovo documento in Hype, utilizzando le impostazioni predefinite.
   
   Aggiungiamo il rettangolo allo schermo.
   
   
2. Fai clic sull'icona Elementi nella barra degli strumenti e scegli Rettangolo. Hype posizionerà un nuovo rettangolo al centro dello schermo.
   
   Posizioniamo il rettangolo nel punto desiderato per l'inizio dell'animazione. Manterremo le dimensioni predefinite, quindi tutto ciò che dobbiamo fare è spostare il rettangolo.
   
   
3. Trascina il rettangolo sul bordo sinistro dello schermo.
   
   
4. Dai un'occhiata all'Ispettore metriche. Il rettangolo ora è 7 pixel dal bordo sinistro e 149 pixel dal bordo superiore. Inoltre, è di 102 x 102 pixel.
   
   

Ora vogliamo che il rettangolo si sposti sul bordo destro e riduca il 50%. Inoltre, vogliamo che ciò avvenga in soli 30 frame. Diciamo a Hype queste informazioni tramite la funzione Record nel prossimo tutorial.

Continua

Istruzioni Video: RetroAhoy: Doom (Aprile 2024).