Practica 16

Comenceu obrint un arxiu nou de 300×300 píxels i fons blanc. A continuació obriu Editar | Insertar | Nuevo símbolo i a Propiedades de símbolo trieu-hi el tipus Gráfico.

m3_p5_1.gif

Fixeu-vos que després de fer aquesta operació apareix un nou quadre de treball, que és on heu d’escriure el text 2004 amb la font Arial 100, negreta i color #FFCC00.

m3_p5_2.gif

Tot seguit podeu tancar l’editor de símbols amb el botó situat al marge superior dret. En aquest moments veureu com apareix una còpia del text, situada a la finestra del document, amb un indicador especial en forma de fletxa corbada al marge inferior esquerre.

Aquesta és la manera que té el programa d’indicar que aquest text s’ha convertit en un símbol. Cal aclarir que cada vegada que en un document s’hi col·loca un símbol, rep el nom d’instància de símbol. Si obriu Ventana | Biblioteca, podeu comprovar com el símbol que heu creat ha passat ara a formar-ne part.

Per crear l’animació cal tenir dues instàncies a l’escenari, la d’inici i la final. Definim l’escenari com l’àrea o superfície editable de l’arxiu. Al llarg dels mòduls 7 i 8 es tracten amb més detall el funcionament i les possibilitats de treball dels símbols.

Podria dir-se que la primera instància ja la teniu, és la que hi ha a la finestra del document. Fixeu-vos que fins i tot podeu moure la seva posició. La segona instància es crea si arrossegueu des de la imatge que apareix amb el text 2004 i que hi ha a la Biblioteca. Arrossegueu aquesta imatge sobre la finestra del document. Aquesta segona imatge és el que es correspon amb una altra instància d’aquest símbol.

15_001.gif

Quan arrossegueu aquesta instància sobre la finestra del document, apareix un quadrat blau que es transforma tot seguit en una còpia de la primera instància. És a partir d’aquest moment que podeu modificar l’aparença inicial i final del text. En aquesta pràctica no heu de modificar la instància inicial però sí que heu de canviar l’opacitat final, amb l’ajut de l’Inspector de propiedades a fi de deixar-la en un valor igual a 20.

15_002.gif

Fixeu-vos en la posició relativa de les instàncies que teniu damunt l’escenari. Seleccioneu-les ambdues i alineeu-les verticalment, tal i com ja heu fet en exercicis anteriors. Tot seguit podeu aplicar-hi l’animació. Per fer-la efectiva cal que seleccioneu les dues instàncies i després aneu a l’opció de menú Modificar | Símbolo | Entre instancias.

15_003.gif

Us apareixerà ara el quadre de diàleg propi de l’opció Entre instancias. Indiqueu-hi el número de fotogrames que voleu, en aquest cas poseu 40, i seguidament activeu l’opció Distribuir en fotogramas. Accepteu aquest quadre de diàleg.

15_004.gif

A partir d’aquest moment teniu la primera animació de text. Ho podeu comprovar utilitzant el botó de reproducció.

15_005.gif

Seguiu animant un altre text repetint les operacions que us acabem d’explicar. Cal inserir el nom símbol al començament de l’animació, al Fotograma 1. Per això, feu visible Ventana | Fotogramas i feu clic a Fotograma 1. Obriu Editar | Insertar | Nuevo símbolo i, a Propiedades de símbolo, trieu l’opció Gráfico. Després escriviu la lluna amb la font Arial 50, color #9900FF i lletra cursiva.

15_006.gif

Tanqueu l’editor de símbols i des de la Biblioteca arrossegueu aquest nou símbol fins a la finestra del document. Recordeu que en aquests moments s’ha convertit en una segona instància.

15_007.gif

Per tal de fer una animació en sentit horitzontal, disposeu-les de manera que quedin, respectivament, una al costat esquerre i l’altra al costat dret de la finestra del document.

15_008.gif

Amb les dues instàncies seleccionades, obriu Modificar | Símbolo | Entre instancias i apliqueu, com abans, l’opció Entre instancias. Indiqueu el número de fotogrames que voleu, poseu també un valor de 40 i seguidament activeu l’opció Distribuir en fotogramas i Aceptar.

Tot i que per a molts de vosaltres pot resultar evident, cal observar que, si poseu un nombre inferior de fotogrames, la imatge animada anirà més ràpida i, si poseu un valor més gran, anirà més a poc a poc.

Comproveu que l’animació es correcta.

Repetiu els passos per produir una animació del text BCN. Feu servir la font Arial 100, cursiva, negreta i color #9900FF. Aquesta vegada intenteu que l’animació del text vagi de baix cap a dalt. Estem segurs que en aquestes alçades ja sabeu com fer-ho, només cal seguir el mateix procés que heu après, però aquesta vegada amb la precaució de situar la instància inicial a la part inferior de la finestra del document i la instància final a la part superior. Assegureu-vos que treballeu al Fotograma 1.



m3_p5_12.gif

Per acabar de practicar l’animació, i si us sembla bé, podeu incorporar dos nous quadrats que tinguin dos moviments diferents, un en sentit horitzontal i l’altre en sentit vertical.

m3_p5_13.gif

Com podeu veure, les animacions són essencialment trucs que permeten reclamar l’atenció de l’espectador. Les imatges es col·loquen en quadres separats anomenats fotogrames que després es reprodueixen en una successió ràpida. Crear animacions amb l’ordinador significa dissenyar aquests fotogrames per separat bé sigui treballant-los i disposant-los manualment, bé amb eines que facilitin la seva interpolació de manera que el resultat final suggereixi la il·lusió de moviment.

Quan tingueu acabada la pràctica deseu-la, com a lluna5.png

A mode d’apunt cal saber que les animacions fetes amb el Fireworks MX es poden desar com a GIF animats si obriu Archivo | Presentación preliminar de la exportación i seleccioneu un format GIF Animado

m3_p5_14.gif

Mitjançant la icona d’Exportación rápida que trobareu al marge superior dret del document, també és possible exportar les vostres animacions a altres formats, entre els quals cal destacar el SWF (ShockWaveFlash).

m3_p5_15.gif

Deixa un comentari

L'adreça electrònica no es publicarà Els camps necessaris estan marcats amb *