In esecuzione con Hype lynda.com
In questo corso di formazione video di lynda.com intitolato Funzionante con Hype, l'istruttore Jake Stroh, copre le basi di Hype. Al termine di questo corso di 1 ora e 37 minuti, avrai le basi per la creazione di animazioni semplici in Hype.

Stroh inizia con una rapida panoramica dell'interfaccia utente di Hype, dalla barra degli strumenti alla linea temporale. Dimostra quindi come creare la tua prima animazione, ovvero spostare un rettangolo sullo schermo con una dissolvenza attiva, utilizzando la funzione Registra. Ti guida nel processo di impostazione dei valori delle proprietà di posizione e opacità per i fotogrammi chiave iniziali e finali.

Basandosi su questo semplice esempio, Stroh discuterà poi quali tipi di immagini possono essere animate in Hype e come importarle tramite il menu Elements. L'immagine di esempio importata è un aeroplano e dimostra come creare un percorso di animazione per far volare l'aereo sullo schermo e come convertirlo in un percorso di movimento. Termina il secondo esempio aggiungendo del testo alla scena, disegnando il testo e creando un effetto sfumato.

Nella sezione successiva, Stroh inizia una discussione approfondita su come le animazioni html5 e css3 vengono create dall'animatore usando la linea temporale, i fotogrammi chiave e la funzione Registra. Descrive diversi esempi di applicazione di fotogrammi chiave alle proprietà dell'elemento. Descrive inoltre come utilizzare alcuni dei controlli nella linea temporale per apportare regolazioni precise all'animazione.

L'argomento successivo è l'allentamento e come utilizzare sei tipi di allentamento per aggiungere la fisica del mondo reale alla tua animazione. L'esempio che discute è come ottenere un'animazione della palla che rimbalza combinando diversi effetti di allentamento. Nei prossimi esempi, Stroh mostra come creare un'animazione di trasformazione e come utilizzare lo strumento Capo per perfezionare l'animazione di una sequenza di elementi sulla linea temporale. Discute anche come riutilizzare le animazioni nella stessa scena e come aggirare la limitazione che Hype non ha uno strumento di ancoraggio per l'animazione di rotazione. Infine, discute l'uso di mascheramento, ritaglio e filtri CSS nelle animazioni.

La sezione successiva introduce l'interattività. Stroh inizia con una discussione sui tipi di pulsanti integrati e su come aggiungere azioni alle loro fasi. Successivamente viene illustrato come aggiungere azioni alle immagini per lavorare come pulsanti sullo schermo. Passa rapidamente al controllo delle animazioni con più linee temporali e come aggiungere pulsanti alla linea temporale principale per controllare linee temporali aggiuntive. Dimostra anche come creare una sequenza temporale in loop.

Per creare animazioni più complesse, Stroh discute su come lavorare con tempistiche relative e concatenamento di azioni. Nei prossimi esempi, mostra come lavorare con i file audio e controllare la riproduzione con le azioni dei pulsanti. Dimostra anche le differenze tra l'utilizzo di più linee temporali e solo la linea temporale principale per controllare una presentazione di galleria di immagini interattiva.

Successivamente l'esempio di progetto è una galleria di prodotti. Stroh discute i pro e i contro di due opzioni, più linee temporali o scene, per costruire questo in Hype.

Ora sei pronto per pubblicare il tuo progetto sul web. Stroh mostra come esportare e incorporare il progetto Hype e le varie opzioni per un sito Web autonomo o come aggiungere il progetto in un sito Web esistente.

Questo non è un corso di apprendimento approfondito per Hype. Tuttavia, questo corso ti darà un'idea dei tipi di animazione che possono essere creati utilizzando il software Hype. Se hai dimestichezza con i filmati in AdobeR VeloceR, apprezzerai la discussione di Stroh su linee temporali di nidificazione, relative linee temporali e concatenamento di azioni.

//www.lynda.com/Hype-tutorials/Up-Running-Hype/135360-2.html

Divulgazione: non sono stato compensato finanziariamente per questo articolo. Le opinioni sono completamente mie sulla base della mia esperienza.