Animáció

Az animáció elve

• Különálló képekből tevődik össze

• Rögzített képekből álló sorozat

• A látás folytonossága miatt nem vesszük észre a filmkockák közötti váltásokat, ha azok elég gyorsan történnek.

Képkockák és kockaszám

• Az egyes képeket kockáknak nevezzük• A Flash képkockái az időszalagon lévő kis

téglalap alakú mezők• Alaphelyzetben egyszerre csak egy kocka

tartalmát tekinthetjük meg• A képkockákba vagy az időszalagra nem

rajzolunk, csak a színpadra• Az időszalag alaphelyzetben egy

képkocka hosszú.

Képkockára ugrás

Megtekintés

• Pásztázás: Vonszolás a képkockaszámok fölött

• Lejátszás: Control > Play (vagy Enter)

• Leállítás: Control > Stop (vagy Enter)

Időszalag

Képkocka sorszáma, Képkockaszám, Aktuális idő

Képkockaszám

• A képkockaváltás sebessége

• Képkocka / másodperc

• A lejátszás sebessége a felhasználó gépétől is függhet.

• Beállítása: Modify > Document

Állítsuk át a képkockaszámot

• Legyen 120

• Láthatjuk, hogy a képkockaszám folyamatosan változik, el akarja érni a beállított sebességet, de nem tudja.

A képkockaszám és a képkockák száma

• Ki kell választani egy képkockaszámot és ragaszkodni kell hozzá

• Az egyes részek felgyorsítását ne a képkockaszám módosításával oldjuk meg, mert az az összes többi rész sebességét meg fogja változtatni

• A mozifilmeken 24 fps• A televízióban 25, illetve 30 fps• A Flashben az alapértelmezett 12 fps

Határok

• 12 fps alatt észrevehető az ugrás

• 36 fps fölött nem minden gép képes a kivitelezésre

• Nagyobb képkockaszám esetén nagyobb lesz a fájlméret ugyanakkora lejátszási idő esetén

Kulcskocka

• Olyan képkocka, amelyben pontosan meghatározzuk, hogy mi történjen az adott pillanatban a színpadon

• Az üres kulcskockában semmi nem történik a színpadon

• Azt kell megadnunk, hogy mikor jelenjen meg a színpadon, és mit tartalmazzon

Átmenetkészítés

• A kulcskockákba azt teszünk, amit akarunk.

• A két kulcskocka közötti rész megtartja a kulcskocka tartalmát

• Az átmenetkészítés kiszámítja, hogy hogyan kell az egyik kulcskockát átvinni a másikba.

A nyers animációs eljárás

• Képkockáról képkockára

• Minden kép egy kicsit eltér a következőtől

Folytatás

• Készítsünk az előbbi módszerrel még 8 új kulcskockát, mindegyiken apró változtatásokkal!

Az animáció előnézete

Frame View

A hártyák használata

• Eredetileg a hagyományos animációknál használták

• Kis változás esetén egy átlátszó lapot helyezünk az eredetire, és ott rajzoljuk meg a változást

hártya kezdete

hártya vége

Ezek mozgathatók

Modify Onion Markers

Modify Onion Markers

• Always Show Markers : A jelzők halványan mindig láthatók az időszalagon, még a hártyák kikapcsolásakor is

• Anchor Onion : Rögzíti a jelzőket• Onion 2 : A jelző két kockával előre, illetve hátra

van állítva• Onion 5 : A jelző öt kockával előre, illetve hátra

van állítva• Onion All : A jelző az animáció elején és végén

van.

Szünetek beépítése

• Egy hagyományos kocka behelyezésével oldható meg

• A kulcskocka határozza meg, hogy mit lehessen látni közben.

• Egy másodperces mozdulatlanság esetén 12 fps-nél elhelyezhetünk 12 hagyományos kockát

Mozgás érzékeltetése

Pislákoló hatás

Tegyük ezt minden páros sorszámú kockával

A páratlan kockák időtartamát pedig növeljük meg.

Mozgásátmenet létrehozása

A mozgásátmenet szabályai

• A kulcskockákban nem lehet több objektum

• Az egyetlen meglévő objektumnak szimbólumnak kell lennie

Megszegtük a mozgásátmenet szabályait

Tulajdonságok átmenete

Alapszabályok

• A mozgásátmenet csak egy objektumot használ, amely egy szimbólum

• Az objektumot mindig alakítsuk szimbólummá

• A kezdő és a befejező kulcskockán beállíthatjuk az objektum tulajdonságait

• Mindig figyeljük az időszalagot, hogy tényleg azt a kulcskockát szerkesszük, amelyiket szerettük volna.

Animáció befejezése kezdőpontban

Erősítés és csillapítás alkalmazása

• Az előbbi animációban végig ugyanakkora sebességgel halad a labda.

• Erősítés: A mozgás lassan kezdődik és egyre gyorsabb

• Csillapítás: A mozgás gyorsan indul, majd egyre lassabb.

Animáció erősítéssel és csillapítással

Forgatás mozgásátmenetekben

Házi feladat

• Rajzoljunk olyan labdát, amely kicsit összenyomódik, amikor a földre ér, és utána visszapattan!

Átváltozás

• Olyan animáció, amely az egyik alakzatot természetes módon átviszi a másokba!

• A mozgással szemben minden jellemző átalakul.

Az alakzatátmenet szabályai

• Nincsenek csoportok

• A szövegeket előbb fel kell bontani: Modify > Break Apart

• Az átmenetkészítés előtt minden csoportot fel kell bontani

• Kevésbé hatékony, mint a mozgásátmenet, lassabban játszódik le, nagyobb a fájlméret

Alakzattippek

• Megadható, hogy egy alakzat egyik pontja hogyan képeződjön le egy másik alakzat egy pontjára.

• Akkor érdemes használni, ha a Flash nem olyan átmenetet készít, mint amire számítunk.

!!!• Játsszuk le!

• Az eredmény nem pont az, amire számítottunk!

Az első kulcskockán

Az első kulcskockán

Szabályok

• Nem adhatunk hozzá alakzattippeket, ha nem vagyunk egy olyan szakasz első kulcskockáján, amely már rendelkezik egy alakzatátmenettel

• A View > Show Shape Hints menüponttal megoldható, hogy ne lássuk az alakzattippeket

• Az alakzattippek csak akkor érvényesek, ha leképeződtek

• Az alakzattipp eltávolítása: Jobb gomb > Remove Hint

• Az alakzattippek csak két kulcskocka között alkalmazhatók.

Időszalaghatások használata

Az elmosás hatás alkalmazása

Időszalaghatások módosítása és szerkesztése

• Újraszerkesztéssel megváltoztathatjuk a hatás jellegét, vagy viselkedését

• Megváltoztathatjuk az animált objektum tartalmát

• Lebonthatjuk az animációt az összetevőkig, így az összes tulajdonsága szerkeszthetővé válik.

Ezt ismételjük minden rétegre

• Esetleg más más színeket állíthatunk be.

• Mindig csak egy réteg legyen látható.

Parancsok

• Egyszerű szövegfájlok, amelyek JSFL kódot tartalmaznak

• Parancsok a JSFL megtanulása nélkül is létrehozhatók

• Mások által fejlesztett parancsok is letölthetők Commands > Get More Commands

Parancs mentése

• A következő lépéssort szeretnénk rögzíteni:– Rajzolunk egy téglalapot, amelynek a

kitöltését eltávolítjuk– A téglalap belsejébe beírunk egy szöveget– Finomítjuk a kinézetet

Jelöljünk ki mindent!

Megjegyzés

• Vannak műveletek, amelyek parancsban nem menthetők

• Ezeket a History ablak piros x jellel jelöli.

Dinamikus parancs készítése

• Egy olyan parancsot szeretnénk készíteni, amely 20 képponttal jobbra helyezi az objektum másolatát!

Az alakzatot jelöljük ki, majd

ALT+SHIFT+VONSZOLÁS

Parancs a színpadon kívüli terület letakarásához

Jó nagy téglalapot rajzoljunk!

Hangok betöltése

• Nincs beépített lehetőség hangok felvételére, vagy létrehozására

• Külső fájlból tölthetünk be hangokat

• A hang betöltése részben hasonló a bitképek betöltéséhez

Támogatott hangformátumok

• MP3

• WAV

• AIF

• AU

Az MP3 előnye

• Az egyetlen forrás egy MP3 fájl

• Már optimálisan tömörített

Összehangolási beállítások (sync)

• Event : Akkor szólal meg, ha elérjük a kulcskockát, és addig szól, amíg a kulcskocka véget nem ér. (Több szólamú is lehet)

• Start : Ugyanannak a hangnak csak egy példánya lehet

• Stop : A háttérzenét leállítja• Stream : A képváltás és a hang tökéletes

összhangját biztosítja. (Lassabb gépeken kihagy képkockákat)

Hatásbeállítások (Effect)

• Fade In : Fokozatos erősítés

• Fade Out : Fokozatos halkítás

• Fade from Left to Right : Fokozás balról jobbra

• Fade from Right to Left : Fokozás jobbról balra

Edit (Szerkesztés)

Közzétételi beállítások

Egyedi kiviteli beállítások

Rétegek

• Párhuzamos időszalagok

• Más rétegek alatt, vagy fölött tárolódnak

• Külön-külön lehet rajtuk vezérelni az animációkat

Két kör animációja

A réteget átnevezhetjük a réteg nevére való dupla kattintással is

Réteg neve

Rétegek megjelenítése, elrejtése

Rétegek lezárása, lezárás megszüntetése Rétegek megjelenítése

körvonalként

Rétegtípusok

Rétegtípusok

• Normal: Egyszerű lap, alapértelmezett

• Guide: Segédalakzatokat, üzeneteket helyezünk el benne, a végső swf-ben nem jelenik meg a tartalma

• Motion Guide: Szintén vezetőréteg, de a mozgás görbéjét tartalmazza

• Mask: Meghatározza az alatta lévő réteg látható és láthatatlan részeit.

Rétegtípusok

• Masked: Azok a részei láthatóak, amit a maszkréteg láttatni enged

• Folder: Más rétegek ágyazhatók bele.

Tiltott területek meghatározása vezetőréteg segítségével

Pattogó labda animációja mozgásvezető réteggel

Gyorsabb megoldás

Fényszóróhatás készítése a maszkolás segítségével

A Halvány rétegen

A maszkok és vezetők korlátai

• A maszkrétegen nem lehet egynél több szimbólum

• A maszkrétegeket és a vezetőrétegeket nem lehet ötvözni

Feladat

• Készítsünk olyan animációt, ahol felhők haladnak el egy ablak előtt!

Feladat

• Készítsünk animációt, ahol egy bolygó ellipszis pályán kering a Nap körül!

Forgó kerék készítése filmklip alkalmazásával

Fényszóróhatás készítése a maszkolás segítségével

A ForgoKerek szimbólumon belül

Ellenőrzés

• Menjünk vissza a jelenethez! (Scene1)

• Ellenőrizzük a forgást!

Feladatok

• Készítsük el egy pöfékelő gőzmozdony animációját!

• Készítsük el egy óriáskerék animációját!

VÉGE