Tuesday, 15 February 2011 19:30

Osnove flash animacije

Written by  Administrator
Rate this item
(0 votes)

osnove flash animacija, stranica, reklama

 

Kako kreirati jednostavnu Flash animaciju koristeći Shape, Motion, Guided Tweening i Frame by Frame Animaciju
 

Dok radite u Flashu uvjerit ćete se da kreiranje jednostavnih animacijskih sekvenci neophodno. U ovom tutorijalu naučićete da kreirate jednostavne animacije u flashu.


Flash animacije mogu biti izrađene na četiri osnovna načina:

•    Motion Tvin
•    Shape Tvin
•    Frejm-by-Frejm Animacija
•    Guided Motion Tvin

Veoma je jednostavno i objašnjeno u nastavku, kako slijedi
 

A. Kreiranje Motion Tvin-a u Flash-u


1.    Nacrtajte vektor koristeći bilo koju od crtaćih alatki u flashu, iscrtajte mali krug, konvertujte ga u simbol (F8) selektirajući grafičke opcije i imenujte ga kao “lopta”
2.    Kliknite na 20ti  frejm u Timeline-u (vremenskoj skali) i insertujte frejm (F5).
3.    Potom kliknite 20ti frejm u Timeline-u (vremenskoj skali) i selektujte Create Motion Tvin (ili Motion opcije iz Tvin panela- Properties inspector) i  insertujte Key Frame (F6).
4.    Selektujte 10ti frejm, insertujte Key frame (F6) i pomjerajte loptu u različite pozicije, iznad trenutne pozicije, da biste kreirali motion sekvence.
5.    Sačuvajte vaš rad i testirajte film (Ctrl + Enter). I to je to! Kreirali ste jednostavnu animaciju koristeći Motion Tvin.

flash animacija

Fig:  Vremenska skala Motion Tvin-a

 


B. Kreiranje Shape Tvin-a u Flashu


1.    Možete kreirati Shape Tvin animacije koristeći Shape opcije iz  Tvin panela-Properties inspector. Nacrtajte vector koristeći bilo koju od crtaćih alatki u Flashu, iscrtajte mali krug i uklonite njegove rubove ili okvir.
2.    Kliknite na 10ti frejm u Timeline ili vremenskoj skali i insertujte Key Frame (F6). Potom nacrtajte još jedan oblik kao diamond koristeći rectangle tool ( pravokutnik) bez okvira.
3.    Zatim kliknite desnim klikom na bilo koji frejm između dva Key Frejma i selektirajte  Shape opcije iz Tvin panela- Properties inspector.
4.    Sačuvajte vaš rad i testirajte film (Ctrl + Enter). Na ovaj način ste naučili kreirati shape tvin u flashu.
shape tvin flash

Fig: Vremenska skala (timeline)  Tvin-a


Napomena: Samo vektori mogu biti Shape Tvin (Ne za simbole). Oba Tvina imaju različite boje duž vremenske skale kako je prikazano na slici iznad. Provjerite da je linija ravna bez presjecanja da biste osigurali pravilan Tvining.

Error twin u adobe flashu

Fig: Vremenska skala prekinutog Tvin-a

 

 

C. Frejm-by-Frejm Animacija

1.    Kreirajte vektor/plain tekst, koristeći bilo koju od crtaćih alatki u flashu, tj. recimo tekst "Animation" otkucano kako je prikazano na primjeru i prelomite ga koristeći Break Apart (Ctrl + B) da bi odvojili slova kako je prikazano u slijedećem primjeru:
flash sajt i animacija

Fig: prikaz teksta poslije korištenja opcije - Break Apart


2.    U Frejm-by-Frejm animaciji kreiramo objekte za svaki frejm kako bi proizveli animacijsku sekvencu.
3.    Insertujte Keyframe (F6) i pomjerajte slova kako bi proizveli  animacijsku sekvencu.
4.    Ponovite prethodno pomenuti korak koliko želite da biste kreirali Frejm-by-Frejm animaciju, kako je prikazano u primjeru.
5.    Sačuvajte vaš rad i testirajte film (Ctrl + Enter). Na ovaj način ste kreirali animaciju koristeći Frejm-by-Frejm animaciju.

timeline frejm animacija

 

D. Kreiranje Guided Motion Tvin-a u Flashu



1.    Kreirajte vektor/obični tekst, koristeći bilo koju od crtaćih alatki u flashu, tj. kao npr. 'Flash' otipkan i prelomljen koristeći opciju Break Apart (Ctrl + B) kao što je urađeno na prethodnom primjeru i stavite svako slovo u različit sloj (Layer), imenujući svaki sloj kako je prikazano na slici ispod.
2.    Insertujte  guide layer desnim klikom miša na najviši layer i selektujte 'Add Guide Layer' (Insert-->Timeline-->Motion Guide), iscrtajte bilo kakvu liniju koristeći olovku u  guide layer-u kako je prikazano na primjeru.
3.    Potom kreirajte Motion tvin tako što ćete selektirati objekt u prvom frejmu i povezati njegovu registracijsku tačku za jedan kraj linije.
4.    Povežite object u zadnji frejm za drugi kraj linije u guide layer-u.
5.    Ponovite  isto za sve objekte tj.slova, povezujući njihove registracijske tačke sa linijom u guide layer-u.
6.    Sačuvajte vaš rad i testirajte film (Ctrl + Enter). Na ovaj način ste naučili kako kreirati Motion duž guided path-a.


guided tween tvin

 

 

Last modified on Wednesday, 16 February 2011 07:15