Mozgó animáció. Mozgás létrehozásának módjai Flashben. Funkciók dinamikus animációja alkalmazásokban

A rendelkezésre álló időtől, a film cselekményétől és saját művészi képességeitől függően kétféle mód közül választhat a film szereplőinek „újraélesztésére”:

  • kockánkénti animáció, amikor minden következő képkockát saját kezűleg hoz létre (vagy importál külső forrásból);
  • automatikus animáció (tweened animáció), amikor csak kulcskockákat és minden közbenső képkockát készít Vakuönállóan alkot.

Meg kell jegyezni, hogy a két mechanizmus együtt is használható, nem csak egy filmen belül, hanem egy tárgy vonatkozásában is. Például a cselekmény szempontjából bonyolultabb töredékek kockánkénti animáción alapulhatnak, míg a „kijósolható” cselekményfejlődésű töredékek automatikus animációval nyerhetők.

Egy ilyen kombináció azért lehetséges, mert minden objektumhoz egyetlen időtengelyt használnak, amelyet a szerkesztőablakban egy idődiagram - Time Line - ábrázol. Több objektum „életvonalának” egy idődiagramon való kombinálásával olyan jelenetet kaphatunk, amelyben több „karakter” vesz részt.

Az automatikus animáció használatának sajátossága, hogy egy adott rétegen csak egy objektumot lehet animálni vele. Egy olyan jelenet létrehozásához, amelyben állítólag több animált objektum van, mindegyiket külön rétegre kell helyeznie (a rétegek használatával kapcsolatos további információkért lásd a következő fejezetet - „Rétegek”).

Függetlenül attól, hogy milyen mechanizmust használnak az egyes képkockák létrehozására, az animáció lényege, hogy tükrözze egy objektum időbeli változását.

Létrehozhat egy filmet, amelyben ugyanaz a labda egy órán keresztül mozdulatlanul fekszik az asztalon. Ebben az esetben a film összes kockája jobban hasonlít majd egymásra, mint az egypetéjű ikrek, és a néző nem fogja tudni megkülönböztetni az Ön „rajzfilmjét” a statikus képtől. Másrészt készíthet több csodálatos felvételt és... lejátszhatja őket ugyanabban az időben. Az eredmény ugyanaz lesz – a néző nem láthatja, mi történik a színpadon. Így az animáció alapelve, hogy az idő minden pillanatának megvan a maga kerete.

Ennek megfelelően az egyszerű animációs film létrehozásának eljárása Vaku az, hogy olyan képeket készítsünk egy tárgyról, amelyek tükrözik annak változását, és azokat az időtengely mentén rendezzük el.

Bármely Vaku-filmszöveg hozzáadható. Hasonló a rendszeres munkavégzéshez szövegszerkesztők, a szöveg mérete, betűtípus, stílus, térköz, szín és igazítás állítható be. A betűtípusokat más objektumokhoz hasonlóan átalakíthatja – forgathatja, méretezheti, döntheti. Ugyanakkor továbbra is lehetséges a szimbólumok szerkesztése.

Szövegrészlet alapján hiperhivatkozás hozható létre.

Vaku- a film tartalmazhat dinamikus szövegmezőket, valamint felhasználó által szerkeszthető mezőket. A szerkeszthető mezők egy Flash filmben ugyanazt a célt szolgálják, mint a weblapon lévő űrlapon elhelyezett szövegmezők: segítségükkel a felhasználótól egy-egy információ nyerhető ki a szerveren vagy egy kliens szkripttel feldolgozandó. Végül a Flash MX-ben görgethető többsoros szövegterületeket hozhat létre.

Szükség esetén a szöveg grafikus objektummá alakítható, majd a szimbólumaival különálló grafikai alakzatokként dolgozhatunk.

Stop motion animáció

Tehát a stop-motion animáció elkészítéséhez előre kell készíteni (vagy legalábbis át kell gondolni) a film minden képkockáját. Ebben az esetben a következő körülményt kell figyelembe venni. Az egyik képkockáról a másikra való átmenet zökkenőmentessége, és ennek megfelelően a karakterek mozgásának simasága és természetessége attól függ, hogy a következő képkocka mennyire különbözik az előzőtől (és nem a képkockaváltások sebességétől, ahogyan azt néha hiszik) . Más szóval, minél több képkockát tartalmaz egy rajzfilm, annál közelebb állnak a karakterek mozgása a természeteshez. Ezért a képkockánkénti animáció létrehozása nagyon fáradságos feladat. Olyan esetekben célszerű használni, amikor az objektumok valamilyen komplex módon változnak vagy kölcsönhatásba lépnek egymással.

Ezenkívül stop-motion animációt használnak Vaku interaktív filmelemek, például gombok viselkedésének leírásakor. Minden gombállapot egy adott kulcskeretnek felel meg az idődiagramon. A fő különbség a gomb viselkedésének leírása és a „szokásos” animáció között az, hogy a gomb állapota nem az időtől, hanem a felhasználói műveletektől függ. A vezérlőelemek filmbe való beillesztésének kérdéseit az „Interaktív filmek készítése” című fejezet tárgyalja részletesebben.

Kulcskép-sorozat létrehozása

A létrehozás fő eszköze stop motion animáció az időzítési diagram panel. Segítségével animációs képkockákat hozhat létre, törölhet és mozgathat, az egyes képkockák és a teljes jelenet megtekintési módját módosíthatja, valamint egyéb műveleteket hajthat végre.

Az időzítési diagram felület elemeit a harmadik fejezet „Felhasználói felület szervezése” fejezete tárgyalja (lásd 3.7. ábra). Itt az ideje, hogy beszéljünk arról, hogy ezek az elemek milyen szerepet töltenek be a „rajzfilm” létrehozásakor.

Megjegyzés

Ebben a fejezetben minden figyelmünk csak az idődiagram jobb oldalára összpontosul, mivel a rétegek használatának külön fejezetet szentelünk. Ennek megfelelően az összes itt vizsgált példában csak egy réteget használunk, amelynek paraméterei alapértelmezés szerint be vannak állítva, és mi nem változtatjuk meg azokat.

Tehát, emlékezve az idődiagramra, azt mondhatjuk, hogy a képkockánkénti animációval létrehozott rajzfilm kulcskockák sorozata, amelyek mindegyike egy-egy képhez (képhez) kapcsolódik az asztalon.

Rajzfilm lejátszásakor az animációs hatás annak köszönhető, hogy az asztalon lévő képek felcserélik egymást. Minden kockánkénti rajzfilmet két fő paraméter jellemez:

  • kulcskockák száma (Keyframe);
  • képkockasebesség (in Vaku az egy másodpercben megjelenített képkockák számát jelenti – képkocka másodpercenként, fps).

Általánosságban elmondható, hogy mindkét paraméter befolyásolja a létrehozott vizuális hatást (a mozdulatok simaságát vagy fordítva, diszkrétségét, „transzformációkat” stb.). De mégis, itt a vezető szerep az első paraméteré, valamint ahhoz, hogy a következő kulcskeret mennyiben tér el az előzőtől.

Az időzítési diagramon a kulcskeretek szürke téglalapként jelennek meg, belül fekete ponttal. Film lejátszásakor az olvasófej egyik képkockáról a másikra mozog, megjelölve az aktuális képkockát. Egy adott képkockához társított kép megtekintéséhez kattintson a keret ikonjára az idővonalon. ábrán. A 6.1. ábrán példaként látható egy „óráról” szóló kis rajzfilm két kulcskockája (az első és az utolsó), amelyekben az egyik képkocka a percmutató pozíciójában különbözik a másiktól. A rajzfilm összesen 6 képkockát tartalmaz, a képkocka sebessége 2.

Rizs. 6.1. Két képkocka az „Órákról” című rajzfilmből

Később még visszatérünk az órával kapcsolatos példára, de a képkockánkénti animáció elkészítésének leírásához egy másik példát fogunk használni. Tegyük fel, hogy a film "hőse" egy golyó, amely leesik és három részre törik. Feltételezzük, hogy öt képkocka elegendő egy ilyen összetett cselekmény feltárásához:

  1. A labda az eredeti helyén van.
  2. A labda leesett, de még mindig sértetlen.
  3. Az első darab leszakadt a labdáról.
  4. A második darab leszakadt a labdáról.
  5. Az asztalon van valami, ami egy előző életben egy labda volt.

Figyelembe véve a leírt cselekményt, a munka sorrendjének a következőnek kell lennie:

  1. Hozzon létre négy képet a táblázaton a fenti képkockáknak megfelelően, ahogy az ábra mutatja. 6.2 (az első és a második kerethez ugyanazt a - egész - labdát használjuk).

Rizs. 6.2. A jövő film képkockáinak megfelelő képek

  1. Hozzon létre egy új filmfájlt „tiszta” táblázattal a fő eszköztár Új gombra kattintva Vaku.
  2. Az idővonalon, az első keretcellában kattintson a jobb gombbal, és válassza a Kulcskép beszúrása lehetőséget a helyi menüből.
  3. Abból az ablakból, ahol a labdaképek készültek, másolja ki az első képet, és helyezze el valahova az asztal tetejére; ebben az esetben az idődiagramon az első képkocka kulcskeretként (fekete pontként) lesz megjelölve. 6.3.

Rizs. 6.3. A Flash ablak nézete az első képkocka létrehozása után

  1. Kattintson a jobb gombbal a második képkocka cellájára, és válassza a helyi menü Kulcskocka beszúrása parancsát; ebben az esetben a keret azonnal kulcskeretként lesz megjelölve, mivel az előző képkocka képe öröklődik számára; használja: mozgassa a golyós képet az asztal aljára.
  2. Kattintson a jobb gombbal a harmadik képkocka cellájára, és a helyi menüben válassza ki ismét az Insert Keyframe parancsot; az új keret kulcskeretként is meg lesz jelölve, és az előző kép mentésre kerül hozzá; szerkesztheti, vagy egyszerűen lecserélheti arra, amire szüksége van.
  3. A negyedik és ötödik képkocka létrehozásához válassza ki a Kulcskép beszúrása parancsot a helyi menüből, és helyezze el a megfelelő képet a táblázatban.

Az utolsó lépés befejezése után az ablak Vakuábrán láthatóhoz hasonlóan kell kinéznie. 6.4.

Rizs. 6.4. A Flash ablak az animáció utolsó képkockájának elkészítése után

Valójában itt fejeződik be az első „rajzfilm” elkészítése. Csak ne felejtse el lemezre menteni: később szükségünk lesz rá, amikor más típusú animációkat tanulmányozunk.

A munka elvégzése után célszerű ellenőrizni, hogy minden úgy sikerült-e, ahogy szeretted volna.

Film lejátszásához csak nyomja meg a gombot (egy másik lehetőség a Lejátszás parancs kiválasztása a Vezérlő menüben). Ebben az esetben az időzítő panel olvasófeje automatikusan az aktuális billentyűkockához lép. Az idődiagram megfelelő cellájában bal egérgombbal kattintva bármelyik képkocka kijelölését kikényszerítheti megtekintésre.

Az általunk vizsgált példában a képkockák tartalmát alkotó képek előre, egy másik film asztalára készültek. A legtöbb egyszerű filmnél azonban kényelmesebb közvetlenül az aktuális film asztalán létrehozni egy keretképet. Ehhez szüksége van:

  1. Hozzon létre egy új kulcskockát az idődiagramon.
  2. Módosítsa az asztalon található objektumok tulajdonságait (alak, pozíció stb.).

Animáció szerkesztése

A tesztelés eredményeként kiderülhet, hogy az elkészített „rajzfilm” nem teljesen felel meg a szerző szándékának, és javításra szorul.

Akárcsak egy „rajzfilm” létrehozásakor, szerkesztésekor a legkényelmesebb az idődiagram panellel dolgozni, vagy inkább helyi menük ezt a panelt.

Emlékezzünk vissza, hogy a helyi menü egy adott objektumhoz van társítva, és olyan parancsokat tartalmaz, amelyek az aktuális helyzetben (egy adott környezetben) alkalmazhatók erre az objektumra.

Az idődiagram keret minden típusának saját helyi menüje van. Például van egy helyi menü a kulcskockákhoz, egy helyi menü a „normál” képkockákhoz, és egy helyi menü a tweened animációs képkockákhoz. Ha bekapcsolva kezdeti szakaszaiban Miután elsajátította, nehezen tudja meghatározni a keret típusát, majd használhatja az eszköztippet. Akkor jelenik meg a képernyőn, ha az egeret a keret ikon fölé viszi (6.5. ábra).

Azonban szem előtt kell tartani, hogy minden olyan képkocka, amely nem kapcsolódik a tweened animációhoz, ebben az esetben statikusnak van jelölve, amint az az 1. ábrán látható. 6,5 a jobb oldalon.

Rizs. 6.5. A keret típusát jelző eszköztippek

A Flash a következő lehetőségeket kínálja az animált sorozatok szerkesztéséhez:

  • bármely kulcskeret tartalmának javítása;
  • kulcskeretek hozzáadása; új blokk mindig csak a sorozat utolsó blokkja után kerül beszúrásra; Kétféle kulcskeretet adhat hozzá:
    • örökölt képpel - az Insert Keyframe paranccsal;
    • üres keret (tartalom nélkül) - az Üres kulcskép beszúrása paranccsal;
  • egyszerű (nem kulcs) keretek hozzáadása; bármely kulcskép után új keretet lehet beilleszteni; a legegyszerűbb esetben egy egyszerű keret beillesztése lehetővé teszi az előző kulcskeret „élettartamának meghosszabbítását”; például, ha egy labdával ellátott „rajzfilmben” néhány egyszerű képkockát ad hozzá a második kulcskockához, akkor a leesett labda egy ideig feküdni fog, és csak ezután esik szét; egyszerű keret hozzáadásához kattintson a jobb gombbal arra a kulcskeretre, amely után új keretet szeretne elhelyezni, és válassza a Keret beszúrása parancsot a helyi menüből; az idődiagramon egy egyszerű keret világos téglalapként jelenik meg;
  • kulcsképkocka konvertálása egyszerűvé; a helyi menüben található Keyframe törlése paranccsal végrehajtva; a "törölt" kulcskeret és az összes egyszerű keret a következő kulcskeret előtt lecserélődik a "törölt" kulcskeretet megelőző keret tartalmára;
  • egy vagy több képkocka másolása; a helyi menü Keretek másolása és Keretek beillesztése parancsaival hajtható végre; a beillesztés bármely kulcskeret után elvégezhető;
  • egy vagy több keret mozgatása; a helyi menü Keretek kivágása és Keretek beillesztése parancsaival hajtható végre; a beillesztés bármely kulcskeret után elvégezhető;
  • egy vagy több képkocka törlése; Keret törléséhez kattintson rá jobb gombbal, és válassza a Keretek eltávolítása lehetőséget a helyi menüből;
  • a képkockák sorrendjének megváltoztatása fordítottra (fordítva); A művelet végrehajtásához válasszon ki egy képkockák sorozatát (kulcskerettel kell kezdődnie és végződnie), majd a helyi menüből válassza ki a Keretek visszafordítása parancsot. Próbálja meg például ezzel a művelettel „visszaállítani” a törött labdát a fent tárgyalt példából.

Az egyes keretek tulajdonságait a Keret tulajdonságai ellenőrző panel segítségével is módosíthatja. Bármilyen „statikus” képkockához (vagyis olyan képkockához, amely nem része a tweened animációnak), ez a panel ugyanazt az elemkészletet tartalmazza (6.6. ábra):

  • szövegmező (Frame Label), a keret nevének (vagy címke) megadásához; a bevezetett címkemechanizmus lehetővé teszi a film képkockái közötti navigáció megvalósítását, amelynek köszönhetően a webhely látogatója visszatérhet egyik vagy másik képkockához; maga az átmeneti mechanizmus szkriptként van megvalósítva az ActionScriptben; a szkript létrehozásának technológiáját ActionScriptben a tizenegyedik fejezet tárgyalja;
  • a Tween legördülő lista, amely a tween animáció használatának lehetséges módjait tartalmazza; Három ilyen módszer létezik:
    • Nincs – tweened animáció nem használatos;
    • Motion – mozgó animáció;
    • Alakzat - az objektum transzformáció tweened animációja;
  • a Hang legördülő lista, amely lehetővé teszi egy hangszimbólum kiválasztását és kerethez társítását; ha a film egyetlen képkockájához sem kapcsolódik hang, akkor a lista egyetlen elemet tartalmaz - Nincs; a hanghasználatot a filmben a tizenegyedik fejezet tárgyalja; a hangparaméterek beállításához kapcsolódó összes többi elem csak a hangszimbólum kerethez való hozzárendelése után válik elérhetővé;
  • egy gomb név nélkül, de hosszú magyarázattal - Szerkessze az objektum műveleti szkriptjét (Szerkessze az objektum szkriptjét), amelyre kattintva megjelenik az ActionScript szerkesztő panel.

Rizs. 6.6. Statikus kerettulajdonság-ellenőr

Képkocka megtekintési módok kezelése

Sok esetben kényelmes, ha az animáció összes kulcskockájának tartalmát egyszerre láthatja az asztalon. Vaku számos lehetőséget kínál az ilyen kombinációkhoz. Az opció kiválasztása az idődiagram panel alsó szélén található gombokkal történik (6.7. ábra):

  • Hagymahéj (pauszpapír) - lehetővé teszi több képkocka egyidejű megtekintését; ebben az esetben az aktív keret (amelyre az olvasófej fel van szerelve) teljes színben jelenik meg, a többi pedig halványabb (6.8. ábra a); alapértelmezés szerint három képkocka jelenik meg egyszerre: az aktív és a két szomszédos képkocka; a megjelenített tartományt az idődiagram skálán speciális markerekkel jelöljük (lásd 8.7. ábra); a jelölők interaktívak - az egérrel való mozgatással módosíthatja a tartomány határait; ebben a módban csak az aktív keret áll rendelkezésre szerkesztésre;

Rizs. 6.7. Az animációs képkockák megjelenítésének vezérlésére szolgáló gombok

  • Hagymahéj körvonalai (Körvonalak pauszpapíron) - olyan mód engedélyezése, amelyben az aktív kerettel szomszédos kereteket csak körvonalak ábrázolják (6.8 b. ábra); ebben a módban csak az aktív keret áll rendelkezésre szerkesztésre;
  • Több képkocka szerkesztése – olyan mód engedélyezése, amelyben az összes látható képkocka szerkeszthető; minden képkocka teljes színben jelenik meg (6.8 c. ábra);
  • Hagymajelzők módosítása - a gombra kattintva megnyílik egy menü, amellyel a határjelzők paraméterei módosíthatók (6.9. ábra):
    • Mindig mutasd a jelölőket – A jelölők mindig jelen vannak az idővonalon, függetlenül attól, hogy a nézetvezérlő gombok engedélyezve vannak-e;
    • Anchor Onion Marks – A szegélyjelzők az aktuális pozíciójukban vannak rögzítve; ennek az opciónak a kiválasztása megakadályozza, hogy a jelölők elmozduljanak, amikor az aktív keret megváltozik;
    • Hagyma 2 (2 látható) - két, az aktív melletti keret jelenik meg az asztalon (jobb és bal oldalon);
    • Hagyma 5 (5 látható) - öt képkocka jelenik meg az asztalon az aktív kerettől jobbra és balra;
    • Onion All – Minden animációs képkocka megjelenik az asztalon.

Rizs. 6.8. A különböző képkocka-megtekintési módok használatának hatása

Rizs. 6.9. Menü a határjelző paramétereinek módosítására szolgáló parancsokkal

Megjegyzés

Kérjük, vegye figyelembe, hogy amikor az időzítési panelen a kulcskép ikonra kattint (és ezzel kijelöli), a kiválasztott képkockának megfelelő kép jelenik meg a táblázatban. Ebben az esetben a keretet alkotó összes grafikus objektum is kiválasztottként jelenik meg.

Objektum mozgásának automatikus animációja

A Flash kétféle animációt tud létrehozni:

  • mozgás-animáció (mozgás tweening);
  • objektum transzformáció animációja (alak tweening).

Tweened motion animáció készítése

Mozgásanimáció automatikusan generálható egy szimbólumpéldányhoz, csoporthoz vagy szövegmezőhöz.

Mozgásanimáció létrehozásakor be kell állítania az objektum attribútumait, például pozíciót az asztalon, méretet, elforgatási vagy dőlési szöget egy bizonyos képkockához, majd módosítani kell ezen attribútumok értékeit egy másik képkockában. Vaku interpolálja a változó attribútumértékeket a közbenső képkockákhoz, létrehozva egy szekvenciális mozgás vagy átalakítás hatását.

Mozgó tweeneket két módszer egyikével hozhat létre:

  • a kerettulajdonságok ellenőrző panel használatával;
  • a Create Motion Tween paranccsal.

Mindkét lehetőség leírására a legegyszerűbb példát fogjuk használni: tegyük fel, hogy balról jobbra kell „gurítanunk” egy labdát az asztalon.

Tehát a labda mozgásának animálásához a Frame Properties Inspector segítségével a következő lépéseket kell végrehajtania.

  1. Győződjön meg arról, hogy a Property Inspector panel megjelenik a képernyőn (a formátuma ennél a lépésnél nem számít). Ha be van zárva, válassza a főablak Ablak menüjének Tulajdonságok menüpontját.
  2. Kapcsolja be az Ovális eszközt, és rajzoljon egy labdát az asztal bal oldalára; Kérjük, vegye figyelembe, hogy az idődiagram első képkockája most kulcskeretként van megjelölve.
  3. Kapcsolja be a Nyíl eszközt, válassza ki a labdát és csoportosítsa (egyesítse) a körvonalat és töltse ki a golyót a Csoport paranccsal, amely a főablak Módosítás menüjében található. Vaku; Ennek eredményeként a labda egy kék kiemelő keretbe kerül.
  4. Kattintson jobb gombbal az idővonalon lévő keret azon cellájára, amelyikben az animáció utolsó képkockáját szeretné elkészíteni (például a 10. képkockát), és válassza a Kulcskép beszúrása menüpontot a helyi menüből; Ennek eredményeként az első és az utolsó kulcsképkocka közötti rést az egyszerű keretek egyszínű (világosszürke) cellái töltik ki, amint az a 1. ábrán látható. 6.10.
  5. Húzza a labdát egy új pozícióba az asztal jobb oldalán.
  6. Kattintson a bal egérgombbal az első kulcsképkockára; ez két művelet egyidejű végrehajtásához vezet: a golyó képe az eredeti helyére kerül, és a Property Inspector panel formátuma megváltozik: a kiválasztott (első) képkocka paramétereit jeleníti meg.
  7. A Property Inspector panelen válassza a Motion lehetőséget a Tween legördülő listából; ugyanakkor megváltozik a panel formátuma, és megjelennek rajta az interfész elemek, amelyek lehetővé teszik az animációs paraméterek beállítását; noha nem érdekelnek bennünket, sokkal fontosabbak az idődiagramban bekövetkezett változások: az első és az utolsó kulcskockát most egy nyíllal köti össze a lila alapon (6.11. ábra). Ez azt jelzi, hogy az animáció sikeresen befejeződött.

Rizs. 6.10. Az időzítési diagram panel nézete a 4. lépés befejezése után

Rizs. 6.11. Az idővonal panel nézete az animáció befejezése után

Ha egy szaggatott vonal jelenik meg az idődiagram panelen nyíl helyett, akkor valamit rosszul csinált. Vessen egy pillantást a Frame Properties Inspector panelre: ha ott egy figyelmeztető jelzéssel ellátott gomb jelenik meg (6.12. ábra), akkor a Flash megpróbál erről tájékoztatni. Kattintson erre a gombra egy ablak megnyitásához, amely elmagyarázza a helyzetet.

Rizs. 6.12. Kilátás kerettulajdonságok ellenőrző panel, ha hiba van

A sikertelenségnek két fő oka lehet: vagy csoportosítatlan objektumokat próbál animálni (ebben a példában körvonalat és kitöltést), vagy a réteg egynél több csoportosított objektumot vagy szimbólumot tartalmaz.

Sok esetben elegendő a felesleges objektum eltávolítása annak érdekében Vaku előadta az animációt. Ha ez nem történik meg, a hiba kijavítása után ismételje meg a tweened animáció létrehozásának folyamatát.

Rajzfilm lejátszásához ugyanazokat az eszközöket kell használni, mint a kockánkénti animációhoz – csak megnyomhat egy billentyűt (jobb előbb megszüntetni a labda kijelölését, bár ez nem szükséges).

A labda mozgásának animálásához a Create Motion Tween paranccsal a következő lépéseket kell végrehajtania (feltételezzük, hogy a labda már jelen van az első keretben).

  1. Kattintson a jobb gombbal az első keretcellára, és a helyi menüből válassza a Motion Tween létrehozása parancsot; ebben az esetben a labda képe automatikusan tweenl nevű grafikus szimbólummá alakul (az átalakulás vizuális jele a labda közepén egy rögzítési pont és egy kiemelő keret megjelenése).
  2. Kattintson a jobb gombbal annak a keretnek a cellájára, amelyet az animációs sorozat utolsó elemévé szeretne tenni (például a 10.), és válassza a Keret beszúrása parancsot a helyi menüből; Ennek eredményeként egy pontozott vonal jelenik meg az első és az utolsó képkocka között, amint az az ábrán látható. 6.14.
  3. Helyezze a labdát egy új pozícióba (az asztal jobb oldalára); ebben az esetben az animáció utolsó képkockája automatikusan kulcskockává alakul (fekete pont jelenik meg a cellában), és a pontozott vonal helyére egy nyíllal ellátott vonal kerül (6.15. ábra).

Rizs. 6.14. Az időzítési diagram panel nézete a Keret beszúrása parancsok végrehajtása után

Rizs. 6.15. Flash ablaknézet az animáció befejezése után

Az animáció létrehozása ezzel befejeződött. Ha most megnézi a Frame Properties Inspector panelt, látni fogja, hogy a Mozgás van kiválasztva a Tween listában.

Megjegyzés

Kérjük, vegye figyelembe, hogy a Create Motion Tween paranccsal tweened motion animáció létrehozásának eredményeként az idődiagramon minden képkocka tween animáltnak van kijelölve, míg a Property Inspector használatakor az utolsó képkocka „csak egy kulcs” maradt (lásd 1. 6.11) . Egy ilyen kulcskockával nagyobb rugalmasságot biztosít a film későbbi szerkesztése során.

A mozgási animáció beállításainak módosítása

Miután elkészített egy tween animációt a Flash használatával, módosíthatja annak bizonyos paramétereit. Az animációs paraméterek szerkesztésének legegyszerűbb módja a Frame Properties Inspector panel használata. Ebben az esetben a következő körülményt kell szem előtt tartani. Annak ellenére, hogy a tweened animáció összes képkockája egy egységként jelenik meg az idődiagramon, bármelyiket kiválaszthatja egyenként, ha rákattint a megfelelő pozícióra az idődiagramon. Ennek eredményeként egy ehhez a kerethez kapcsolódó kép jelenik meg a táblázatban, és ennek a keretnek a paraméterei jelennek meg a Property Inspector panelen.

Mielőtt rátérnénk a rajzfilm szerkesztésének lehetséges módjaira, meg kell tenni egy fontos megjegyzést. Az Eszközök panel eszközeivel végrehajtott szabványos objektum-átalakítási műveletek (például döntés, átméretezés, kör oválissá alakítása stb.) nem kerülnek figyelembevételre az automatikus animáció létrehozásakor. Vaku

Tehát egy tweened motion animációban szereplő képkockához a következő paraméterek állíthatók be a Property Inspector panelen (6.16. ábra):

  • az objektum méretezésének (kicsinyítésének vagy nagyításának) képessége; az automatikus animációs opció engedélyezéséhez jelölje be a Scale jelölőnégyzetet;

Rizs. 6.16. Property Inspector Panel Format Tweened Motion Tween Frame

  • átváltási érték; Alapértelmezés szerint a változások állandó sebességgel mennek végbe, de ezt az Easing paraméter értékeinek módosításával szabályozhatja: ennek a paraméternek a negatív értékei (-1-től -100-ig) azt jelentik, hogy a változások fokozatosan felgyorsulnak. , és a pozitív értékek (1-től 100-ig), éppen ellenkezőleg, a változások fokozatos lassulását jelentik;
  • az objektum forgásának animálása; a forgatás kijelölése, iránya és időtartama a Forgatás legördülő lista és a mellette található idők szövegmező használatával történik; A Forgatás lista a következő lehetőségeket kínálja:
    • Nincs (nincs forgatás) - a forgatási animáció nem használatos (a beállítás alapértelmezés szerint be van állítva);
    • Auto - Az objektum abba az irányba forog, amelyik a legkevesebb mozgást igényli;
    • CW (Clockwise) - az objektum az óramutató járásával megegyezően forog; a fordulatok száma az idők mezőben van megadva;
    • CCW (az óramutató járásával ellentétes irányba) - az objektum az óramutató járásával ellentétes irányban forog; a fordulatok száma az idők mezőben van megadva;
  • az objektum mozgásának nemlineáris (tetszőleges) pályájának megadásának képessége; az Orient to Path jelölőnégyzet bejelölésével biztosítható; a további pályaparamétereket a Sync (Synchronization) és Snap jelzők segítségével állíthatja be; Az objektum mozgási útvonalának leírására szolgáló eljárásról a következő fejezetben lesz részletesebben szó.

Nézzük meg közelebbről az objektum átméretezés animálásának eljárását. Ehhez térjünk vissza a labdával kapcsolatos példához. Tegyük fel, hogy amikor eléri az asztal jobb szélét, akkor csökkennie kell. A probléma megoldása a következő műveletek végrehajtása:

  1. Kattintson jobb gombbal az előző animációs rész utolsó (10.) képkockájának cellájára, és válassza ki a helyi menüből a Create Motion Tween parancsot.
  2. Kattintson a jobb gombbal annak a keretnek a cellájára, amelyet az új animációs sorozatban az utolsónak kíván tenni (például a 20.), és a helyi menüből válassza az Insert Keyrame parancsot; ennek eredményeként a 10. és 20. képkocka között megjelenik egy nyíllal ellátott vonal (ahogyan a 6.17. ábrán látható), és a labda egy kiemelő keretben marad.
  3. Kapcsold be a Free .Transform eszközt az Eszközök panelen és csökkentsd a labda méretét (kicsit "lapíthatod" is;).

Minden. A folyamat befejeződött. Nincs más hátra, mint az eredmény tesztelése a gomb megnyomásával .

Rizs. 6.17. Az időzítési diagram nézete az animált sorozat második szegmensének létrehozása után

Képkockánkénti és automatikus animáció kombinálása

A stop-motion és az automatikus animáció használható ugyanabban a filmben és akár ugyanazon az objektumon is. Ráadásul Vaku teljesen mindegy, hogy milyen sorrendben váltják egymást.

Ismertesse meg a képkockánkénti és az automatikus animáció kombinálásának technikáját, amikor egy objektum viselkedését ugyanazon labda példáján írjuk le. A film cselekménye meglehetősen egyszerű: egy labda átgurul az asztalon, majd leesik és eltörik. Ennek a szórakoztató történetnek az első része tweened animáción fog alapulni, a második része --alapú képkockánként. Ami azt illeti, mindkét töredéket már korábban mi készítettük el, és most már csak az van hátra, hogy egy filmbe egyesítsük őket.

Tehát ahhoz, hogy olyan filmet kapjon, amely mindkét típusú animációt ötvözi, a következőket kell tennie:

  1. Írja le a labda mozgását az asztalon tweened animáció segítségével (a művelet végrehajtása után az idődiagram ablaknak úgy kell kinéznie, mint a 6.11. ábrán).
  2. Kattintson a jobb gombbal a tweened animáció utolsó képkockáját követő keret cellájába (ebben a példában a 11. képkocka cellájába), és a helyi menüben válassza az Insert Keyrame parancsot; ebben az esetben a Nincs lehetőség (ne használjon tween-animációt) automatikusan kiválasztásra kerül a tulajdonságvizsgáló Tween listájában.
  3. Helyezze a golyós képet az asztal aljára.
  4. Hozza létre a fennmaradó kockánkénti animációs kulcskockákat a „Képkockánkénti animáció leállítása” részben leírtak szerint; A végső keret létrehozása után a szerkesztő ablaknak valahogyan úgy kell kinéznie, mint az 1. ábrán. 6.18.

Rizs. 6.18. A stop-motion és a tweened animációt kombináló film idődiagramja

Megjegyzés

Ha egy filmet korábban készített filmek alapján hoznak létre, egyszerűen átmásolhatja a szükséges képkockákat egy új filmbe a Soru és a Paste parancsokkal. Ezzel párhuzamosan a felvételek tartalma is átkerül az új filmbe. Ha a másolt képkockák szimbólumokat használnak, akkor azok hozzáadódnak az új film könyvtárához.

Befejezésül adunk még egy kis példát, amely bemutatja a tweened motion animáció szövegblokkokhoz való használatának jellemzőit. Ebben a példában nincs mozgás önmagában – egyszerűen a Free Transformation eszközzel kapott szöveg tükörképe lesz az animáció utolsó képkockája. És így néznek ki a létrehozott köztes képkockák Vaku(6.19. ábra).

Rizs. 6.19. Példa tweened motion animációra szövegblokkokhoz

Objektum transzformáció automatikus animációja

Transzformációs animáció segítségével olyan hatást hozhat létre, amikor egy objektum simán „folyik” egyik alakzatból a másikba. Sőt, a kapott formának semmi köze lehet az eredetihez. Például az elektronikus súgórendszerben Vaku Adunk egy példát az „átalakításra” (6.20. ábra).

Rizs. 6.20. Példa objektum transzformációra

Ismételjük meg még egyszer, hogy az Eszközök panel eszközeivel végrehajtott szabványos objektummódosítási műveletek animálása (döntés, átméretezés stb.) nem kerül figyelembevételre. Vaku transzformációs műveletként, és "kísérő" változtatásként hozzáadható az objektum mozgásának animációjának létrehozásakor.

Tanács

Általában a legjobb vizuális hatás Vaku biztosítja, ha egyszerre csak egy objektum kerül átalakításra. Ha egyszerre több objektumot kell átalakítania, akkor mindegyiket egy rétegen kell elhelyezni.

A Flash nem tudja automatikusan animálni a karakterek, csoportosított objektumok, szövegmezők és bitképek átalakítását. Ahhoz, hogy az ilyen típusú objektumokat elérhetővé tegye az automatikus átalakításhoz, egy szétválasztási eljárást kell alkalmaznia rájuk.

Tweened transzformációs animáció készítése

Ha úgy dönt, hogy tweened transzformációs animációt is beépít a filmébe, tartsa szem előtt a következőket. Alapértelmezett Vaku megpróbál áttérni egyik formáról a másikra „a legrövidebb úton”. Ezért a köztes keretek meglehetősen váratlanok lehetnek az Ön számára. Az alábbiakban elmondottakat illusztrálja egy rajz (6.21. ábra), amely az Ön számára már ismert „óra” transzformációjának köztes képkockáját mutatja. Itt a tweened animáció segítségével a percmutató 12-ről 6-ra próbál „kúszni” a „parancsikon”.

Ellentétben a mozgási tweenekkel, a tweened transzformációs tweeneket csak egy módon lehet létrehozni - a Keret tulajdonságait felügyelő panel használatával.

Az ilyen animáció létrehozásának technológiájának magyarázatához térjünk vissza az „óra” példához: tegyük fel, hogy a percmutatót „12”-ről „6”-ra szeretné mozgatni.

A probléma megoldásához a következő lépéseket kell végrehajtania.

  1. Győződjön meg arról, hogy a Property Inspector panel megjelenik a képernyőn. Ha be van zárva, válassza a főablak Ablak menüjének Tulajdonságok menüpontját.

Rizs. 6.21. Példa egy köztes képkockára egy tweened transzformációs animációhoz

  1. Kapcsolja be az Ovális eszközt, és rajzolja meg vele az ábrán látható „óra” összes elemét. 6.21, balra.
  2. Kapcsolja be a Nyíl eszközt, és válassza ki az átalakítani kívánt képet.
  3. Kattintson a jobb gombbal annak a keretnek a cellájára, amelyet az utolsónak kíván tenni az animációban (például a 10.), és válassza ki a Kulcskocka beszúrása parancsot a helyi menüből; Ennek eredményeként az első és az utolsó képkocka között egyszerű szürke keretek sorozata jelenik meg az idődiagramon, amint az az ábrán látható. 6.22, fent.
  4. Cserélje ki az eredeti képet az asztalon arra, amelyre át kell alakítani; a vizsgált példában mindössze annyit kell tennie, hogy a Free Transform eszközzel elforgatja a percmutatót, és áthelyezi egy új pozícióba.
  5. Kattintson a jobb gombbal az animáció első képkockájának cellájára; Ennek két hatása lesz: az eredeti kép megjelenik az asztalon, és megváltozik a Property Inspector panel formátuma.
  6. A Tween legördülő listából válassza ki az Alak lehetőséget; ennek eredményeképpen az animáció első és utolsó képkockája az időzítési diagramon világoszöld háttéren nyíllal lesz összekötve (6.22. ábra, lent); ez azt jelzi, hogy az animáció sikeresen befejeződött.

Rizs. 6.22. Idődiagram nézete egy objektum transzformációjának animálásakor

Az Alakzat kiválasztása a Tween listából megváltoztatja a Tulajdonságvizsgáló panel formátumát. Segítségével az alábbi további paraméterek állíthatók be az objektum transzformáció animációjához (6.23. ábra):

  • átváltási érték; Alapértelmezés szerint a változások állandó sebességgel történnek, de ezt az Ease paraméter értékeinek módosításával szabályozhatja: ennek a paraméternek a negatív értékei (-1-től -100-ig) azt jelentik, hogy a változtatások fokozatosan felgyorsulnak. felfelé, a pozitív értékek pedig (1-től 100-ig) éppen ellenkezőleg, a változások fokozatos lassulását jelentik;
  • transzformációs módszer; a Blend listában kiválasztott érték határozza meg:
    • Elosztó - Vaku animációt hoz létre, amelyben a köztes formák simábbak;
    • Szögletes -- Vaku olyan animációt hoz létre, amely megőrzi a köztes alakzatokban a nyilvánvaló szögeket és egyenes vonalakat.

Rizs. 6.23. Objektum transzformációs animációs beállítások

Megjegyzés

Kérjük, vegye figyelembe, hogy az animáció létrehozásához nincs szükség objektum transzformációra (sőt, ez tiltott) csoportosítsa a körvonalat és a kitöltést, valamint az egyéb átalakítandó képelemeket. Mindössze annyit kell tennie, hogy egyszerűen kiválasztja ezeket az elemeket a Nyíl eszközzel.

Alakzati rögzítési pontok alkalmazása

A bonyolultabb alakváltozások szabályozására úgynevezett alakjavaslatokat használnak, amelyek meghatározzák, hogy az eredeti forma töredékei hogyan kerülnek át az új alakzatba. Más szavakkal, a rögzítési pontok az eredeti alakzat azon pontjainak azonosítására szolgálnak, amelyek relatív helyzetét meg kell őrizni. A horgonypontok használatának legjellemzőbb példája az arckifejezések animációja, amelynek egyes részei (különösen a szemek) nem vehetnek részt az átalakításban. ábrán. A 8.24. ábra két transzformációs lehetőséget mutat - elrendezés nélkül és csomópontok elrendezésével. A második lehetőségnél a szemek nem alakulnak át.

Rizs. 6.24. Példa a transzformációra elhelyezés nélkül és rögzítési pontok elhelyezésével

A csomópontokat a képen kis, betűkkel ellátott körök jelzik. A betűket (a-tól z-ig) a rögzítési pontok neveként (azonosítójaként) használjuk. Az eredeti kép minden csomópontjának rendelkeznie kell egy azonos nevű ponttal az eredményül kapott képen. Összesen legfeljebb 26 rögzítési pont használható egy figurához (az ábécé betűinek számától függően). Az eredeti kép csomópontjai színesek sárga, az eredmény zöld.

A rögzítési pontok elhelyezéséhez a következőket kell tennie:

  1. Kattintson a bal egérgombbal az eredeti képnek megfelelő keretcellára.
  2. A Módosítás menüben válassza az Alakzat kaszkád menüt, és abban - az Alakzati tipp hozzáadása parancsot; Ennek eredményeként az első csomópont „üres” része jelenik meg a képen - egy piros kör a betűvel.
  3. Mozgassa az egérrel a kép azon pontjára, amelyet csomópontként szeretne megjelölni.
  4. Kattintson a bal egérgombbal az eredményül kapott képnek megfelelő keretcellában; egy piros kör lesz az asztalon ugyanazzal a betűvel, mint az eredeti keretben.
  5. Mozgassa a kört a kép egy olyan pontjára, amely megfelel az eredeti keretben jelöltnek; mozgatása után a kör színe zöldre változik.
  6. Menjen vissza az animált sorozat első képkockájához, és győződjön meg arról, hogy a rögzítési pont színe sárgára változott.
  7. Ha folytatnia kell a rögzítési pontok elhelyezését, ismételje meg mindegyiknél a leírt eljárást.

Megjegyzések

    1. A rögzítési pontok elrendezése csak egy tweened transzformációs animáció létrehozása után lehetséges.
    2. A rögzítési pontok elhelyezését a Nyíl eszközzel kell elvégezni, és az Objektumokhoz illeszthetőség módosító engedélyezve van.

Tanács

Ha több rögzítési pontot használ az átalakítás során, akkor rendezze el őket az óramutató járásával megegyező irányba, a kép bal felső sarkától kezdve. Ennek az az oka, hogy a Flash ábécé sorrendben dolgozza fel a rögzítési pontokat.

A csomópontok elrendezése után célszerű a fólia próbaüzemét elvégezni, és szükség esetén a pontok elhelyezését módosítani. Egy horgonypont helyzetének megváltoztatásához egyszerűen húzza át egy új helyre (ez megtehető a sorozat első vagy utolsó képkockáján). Ezenkívül bármikor törölheti a felesleges pontokat, vagy hozzáadhat újakat. Ha elégedett az eredménnyel, elrejtheti (elrejtheti) a rögzítési pontokat. A felsorolt ​​műveletek legkényelmesebben a helyi menü segítségével hajthatók végre. A megnyitáshoz kattintson a jobb gombbal az egyik rögzítési pontra. A menü négy parancsot tartalmaz (6.25. ábra), amelyek közül az első három csak a forráskép horgonypontjaihoz érhető el:

  • Tipp hozzáadása – a parancs végrehajtásakor egy új rögzítési pont üres helye jelenik meg a táblázatban;
  • Távolítsa el a tippet – az a rögzítési pont, amelyre a jobb gombbal kattintott a menü megnyitásához, törlődik;
  • Remove All Hints – eltávolítja az összes rögzítési pontot;
  • Tippek megjelenítése - ez a mód alapértelmezés szerint használatos (a parancs neve mellett van egy jelölő); ha újra kiválasztja, a rögzítési pontok láthatatlanok lesznek; Ezt az opciót csak a kívánt eredmény elérése után szabad használni, mivel a rögzítési pontok megjelenítési módjához való visszatéréshez a Módosítás menüből az Add Shape Hint parancsot kell kiválasztani. szükséges mennyiség.

Rizs. 6.25. Horgonypont helyi menü

Sziasztok kedves olvasók. cikkében Beszéltem a sebességvonalak használatáról, amelyekkel egy gyorsulással mozgó tárgy illúzióját lehet kelteni. A cikkben is egy technikát mutattak be szabványos mozgásanimációval és színátmenetes kitöltéssel az objektum megjelenése során. Ha nem emlékszik vagy nem olvasta ezeket a cikkeket, azt tanácsolom, hogy olvassa el őket. Ma szeretném folytatni az Adobe Flash mozgásanimációjának témáját, és nem az objektumok lineáris mozgását szeretném bemutatni, mint korábban, hanem egy pálya mentén történő mozgást.

Először egy egyszerű példán mutatom be, hogyan működik ez a technika.

Teremt új dokumentumot méret 600 x 200 pixel. Nevezd meg First_animate. Háttérszín kék vagy bármilyen más. Azok számára, akik nem emlékeznek, először létre kell hoznia egy új Action Script 3.0 dokumentumot. (Fájl - Új Ctrl + N). Aztán a tulajdonságok panelen (Ctrl + F3)állítsa be a munkaablak méretét és a háttérszínt.

Nevezze át az első réteget erre: " Egy tárgy". Hozz létre rajta egy oválist ( O). Az objektum kijelölésének megszüntetése nélkül. nyomja meg a gombot F8és rendelje hozzá szimbólumként. Név tárgy1.

Hozzon létre egy második réteget a " Egy tárgy", Nevezd meg " Röppálya". Ezen a rétegen rajzolja meg ceruzával a labda röppályáját.

Kattintson jobb gombbal a rétegre " Röppálya" és válassza a " Útmutató". A bal oldalon megjelenik egy kalapács ikon. Most húzza meg a réteget "Egy tárgy" réteg alatt" Röppálya", így összekapcsolja őket egymással.

Most pedig térjünk vissza a munkaterületre. Helyezzük tárgyunkat az ösvény elejére. Hozzon létre kulcskockákat a réteghez "Egy tárgy"és réteg "Röppálya" a 30-as kereten. Helyezze a labdát az út végére. (BAN BEN próba verzió Drótvázas réteg nézet engedélyezve "Egy tárgy").

Most kattintson a jobb gombbal a réteg első képkockájára " Egy tárgy" és válassza a " Hozzon létre egy klasszikus mozgást". Ezek után tesztelhetjük az animációnkat ( ctrl + Enter).

Most pedig lássuk, mit tehetünk ezzel a tudással. Hadd mondjak még egy egyszerű példát. Tegyük fel. hogy sárkányt kell rajzolnunk. aki átrepül az égen.

Hozzunk létre egy új méretű dokumentumot 600 x 200 képpont. Töltsük meg színátmenettel kéktől sárgáig. Ehhez a legelején hozzunk létre egy réteget, amelyet „ Háttér", rajzoljon egy téglalapot a munkaterület teljes méretével (azaz 600 x 200 képponttal), és töltse ki színátmenettel. A cikkben már leírtam, hogyan kell dolgozni a színátmenetekkel.

Kattintson a "Beszúrás - Szimbólum létrehozása (ctrl + F8)" gombra. Állítson be egy nevet sárkány. Rajzolj egy sárkányt. Ezt nem nehéz megtenni, úgy néz ki, mint egy rombusz.

Hogy valósághűen nézzen ki a sárkányunk. Határozzuk meg a mozgását magában a szimbólumban sárkány. Ez lesz a sárkány, ami fel-alá billeg, és a szalagok fejlődnek. A hintázást költségén, a szalagok fejlesztését a költségén végezzük. Először foglalkozzunk a szalagokkal. Animációjuk hasonló lesz az űrlap kontúranimációjához (a szalagokat egyébként az eszközzel rajzoljuk Kefeés alkalmasak erre a manipulációra), amelyekről a cikkben írtam

Ezt a macskát karakternek vesszük. Figyelni fogja, hogy az egér megjelenjen a keretben, és csóválja a farkát.

A karakter a következő objektumokból áll, amelyek különböző rétegeken helyezkednek el:

A szem animációja már készen áll egy külön szimbólumban. Most a farok animációja érdekel minket. Így nyugodtan kiterjeszthetjük rajtuk az animációt a szükséges képkockákra, például 20 ( használd az f5-öt), és blokkolja azokat a rétegeket, amelyekre nincs szükségünk, hogy ne akadályozzák.

Most a farok. Az első képkockán megvan a farok első pozíciója, 10-én a második pozíciót tesszük meg. Egyszerűen tükröztem a farkat balról jobbra - Módosítás – Átalakítás – Balról jobbra forgatni.

Az 5. képkocka „Farka” rétegében hozzon létre egy üres kulcskockát. Ehhez kattintson rá a bal egérgombbal, és nyomja meg az F6 billentyűt. Ezután kattintson a Törlés gombra az összes tartalom törléséhez. Itt sebességvonalak lesznek. A kényelem érdekében kapcsolja be a „ Többrétegű szerkezet"vagy más néven "hagymahéj", állítsa be a tartományát a farkunk két állapota között.

Az ötödik képkockán ecsettel húzz sebességvonalakat, szem előtt tartva, hogy magának az objektumnak a színében valósághűbbek lesznek, nos, a miénk fekete, a változatosság kedvéért adhatunk hozzá egy kis szürkét. A vonalakat úgy készítse el, hogy ne menjenek túl az objektum határain.

Most reálisabbá kell tennünk. Ehhez először beállítunk egy kis animációt a farok alakjáról. Vegye ki a 3-as keretet kulcskeretnek, változtassa meg a macska farkának alakját, és döntse kissé jobbra. Ezután kattintson jobb gombbal az első képkockára, és adja hozzá forma animáció.

Most tegyük meg ugyanezt a farok második állapotával. A 13-as kereten hozzon létre egy kulcskeretet (F6). Lépjen a 10-es kerethez, változtassa meg kissé a farkát, és döntse balra. Ezután a 10. képkockához hozzon létre forma animáció.

Most szerkesszük egy kicsit a kereteket. Távolítsuk el a feleslegeseket. Hogy természetesebb legyen a mozgás. És ismételjük meg a képkockákat fordított sorrendben.

4. lecke. Animáció készítése

A Macromedia Flash MX 2004 számos módot kínál animációs sorozatok létrehozására:

Animációs effektusok - a program maga hoz létre egy olyan képkockát, amely egy bizonyos hatást szimulál egy bizonyos objektumhoz képest;

Képkockánkénti animáció – a felhasználó létrehozza a jövőbeli animáció minden egyes képkockáját;

Automatikus tweened animáció, vagy transzformációs animáció, - a felhasználó adja meg a kezdő és záró képkockákat, a program pedig maga készíti el a közbenső képkockákat szoftveres interpoláció alapján.

Animációs effektusok

A Flash MX 2004 előre elkészített animációs effektusokat (idővonal-effektusokat) tartalmaz, amelyek segítségével összetett animációkat hozhat létre minimális mennyiség akciók. Használhatja a funkciót Idővonal-effektusok a következő objektumokhoz:

Grafikus objektumok, beleértve az alakzatokat, csoportosított objektumokat és grafikus szimbólumokat;

Raszteres képek;

Amikor animációs effektusokat ad hozzá egy objektumhoz, a Flash automatikusan létrehoz egy megfelelő réteget, és az ehhez a réteghez szükséges összes mozgás- és alakátalakítás végrehajtásra kerül. Az új réteg automatikusan ugyanazt a nevet kapja, mint az effektus.

Példaként hozzunk létre egy „robbanás” hatást a szövegen. Ehhez írjon be egy kifejezést vagy szót (1. ábra), jelölje ki a Nyíl eszközzel, és hajtsa végre a parancsot Insert => Timeline Effects => Effects => Explode.

Rizs. 1. Kijelölt szövegobjektum

Ennek eredményeként megjelenik egy azonos nevű panel (2. ábra), amely számos effektparaméter konfigurálását teszi lehetővé.

Rizs. 2. A panel felrobbanása

Az előnézeti ablak lehetővé teszi az effektusok különböző változatainak elemzését anélkül, hogy elhagyná a panelt Felrobban. Miután kiválasztotta a szükséges opciókat, kattintson a gombra rendbenés kapsz valami ehhez hasonló animációt.

Hasonló hatások alkalmazhatók raszteres képre is. Tekintsünk egy példát a raszteres kép zökkenőmentes eltűnésére. Bittérkép importálása a jelenetbe parancs segítségével Fájl => Import => Importálás a színpadra(3. ábra), és alkalmazza a Blur effektust a parancsra Beszúrás => Idővonal effektusok => Effektusok => Elmosódás Videoklip .

Rizs. 3. Bitmap importálva a jelenetbe

Animációs effektus szerkesztéséhez válassza ki az effektushoz társított objektumot a színpadon és a megjelenő ablakban Tulajdonságok kattintson a gombra Szerkesztés(4. ábra) - ennek eredményeként egy panel jelenik meg Elhomályosít.

Rizs. 4. Gomb Szerkesztés a panel alján található Tulajdonságok

A panelben Elhomályosít ismét módosíthatja az effektparamétereket, és elmentheti az új beállításokat (5. ábra).

Rizs. 5. Panel Elhomályosít lehetővé teszi az effektbeállítások módosítását

Stop motion animáció

Tekintsük a legegyszerűbb példát - egy papírdarab a képernyő egyik pontjáról a másikra mozog a tengelye körüli forgással.

Rizs. 6. Az animáció első kulcskockája

Rajzoljunk például egy juharlevelet, ahogy az ábra mutatja. 6, - megfelelő keret a panelen Idővonal szürkévé válik, és egy pont jelenik meg benne, jelezve, hogy ez egy kulcskép. A kulcskeret egy olyan keret, amelyben a tartalom elhelyezhető vagy módosítható.

Rizs. 7. Hozza létre a második keretet az első húzásával és átalakításával

Ezután kattintson a jobb gombbal a szomszédos keretre, és szúrjon be egy másik kulcskeretet a paranccsal Kulcskeret beszúrása. Ennek eredményeként a levél másolata megjelenik ebben a keretben; mozgassa lefelé (a nyíl eszközzel), és forgassa el a paranccsal Módosítás => Átalakítás => Ingyenes átalakítás(7. ábra).

Ismételjük meg az eljárást úgy, hogy a 6. képkockában a lap elfoglalja a végső pozícióját (8. ábra).

Rizs. 8. Az animáció utolsó képkockája

Ügyeljen a panelre Tulajdonságok(8. ábra) - az objektum típusa a bal oldalon látható. Minden keretben a levél egy típusú objektum Alak(forma), más típusú objektumokról kicsit később lesz szó.

Ha egy filmet SEF-fájlként (a Macromedia natív formátuma a Flash-filmekhez) szeretne exportálni, futtassa a parancsot Fájl => Exportálás => Film exportálása. Ennek eredményeként a következő filmet kapjuk: szabadság1.fla). A kapott filmet anélkül tekintheti meg, hogy parancsra elhagyná a Flash programot Control => Test Movie. Sőt, annak megtekintéséhez, hogy mennyi helyet foglalnak el a film egyes képkockái, futtassa a parancsot. Ennek eredményeként látni fogjuk, hogy a hat képkocka mindegyike körülbelül 600 KB-ot foglal el (9. ábra). Így a teljes film mérete 3686 bájt.

Rizs. 9. Filmnézés Sávszélesség-profilozó

Annak értékeléséhez, hogy ez sok-e vagy kevés, gondolja át, hogyan lehet hasonló filmet készíteni automatikus animáció vagy mozgástranszformációs animáció segítségével.

Automatikus animáció

Rizs. 10. Az objektum automatikusan grafikus szimbólummá változik

Nézzük meg, hogyan készítheti el ugyanazt az animációt, és hogyan kaphat kompaktabb eredményű fájlt. Jelölje ki a rajzolt levelet a képernyőn az Arrow eszközzel, és hajtsa végre a parancsot Beszúrás => Idővonal => Motion Tween létrehozása, ennek eredményeként a szórólap keretbe kerül, és a panelbe Tulajdonságoküzenet jelenik meg, hogy a kiválasztott objektumnak vannak tulajdonságai Grafikus(10. ábra). Ez azt jelenti, hogy az animált objektum automatikusan grafikus szimbólummá alakul. Most már nem lehet tetszőlegesen szerkeszteni a Nyíl eszközzel, mint Shape típusú objektummal. A szimbólumok használata az fontos fogalom a Flash-ben. A szimbólum létrehozása után többször is felhasználható egy filmben anélkül, hogy növelné az eredményül kapott fájl méretét. A szimbólumokat grafikus szimbólumokra, gombszimbólumokra és filmklipszimbólumokra osztják. Ebben a leckében egy grafikus szimbólumot fogunk megnézni, és később visszatérünk más típusú szimbólumokra. Minden új szimbólum azonnal az aktuális dokumentum könyvtárának részévé válik (11. ábra).

Rizs. 11. Minden új szimbólum a könyvtár részévé válik

Ha lefuttatja a parancsot Ablak => Könyvtár, akkor megbizonyosodhat arról, hogy egy szimbólum megjelent a könyvtárban, és alapértelmezés szerint a Tween 1 nevet kapta. Ha egy szimbólumhoz más nevet szeretne rendelni, kattintson duplán a névre, és cserélje ki a kívánt névre. Miután elkészítettük a grafikus szimbólumot, menjünk az animációnk utolsó képkockájára (legyen ez a 15. képkocka) és szúrjunk be egy kulcskockát (az Insert paranccsal Kulcskocka). Ebben a keretben megjelenik a szimbólum másolata, amelyet mozgatunk és elforgatunk a tengelye körül (a parancs segítségével Modify Transform=>Ingyenes átalakítás), mint az előző példában. ábrából látható. 12, minden képkocka két kulcsképkocka között kék színű, és egy nyíl húzódik az első kulcskockától az utolsóig, ami animáció létrehozását jelzi Motion Tween.

Rizs. 12. Kék alapon nyíl jelzi az animáció létrehozását Motion Tween

A parancs végrehajtásával Control => Test Movieábrán látható információkat kapjuk. 13.

Rizs. 13. Filmnézés Sávszélesség-profilozó módban

Annak ellenére, hogy ebben a példában 15 helyett hat képkocka van, mint az előzőben, és az animáció simább, a kapott fájl mérete kisebb - csak 900 bájt. Amint az a diagramból (13. ábra) látható, az objektumra vonatkozó információk csak az első keretben tárolódnak, és minden új keretben csak a lap új pozícióit kell megjegyezni. Ez átlagosan csak 20 bájtot vesz igénybe.

A lap síkja körüli elforgatással történő leesés szemléltetésére megismételjük az előző példát, csak az utolsó kulcskeret módosításakor adjuk hozzá a parancsot Módosítás => Átalakítás => Flip Vízszintes. Ennek eredményeként a következő filmet kapjuk.

Most nézzünk egy példát, amikor egy levél közeledik a nézőhöz. Ehhez az utolsó képkockában a tükrözés helyett ( Vízszintesen megfordít) növeljük a lap méretét. Annak érdekében, hogy elkerüljük a lassulás érzését, amikor egy tárgy közeledik a nézőhöz, növelni kell a mozgás sebességét. Ennek a hatásnak az eléréséhez kattintson az első képkockára, és tekintse meg a részt Könnyű a panelben Tulajdonságok. Az Ease paraméter pozitív értékei a mozgás lelassulását, míg a negatív értékek felgyorsítják a mozgást. Válasszuk ki az objektum maximális gyorsulását.

Rizs. 14. Válassza ki az objektum maximális gyorsulását Könnyű = –100

Ehhez állítsa be a paraméter értékét Könnyű egyenlő –100 (14. ábra). Az eredmény egy film. Vegyük figyelembe, hogy az első képkockát a színpad mögé is elhelyezhetjük, ekkor kapunk egy filmet, amiben a levél berepül a képkockába és a néző felé mozdul. Simulálhatja a lap forgását egy eltolt szimmetriaközéppont körül. Remélem, maga az olvasó is tud majd kísérletezni, megnehezítve a végső képkocka módosítását, és ezzel megváltoztatva a lap mozgásának jellegét.

A bemutatott példákból kitűnik, hogy az automatikus mozgásanimáció akkor hatékony, ha egy objektum mozgása közbeni átalakulását egyszerű függvények (forgatás, méretezés stb.) adják meg. Ha összetett mozgásokat kell animálni (például egy rajzfilmfigura kezének mozgását), akkor a mozgástranszformációs animáció nem alkalmazható. Minden képkockát kézzel kell megrajzolni, azaz kockánkénti animációt használunk, amely kulcskockák halmazából áll. Így a képkockánkénti animáció a legsokoldalúbb, de egyben a legmunkaigényesebb animációs típus, ráadásul ez hozza létre a legnehezebb fájlokat. Ha lehetséges a képkockánkénti animációt automatikus animációval helyettesíteni, ez előnyösebb. Nézzünk meg néhány példát, amelyek lehetővé teszik az automatikus mozgás-animáció használatát repülés szimulálásakor.

Mozgás adott pálya mentén

A vaku lehetővé teszi egy objektum mozgásának beállítását egy adott útvonalon. Ennek a pályának a beállításához futtassa a parancsot Beszúrás => Idővonal => Mozgási útmutató.

Ennek eredményeként egy speciális réteg jelenik meg az aktuális réteg felett, amelynek alapértelmezés szerint a neve lesz 1. útmutató réteg.

Kattintsunk a pályarétegre, és a ceruza eszközzel rajzoljunk egy vonalat, amely mentén a lapot tervezzük mozgatni (15. ábra).

Rizs. 15. Példa mozgási pálya megadására

Most menjünk az első képkockára (kattintsunk rá az egérrel) és a megjelenő panelen Tulajdonságok jelölje be a négyzetet Snap(beállítja a kötés módját a mozgáspályához) - ábra. 16.

Rizs. 16. Paraméter Snap beállítja a csattanási módot a mozgáspályához

Miután bejelölte a négyzetet Snap, a lap közepe a mozgás pályájához igazodik. A Nyíl eszközzel mozgathatja a levelet a mozgási pályán, de ha megpróbálja letépni a lapot és mellé helyezni, akkor az visszahúzódik, és ismét a mozgási pályához „tapad” (ábra). 17).

Rizs. 17. Úgy tűnik, hogy a tárgy a középpontjával ragaszkodik a mozgás pályájához

Menjen az utolsó képkockára, és hasonló módon kösse a lapot a mozgáspálya végpontjához. A film hangerejének növeléséhez adja hozzá az átalakítást Vízszintesen megfordít, - ennek eredményeként megkapjuk a filmet .

Amikor egy lap egy pálya mentén mozog, számunkra nem mindegy, hogyan forgatjuk el a mozgás irányába. De ha hasonló módon beállítjuk egy madár repülési útvonalát, akkor a görbe egyes részein kiderül, hogy a madár repül először farokkal.

Nyilvánvaló, hogy ha egy repülőgép vagy egy madár repülését akarjuk animálni, akkor arra van szükség, hogy az orrát mindig előre mozgassa. Flash-ben ez a fajta mozgás nagyon könnyen beállítható (18. ábra).

Rizs. 18. Ha bejelöli a négyzetet Orientation to Path, a madár fejjel előre fog repülni

Jelölőnégyzet kötelező Orientation to Path, és a madár mozgása teljesen ismerősre változik (ennek a videónak a forrása egy madár repülése.fla).

Rizs. 19. Egyszínű háttér hozzáadása

Ha egyszínű hátteret szeretne hozzáadni, kattintson a háttérre és a megjelenő panelen Tulajdonságok(19. ábra) a terepen Háttér válassza ki a kívánt háttérszínt.

Ha háttérképet szeretnénk hozzáadni, akkor ehhez külön rétegre lesz szükségünk. A Flash elvileg lehetőséget kínál a klasszikus animációban használthoz hasonló rétegrendszer létrehozására, amelyben a háttér és a különböző mozgó objektumok mindegyike a saját átlátszósági rétegére rajzolódik ki.

Ha a háttérképet és minden animált objektumot a saját rétegére helyezi, sokkal könnyebben átveheti az irányítást felettük. Tehát egy háttérkép hozzáadásához hozzunk létre egy új réteget. Ehhez kattintson a jobb gombbal az ábrán látható rétegre. A 19 az 1. rétegnek van kijelölve, és a legördülő menüben válassza a Réteg beszúrása sort. A hozzáadott rétegben rajzolja meg a napot. Annak érdekében, hogy ne keveredjünk össze a rétegszámokkal, adjuk a rétegnek a „háttér” nevet. Ehhez kattintson az aktuális névre, és írja be a kívánt nevet (20. ábra).

Rizs. 20. Egy új rétegen hozzon létre egy álló háttérobjektumot

ábrából látható. 20, a madár a nap mögött van, ami ellentmond a józan észnek. A rétegek felcseréléséhez használja a fogd és vidd módot a „háttér” nevű réteg lehúzásához.

Szerkesszük meg a film tárgyait (úgy, hogy a madár körözzön a nap hátterében, változtassuk meg repülésének pályáját és változtassuk meg a nap és a madár méreteinek arányát), és kapjuk meg a következő videót.

Rizs. 21. A felhő animálásához hozzon létre egy külön réteget

Most adjunk hozzá mozgó objektumokat az animációnkhoz, például egy felhőt. A felhőhöz hozzon létre egy új réteget, és állítsa be rajta a mozgástranszformációs animációt. Annak érdekében, hogy a felhő berepüljön a helyszínre, az ábrán látható módon helyezzük el. 21. Ennek eredményeként a következő filmet kapjuk (a film forrása a csatolt fájlban található

Mozgásanimáció létrehozásakor meghatározhatja egy objektum mozgását egy bizonyos pálya mentén - egyenes vonal mentén, egyenes vonalszakaszokból álló szaggatott görbe mentén és sima görbe vonal mentén.

Egyenes vonalú mozgás animációja

1. példa:
Lásd a 2. példát

Hozzunk létre egy egyenes vonalban mozgó síkot.

A szerkesztőkeretbe illesszen be egy repülőgép képét a jelenet bal oldalára. A repülőgép vektoros képe Adobe Flash-ben készíthető (lásd: Rajz), vagy importálhat egy oldalra készített képet (.png formátumban, átlátszó háttérrel).

Emelje ki a gépet a jelenetben. A repülőgép helyi menüjében válassza a lehetőséget Átalakítás szimbólummá(Átalakítás szumbolra). Válassza ki a szimbólum grafikus típusát.

A kép helyi menüjében válassza a lehetőséget Hozzon létre egy mozgás animációt(Motion Tween létrehozása). A program automatikusan 24 képkockát hoz létre a zökkenőmentes változtatásokhoz.
Mozgassa a képet a jelenet jobb oldalára.
Beállíthatja az animáció időtartamát és még sok mást - lásd. Munka a személyzettel .

Az egyenes vonalban mozgó síkról animáció készült, amely az Enter billentyűre kattintva tekinthető meg.

Ebből a példából a következő következtetéseket vonhatjuk le:

A program által automatikusan létrehozott új tween span hossza alapértelmezés szerint a beállított animációs sebesség. Ha az animáció sebessége 24 képkocka/másodperc, akkor alapértelmezés szerint egy 24 képkocka váltási terület (1 másodperc animáció) jön létre. Ha a sebesség 30 fps. - az alapértelmezett változtatási terület 30 képkocka lesz.

Ahhoz, hogy a program fade-ot hozzon létre, a jelenetbe beillesztett objektumot szimbólummá kell alakítani. Ebben az esetben az objektum bármi lehet - Adobe Flash-ben létrehozott vektoros rajz, szöveg, importált raszterkép stb. Ha nem szimbólumon próbál sima változást létrehozni, a program megkéri, hogy konvertálja a elemet egy szimbólumhoz ().

Egyszerre csak egy karaktert lehet tweenelni. Ha egy több objektumot tartalmazó fóliára próbál módosítani, a program felszólítja, hogy a grafikus szimbólumokat egyetlen szimbólummá alakítsa át.

A Fade használható átméretezésre/nagyításra, színek megváltoztatására és szűrők alkalmazására.

Megjegyzés: A szűrőeffektusok halványítása csak a klip- és gombszimbólumokra vonatkozik, a grafikus szimbólumokra nem.

Megjegyzések:
1. Klasszikus mozgóanimáció készítésekor az eljárás eltérő - lásd. Classic Motion Tween készítése .
2. Objektumok mozgásának létrehozása kockánkénti animáció során – lásd Time-lapse animáció
3. Példánkban a gép a jeleneten belül mozgott. De a repülőgép (vagy más objektum) kezdeti helyzete lehet a jeleneten kívül, míg a gép „a színfalak mögül” (jobbra, balra, fent, lent) bukkanhat fel. Ugyanígy eltűnhet a színpadról a „kulisszák mögött”. Elvileg egy objektum kezdeti és végső helyzete is lehet a jeleneten kívül, pl. a tárgy kiugrik „a színfalak mögül”, végrehajtja trükkjeit a színpadon, és ismét eltűnik „a színfalak mögött”.

Görbe mozgás animációk

Számos módja van egy objektum görbe mentén történő mozgásának létrehozására:



2. módszer
Szúrjon be egy piros négyzetet a jelenetbe
Hozzon létre egy mozgást a négyzethez (lásd: Mozgási tween létrehozása)
Ennek eredményeként a mi terünk és annak mozgáspályája megjelenik a színpadon (jelölőkkel ellátott vonal formájában).

Beállíthatja a mozgás útvonalát, nem magát az utat, hanem az objektumot befolyásolva (ahogy az alábbi animáción látható):



Ennek a módszernek a használata egyszerű: kattintsunk egy kiválasztott képkockára az Idővonalon (nálunk ez a 10., 20. és 30. képkockák), és ennek megfelelően mozgassuk az objektumot a jelenetben (anélkül, hogy az útvonalgörbét befolyásolná) A program automatikusan kulcskockákat hoz létre a kiválasztott képkockákban.

Saját vezetési útvonal kialakítása

1. Illesszen be egy repülőgép rajzát a jelenetbe.

2. Alakítsa át a repülőgép rajzát grafikus szimbólummá
3. Hozzon létre egy új réteget „Útvonal” néven, amelyre ceruzával () megrajzoljuk a sík pályáját. Az útvonalvonalat nem szabad lezárni.

4. Ha szükséges, simítsa ki a görbe vonalát az alján található "Smooth" () eszközzel Eszköztárak .

5. Válassza ki a létrehozott elérési utat, és másolja a vágólapra. Ezt követően maga az elérési út törölhető.

6. Térjen vissza a sík réteghez. Válassza ki a síkot a színpadon, és válassza a " Hozzon létre egy mozgás animációt"(Motion Tween létrehozása).

7. Válassza ki a síkot a jeleneten, majd a Szerkesztés menüben válassza a „Beillesztés” vagy a „Beillesztés a helyére” menüpontot.
A repülési útvonal képe hozzáadásra kerül a repülőgép képéhez.

8. Megtekintéshez helyezze a piros csúszkát az 1. képkockára, kattintson az Enter billentyűre.


Mozgási útvonal szerkesztése

A mozgási útvonalat ugyanúgy alakíthatja át, mint bármely más grafikus objektumot.

Válassza ki ingyenes átalakító eszköz(Szabad átalakítás) az eszköztáron, és kattintson a mozgási útvonalra.
A mozgási pálya körül transzformációs jelzők jelennek meg.

A mozgási útvonalat méretezheti vagy elforgathatja. Út görbületet hozhat létre a kiválasztási eszközök és a Horgonypont konvertálása(Horgonypont konvertálása) – ez az eszköz a Toll eszköz alatt van elrejtve.

Kattintson a kiindulási pontra, és mozgassa a kijelölés kezdő fogantyúját, amely az útvonal görbületét szabályozza.

3 Az elérési út javításához válassza ki az Alválasztó eszközt az eszköztáron.
4 Kattintson és húzza a fogantyút az útvonalgörbe szerkesztéséhez.
Megjegyzés: A mozgás útvonala közvetlenül is vezérelhető a Kijelölő eszközzel ().
Válassza ki a Kijelölő eszközt () és vigye közel a mozgáspályához. A kurzor mellett megjelenik egy görbe ikon, jelezve, hogy szerkesztheti az útvonalat. Kattintson és húzza a mozgási útvonalat a görbület módosításához.

Kijelölhet egy objektumot, kattintson rá jobb gombbal, és válassza ki a menüből Hozzon létre egy mozgás animációt. Ezután mozgassa a csúszkát az idővonalon, és szinkron módon mozgassa az objektumot a létrehozott görbe mentén.

Jegyzet:
Ha remegő kezével túl ügyetlen utat rajzolt meg, és ugyanakkor túl kevés képkockát osztott ki ahhoz, hogy ezen az úton haladjon, akkor a program nem tudja végrehajtani a feladatot, és megismételni az összes kanyart. pálya.
Ebben az esetben egy közlemény jelenik meg:
"A görbét egyszerűsíteni kell, hogy illeszkedjen az aktuális mozgásban rendelkezésre álló képkockák számához. Kérjük, válasszon egyet a következő módszerek közül."
Vagy: "A görbét egyszerűsíteni kell, hogy megfeleljen az aktuális mozgásanimációban elérhető képkockák számának. Kérjük, válasszon egyet a következő módszerek közül..." és két lehetőség jelenik meg, amelyek közül az első az útvonal egyszerűsítése.

Lásd még:
Saját animációs útvonal létrehozása


Haladásirány megfordítása

Ha egy objektumot a végpontról a kezdőpontra szeretne mozgatni, az objektum helyi menüjében válassza a lehetőséget Pálya ( Motion Path ) - Fordított pálya(Reverse Path).

Lásd még:

Tárgytájolás mozgás közben

Néha fontos az útvonal mentén mozgó objektum tájolása.
Példánkban a gépnek nemcsak a pályája mentén kell mozognia, hanem egyidejűleg el is kell fordulnia, hogy az orra a mozgás irányába legyen.

1 Kattintson a mozgási rétegre az idővonalon. Példánkban ez a „repülőgép” réteg.

2. Válassza ki a mozgási útvonalat a kijelölő eszközzel ()

3. Helyezze el helyesen a tárgyat a mozgás útjához képest az 1. ill utolsó képkockákélénkség.

4. B Ingatlanvizsgáló válassza ki Útvonal orientáció(Orient to path) az elérési út opcióban.

A szerkesztő beilleszti a külső kereteket, hogy a mozgás sima változása mentén forogjanak úgy, hogy a repülőgép orra a mozgási útvonal mentén legyen orientálva.

A program automatikusan kulcskockákat ad hozzá, elforgatva a síkot a pályája mentén.

Az idővonal így fog kinézni:

Megjegyzés: A tájékozódási lehetőség helyes működéséhez a kiindulási helyzetben lévő repülőgépet helyesen kell beállítani, pl. orra hegyes legyen a mozgás útján.
Ehhez használja ingyenes átalakító eszköz, forgassa el a síkot a megfelelő pozícióhoz.