Cum sa realizezi o animatie bazata pe modificare de culoare (Tint) si dimensiune in Flash CS4

Acest tutorial descrie cum sa realizezi o animatie Flash simpla utilizand Adobe Flash CS4. In acest exemplu se va realiza o animatie ce utilizeaza efecte Flash de tip Classic Motion Tween pentru a modifica culoarea (efect de tip Tint) si dimensiunea unui obiect de pe ecran. Ceva de genul acesta:

[kml_flashembed publishmethod=”static” fversion=”9.0.0″ useexpressinstall=”true” movie=”http://www.itcsolutions.eu/wp-content/uploads/2010/01/StarAnimation.swf” width=”300″ height=”150″ targetclass=”flashmovie”]

Get Adobe Flash player

[/kml_flashembed]

Pentru a intelege acest exemplu si conceptele de baza din Adobe Flash CS4, folosite pentru a realiza animatia, poate fi citit post-ul Adobe Flash CS3 and CS4 interface, basic commands and concepts
Pentru a realiza animatia bazata pe modificare de culoare si dimensiune in Flash CS4:

1. Se creeaza un nou proiect Flash (Flash File ActionScript 2.0 sau 3.0) alegand File -> New (Ctrl + N) din meniul aplicatiei

2. Se redenumeste layer-ul implicit (Dublu-Click cu mouse-ul pe numele imlicit a layer-ului Layer 1) cu un nou nume, Background

3. Pentru a separa obiectul animat de layer-ul pentru fundal se construieste un nou layer (din meniul aplicatiei Insert ->Timeline -> Layer), numit Animation

4. Pe noul layer, numit Animation, se deseneaza o stea; steaua se deseneaza utilizand PolyStar Tool din Toolbar; inainte de a desena steaua, se selecteaza PolyStar Tool si se stabilesc proprietatile: Style – star; Number of sides – 5; Star point size – 0.50; toate aceste setari sunt realizate din fereastraProperties si Tool Settings a instrumentului PolyStar Tool

Flash CS4 PolyStar Tool Settings
Flash CS4 PolyStar Tool Settings

5. Se creeaza un keyframe (cadru cheie) la frame-ul 30 pe layer-ul Animation (se selecteaza cadrul 30 si se apasa F6; pentru alte posibilitati de a crea cadre cheie – Adobe Flash CS3 and CS4 interface, basic commands and concepts); aceasta actiune va multiplica primul cadru cheie peste urmatoarele 30 de cadre si va crea un nou cadru cheie la sfarsit;

6. Se creeaza un efect de tip Classic Motion Tween pe layer-ul Animation intre cadrele cheie 1 si 30 (daca nu se stie cum se aplica un astfel de efect – Adobe Flash CS3 and CS4 interface, basic commands and concepts)

Flash Motion Tween
Flash Motion Tween

7. Se selecteaza primul keyframe (cadru cheie) de pe layer-ul Animation si folosind Selection Tool se defineste dimensiunea si culoarea initiala a obiectului (steaua) de pe scena:

  • Modificarea dimensiunii se face utilizand Free Transform Tool din Toolbar. Activand acest instrument se poate face o redimensionare vizuala a obiectului. Pentru a pastra proportiile acestuia, se tine apasata tasta Shift in momentul redimensionarii.
  • Modificare de culoare se realizeaza printr-un efect de tip Color Effect. Acest efect poate fi aplicat din fereastra Properties dupa ce steaua a fost selectata in primul cadrul cheie. Se alege un efect de tip Tint pentru care se fac setarile: Tint – 100% (pentru a controla mai usor culoare dorita); Tint color – culoarea dorita.
Flash CS4 Tint Color Effect
Flash CS4 Tint Color Effect

8. Se selecteaza al doilea keyframe (cadru cheie) de pe layer-ul Animation si folosind Selection Tool se defineste dimensiunea si culoarea finala a obiectului (steaua) de pe scena. Modificarile se fac in mod identic cu cele de pe primul cadru cheie.

9. Pentru a genera un efect de stralucire vom face o modificare intermediara de culoare. Intre cadrele cheie 1 si 30 se mai adauga un nou keyframe pe cadrul 30. In acesta se modifica doar culoarea (nu si dimensiunea obiectului pentru a nu strica animatia).

10. Se testeaza animatia utilizand Ctrl+ Enter (pentru Windows)

Pentru a intelege exemplul, puteti viziona si versiunea video a acestui tutorial:

[kml_flashembed publishmethod=”static” fversion=”9.0.0″ movie=”http://www.acs.ase.ro/multimedia/SuportFlash/StarAnimationFlashMovieCS4.swf” width=”550″ height=”420″ targetclass=”flashmovie” play=”true” loop=”true”]Get Adobe Flash player

[/kml_flashembed]