Avatar con Bagliore

In questo tutorial andremo ad esporre in modo semplice e diretto, come poter realizzare un piccolo avatar con bagliore in flash. Ovviamente avremo bisogno di un avatar già pronto realizzato con photoshop.

La realizzazione in flash dell’effetto luminoso è molto semplice e per questo tutorial si è scelto di far ricorso alle linee temporali e ad un semplicissimo script che ci permetterà di regolare il tempo di visualizzazione dell’effetto bagliore.

Come prima cosa iniziamo un nuovo progetto in flash e diamo le dimensioni desiderate, per il nostro esempio il userò questa immagine:

quindi creerò uno stage di dimensioni 145×91 ed imposto il colore di sfondo di colore nero. Importiamo quindi l’immagine di nostro interesse nella libreria

File > Importa > Nella Libreria

Fatto questo, con una semplice azione di Drag&Drop, trasciniamo sullo stage l’immagine e posizioniamola ad X = 0 e Y = 0 come mostrato:

E’ buona norma rinominare i livelli quindi, rinominiamo il nostro Livello 1 in BG. Procediamo adesso con la creazione di un nuovo livello che sarà quello del bagliore.

Rinominiamolo adesso come Bagliore. E’ arrivato il momento di creare il nostro bagliore, per farlo,

Inserisci > Nuovo Simbolo

E diamo queste impostazioni:

Ci ritroveremo direttamente nello spazio dedicato alla gestione del nuovo simbolo Clip Filmato che abbiamo creato. Adesso con lo strumento rettangolare, impostiamo a trasparente i bordi e bianco il contenuto, tracciamo così un rettangolo di dimensione 410×85 come mostrato in figura:

A questo punto dobbiamo spostare il nostro simbolo grafico “Bagliore” nello stage dopo aver selezionato il livello “Bagliore” al primo frame come mostrare in figura:

Per posizionarlo aiutiamoci con Trasformazione Libera selezionando il nostro rettangolo “Bagliore” e cliccando con il tasto destro:

Ora possiamo procedere con l’aggiunta del filtro che ci permetterà di avere l’effetto bagliore. Nella barra delle proprietà, clicchiamo su Filtri e quindi scegliamo sfocatura e diamo questi parametri:

Ottenendo questo risultato:

Adesso dobbiamo creare la nostra animazione. Come prima cosa scegliamo di quanti secondi deve essere il bagliore. Il tempo della durata lo scegliamo attraverso la linea temporale. L’impostazione standard è di 12 frame al secondo, noi dobbiamo portarla a 24 frame a secondo:

Adesso clicchiamo col tasto destro sul frame numero 25 della linea temporale del livello “Bagliore” e inseriamo un nuovo fotogramma chiave:

Posizionandosi sul livello BG, un click sul primo frame per selezionarlo, premere F5 fino a che non arriviamo al frame 25, proprio sotto a quello appena creato:

Una volta fatto questo, selezioniamo il livello “Bagliore” al frame 25 e mantenendo la stessa Y del nostro rettangolo, spostiamolo verso destra modificando solo la X quel tanto che basta per farlo uscire dall’altra parte dell’avatar:

Adesso sfrutteremo uno strumento molto usato in Flash e molto potente, ovvero le Interpolazioni. Selezionando il primo frame del livello “Bagliore” scendiamo con il mouse nella tabella proprietà dove potremmo notare un menù a tendina denominato Interpolazione. Scegliamo il tipo Movimento. Noteremo che comparirà una freccia che parte dal frame 1 e termina fino al 24 del livello “Bagliore”

A questo punto il nostro Avatar è funzionante, ma l’effetto bagliore continua in un loop infinito. Dobbiamo in un qualche modo regolare la sua temporizzazione. Per fare questo useremo un semplice Script in AcrtionScript 2.0 che offre una funzione di Pausa. Selezioniamo il livello “Bagliore” fotogramma uno e nello spazio “Azioni” incolliamo questo script:

Questo script non funziona se non viene evocato, quindi, bisognerà chiamarlo quando richiesto. La logica è quella di far iniziare l’animazione, farla procedere fino alla fine e mandarla in pausa per un tempo T prima di ripetersi. Per fare questo, posizioniamoci sul frame 25 del livello “Bagliore” ed inseriamo la chiamata allo script:

In questo modo ogni 4 secondi, l’animazione si ripeterà. Sta a voi poi regolare i tempi.

Questo è il lavoro finito.

Tengo a precisare che, il lavoro poteva essere svolto in vari modi, ad esempio con l’aggiunta di maschere di livello per il bagliore e di un modulo specifico per l’Action Script, tuttavia si è scelta un implementazione più semplice.

  Avatar con Bagliore (34.6 KiB, 31 hits)
You need to be a registered user to download this file.