Macromedia Flash (Designer) per principianti in un'ora
Prima di cominciare, è necessario dire che con questa guida non affronteremo nell'ambito globale tutte le funzioni e l'utilizzo del programma, che sono molto ampie, ma solo l'uso da designer per gettare un po' le basi di questo software.
Cominciamo!!!
Macromedia Flash è un software, come da nome, di proprietà di Macromedia, scaricabile tranquillamente in versione trial dal sito
www.macromedia.com.
Macromedia Flash è un programma ideato per la realizzazione di contenuti grafici e visivi: siti web, animazioni e filmati, ma essendo un programma potentissimo, si possono benissimo raggiungere risultati maggiori: applicazioni di vario genere, giochi e cartoon.
Al suo interno vi è anche un dettaglio non indifferente, il software ha un vero e proprio linguaggio di programmazione, che è l’actionscript che permette la semplice gestione dei contenuti nei filmati realizzati.
Adesso che abbiamo un po’ chiarito cos’è Flash e a cosa serve possiamo procedere scendendo nei particolari.
Comincerei con il parlare un po’ sull’uso del programma anche se è molto semplice e anche i più negati come me impareranno presto come usarlo.
A scanso di equivoci la versione di Flash che utilizzerò per questa guida è Macromedia Flash 2004 MX
Uso di Flash
Immagine Flash
Finalmente andiamo un po’ ad esplorare il programma. Come potete vedere dall’immagine, la sua struttura è molto semplice ed intuitiva: al centro lo “stage” dove viene realizzatoli filmato, sulla sinistra la barra degli strumenti, in alto la linea temporale dove si possono selezionare i fotogrammi e le scene del filmato, a destra le varie finestre che a scelta uno può selezionare a seconda della convenienza, e infine in basso la finestra delle proprietà e quella delle azioni dove viene inserito il linguaggio di programmazione Flash (l’Actionscript).
Fino ad ora credo nessun problema… Analizziamo singolarmente ognuno di questi ambienti per capire a fondo tutte le capacità di questo software.
Vi consiglio di aprire il programma per seguire i vari passaggi, perché anche se ogni descrizione sarà accompagnata da immagini, vi sarà più facile la comprensione. Quindi se avete windows potreste affiancare questa finestra con la guida e quella di Flash orizzontalmente, cliccando con il tasto destro sulla barra di windows.
Il pannello delle proprietà
Aperto Flash, aprite ance un nuovo documento dal menù file su cui lavorare.
Entrati nel programma, vi troverete la schermata sopra descritta, ma noi prendiamo in considerazione solo il pannello proprietà tralasciando il resto. Tornando alla nostra cara finestra delle proprietà, come da nome, vi si potranno modificare tutte le proprietà di un determinato strumento o oggetto, anche se questo lo vedremo in seguito, quando analizzeremo la barra degli strumenti.
Soffermiamoci adesso sulle proprietà principali del filmato: le dimensioni, lo sfondo, la frequenza di fotogrammi per secondo e le impostazioni, di cui adesso non possiamo ancora capirne a fondo l’utilizzo.
Come avete potuto vedere, le dimensioni standard di un documento Flash sono 550 x 400 px.
Noi adesso le andremo a modificare cliccandoci sopra e mettendo come dimensioni 400 x 300 px, di modo da poter avere davanti a noi l’intero stage senza che venga coperto dalle altre finestre.
Potremmo anche cambiare il colore dello sfondo, ma attualmente non ne vedo l’utilità. L’importante è che abbiate capito come modificare le impostazioni principali di un filmato.
La barra degli strumenti
Finalmente andiamo nel pratico!!! Come per la schermata principale di Flash analizzeremo uno per uno tutti gli elementi, per farvi conoscere a fondo a fondo ogni loro caratteristica.
A fianco ogni nome dello strumento scriverò anche il tasto di scelta rapida, così per voi sarà più facile individuarli e selezionarli.
La matita (Y)
Selezioniamo la matita e cominciamo a prenderci confidenza! Sempre mantenendo la matita come strumento in basso alla barra degli strumenti ne potreste modificare il colore e le opzioni.
Infatti, una cosa da sottolineare è la possibilità di cambiare il tipo di tratto dalle opzioni, che può essere: raddrizzato, attenuato e tipo inchiostro.
Sulla matita infine c’è ancora da dire, che come ogni altro strumento, abbiamo la possibilità di cambiarne le proprietà, proprio dalla finestra delle proprietà in basso.
Li potrete personalizzare il colore, la grandezza (che va da 1 a 10 px) e il tratto.
La linea (N)
Sulla linea non abbiamo niente in particolare da segnalare, solo che per tracciare una linea perfettamente dritta, vi basterà tenere premuto il tasto tab durante la realizzazione.
Lo strumento ovale (O) - Strumento rettangolo e Polystar (R)
Su questi strumenti, molto simili, che servono alla realizzazione di ovali, rettangoli e poligoni non vi è molto da dire, se non che quando il puntatore è accompagnato da un tondino, durante la realizzazione di uno di questi, sta a significare che si sta realizzando o un cerchio o un poligono regolare.
Come per la linea, per realizzare cerchi e poligoni perfetti vi basterà cliccare il solito tasto tab durante la realizzazione degli stessi.
Il pennello (B)
Sul pennello invece vi sono diverse cose da dire, ad esempio la possibilità di modificare oltre al suo colore e alle sue dimensioni anche la sua forma, la sua attenuazione e la sua modalità di disegno (es. sopra, sotto un oggetto…).
Lo strumento penna (P)
Lo strumento penna è molto utile per la realizzazione di linee curve e di tracciati, vi basterà cliccare su un punto di partenza, dare una direzione e cliccare nuovamente in un nuovo punto, orientando la curva.
La gomma (E)
La gomma come il pennello ha la possibilità di essere modificata per dimensioni forma e modalità di azione (es. sopra, sotto un oggetto… e la modalità rubinetto).
Una scorciatoia per cancellare completamente quello che si trova sullo stage è cliccare due volte “sull’iconcina” della gomma, mentre con il rubinetto potrai cancellare determinate selezioni.
Il secchio di vernice (K)
Il secchio di vernice consente di cambiare colore all’interno di una figura. L’unica cosa di rilievo che possiamo segnalare è che c’è la possibilità di modificare l’opzione di riempimento. es. nel caso una figura non sia chiusa bene con l’opzione “riempi spazi grandi e vuoti” il riempimento si avrebbe ugualmente.
La bottiglia di inchiostro (S)
Sulla bottiglia di inchiostro non ho nulla da segnalarvi, se non il funzionamento che è simile a quello del secchio di vernice, infatti, bisogna prima selezionare il disegno che si desidera modificare e poi dal pannello colori cambiare il colore riempimento e/o del tratto.
Lo strumento trasformazione riempimento (F)
Lo strumento trasformazione riempimento serve a modificare il senso di riempimento nel caso fosse radiale o lineare, per utilizzarlo vi basterà cliccare sul riempimento per modificare la rotazione e l’ampiezza.
Per avere una dimostrazione pratica di riempimento radiale o lineare (selezionando tra i colori riempimento), vi basta prima realizzare una figura con riempimento tale e poi modificarla come desiderate questo strumento.
Il contagocce (I)
Il contagocce come tutti credo sappiate, serve a selezionare un colore prendendolo da un oggetto già esistente sullo stage cliccandoci su.
La casella di testo (T)
Sulla casella di testo c’è molto da dire, infatti sono molte le proprietà settabili.
Tralasciando il carattere, le dimensioni, il colore e l’allineamento, a cui ormai credo siate abituati a usarle, vi è un parametro diverso che è il testo alias, che “praticamente” serve rendere il testo di piccole dimensioni più nitido e visibile.
Vi consiglio, a tal proposito, di settare questo parametro solo quando usate caratteri piccoli o le pixel font.
In basso invece ci sono altre proprietà che danno la possibilità di inserire link, scrivere in html e rendere il testo selezionabile.
I più attenti adesso si chiederanno ma allora il parametro del testo: statico, dinamico e imput a cosa serve???
Serve appunto quando si realizzano contenuti dinamici: variabili (testo dinamico) o form (testo imput).
Lo strumento freccia (V)
Questo è uno degli strumenti più importanti in quanto permette di modificare, cancellare e selezionare quello che si realizza.
Per selezionare
con questo strumento solo un riempimento di un oggetto poligono basterà cliccarci su, idem per il tratto, mentre per selezionare tutto un oggetto basterà fare un doppio click sul riempimento e lo stesso vale per il tratto matita.
Una volta selezionato, lo potrai: cancellare, spostare, cambiarne le proprietà…
Per curvare una linea
basterà invece posizionarle il cursore vicino e attendere che compaia una piccola curva vicino il puntatore per poi cliccare e indirizzarne la curvatura.
Per prolungare una linea
basterà posizionarlo vicino ad una estremità e attendere che vicino al puntatore esca un piccolo angolo retto per poi cliccare.
Queste considerazioni, ovviamente, valgono anche per le figure come i poligoni e gli ovali.
C’è ancora da dire che selezionando una retta, un poligono o un ovale è possibile modificarne le dimensioni dal pannello delle proprietà e scegliere se mantenerne le proporzioni. (vedi immagine)
Lo strumento sottoseleziona (A) – Il lazo (L)
Lo strumento sottoseleziona serve a selezionare interi oggetti o a modificarne le linee vettorialmente, mentre il lazo a selezionare solo alcune parti di oggetti.
Lo strumento trasformazione libera (Q)
Lo strumento trasformazione libera, una volta che tu hai selezionato un oggetto, ti permette di ingrandirlo secondo le proporzioni, distorcerlo, inclinarlo e modificarne la forma.
Abbiamo terminato la prima parte di questa guida che dovrebbe essere abbastanza chiara per tutti… spero…
Adesso l’unico consiglio che vi do è cercare di memorizzare un po’ tutte le proprietà degli oggetti, e di esercitarvi seguendo anche questa breve guida su alcune nozioni della grafica Flash.
Esercizi di allenamento
La linea temporale
Il pannello della linea temporale serve a organizzare le animazioni. Infatti essa è divisa in scene che sono suddivise a loro volta in fotogrammi, che si possono trovare su livelli diversi (sembra complicato ma non lo è).
Prima di entrare nel dettaglio, spieghiamo più sommariamente cosa sono i fotogrammi le scene e i livelli.
I fotogrammi costituiscono ognuno la più piccola parte di un filmato, infatti li potete pensare un po’ come i vari fogli che servono alla realizzazione dei cartoni animati.
I livelli danno la possibilità di dividere diversi oggetti senza che si sovrappongano, un esempio pratico potrebbe essere l’animazione di due auto che vanno in direzioni opposte, dovranno essere posizionate su livelli diversi e orientate nel senso giusto.
I livelli li potete pensare come tanti fogli di carta lucida sovrapposti ognuno con un disegno diverso, così da formare un ambiente.
Le scene invece sono l’insiemi di diversi fotogrammi e sono proprio come le diverse scene di un cartone.
I fotogrammi
I fotogrammi possono essere aggiunti cliccando sulla linea temporale dove si desidera ottenere il fotogramma con il tasto destro e fare inserisci fotogramma (“”,”chiave” o “vuoto”).
Aggiungendo un fotogramma semplice si ha solamente un prolungamento del fotogramma che lo precede e ciò fa si che non si possono apportare modifiche all’animazione.
Aggiungendo un fotogramma chiave invece è un cambiamento della linea temporale, che da’ la possibilità di modellare facilmente il filmato.
Aggiungendo un fotogramma vuoto si ottiene come dal nome un fotogramma senza contenuti grafici al suo interno.
I livelli
I livelli danno la possibilità di far svolgere su uno stesso filmato più animazioni contemporaneamente e per aggiungere un livello vi basterà cliccare sulla piccola icona presente in basso a sinistra della linea temporale che raffigura un piccolo foglio.
I livelli devono però essere gestiti in modo corretto, infatti, quando ci sono più livelli c’è il rischio che ci si confonda, quindi è necessario rinominare ogni livello a seconda del contenuto.
Ogni volta che si crea un livello e si ci disegna all’interno è necessario che tutti gli altri vengano bloccati, cliccando sulla piccola icona raffigurante un lucchetto, mentre cliccando su quella raffigurante l’occhio renderai il livello selezionato invisibile.
Inoltre è possibile rendere invisibile determinati oggetti sullo stage inserendoli in livelli maschera, che si possono creare cliccando con il tasto destro su un livello e poi su maschera.
Le scene
Sulle scene non c’è niente d’importante da dire, oltre al fatto che si creano cliccando sul tasto menù inserisci e poi su scena. Di solito vengono utilizzate per spezzare i filmati in più parti senza creare lunghe file di fotogrammi.
Le interpolazioni
Le interpolazioni servono a realizzare animazioni che richiederebbero molto lavoro con delle semplici e veloci procedure.
Infatti basta realizzare un immagine e poi creare un fotogramma chiave dopo una decina di fotogrammi dal primo (più grande sarà la distanza più durerà l’animazione) e infine selezionare l’intervallo tra i due fotogrammi, andare a modificare il pannello delle proprietà aggiungendo un interpolazione.
Adesso c’è da fare una distinzione, se nel primo fotogramma chiave abbiamo un quadrato e nell’ultimo fotogramma lo abbiamo spostato dovremo selezionare un’interpolazione movimento, altrimenti se al posto del quadrato avete cambiato forma dovrete creare un’interpolazione forma.
Ovviamente una volta realizzata l’interpolazione vi sarà semplice settare glia altri parametri come la rotazione o l’inserimento di un file audio durante il movimento.
mypixel.altervista.org/guida/movimento.swf
Finalmente abbiamo concluso anche questa parte della guida e dovreste essere già in grado di realizzare delle piccole animazioni.
Le altre finestre
Altre finestre e pannelli sono solitamente visibili sulla destra del programma ma per selezionarne altre e scegliere quali sono le più necessarie vi basterà andare sul tasto menù finestra.
Ovviamente in questa guida non posso spiegare l’uso di ogni finestra anche perché alcune di esse sono per utenti avanzati quindi per adesso vi basterà avere sotto mano le finestre: allinea, mixer colori, cronologia e libreria.
La finestra allinea
Attraverso questa finestra è possibile gestire facilmente gli oggetti sullo stage, infatti come potete vedere li potete allineare e deformare secondo le dimensioni del filmato.
Il mixer colori
Attraverso il mixer colori invece potrete realizzare facilmente combinazioni di colori lineari e radiali e selezionare in modo semplice e veloce i colori per il riempimento e il tratto.
La cronologia
Attraverso la finestra della cronologia potrete gestire facilmente le vostre azioni, in modo da annullare le azioni sbagliate o ripetere cose cancellate in precedenza.
La libreria
La libreria è una delle parti più importanti del programma che contiene tutti i simboli realizzati e tutti i file esterni importati.
Per inserire un file esterno all’interno della libreria come un’immagine o un suono, vi basterà andare sul tasto menù file e poi cliccare su importa, importa nella libreria.
I simboli
I simboli si possono creare da zero, cliccando sull’icona in basso della libreria, raffigurante un piccolo foglio, o selezionando grafici già sullo stage e poi cliccandoci su con il tasto destro, andando su converti in simbolo.
I simboli che si possono creare sono i pulsanti, i grafici e le animazioni.
La creazione di un pulsante in flash è estremamente semplice, infatti, vi basterà inserire dei fotogrammi chiavi nelle istanze su, sopra, giù e premuto; per ottenerne uno.
I grafici sono immagini statiche e su di essi non c’è altro da dire.
Le animazioni sono dei veri sottofilmati che si svolgono nel filmato principale.
Salvare e pubblicare il file
Adesso credo che siate in grado di realizzare facilmente un’animazione o un contenuto grafico con flash e per salvarlo sarà molto semplice, infatti, bisogna andare sul tasto menù file e salvare il vostro documento con il nome.
Una volta salvato il file avrete un file estensione .fla che contiene solo i dati per creare l’animazione e non il filmato, infatti dovrete pubblicarlo, cliccando su pubblica dal tasto menù file, così da ottenere un file con estensione .swf e .html.
Il file swf è il vero e proprio filmato flash e l’html serve soprattutto per chi realizza i siti, mentre il .fla vi potrà servire per modificare l’animazione.
Finalmente abbiamo concluso e di sicuro con l'aiuto del forum e di qualche tutorial e guida in rete, in breve tempo diventerete dei guru di Flash.
pepsav89
Per qualsiasi domanda o chiarimento postate qui sotto grazie.
Palo ecotela... cui coreta sperò...
![[SM=x53915]](http://www.aessenet.org/forum/emoticon/05.gif)
daci comuncue ociata
![[SM=x53912]](http://www.aessenet.org/forum/emoticon/02.gif)
Modificato da pepsav89 12/04/2005 2.27
Modificato da pepsav89 12/04/2005 2.30