7/22/2019 tips_1010.pdf

1/3

[TIPS & TRICKS] Ottobre 2010

Incomedia S.r.l.| www.incomedia.eu |www.websitex5.com 1

Intestazioni con Animazioni Flash

Come creare a inserire unAnimazione Flashnellintestazione del Sito Web

Come sappiamo, WebSite X5 Evolution 8 permette di scegliere fra oltre 1400 template preinstallati o dicreare un proprio modello grafico da zero. In pi ha un pratico editor interno attraverso il quale possiamo

lavorare su intestazione e pi di pagina del modello aggiungendo testi, immagini, collegamenti e tutto ciche serve per adattarlo al nostro gusto e alle nostre esigenze.Uno degli elementi che potrebbe rendere lintestazione del nostro modello pi accattivante lAnimazione Flashma difficile riuscire a trovare gi pronta lanimazione che fa al caso nostro. Vediamo,dunque, come possiamo creare unAnimazione Flash grazie a un software veramente molto semplice,SWiSH Lite, e a inserirla nel nostro sito fatto con WebSite X5 Evolution 8.

SWISHLITE:SWiSH Lite una versione semplificata di SWiSH Max3, software completo e professionale per la creazionedi siti e Animazioni Flash.Con SWiSH Lite possibile creare piccole animazioni in cui si combinano testi e immagini contando suuninterfaccia estremamente intuitiva e una galleria di effetti preimpostati.

SCENARIO:Ipotizziamo di voler creare unanimazione in cui vengano visualizzati il logo, il nome del nostro sito e unbreve slogan, da posizionare nellintestazione del sito stesso.Gli elementi dellanimazione dovrebbero presentarsi in questo modo:

CREARE LANIMAZIONE CON SWISHLITE:Dopo aver installato e registrato la nostra copia di SWiSH Lite, lanciamo il programma.SWiSH Lite presenta due finestre: una con tutti i comandi, organizzati in sezioni omogenee, e una vuotadove verr visualizzata lanteprima dellanimazione creata.

Nella sezione Generale, impostiamo la Larghezza e lAltezza del filmatorispettivamente a 430 px e a100 px. Lasciamo la frequenza a 12 fotogrammi al secondo e come colore di sfondo il bianco.

Passiamo alla sezione Linea Temporale: qui possiamo lavorare allo sviluppo dellanimazionefotogramma per fotogramma.

Clicchiamo sul pulsante Inserisci Nuovo Oggetto Immagine e importiamo il file gif, jpg o pngrelativo al logo. Il logo viene aggiunto sulla Linea Temporale e viene visualizzato nella finestra dianteprima.

Accertiamoci che sia selezionato loggetto immagine(Logo) e clicchiamo su Aggiungi Effetto in modo davisualizzare lelenco di tutti gli effetti disponibili.

Possiamo scegliere, per esempio, leffettoDissolvenza in entrata.

Leffetto viene applicato alloggetto con delleimpostazioni standard ma possiamo lavorare sullaLinea Temporale per modificarlo.

SWISHLITE INOMAGGIO

CON GLI ORDINI FATTI USANDO IL

CODICE PROMO AWARDX5

7/22/2019 tips_1010.pdf

2/3

[TIPS & TRICKS] Ottobre 2010

Incomedia S.r.l.| www.incomedia.eu |www.websitex5.com 2

Possiamo, per esempio, fare in modo che duri pi a lungo semplicemente trascinando il bordo delrettangolo blu che lo rappresenta sulla Linea Temporale fino al fotogramma desiderato. In pi,possiamo fare doppio click sullo stesso rettangolo blu per richiamare la finestra che permette digestire tutte le opzioni relative alleffetto.

Per visualizzare lanteprima delleffetto impostato, dobbiamo semplicemente cliccare sul pulsanteRiproduci filmato. Per interrompere lanteprima, invece, e continuare a sviluppare lanimazione

dobbiamo cliccare su Ferma filmato.

Clicchiamo, ora, sul pulsante Inserisci Nuovo Oggetto Testo: loggetto viene inserito sulla LineaTemporale e una scritta Testo compare al centro della finestra di anteprima, sovrappostoallimmagine del logo. Possiamo lavorare direttamente sulla finestra di anteprima per spostare glielementi in modo da affiancarli correttamente.

Apriamo la sezione Testo (per farlo possiamo anche fare doppio click sul testo visualizzato nellafinestra di anteprima), digitiamo il nome del nostro sito e diamo le formattazioni del caso.

Come abbiamo fatto per limmagine del logo, impostiamo anche per il testo un effetto: questa voltapossiamo scegliere, per esempio, leffetto Schiaccia specificando attraverso la finestra delleimpostazioni Schiaccia verso sinistra.

A questo punto la Linea Temporale si presenta cos:

Clicchiamo di nuovo sul pulsante Inserisci Nuovo Oggetto Testo: digitiamo, formattiamo eposizioniamo la scritta relativa allo slogan.

Anche sullo slogan impostiamo leffetto Schiaccia ma scegliendo Schiaccia verso destra. A questo punto, possiamo far scomparire tutti e 3 gli elementi contemporaneamente: per ciascuno di

questi posizioniamoci al fotogramma 55 della Linea Temporale e inseriamo lEffetto Dissolvenza inuscita.

A questo punto la Linea Temporale si presenta cos:

7/22/2019 tips_1010.pdf

3/3

[TIPS & TRICKS] Ottobre 2010

Incomedia S.r.l.| www.incomedia.eu |www.websitex5.com 3

Verificato che tutto funzioni correttamente possiamo esportare la nostra animazione. Apriamo lasezione Esportazione per verificare i parametri impostati e, quindi, clicchiamo sul pulsanteEsporta in SWF scegliendo di salvarla, per esempio, come titolo.swf in una nostra cartella di lavoro.

IMPORTARE LANIMAZIONE IN WEBSITE X5EVOLUTION 8:Adesso che abbiamo creato la nostra Animazioni Flash non ci rimane che inserirla nellintestazione deltemplate del nostro sito.

1. In WebSite X5 Evolution 8, apriamo il progetto del nostro sito e, nel Passo 1 apriamo la finestraModifica del modello.

2. Clicchiamo sul pulsante Inserisci Animazione Flash e importiamo il file titolo.swf che abbiamocreato con SWiSH Lite.

3. Posizioniamo adeguatamente lanimazione e attraverso il riquadro Posizione e dimensioniimpostiamoi valori corretti di Larghezza (430 px)e Altezza (100 px).

4. Verifichiamo che tutti funzioni correttamente e salviamo.

Con questo abbiamo concluso e abbiamo visto com semplice, grazie a SWiSH Lite, creare una semplice

animazione Flash per impreziosire la grafica dei nostri siti.

Visti e compresi questi semplici passaggi base, vale sicuramente la pena spendere un po di tempo per

guardare gli effetti disponibili e fare pratica a lavorare sulla Linea Temporale per scoprirete tutto ci che

possibile fare.

Se poi scoprire che il mondo dellanimazione Flash vi affascina, allora vi consigliamo di approfondire il

discorso con versioni pi complete e performanti come SWiSH Max3o SWiSH miniMax3.

PER MAGGIORI INFORMAZIONI

SUI SOFTWARE SWISH

HTTP://WWW.SWISHZONE.IT