V závislosti od dostupného času, deja filmu a vašich vlastných umeleckých schopností si môžete vybrať jeden z dvoch spôsobov, ako oživiť postavy vo filme:

• animácia po jednotlivých snímkach, keď každý ďalší snímok vytvoríte vlastnými rukami (alebo importujete z externého zdroja);
• automatická animácia (tweened-animation), keď vytvárate iba kľúčové snímky a všetky medziľahlé snímky Flash tvorí samo o sebe.

Treba poznamenať, že oba mechanizmy možno použiť spoločne, a to nielen v rámci toho istého filmu, ale aj vo vzťahu k jednému objektu. Napríklad fragmenty, ktoré sú z hľadiska deja zložitejšie, môžu byť založené na animácii snímok po snímke a fragmenty s „predvídateľným“ vývojom deja možno získať pomocou automatickej animácie.

Takáto kombinácia je možná vďaka použitiu jedinej časovej osi pre každý objekt, reprezentovanej v okne editora časovým diagramom - - Time Line. Kombináciou „životných línií“ niekoľkých objektov na jednom časovom diagrame môžete získať scénu, na ktorej sa zúčastňuje niekoľko „postáv“.

Zvláštnosťou použitia automatickej animácie je, že dokáže animovať iba jeden objekt na danej vrstve. Ak chcete vytvoriť scénu, ktorá má mať niekoľko animovaných objektov, musíte každý z nich umiestniť na samostatnú vrstvu (viac informácií o používaní vrstiev nájdete v nasledujúcej kapitole - "Vrstvy").

Bez ohľadu na to, aký mechanizmus sa používa na vytvorenie jednotlivých snímok, podstatou animácie je odrážať zmenu objektu v priebehu času.

Môžete vytvoriť film, v ktorom bude rovnaká guľa ležať hodinu nehybne na stole. V tomto prípade si budú všetky políčka filmu navzájom viac podobné ako jednovaječné dvojčatá a divák nerozozná vašu „karikatúru“ od statického obrazu. Na druhej strane môžete urobiť niekoľko skvelých záberov a... zároveň ich reprodukovať. Výsledok bude rovnaký – divák nebude vidieť, čo sa deje na javisku. Základným princípom animácie teda je, že každý okamih času má svoj vlastný rámec.

Podľa toho postup pri vytváraní najjednoduchšieho animovaného filmu v Flash je pripraviť obrazy objektu, odrážajúce jeho zmenu, a usporiadať ich pozdĺž časovej osi.

Pri akomkoľvek Flash-možno pridať filmový text. Podobne ako pri práci v bežných textových editoroch je možné textu nastaviť veľkosť, typ písma, štýl, medzery, farbu a zarovnanie. Písmo môžete transformovať ako iné objekty – otáčať, meniť mierku, skosiť. Zároveň zostáva možnosť úpravy jeho symbolov.

Hypertextový odkaz možno vytvoriť na základe kúsku textu.

Flash-movie môže obsahovať dynamické textové polia, ako aj polia upraviteľné používateľom. Upraviteľné polia vo filme Flash majú rovnaký účel ako textové polia umiestnené vo formulári na webovej stránke: možno ich použiť na získanie určitých informácií od používateľa, ktoré sa majú spracovať na serveri alebo klientskom skripte. A nakoniec, vo Flash MX môžete vytvárať rolovateľné viacriadkové textové oblasti.

V prípade potreby je možné text previesť na grafický objekt a potom je možné pracovať s jeho symbolmi ako so samostatnými grafickými obrazcami.

Zastavte animáciu pohybu

Ak teda chcete vytvoriť animáciu po jednotlivých snímkach, musíte si najprv pripraviť (alebo aspoň premyslieť) každé políčko filmu. V tomto prípade je potrebné vziať do úvahy nasledujúcu okolnosť. Hladkosť prechodu z jedného rámca na druhý, a teda plynulosť a prirodzenosť pohybov postáv, závisí od toho, aký odlišný je nasledujúci rámec od predchádzajúceho (a nie od frekvencie snímok, ako sa niekedy verí). Inými slovami, čím viac snímok „karikatúra“ obsahuje, tým sú pohyby postáv bližšie k prirodzeným. Preto je vytváranie animácií po jednotlivých snímkach veľmi náročnou úlohou. Je vhodné ho použiť v prípadoch, keď sú objekty modifikované alebo vzájomne nejakým komplexným spôsobom interagujú.

Okrem toho sa používa animácia po jednotlivých snímkach Flash pri popise správania interaktívnych filmových prvkov, ako sú tlačidlá. Každý stav tlačidla zodpovedá konkrétnemu kľúčovému snímku v časovom diagrame. Hlavný rozdiel medzi popisom správania tlačidla a „normálnou“ animáciou spočíva v tom, že stav tlačidla nezávisí od času, ale od akcií používateľa. Ďalšie informácie o zahrnutí ovládacích prvkov do filmu nájdete v kapitole „Vytváranie interaktívnych filmov“.

Vytvorenie sekvencie kľúčových snímok

Hlavný nástroj na tvorbu rámová animácia je časovacia lišta. S jeho pomocou môžete vytvárať, mazať a presúvať snímky animácie, meniť režimy zobrazenia jednotlivých snímok a celej scény a vykonávať ďalšie operácie.

Prvky rozhrania časového diagramu boli rozobraté v časti „Organizácia používateľského rozhrania“ v tretej kapitole (pozri obr. 3.7). Teraz je čas hovoriť o tom, akú úlohu zohráva každý z týchto prvkov pri vytváraní „karikatúry“.

Komentujte

V tejto kapitole sa všetka naša pozornosť sústredí len na pravú stranu časového diagramu, keďže používaniu vrstiev je venovaná samostatná kapitola. Preto sa vo všetkých tu uvažovaných príkladoch používa iba jedna vrstva, ktorej parametre sú predvolene nastavené a nemôžeme ich meniť.

Takže, keď si pamätáme časový diagram, môžeme povedať, že karikatúra vytvorená pomocou animácie snímok po snímke je sekvencia kľúčových snímok, z ktorých každá je spojená s obrázkom (obrázkom) na stole.

Pri hraní karikatúry sa efekt animácie dosiahne vďaka tomu, že obrázky na stole sa navzájom nahrádzajú. Každá karikatúra po jednotlivých snímkach sa vyznačuje dvoma hlavnými parametrami:

• počet kľúčových snímok (Kľúčová snímka);
• snímková frekvencia (počas Flash meria sa ako počet snímok zobrazených za jednu sekundu – snímka za sekundu, fps).

Vo všeobecnosti oba tieto parametre ovplyvňujú vytvorený vizuálny efekt (na plynulosť alebo naopak diskrétnosť pohybov, "premeny" atď.). Vedúca úloha tu však patrí prvému parametru, ako aj tomu, ako veľmi sa nasledujúci kľúčový rámec líši od predchádzajúceho.

Na časovom diagrame sú kľúčové snímky zobrazené ako sivé obdĺžniky s čiernou bodkou vo vnútri. Pri prehrávaní filmu sa čítacia hlava pohybuje z jednej snímky na ďalšiu a označuje aktuálnu snímku. Ak chcete vidieť obrázok spojený s konkrétnym rámcom, musíte kliknúť na ikonu tohto rámca v časovom diagrame. Na obr. 6.1 ukazuje ako príklad dve kľúčové snímky (prvú a poslednú) malého kresleného filmu „o hodinách“, v ktorom sa jedna snímka od druhej líši polohou minútovej ručičky. Celkovo karikatúra obsahuje 6 snímok, snímková frekvencia je 2.

Ryža. 6.1. Dva snímky z karikatúry „O hodinách“

K príkladu s hodinami sa ešte vrátime, ale na opísanie postupu vytvárania animácie snímok po snímke použijeme iný príklad. Predpokladajme, že „hrdinom“ filmu je guľa, ktorá spadne a rozbije sa na tri časti. Predpokladáme, že na odhalenie takého zložitého sprisahania stačí päť snímok:

1. Lopta je vo svojej pôvodnej polohe.
2. Lopta spadla, ale stále je neporušená.
3. Prvý kúsok odlomil loptičku.
4. Z lopty sa odlomil druhý kúsok.
5. Na stole leží niečo, čo v minulom živote bola lopta.

Vzhľadom na opísaný pozemok by postupnosť práce mala byť nasledovná:

1. Vytvorte štyri obrázky na stole zodpovedajúce vyššie uvedeným rámom, ako je znázornené na obr. 6.2 (pre prvý a druhý rám je použitá rovnaká - celá - guľa).

Ryža. 6.2. Obrázky zodpovedajúce snímkam budúceho filmu

1. Vytvorte nový filmový súbor s prázdnou tabuľkou kliknutím na tlačidlo Nový na hlavnom paneli nástrojov Flash.
2. Na časový diagram v bunke prvej snímky kliknite pravým tlačidlom myši az kontextovej ponuky vyberte príkaz Vložiť kľúčovú snímku.
3. Z okna, v ktorom boli vytvorené obrázky lopty, skopírujte prvý obrázok a umiestnite ho niekde na vrch stola; v tomto prípade bude prvá snímka na časovom diagrame označená ako kľúč (čierna bodka), obr. 6.3.

Ryža. 6.3. Pohľad na okno Flash po vytvorení prvého rámca

1. Kliknite pravým tlačidlom myši do bunky druhého rámca a z kontextového menu vyberte príkaz Vložiť kľúčový rámec; v tomto prípade bude snímka okamžite označená ako kľúčová, pretože sa pre ňu zdedí obrázok z predchádzajúcej snímky; použite: presuňte obrázok lopty na spodok tabuľky.
2. Kliknite pravým tlačidlom myši do bunky tretieho rámca a v kontextovej ponuke znova vyberte príkaz Vložiť kľúčový rámec; nová snímka sa tiež označí ako kľúčová a uloží sa pre ňu predchádzajúca snímka; môžete ho buď upraviť, alebo jednoducho nahradiť tým, ktorý chcete.
3. Vytvorte štvrtý a piaty rámec výberom príkazu Vložiť kľúčový obrázok z kontextovej ponuky a umiestnením príslušného obrázka na stôl.

Po dokončení posledného kroku, okno Flash by mal vyzerať podobne ako na obr. 6.4.

Ryža. 6.4. Vzhľad okna Flash po vytvorení finálnej snímky animácie

V skutočnosti je tým dokončená tvorba prvej „karikatúry“. Nezabudnite si ho uložiť na disk: budeme ho potrebovať neskôr, keď sa budeme učiť iné typy animácií.

Po dokončení práce je užitočné skontrolovať, či všetko dopadlo tak, ako ste chceli.

Ak chcete prehrať film, stačí stlačiť tlačidlo (Alternatívnou možnosťou je vybrať príkaz Prehrať z ponuky Ovládanie - „prehrať“). V tomto prípade sa čítacia hlava časovacieho panela automaticky presunie z aktuálnej na poslednú kľúčovú snímku. Kliknutím na príslušnú bunku časového diagramu ľavým tlačidlom myši môžete násilne vybrať ľubovoľný rámec na prezeranie.

V našom príklade boli obrázky, ktoré tvoria obsah snímok, vytvorené vopred, na stole iného filmu. Pre väčšinu jednoduchých filmov je však vhodnejšie vytvoriť rámový obraz priamo na stole aktuálneho filmu. Na to potrebujete:

1. Vytvorte nový kľúčový rámec na časovom diagrame.
2. Zmeňte vlastnosti objektov umiestnených na stole (tvar, polohu atď.).

Úprava animácie

V dôsledku testovania sa môže ukázať, že vytvorená „karikatúra“ úplne nezodpovedá zámeru autora a je potrebné ju opraviť.

Rovnako ako v prípade vytvárania „karikatúry“, pri jej úprave je najvhodnejšie pracovať s panelom časového diagramu, resp. kontextové ponuky tento panel.

Pripomeňme, že kontextové menu je spojené s konkrétnym objektom a obsahuje príkazy, ktoré možno na tento objekt v aktuálnej situácii (v tomto kontexte) aplikovať.

Každý typ rámca časového diagramu má svoju vlastnú kontextovú ponuku. Existuje napríklad kontextová ponuka pre kľúčovú snímku, kontextová ponuka pre „bežnú“ snímku (Frame), kontextová ponuka pre doplnené snímky animácie. Ak v počiatočných fázach ovládania budete mať ťažkosti s určením typu rámca, môžete použiť popis. Zobrazí sa na obrazovke, keď prejdete kurzorom myši na ikonu rámčeka (obr. 6.5).

Je pravda, že je potrebné mať na pamäti, že všetky snímky, ktoré nesúvisia s doplnenou animáciou, sú v tomto prípade označené ako statické (statické), ako je znázornené na obr. 6,5 vpravo.

Ryža. 6.5. Popisy označujúce typ rámca

Flash poskytuje nasledujúce možnosti úpravy animovanej sekvencie:

• korekcia obsahu ľubovoľného kľúčového rámca;
• pridávanie kľúčových snímok; nová snímka sa vkladá vždy až za koncovú snímku sekvencie; Môžete pridať dva typy kľúčových snímok:
  • so zdedeným obrázkom - pomocou príkazu Vložiť kľúčovú snímku;
  • prázdny rámec (bez obsahu) - pomocou príkazu Insert Blank Keyframe (Vložiť prázdny kľúčový rámec);
• pridanie jednoduchých (nie kľúčových) rámov; za ktorýkoľvek kľúčový rámec možno vložiť nový rám; v najjednoduchšom prípade vloženie jednoduchého rámčeka umožňuje "predĺžiť životnosť" predchádzajúceho kľúčového rámčeka; napríklad, ak v "karikatúre" s loptou pridáme niekoľko jednoduchých snímok po druhej kľúčovej snímke, spadnutá guľa si na chvíľu ľahne a až potom sa rozpadne; ak chcete pridať jednoduchý rám, kliknite pravým tlačidlom myši na kľúčový rám, za ktorý chcete umiestniť nový rám, az kontextovej ponuky vyberte príkaz Vložiť rám; jednoduchý rám sa zobrazí na časovom diagrame ako svetelný obdĺžnik;
• konverzia kľúčovej snímky na jednoduchú; vykonáva sa pomocou príkazu Clear Keyframe (Clear key frame), zahrnutého v kontextovej ponuke; obsah „vyčistenej“ kľúčovej snímky a všetkých jednoduchých snímok až po ďalšiu kľúčovú snímku sa nahradí obsahom snímky predchádzajúcej „vymazanej“ kľúčovej snímke;
• kopírovanie jedného alebo viacerých snímok; vykonáva sa pomocou príkazov kontextového menu Kopírovať snímky (Kopírovať snímky) a Prilepiť snímky (Vložiť snímky); vloženie je možné vykonať po ľubovoľnom kľúčovom snímku;
• pohyb jedného alebo viacerých snímok; vykonáva sa pomocou príkazov kontextovej ponuky Vystrihnúť snímky (Vystrihnúť snímky) a Vložiť snímky; vloženie je možné vykonať po ľubovoľnom kľúčovom snímku;
• vymazanie jedného alebo viacerých snímok; ak chcete odstrániť rám, kliknite naň pravým tlačidlom myši a z kontextového menu vyberte príkaz Odstrániť rámy;
• zmena poradia snímok na reverznú (obrátenú); Ak chcete vykonať túto operáciu, vyberte postupnosť snímok (musí začínať a končiť kľúčovou snímkou) a z kontextovej ponuky vyberte príkaz Obrátiť snímky. Skúste napríklad pomocou tejto operácie „obnoviť“ zlomenú guľu z vyššie uvedeného príkladu.

Vlastnosti jednotlivého rámu môžete zmeniť aj pomocou panela Inšpektor vlastností rámu. Pre akýkoľvek „statický“ rámec (t. j. rámec, ktorý nie je súčasťou doplnenej animácie), tento panel obsahuje rovnakú sadu prvkov (obrázok 6.6):

• textové pole (štítok rámu), určený na zadanie názvu (alebo štítku) rámu; mechanizmus označovania zavedený v , vám umožňuje implementovať navigáciu medzi snímkami filmu, aby sa návštevník stránky mohol vrátiť k jednému alebo druhému snímku; skutočný mechanizmus prechodu je implementovaný ako skript ActionScript; Technológia skriptovania ActionScript je zahrnutá v jedenástej kapitole;
• rozbaľovací zoznam Tween (užitočné), ktorý obsahuje zoznam možných spôsobov použitia doplnenej animácie; existujú tri takéto spôsoby:
  • Žiadne – nepoužíva sa žiadna doplnená animácia;
  • Motion (Movement) - doplnená animácia pohybu;
  • Tvar (Forma) - doplnená animácia transformácie objektu;
• rozbaľovací zoznam Zvuk (zvuk), ktorý vám umožňuje vybrať a priradiť symbol zvuku k rámu; ak k žiadnemu snímku filmu nie je priradený žiadny zvuk, potom zoznam obsahuje jedinú položku - Žiadny; použitie zvukového sprievodu vo filme je popísané v jedenástej kapitole; všetky ostatné prvky súvisiace s nastavením zvukových parametrov budú dostupné až po priradení zvukového symbolu k rámu;
• tlačidlo bez názvu, ale s dlhým vysvetlením - Upravte skript akcie pre tento objekt (Upravte skript pre tento objekt), kliknutím naň zobrazíte panel editora ActionScript.

Ryža. 6.6."Statický" Inšpektor vlastností rámu

Ovládanie zobrazenia rámu

V mnohých prípadoch je vhodné vidieť obsah všetkých kľúčových snímok animácie na stole súčasne. Flash ponúka niekoľko možností pre takúto kombináciu. Výber možnosti sa vykonáva pomocou tlačidiel umiestnených na spodnom okraji panela časového diagramu (obr. 6.7):

• Cibuľová koža (pauzovací papier) - umožňuje režim súčasného prezerania niekoľkých snímok; v tomto prípade je aktívny rám (na ktorom je nainštalovaná čítacia hlava) zobrazený v plnej farbe a zvyšok je viac vyblednutý (obr. 6.8 a); štandardne sa súčasne zobrazujú tri rámce: aktívny a dva susediace; zobrazený rozsah je vyznačený na mierke časového diagramu špeciálnymi značkami (pozri obr. 8.7); značky sú interaktívne - ich posúvaním pomocou myši môžete meniť hranice rozsahu; v tomto režime je na úpravu dostupný iba aktívny rám;

Ryža. 6.7. Ovládacie tlačidlá zobrazenia rámčeka animácie

• Obrysy cibule (obrysy na pauzovacom papieri) - zapnutie režimu, v ktorom sú rámce susediace s aktívnym reprezentované iba obrysmi (obr. 6.8 b); v tomto režime je na úpravu dostupný iba aktívny rám;
• Edit Multiple Frames (Edit multiple Frames) – zahrnutie režimu, v ktorom sú na úpravu dostupné všetky viditeľné snímky; všetky rámy sú zobrazené v plnej farbe (obr. 6.8 c);
• Upraviť cibuľové značky - kliknutím na tlačidlo sa otvorí ponuka, pomocou ktorej je možné zmeniť parametre hraničných značiek (obr. 6.9):
  • Vždy zobrazovať značky (Vždy zobrazovať značky) – značky sú na časovej osi vždy prítomné bez ohľadu na to, či sú povolené tlačidlá na ovládanie zobrazenia;
  • Kotviace cibuľové značky - Kotviace cibuľové značky sú uzamknuté vo svojej aktuálnej polohe; výber tejto možnosti zabráni pohybu značiek pri zmene aktívneho rámca;
  • Cibuľa 2 (Viditeľné 2) - na stole sa zobrazia dva rámce susediace s aktívnym rámcom (vpravo a vľavo);
  • Cibuľa 5 (viditeľná 5) - päť snímok sa zobrazí na stole vpravo a vľavo od aktívneho rámca;
  • Onion All - Všetky snímky animácie sa zobrazia na stole.

Ryža. 6.8. Efekt použitia rôznych zobrazení rámu

Ryža. 6.9. Menu s príkazmi na zmenu parametrov hraničných značiek

Komentujte

Všimnite si, že keď kliknete na ikonu kľúčovej snímky na paneli časovania (a tým ju vyberiete), v tabuľke sa zobrazí obrázok zodpovedajúci vybratej snímke. V tomto prípade sa všetky grafické objekty, ktoré tvoria rám, zobrazia ako vybraté.

Automatická animácia pohybu objektu

Flash dokáže vytvoriť dva typy doplnenej animácie:

• animácia pohybu (dopĺňanie pohybu);
• animácia transformácie objektu (tweening tvaru).

Vytvorte doplnené doplnenie pohybu

Animácia pohybu môže byť automaticky vytvorená pre inštanciu symbolu, skupiny alebo textového poľa.

Pri vytváraní doplnenia pohybu je potrebné nastaviť atribúty objektu, ako je poloha na stole, veľkosť, otočenie alebo uhol naklonenia pre niektorý rámec, a potom zmeniť hodnoty týchto atribútov v inom rámci. Flash interpoluje hodnoty premenných atribútov pre medziľahlé snímky, čím vytvára efekt postupného pohybu alebo transformácie.

Pohybovú animáciu môžete vytvoriť jedným z dvoch spôsobov:

• pomocou panela inšpektora vlastností rámu;
• pomocou príkazu Create Motion Tween.

Na opísanie oboch možností použijeme najjednoduchší príklad: Predpokladajme, že chcete „prevaliť“ loptičku po stole zľava doprava.

Ak chcete animovať pohyb lopty pomocou inšpektora vlastností rámu, musíte vykonať nasledujúce kroky.

1. Skontrolujte, či je na obrazovke prítomný panel inšpektora vlastností (na jeho formáte v tomto kroku nezáleží). Ak je zatvorený, vyberte položku Vlastnosti z ponuky Okno hlavného okna.
2. Zapnite nástroj Oval a nakreslite loptu na ľavú stranu stola; Všimnite si, že prvá snímka v časovom diagrame bola označená ako kľúčová.
3. Zapnite nástroj Šípka, vyberte loptu a zoskupte (skombinujte do jedného celku) obrys a výplň lopty pomocou príkazu Zoskupiť, ktorý je súčasťou ponuky Upraviť v hlavnom okne. Flash; v dôsledku toho bude lopta uzavretá v modrom rámčeku výberu.
4. Kliknite pravým tlačidlom myši do bunky snímky na časovej osi, z ktorej chcete urobiť poslednú snímku animácie (napríklad 10.) az kontextovej ponuky vyberte príkaz Vložiť kľúčovú snímku; v dôsledku toho bude medzera medzi prvou a poslednou kľúčovou snímkou ​​vyplnená jednofarebnými (svetlosivými) bunkami jednoduchých snímok, ako je znázornené na obr. 6.10.
5. Potiahnite loptu na nové miesto na pravej strane stola.
6. Kliknite ľavým tlačidlom myši na bunku prvej kľúčovej snímky; tým sa urobia dve veci súčasne: obrázok balóna sa presunie do pôvodnej polohy a panel inšpektora vlastností zmení svoj formát tak, aby zobrazoval parametre vybratého (prvého) snímky.
7. Na paneli Inšpektor vlastností vyberte položku Pohyb z rozbaľovacieho zoznamu Doplnenia; zároveň sa zmení formát panela a objavia sa na ňom prvky rozhrania, ktoré vám umožnia nastaviť parametre animácie; hoci nás nezaujímajú, oveľa dôležitejšie sú zmeny, ktoré nastali v časovom diagrame: prvá a posledná kľúčová snímka sú teraz spojené šípkou na fialovom pozadí (obr. 6.11). To znamená, že vytvorenie animácie bolo úspešne dokončené.

Ryža. 6.10. Pohľad na panel časového diagramu po dokončení 4. kroku

Ryža. 6.11. Pohľad na panel časovania po dokončení animácie

Ak sa namiesto šípky na paneli časového diagramu objaví bodkovaná čiara, v niečom sa mýlite. Pozrite sa na panel Frame Property Inspector: ak je tam tlačidlo s varovným znakom (obrázok 6.12), Flash sa vám to snaží povedať. Kliknutím na toto tlačidlo otvoríte okno s vysvetleniami situácie.

Ryža. 6.12. vyhliadka panel inšpektora vlastností rámu, keď sa vyskytne chyba

Existujú dva hlavné dôvody zlyhania: buď sa pokúšate animovať nezoskupené objekty (v tomto príklade cestu a výplň), alebo táto vrstva obsahuje viac ako jeden zoskupený objekt alebo symbol.

V mnohých prípadoch na to stačí odstrániť ďalší objekt Flash urobil animáciu. Ak sa tak nestane, po odstránení chyby zopakujte postup vytvorenia doplnenej animácie znova.

Na prehrávanie karikatúry sa používajú rovnaké nástroje ako na animáciu po jednotlivých snímkach – stačí stlačiť kláves (je lepšie najskôr zrušiť výber lopty, aj keď to nie je potrebné).

Ak chcete animovať pohyb lopty pomocou príkazu Create Motion Tween, musíte vykonať nasledujúce akcie (predpokladáme, že loptička je už prítomná v prvej snímke).

1. Kliknite pravým tlačidlom myši do bunky prvej snímky az kontextovej ponuky vyberte príkaz Create Motion Tween; v tomto prípade sa obraz lopty automaticky prevedie na grafický symbol s názvom tweenl (vizuálnym znakom transformácie je vzhľad kotviaceho bodu v strede lopty a výberový rám).
2. Kliknite pravým tlačidlom myši na bunku snímky, ktorú chcete urobiť ako poslednú v sekvencii animácie (napríklad 10.) a v kontextovej ponuke vyberte príkaz Vložiť snímku (Vložiť snímku); v dôsledku toho sa medzi prvým a posledným rámčekom objaví bodkovaná čiara, ako je znázornené na obr. 6.14.
3. Presuňte loptu na novú pozíciu (na pravú stranu stola); v tomto prípade sa posledná snímka animácie automaticky skonvertuje na kľúčovú (v bunke sa objaví čierna bodka) a bodkovaná čiara bude nahradená čiarou so šípkou (obr. 6.15).

Ryža. 6.14. Pohľad na panel časového diagramu po vykonaní príkazov Vložiť snímku

Ryža. 6.15. Pohľad na okno Flash po dokončení animácie

Vytváranie animácie je teraz dokončené. Ak sa teraz pozriete na panel Frame Property Inspector, uvidíte, že v zozname Tween je vybratá možnosť Motion.

Komentujte

Všimnite si, že vytvorenie doplneného doplnenia pohybu pomocou príkazu Create Motion Tween označí všetky snímky na časovej osi ako doplnené animované, zatiaľ čo pri použití inšpektora vlastností zostala posledná snímka „len kľúč“ (pozri obrázok 6.11). Takáto kľúčová snímka poskytuje väčšiu flexibilitu pri neskoršej úprave filmu.

Zmena nastavení Tweened Motion Tween

Po vytvorení doplnenej animácie pomocou programu Flash môžete upraviť niektoré jej parametre. Úpravu parametrov animácie možno najpohodlnejšie vykonať pomocou panela Inšpektor vlastností rámu. V tomto prípade je potrebné mať na pamäti nasledujúcu okolnosť. Aj keď všetky snímky doplnenej animácie vyzerajú na časovej osi ako jedna snímka, kliknutím na príslušnú pozíciu na časovej osi môžete vybrať ktorúkoľvek z nich jednotlivo. V dôsledku toho sa na tabuľke zobrazí obrázok súvisiaci s týmto rámom a parametre tohto rámca sa zobrazia na paneli Inšpektor vlastností.

Predtým, ako pristúpime k popisu možných spôsobov úpravy „karikatúry“, treba urobiť jednu dôležitú poznámku. Všetky štandardné operácie transformácie objektov, ktoré sa vykonávajú pomocou nástrojov panela Nástroje (napríklad zošikmenie, zmena veľkosti, konverzia kruhu na ovál atď.), sa pri vytváraní automatickej animácie nezohľadňujú Flash

Takže pre snímku obsiahnutú v doplnenej animácii pohybu možno na paneli Property Inspector nastaviť nasledujúce parametre (obr. 6.16):

• schopnosť zmenšiť (zmenšiť alebo zväčšiť) objekt; ak chcete povoliť túto možnosť pre automatickú animáciu, začiarknite políčko Mierka (mierka);

Ryža. 6.16. Formát panelu inšpektora vlastností pre rámec doplneného pohybu

• rýchlosť zmeny; v predvolenom nastavení sa zmeny vyskytujú konštantnou rýchlosťou, ale môžete to ovládať zmenou hodnôt parametra Easing: záporné hodnoty tohto parametra (od -1 do -100) znamenajú, že zmeny sa budú postupne zrýchľovať, a kladné „hodnoty“ (od 1 do 100) naopak znamenajú postupné spomaľovanie zmien;
• schopnosť animovať rotáciu objektu; výber, smer a trvanie otáčania sa vykonáva pomocou rozbaľovacieho zoznamu Otočiť (Otočiť) a textového poľa umiestneného vedľa neho časy (trvanie); Otočiť zoznam má nasledujúce možnosti:
  • Žiadne (Bez rotácie) - animácia rotácie sa nepoužíva (možnosť je predvolene nastavená);
  • Auto (Automatické otáčanie) - objekt sa otáča v smere, ktorý vyžaduje najmenší pohyb;
  • CW (Clockwise - clockwise) - objekt sa otáča v smere hodinových ručičiek; počet otáčok sa nastavuje v poli časov;
  • CCW (proti smeru hodinových ručičiek) - objekt sa otáča proti smeru hodinových ručičiek; počet otáčok sa nastavuje v poli časov;
• schopnosť nastaviť nelineárnu (ľubovoľnú) trajektóriu objektu; zabezpečuje nastavenie vlajky Orient na Path (Určite trasu); dodatočné parametre trajektórie sa nastavujú pomocou zaškrtávacích políčok Sync (Synchronizácia - synchronizácia) a Snap (Binding); Postup pri opise trasy pohybu objektu bude podrobnejšie rozobraný v nasledujúcej kapitole.

Pozrime sa bližšie na postup animácie zmeny veľkosti objektu. Aby sme to urobili, vráťme sa k príkladu lopty. Predpokladajme, že po dosiahnutí pravého okraja tabuľky by sa mala znížiť. Riešením problému je vykonať nasledujúce akcie:

1. Kliknite pravým tlačidlom myši na bunku poslednej (10.) snímky predchádzajúcej časti animácie a z kontextovej ponuky vyberte príkaz Create Motion Tween.
2. Kliknite pravým tlačidlom myši na bunku snímky, ktorú chcete urobiť poslednou v novej sekvencii animácie (napríklad 20.) a z kontextovej ponuky vyberte príkaz Vložiť kľúčový súbor; v dôsledku toho sa medzi 10. a 20. rámčekom objaví čiara so šípkou (ako je znázornené na obr. 6.17) a loptička zostane uzavretá vo výberovom rámčeku.
3. Zapnite nástroj Free .Transform na paneli Tools a zmenšite veľkosť lopty (súčasne ju môžete trochu „sploštiť“;).

Všetky. Proces dokončený. Zostáva len otestovať výsledok stlačením tlačidla .

Ryža. 6.17. Pohľad na časový diagram po vytvorení druhého segmentu animovanej sekvencie

Kombinácia snímok po snímke a automatickej animácie

Snímku po snímke a automatickú animáciu možno použiť v rovnakom filme a dokonca aj pre rovnaký objekt. A Flash je jedno v akom poradí.

Vysvetlime si techniku ​​kombinovania snímok po snímke a automatickej animácie pri popise správania jedného objektu na príklade tej istej gule. Dej filmu je celkom jednoduchý: lopta sa kotúľa po stole, potom spadne a rozbije sa. Prvá časť tohto zábavného príbehu bude realizovaná na základe doplnenej animácie, druhá --založené snímok po snímku. Oba fragmenty sme vlastne vytvorili už dávnejšie a teraz ich ostáva len spojiť do jedného filmu.

Ak teda chcete získať film, ktorý kombinuje oba typy animácií, musíte:

1. Opíšte pohyb lopty po stole pomocou doplnenej animácie (po dokončení tohto postupu by okno časového diagramu malo vyzerať tak, ako je znázornené na obr. 6.11).
2. Kliknite pravým tlačidlom myši do bunky snímky nasledujúcej za poslednou snímkou ​​doplnenej animácie (v tomto príklade do bunky 11. snímky) a v kontextovej ponuke vyberte príkaz Vložiť kľúčovú snímku; toto automaticky vyberie Žiadne (nepoužívať doplnenú animáciu) v zozname Doplnenia inšpektora vlastností.
3. Presuňte obrázok lopty na spodok tabuľky.
4. Vytvorte zvyšok kľúčových snímok animácie snímku po snímke podľa popisu v časti Animácia snímky po snímke; po vytvorení konečného rámca by okno editora malo vyzerať podobne ako na obr. 6.18.

Ryža. 6.18.Časová os filmu, ktorý kombinuje stop-motion a doplnenú animáciu

Komentujte

Ak je film vytvorený na základe filmov vytvorených skôr, môžete jednoducho skopírovať potrebné snímky do nového filmu pomocou príkazov Soru a Paste. Zároveň sa do nového filmu prenesie aj obsah políčok. Ak sa v skopírovaných snímkach použijú symboly, pridajú sa do knižnice nového filmu.

Na záver uveďme ešte jeden malý príklad, ktorý ilustruje vlastnosti použitia animácie doplneného pohybu pre textové bloky. V tomto príklade nedochádza k žiadnemu pohybu ako takému – iba používa zrkadlový obraz textu získaného pomocou nástroja Voľná ​​transformácia ako konečný rámec animácie. A tu je návod, ako sa vytvorili medzirámce Flash(obr. 6.19).

Ryža. 6.19. Príklad animácie doplneného pohybu pre textové bloky

Automatická animácia transformácie objektu

Pomocou transformačnej animácie môžete vytvoriť efekt plynulého „točenia“ objektu z jedného tvaru do druhého. Navyše výsledná podoba nemusí mať s originálom absolútne nič spoločné. Napríklad v systéme pomoci online Flash je uvedený príklad "transformácie" (obr. 6.20).

Ryža. 6.20. Príklad transformácie objektu

Animácia štandardných operácií úpravy objektu, ktoré sa vykonávajú pomocou nástrojov panela Nástroje (naklonenie, zmena veľkosti atď.), sa opäť nezohľadňuje v Flash ako transformačné operácie a možno ich pridať ako „sprievodné“ zmeny pri vytváraní animácie pohybu objektu.

Poradenstvo

Vo všeobecnosti najlepší vizuálny efekt Flash poskytuje v prípade, že nie je súčasne transformovaných viac ako jeden objekt. Ak potrebujete súčasnú transformáciu niekoľkých objektov, všetky by mali byť umiestnené v jednej vrstve.

Flash nedokáže automaticky animovať transformáciu postáv, zoskupených objektov, textových polí a bitových máp. Ak chcete sprístupniť objekty týchto typov na automatickú transformáciu, musíte na ne použiť procedúru rozdelenia.

Vytvorte animáciu doplnenej transformácie

Ak sa rozhodnete do filmu zahrnúť animáciu doplnenej transformácie, pamätajte na nasledujúce skutočnosti. Predvolené Flash sa snaží urobiť prechod z jednej formy do druhej „najkratšou cestou“. Preto môžu byť medzirámce pre vás celkom neočakávané. Ako ilustráciu toho, čo bolo povedané nižšie, je tu obrázok (obr. 6.21), ktorý ukazuje medzirámec transformácie „hodiniek“, ktoré už poznáte. Tu sa pomocou doplnenej animácie minútová ručička snaží „preliezť“ z 12 na 6 „skratkou“.

Na rozdiel od doplnenia pohybu možno animáciu doplnenej transformácie vytvoriť iba jedným spôsobom – pomocou panela Inšpektor vlastností rámu.

Aby sme vysvetlili technológiu vytvárania takejto animácie, vráťme sa k príkladu „hodiny“: predpokladajme, že chcete posunúť minútovú ručičku z „12“ na „6“.

Pri riešení tejto úlohy musíte vykonať nasledujúce kroky.

1. Skontrolujte, či je na obrazovke panel inšpektora vlastností. Ak je zatvorený, vyberte položku Vlastnosti z ponuky Okno hlavného okna.

Ryža. 6.21. Príklad medziľahlého rámca s animáciou doplnenej transformácie

1. Zapnite nástroj Oval a nakreslite s ním všetky prvky „hodiny“ znázornené na obr. 6.21, vľavo.
2. Zapnite nástroj šípka a vyberte obrázok, ktorý chcete transformovať.
3. Kliknite pravým tlačidlom myši na bunku snímky, z ktorej chcete urobiť poslednú snímku v animácii (napríklad 10.) a z kontextovej ponuky vyberte príkaz Vložiť kľúčovú snímku; v dôsledku toho sa medzi prvou a poslednou snímkou ​​na časovom diagrame objaví sekvencia jednoduchých sivých snímok, ako je znázornené na obr. 6.22, vyššie.
4. Nahraďte pôvodný obrázok na stole tým, na ktorý by sa mal transformovať; v tomto príklade stačí použiť nástroj Voľná ​​transformácia na otočenie minútovej ručičky a jej posunutie do novej polohy.
5. Kliknite pravým tlačidlom myši do bunky prvej snímky animácie; bude to mať dva efekty: pôvodný obrázok sa objaví na stole a panel inšpektora vlastností zmení svoj formát.
6. V rozbaľovacom zozname Tween vyberte možnosť Tvar; výsledkom je, že prvá a posledná snímka animácie na časovom diagrame budú spojené šípkou na svetlozelenom pozadí (obr. 6.22 nižšie); to znamená, že vytvorenie animácie bolo úspešne dokončené.

Ryža. 6.22. Pohľad na časový diagram pri animácii transformácie objektu

Výberom položky Tvar zo zoznamu Tween sa zmení formát panela inšpektora vlastností. Dá sa použiť na nastavenie nasledujúcich doplnkových parametrov animácie transformácie objektu (obr. 6.23):

• rýchlosť zmeny; v predvolenom nastavení sa zmeny vyskytujú konštantnou rýchlosťou, ale môžete to ovládať zmenou hodnôt parametra Ease: záporné hodnoty tohto parametra (od -1 do -100) znamenajú, že zmeny sa budú postupne zrýchľovať, a kladné hodnoty (od 1 do 100), naopak, znamenajú postupné spomalenie zmien;
• transformačná metóda; je určená hodnotou vybratou v zozname Blend (Transition):
  • Distribučné (rozmazané) - Flash vytvorí animáciu, v ktorej sú medziľahlé tvary hladšie;
  • Uhlový -- Flash vytvára animáciu, ktorá zachováva zrejmé uhly a rovné čiary v medziľahlých tvaroch.

Ryža. 6.23. Možnosti animácie transformácie objektu

Komentujte

Upozorňujeme, že na vytvorenie animácie nie je potrebná transformácia objektu (navyše - je zakázané) zoskupte obrys a výplň, ako aj ďalšie prvky obrázka, ktorý sa má transformovať. Všetky tieto prvky stačí jednoducho vybrať pomocou nástroja Šípka.

Aplikácia kotviacich bodov tvaru

Na kontrolu zložitejších tvarových zmien sa používajú takzvané tvarové rady, ktoré určujú, ako sa fragmenty pôvodného tvaru prenesú do nového tvaru. Inými slovami, kotviace body sa používajú na identifikáciu tých bodov pôvodného tvaru, ktorých relatívnu polohu je potrebné zachovať. Najtypickejším príkladom použitia kotviacich bodov je animácia mimiky, pri ktorej by sa niektoré jej časti (najmä oči) nemali podieľať na transformácii. Na obr. 8.24 sú zobrazené dve možnosti transformácie - bez umiestnenia a s umiestnením uzlových bodov. V druhom variante nie sú oči transformované.

Ryža. 6.24. Príklad transformácie bez umiestnenia a s usporiadaním uzlových bodov

Uzlové body sú na obrázku označené malými krúžkami s písmenami. Písmená (od a do z) sa používajú ako názvy (identifikátory) kotviacich bodov. Každý hotspot na zdrojovom obrázku musí zodpovedať bodu s rovnakým názvom na výslednom obrázku. Celkovo možno na jednu figúrku použiť najviac 26 kotviacich bodov (podľa počtu písmen abecedy). Uzlové body na zdrojovom obrázku sú sfarbené do žlta, na výslednom obrázku sú zelené.

Ak chcete umiestniť kotviace body, musíte urobiť nasledovné:

1. Kliknite ľavým tlačidlom myši na bunku rámčeka zodpovedajúcu pôvodnému obrázku.
2. Z ponuky Upraviť vyberte rozbaľovaciu ponuku Tvar a v nej príkaz Pridať nápovedu tvaru; v dôsledku toho sa na obrázku objaví "prázdno" prvého kotviaceho bodu - červený kruh s písmenom a.
3. Presuňte ho myšou do bodu na obrázku, ktorý chcete označiť ako uzol.
4. Kliknite ľavým tlačidlom myši do bunky rámca zodpovedajúceho výslednému obrázku; na stole bude červený kruh s rovnakým písmenom ako v pôvodnom ráme.
5. Presuňte kruh do bodu na obrázku, ktorý by mal zodpovedať bodu označenému v pôvodnom ráme; po posunutí kruh zmení farbu na zelenú.
6. Vráťte sa na prvú snímku sekvencie animácie a skontrolujte, či sa farba kotviaceho bodu zmenila na žltú.
7. Ak chcete pokračovať v umiestňovaní kotviacich bodov, zopakujte popísaný postup pre každý z nich.

Poznámky

1. Usporiadanie kotviacich bodov je možné až po vytvorení animácie doplnenej transformácie.
2. Usporiadanie kotviacich bodov by sa malo vykonať pomocou nástroja Šípka so zapnutým modifikátorom Prichytiť k objektom.

Poradenstvo

Ak počas transformácie použijete niekoľko kotviacich bodov, usporiadajte ich v smere hodinových ručičiek, počnúc od ľavého horného rohu obrázka. Flash totiž spracováva aktívne body v abecednom poradí.

Po umiestnení uzlových bodov sa odporúča vykonať skúšobnú jazdu filmu a v prípade potreby opraviť umiestnenie bodov. Ak chcete zmeniť polohu kotviaceho bodu, jednoducho ho presuňte na nové miesto (toto je možné vykonať na prvom aj poslednom snímku sekvencie). Okrem toho môžete vždy odobrať body navyše alebo pridať nové. Potom, čo ste s výsledkom spokojní, môžete kotviace body skryť (skryť). Uvedené operácie sa najpohodlnejšie vykonávajú pomocou kontextového menu. Ak ho chcete otvoriť, kliknite pravým tlačidlom myši na jeden z kotviacich bodov. Menu obsahuje štyri príkazy (obr. 6.25), z ktorých prvé tri sú dostupné len pre uzlové body pôvodného obrázku:

• Pridať nápovedu (Pridať uzlový bod) - po vykonaní príkazu sa na stole objaví medzera nového uzlového bodu;
• Odstrániť nápovedu – kotviaci bod, na ktorý ste klikli pravým tlačidlom myši, aby ste otvorili ponuku, sa odstráni;
• Remove All Hints (Odstrániť všetky kotviace body) – odstránenie všetkých kotviacich bodov;
• Show Hints (Zobraziť kľúčové body) - tento režim sa používa štandardne (vedľa názvu príkazu je značka); jeho opätovný výber spôsobí, že sa kotevné body stanú neviditeľnými; táto možnosť by sa mala použiť až po dosiahnutí požadovaného výsledku, pretože na návrat do režimu zobrazenia kotviaceho bodu budete musieť vybrať príkaz Pridať nápovedu tvaru z ponuky Upraviť. požadované množstvo.

Ryža. 6.25. Kontextové menu hotspotu

Dobrý deň milí čitatelia. Vo svojom článku Hovoril som o použití rýchlostných línií, pomocou ktorých môžete vytvoriť ilúziu pohybujúceho sa objektu so zrýchlením. Aj v článku bola ukázaná technika využívajúca štandardnú animáciu a prechodovú výplň počas vzhľadu objektu. Ak si tieto články nepamätáte alebo ste ich nečítali, odporúčam vám ich prečítať. Dnes chcem pokračovať v téme animácie pohybu v Adobe Flash a ukázať nie lineárny pohyb objektov, ako to bolo predtým, ale pohyb po trajektórii.

Najprv ukážem, ako táto technika funguje na jednoduchom príklade.

Vytvorte nový dokument veľkosti 600 x 200 pixelov. Pomenujte to First_animate. Farba pozadia je modrá alebo čokoľvek iné. Pre tých, ktorí si to nepamätajú, musíte najskôr vytvoriť nový dokument Action Script 3.0. (Súbor - Nový Ctrl + N). A potom na paneli vlastností (Ctrl+F3) nastavte veľkosť pracovného okna a farbu pozadia.

Premenujte prvú vrstvu na " Objekt". Vytvorte na ňom ovál ( O). Bez zrušenia výberu objektu. stlačte kláves F8 a priradiť mu symbol. názov objekt1.

Vytvorte druhú vrstvu nad " Objekt", Pomenujte to " Trajektória". Na túto vrstvu nakreslite ceruzkou trajektóriu lopty.

Kliknite pravým tlačidlom myši na vrstvu " Trajektória“ a zvoľte „ sprievodca". Vľavo sa zobrazí ikona kladiva. Teraz vytiahnite vrstvu "Objekt" pod vrstvou Trajektória„Takže ich prepojíte navzájom.

Teraz späť do pracovného priestoru. Umiestnite náš predmet na začiatok cesty. Vytvorte kľúčové snímky pre vrstvu "Objekt" a vrstviť "dráha" v snímke 30. Umiestnite loptu na koniec cesta. (Ukážka obsahuje zobrazenie vrstvy drôtového modelu "Objekt").

Teraz kliknite pravým tlačidlom myši na prvý snímok vrstvy " Objekt“ a zvoľte „ Vytvorte klasické doplnenie". Potom môžeme otestovať našu animáciu ( ctrl+enter).

Teraz sa pozrime, čo sa dá s týmito znalosťami urobiť. Dovoľte mi uviesť ďalší jednoduchý príklad. Predpokladajme. že potrebujeme nakresliť šarkana. ktorá letí po oblohe.

Vytvorme nový dokument 600 x 200 pixelov. Naplňte ju prechodom od modrej po žltú. Aby sme to dosiahli, na úplnom začiatku vytvoríme vrstvu, ktorú nazveme „ Pozadie“, nakreslite obdĺžnik v celej veľkosti plochy (teda 600 x 200 pixelov) a vyplňte ho prechodom. Ako pracovať s gradientom som už písal v článku.

Kliknite na "Vložiť - Vytvoriť symbol (ctrl + F8)". Nastavte meno šarkana. Nakreslite šarkana. Nie je to ťažké, vyzerá to ako kosoštvorec.

Aby náš drak vyzeral realisticky. Definujme jeho pohyb v samotnom symbole šarkana. Toto bude kývajúci sa had a rozvíjajúce sa stuhy. Wiggle bude robiť na úkor, rozvíjať stuhy na úkor. Najprv sa pustíme do stužiek. Ich animácia bude podobná animácii obrysu tvaru (mimochodom, stuhy sa kreslia pomocou nástroja Kefa a sú vhodné na túto manipuláciu), o ktorých som písal v článku

Takúto mačku vezmeme ako postavu. Bude sledovať vzhľad myši v ráme a vrtí chvostom.

Postava pozostáva z nasledujúcich objektov umiestnených v rôznych vrstvách:

Animácia očí pre neho je už pripravená v samostatnom symbole. Teraz nás zaujíma animácia chvosta. Animáciu na nich teda môžeme pokojne predĺžiť na požadovaný počet snímok, napríklad 20 ( použite f5) a zablokujeme vrstvy, ktoré nepotrebujeme, aby neprekážali.

Teraz chvost. Na prvom ráme máme prvú pozíciu chvosta, na 10 urobíme druhú pozíciu. Len som otočil chvost zľava doprava - Upraviť - Transformovať - ​​Prevrátiť zľava doprava.

Vo vrstve „Chvost“ na snímke 5 vytvorte prázdnu kľúčovú snímku. Ak to chcete urobiť, kliknite naň ľavým tlačidlom myši a stlačte kláves F6. Potom kliknutím na tlačidlo Odstrániť odstránite celý obsah. Tu budeme mať rýchlostné trate. Pre pohodlie povoľte " Viacvrstvová štruktúra“ alebo ako sa to inak nazýva „cibuľová šupka“, upravte jej rozsah medzi dvoma stavmi nášho chvosta.

Na piatom ráme namaľujte štetcom čiary rýchlosti, pričom majte na pamäti, že budú realistickejšie vo farbe samotného objektu, no, máme to čierne, môžete pre zmenu pridať trochu šedej. Čiary urobte tak, aby nepresahovali hranice objektu.

Teraz to musíme urobiť realistickejším. Aby sme to urobili, najprv nastavíme malú animáciu tvaru pre chvost. Urobte z rámu 3 kľúč, zmeňte tvar mačacieho chvosta a nakloňte ho mierne doprava. Potom kliknite pravým tlačidlom myši na prvý rám a pridajte animácia formulára.

Teraz urobíme to isté pre druhý chvostový stav. Na snímke 13 vytvorte kľúčovú snímku (F6). Prejdite na rám 10, trochu zmeňte chvost a nakloňte ho doľava. Potom vytvorte pre rám 10 animácia formulára.

Teraz si rámy trochu upravíme. Odstránime tie prebytočné. Aby bol pohyb prirodzenejší. A zopakujte snímky v opačnom poradí.

Lekcia 4

Macromedia Flash MX 2004 poskytuje niekoľko spôsobov vytvárania animačných sekvencií:

Efekty animácie - program sám vytvára sekvenciu snímok, ktoré napodobňujú jeden alebo iný efekt vo vzťahu k nejakému objektu;

Animácia po jednotlivých snímkach – používateľ vytvorí každú snímku budúcej animácie;

Automatická doplnená animácia, alebo animácia transformácie, - užívateľ nastaví počiatočný a koncový rámec a program sám vytvorí medzisnímky na základe softvérovej interpolácie.

Animačné efekty

Flash MX 2004 obsahuje vopred vytvorené animačné efekty (efekty časovej osi), ktoré vám umožňujú vytvárať zložité animácie pomocou minimálne množstvo akcie. Môžete použiť funkciu Efekty časovej osi na tieto objekty:

Grafické objekty vrátane tvarov, zoskupených objektov a grafických symbolov;

Rastrové obrázky;

Keď k objektu pridáte efekty animácie, Flash automaticky vytvorí príslušnú vrstvu a v tejto vrstve sa implementujú všetky transformácie pohybu a tvaru potrebné pre daný efekt. Nová vrstva automaticky dostane rovnaký názov ako efekt.

Ako príklad vytvoríme efekt „explózie“ na texte. Aby sme to urobili, vytlačíme nejakú frázu alebo slovo (obr. 1), vyberieme ho nástrojom Šípka a vykonáme príkaz Vložiť => Efekty časovej osi => Efekty => Rozložiť.

Ryža. 1. Vybraný textový objekt

V dôsledku toho sa objaví panel s rovnakým názvom (obr. 2), ktorý poskytuje možnosť nastavenia množstva parametrov efektu.

Ryža. 2. Rozložte panel

Prítomnosť okna náhľadu vám umožňuje analyzovať rôzne variácie efektov bez opustenia panelu Vybuchnúť. Po výbere požadovaných možností kliknite na tlačidlo OK a získajte niečo ako táto animácia.

Podobne je možné efekty aplikovať na bitmapu. Zoberme si príklad s hladkým zmiznutím rastrového obrázka. Import bitmapy do scény na príkaz Súbor => Import => Importovať do fázy(obr. 3) a na príkaz použite efekt Blur Vložiť => Efekty časovej osi => Efekty => Rozostrenie videoklip .

Ryža. 3. Bitmapa importovaná do scény

Ak chcete upraviť efekt animácie, vyberte objekt spojený s efektom na scéne a v zobrazenom okne Vlastnosti stlač tlačidlo Upraviť(obr. 4) - v dôsledku toho sa zobrazí panel Rozmazať.

Ryža. 4. Tlačidlo Upraviť umiestnený v spodnej časti panelu. Vlastnosti

V paneli Rozmazať môžete opäť zmeniť parametre efektu a uložiť nové nastavenia (obr. 5).

Ryža. 5. Panel Rozmazať umožňuje zmeniť nastavenia efektov

Zastavte animáciu pohybu

Zvážte najjednoduchší príklad - list sa pohybuje z jedného bodu obrazovky do druhého s rotáciou okolo svojej osi.

Ryža. 6. Prvá kľúčová snímka animácie

Nakreslíme napríklad javorový list, ako je znázornené na obr. 6, - zodpovedajúci rámček na paneli Časová os sa zmení na sivú a zobrazí sa v nej bodka, ktorá označuje, že ide o kľúčovú snímku. Kľúčová snímka je snímka, v ktorej je umiestnený alebo upravený obsah.

Ryža. 7. Vytvorte druhý rám pretiahnutím a transformáciou prvého

Potom kliknite pravým tlačidlom myši na susednú snímku a pomocou príkazu vložte ďalšiu kľúčovú snímku Vložiť kľúčovú snímku. V dôsledku toho sa v tomto ráme objaví kópia listu; posuňte ho nadol (pomocou nástroja Šípka) a otočte pomocou príkazu Upraviť => Transformovať => Voľná ​​transformácia(obr. 7).

Postup zopakujeme tak, aby v 6. snímke list zaujal konečnú pozíciu (obr. 8).

Ryža. 8. Posledná snímka animácie

Venujte pozornosť panelu Vlastnosti(obr. 8) - typ objektu je vyznačený v jeho ľavej časti. V každom ráme je list objektom typu tvar(tvar), o iných typoch predmetov bude reč neskôr.

Ak chcete exportovať film ako súbor SEF (natívny formát Macromedia pre filmy Flash), spustite príkaz Súbor => Exportovať => Exportovať film. Výsledkom je nasledujúci film opustiť1.fla). Výsledný film si môžete pozrieť bez toho, aby ste opustili program Flash na príkaz Ovládanie => Testovať film. Okrem toho, aby ste videli, koľko miesta zaberajú jednotlivé snímky filmu, mali by ste vykonať príkaz . Vo výsledku uvidíme, že každý zo šiestich rámcov zaberá približne 600 KB (obr. 9). Objem celého filmu je teda 3686 bajtov.

Ryža. 9. Sledujte film v režime Profilovač šírky pásma

Aby ste pochopili, či je to veľa alebo málo, zvážte, ako možno podobný film vytvoriť pomocou automatickej animácie alebo animácie transformácie pohybu.

Automatická animácia

Ryža. 10. Objekt sa automaticky zmení na grafický symbol

Pozrime sa, ako môžeme urobiť rovnakú animáciu a získať kompaktnejší výsledný súbor. Vyberte nakreslený list na obrazovke pomocou nástroja Šípka a vykonajte príkaz Vložiť => Časová os => Vytvoriť doplnenie pohybu v dôsledku toho bude krídlo umiestnené v ráme a v paneli Vlastnosti zobrazí sa správa, že vybraný objekt má vlastnosti Grafický(obr. 10). To znamená, že animovaný objekt sa automaticky prevedie na grafický symbol. Teraz ho už nie je možné ľubovoľne upravovať pomocou nástroja Šípka ako objekt typu Tvar. Používanie symbolov je dôležitým pojmom vo Flashi. Po vytvorení symbolu ho možno vo filme použiť viackrát bez toho, aby sa zväčšila veľkosť výsledného súboru. Symboly sa delia na grafické (grafické), symboly tlačidiel (tlačidlo) a symboly filmových klipov (filmový klip). V tejto lekcii sa budeme zaoberať grafickým symbolom a k iným typom symbolov sa vrátime neskôr. Každý nový symbol sa okamžite stáva súčasťou knižnice aktuálneho dokumentu (obr. 11).

Ryža. 11. Každý nový symbol sa stáva súčasťou knižnice

Ak spustíte príkaz Okno => Knižnica, môžete sa uistiť, že sa symbol objavil v knižnici a že má predvolene názov Tween 1. Ak chcete symbolu priradiť iný názov, dvakrát kliknite na názov a nahraďte ho požadovaným. Po vytvorení grafického symbolu prejdite na posledný snímok našej animácie (nech je to 15. snímka) a vložte kľúčovú snímku (pomocou príkazu Vložiť kľúčový rám). V tomto rámčeku sa objaví kópia symbolu, ktorú budeme posúvať a otáčať okolo osi (príkazom Upraviť transformáciu=>Voľná ​​transformácia) ako v predchádzajúcom príklade. Ako je možné vidieť na obr. 12, všetky snímky medzi dvoma kľúčovými snímkami sa zmenili na modrú a šípka sa roztiahla od prvej kľúčovej snímky po poslednú, čo znamená vytvorenie animácie doplnenie pohybu.

Ryža. 12. Šípka na modrom pozadí označuje vytvorenie animácie doplnenie pohybu

Vykonaním príkazu Ovládanie => Testovať film, získame informácie uvedené na obr. 13.

Ryža. 13. Sledovanie filmu v režime Bandwidth Profiler

Napriek tomu, že v tomto príklade máme skôr 15 ako šesť snímok, ako v predchádzajúcom a animácia sa ukázala ako plynulejšia, veľkosť výsledného súboru je menšia - iba 900 bajtov. Ako je zrejmé z diagramu (obr. 13), informácie o objekte sú uložené iba v prvom rámci a v každom novom rámci je potrebné zapamätať si iba nové polohy listu. To trvá v priemere len 20 bajtov.

Aby sme ilustrovali pád listu s rotáciou okolo roviny listu, zopakujeme predchádzajúci príklad, len pri úprave posledného kľúčového snímku pridáme príkaz Upraviť => Transformovať => Prevrátiť Horizontálne. Výsledkom je nasledujúci film.

Teraz zvážte príklad, keď sa k divákovi priblíži list. Ak to chcete urobiť, v konečnom rámci namiesto zrkadlenia ( Prevrátiť horizontálne) zväčší veľkosť listu. Aby sa zabránilo pocitu spomalenia, keď sa objekt priblíži k divákovi, musí sa zvýšiť rýchlosť jeho pohybu. Aby ste dosiahli tento efekt, musíte kliknúť na prvý rám a pozrieť sa na sekciu Ľahkosť v paneli Vlastnosti. Kladné hodnoty parametra Ease spôsobia spomalenie pohybu a záporné hodnoty jeho zrýchlenie. Zvoľme maximálne zrýchlenie objektu.

Ryža. 14. Zvoľte maximálne zrýchlenie objektu Ease = -100

Ak to chcete urobiť, nastavte hodnotu parametra Ľahkosť rovná –100 (obr. 14). Výsledkom je film. Všimnite si, že prvé políčko môže byť umiestnené aj za scénou, potom dostaneme film, v ktorom list vletí do rámu a bude sa pohybovať smerom k divákovi. Môžete simulovať otáčanie listu okolo posunutého stredu symetrie. Dúfam, že samotný čitateľ bude môcť experimentovať, čo skomplikuje úpravu konečného rámu a tým zmení charakter pohybu listu.

Z prezentovaných príkladov je zrejmé, že automatická animácia pohybu je efektívna vtedy, keď je transformácia objektu pri jeho pohybe nastavená jednoduchými funkciami (rotácia, zmena mierky a pod.). Ak je potrebné animovať zložité pohyby (napríklad pohyb ruky kreslenej postavičky), animácia transformácie pohybu tu nie je použiteľná. Každá snímka sa musí nakresliť ručne, to znamená, že sa použije animácia snímok po snímke, ktorá pozostáva zo sady kľúčových snímok. Animácia po snímke je teda najuniverzálnejším, no zároveň aj časovo najnáročnejším typom animácie, navyše vytvára „najťažšie“ súbory. Vždy, keď je možné nahradiť animáciu po jednotlivých snímkach automatickou, je to vhodnejšie. Pozrime sa na niekoľko príkladov, ktoré umožňujú použiť automatickú animáciu pohybu pri simulácii letu.

Pohyb po danej trajektórii

Blesk umožňuje nastaviť pohyb objektu po danej dráhe. Ak chcete nastaviť túto trajektóriu, spustite príkaz Vložiť => Časová os => Sprievodca pohybom.

V dôsledku toho sa nad aktuálnou vrstvou zobrazí špeciálna vrstva, ktorá bude mať predvolene názov Vodiaca vrstva 1.

Klikneme na vrstvu trajektórie a pomocou nástroja ceruzka nakreslíme čiaru, po ktorej plánujeme posúvať list (obr. 15).

Ryža. 15. Príklad nastavenia trajektórie pohybu

Teraz poďme na prvý rám (kliknite naň myšou) a na panel, ktorý sa zobrazí Vlastnosti začiarknite políčko Snap(nastavuje režim väzby na trajektóriu pohybu) - obr. 16.

Ryža. 16. Parameter Snap nastaví režim prichytenia na dráhu pohybu

Po začiarknutí políčka Snap, stred listu je zarovnaný s dráhou pohybu. Pomocou nástroja Šípka môžete posúvať list pozdĺž pohybovej krivky, ale ak sa pokúsite list odtrhnúť od cesty a položiť ho vedľa nej, stiahne sa a opäť sa „prilepí“ na dráhu pohybu (obr. 17).

Ryža. 17. Objekt sa akoby stredom drží trajektórie pohybu

Prejdite na posledný snímok a podobne priviažte list ku koncovému bodu dráhy pohybu. Ak chcete dať filmu objem, pridajte transformáciu Prevrátiť horizontálne, - ako výsledok dostaneme film .

Keď sa list pohybuje po dráhe, je nám jedno, ako sa bude otáčať v smere pohybu. Ale ak nastavíme dráhu letu vtáka podobným spôsobom, potom v niektorých častiach krivky to dopadne tak, že vták letí chvostom ako prvý.

Je zrejmé, že ak chceme animovať let lietadla alebo vtáka, potom potrebujeme, aby sa neustále posúval vpred. Vo Flashi je veľmi jednoduché nastaviť takýto charakter pohybu (obr. 18).

Ryža. 18. Ak začiarknete políčko Orientovať sa na cestu, vták poletí hlavou napred

Vyžaduje sa začiarkavacie políčko Orientovať sa na cestu, a pohyb vtáka sa zmení na celkom známy (zdroj pre toto video je let vtáka.fla).

Ryža. 19. Pridanie jednofarebného pozadia

Ak chcete pridať jednofarebné pozadie, kliknite na pozadie a na zobrazený panel Vlastnosti(obr. 19) v teréne pozadie vyberte požadovanú farbu pozadia.

Ak chceme pridať obrázok na pozadí, potrebujeme na to samostatnú vrstvu. Flash v princípe ponúka možnosť vytvorenia systému vrstiev podobných tým, ktoré sa používajú v klasickej animácii, v ktorej sa pozadie a rôzne pohyblivé objekty kreslia každý na vlastnú vrstvu priehľadnosti.

Umiestnením obrázka na pozadí a každého animovaného objektu do vlastnej vrstvy je oveľa jednoduchšie dosiahnuť nad nimi kontrolu. Ak teda chcete pridať obrázok na pozadí, vytvorte preň novú vrstvu. Ak to chcete urobiť, kliknite pravým tlačidlom myši na vrstvu, ktorá na obr. 19 je označená ako vrstva 1 a v rozbaľovacej ponuke vyberte riadok Vložiť vrstvu. V pridanej vrstve nakreslite slnko. Aby sme sa nenechali zmiasť číslami vrstiev, nazvime vrstvu „pozadie“. Za týmto účelom kliknite na aktuálny názov a zadajte požadovaný názov (obr. 20).

Ryža. 20. Vytvorte stacionárny objekt pozadia na novej vrstve

Ako je možné vidieť na obr. 20, vták je za slnkom, čo je v rozpore so zdravým rozumom. Na výmenu vrstiev stačí v režime drag-and-drop potiahnuť vrstvu s názvom „pozadie“ nadol.

Upravme filmové objekty (aby vták mohol krúžiť na pozadí slnka, zmeniť trajektóriu letu a zmeniť pomer veľkostí slnka a vtáka) a získajme nasledujúci film.

Ryža. 21. Ak chcete animovať oblak, vytvorte samostatnú vrstvu

Teraz do našej animácie pridajte pohybujúce sa objekty, ako napríklad oblak. Pre cloud vytvorte novú vrstvu a nastavte na nej animáciu transformácie pohybu. Aby oblak vletel do scény, umiestnite ho podľa obr. 21. Výsledkom je nasledujúci film (zdroj tohto filmu je v priloženom súbore

Pri vytváraní animácie pohybu môžete definovať pohyb objektu po určitej trajektórii – po priamke, po prerušovanej krivke pozostávajúcej z priamych segmentov a po hladkej zakrivenej čiare.

Animácia pohybu v priamke

Príklad 1:
Pozri príklad 2

Vytvorme pohyb roviny po priamke.

Do prestrihovej scény vložte obrázok lietadla na ľavú stranu scény. Môžete vytvoriť vektorový obrázok lietadla v programe Adobe Flash (pozri Nákres) alebo importovať obrázok vytvorený na boku (vo formáte .png s priehľadným pozadím).

Vyberte rovinu v scéne. V kontextovej ponuke lietadla vyberte Previesť na symbol(Previesť na Sumbol). Vyberte grafický typ symbolu.

V kontextovej ponuke obrázka vyberte Vytvorte doplnenie pohybu(Vytvoriť doplnenie pohybu). Program automaticky vytvorí 24 snímok pre plynulé zmeny.
Presuňte obrázok na pravú stranu scény.
Môžete upraviť dĺžku trvania animácie a ďalšie - pozri nižšie. Personálny manažment .

Vytvorí sa animácia roviny pohybujúcej sa po priamke, možno ju zobraziť kliknutím na kláves Enter.

Z tohto príkladu možno vyvodiť nasledujúce závery:

Dĺžka každého nového rozsahu doplnenia, ktorý program automaticky vytvorí, štandardne zodpovedá nastavenej rýchlosti animácie. Ak je rýchlosť animácie nastavená na 24 snímok za sekundu, predvolene sa vytvorí 24 snímok (1 sekundová animácia). Ak zvolíte 30 fps. - predvolená oblasť zmeny bude 30 snímok.

Aby program vytvoril plynulú zmenu, musí byť objekt vložený do scény prevedený na symbol. V tomto prípade môže byť objektom čokoľvek - vektorový obrázok vytvorený v Adobe Flash, text, importovaná bitmapa atď. Ak sa snažíte vytvoriť plynulú zmenu na neznaku, program vás požiada o konverziu prvku na symbol ().

Naraz je možné doplniť iba jeden znak. Ak sa pokúsite aplikovať zmenu na vrstvu s viacerými objektmi, program vás požiada o konverziu grafických znakov na jeden znak.

Plynulé zmeny veľkosti možno použiť na zmenu veľkosti/zmeny, zmenu farieb a použitie filtrov.

Poznámka: Miznutie pre efekty filtra sa vzťahuje len na symboly klipov a tlačidiel, nie na grafické symboly.

Poznámky:
1. Pri vytváraní klasického doplnenia pohybu je postup odlišný – viď nižšie. Vytvorte klasické doplnenie .
2. Vytváranie pohybu objektov pri animácii snímok po snímke – pozri animáciu snímku po snímke
3. V našom príklade sa lietadlo pohybovalo v rámci scény. Ale počiatočná poloha lietadla (alebo iného objektu) môže byť mimo scény, zatiaľ čo lietadlo môže vyskočiť „za scénu“ (vpravo, vľavo, hore, dole). Rovnako tak môže zmiznúť z javiska „v zákulisí“. V zásade môže byť počiatočná aj koncová poloha objektu mimo scény, t.j. objekt vyskočí „v zákulisí“, predvedie svoje triky na javisku a opäť zmizne „v zákulisí“.

Animácie kriviek

Existuje niekoľko spôsobov, ako vytvoriť pohyb objektu pozdĺž krivky:

Metóda 2
Vložte červený štvorec do javiska
Vytvorte doplnenie pohybu pre štvorec (pozrite si časť Vytvorenie doplnenia pohybu)
V dôsledku toho sa na scéne objaví náš štvorec a jeho dráha pohybu (vo forme čiary so značkami).

Môžete upraviť dráhu pohybu, ktorá neovplyvní samotnú cestu, ale objekt (ako je znázornené na animácii nižšie):



Použitie tejto metódy je jednoduché: kliknite na vybranú snímku na časovej osi (naša je 10., 20. a 30. snímka) a podľa toho pohybujte objektom po scéne (bez ovplyvnenia krivky cesty).Program automaticky vytvorí kľúčové snímky v vybrané rámy.

Vytvorenie vlastnej cesty

1. Prilepte kresbu lietadla do scény.

2. Konverzia kresby lietadla na grafický symbol
3. Vytvorte novú vrstvu s názvom „Cesta“, na ktorú ceruzkou () nakreslite trajektóriu lietadla. Traťová trať nesmie byť uzavretá.

4. Ak je to potrebné, vyhladzujte čiaru cesta pomocou nástroja "Vyhladenie" () v spodnej časti Panely s nástrojmi .

5. Vyberte vytvorenú cestu a skopírujte ju do schránky. Potom môže byť samotná cesta vymazaná.

6. Vrátime sa do rovinnej vrstvy. Vyberte lietadlo na scéne, v kontextovom menu zvoľte " Vytvorte doplnenie pohybu“ (Vytvoriť doplnenie pohybu).

7. Vyberte rovinu na scéne, v menu Edit (Edit) zvoľte "Paste" alebo "Paste in Place" (Paste in Place).
K obrázku lietadla je pridaný obrázok dráhy pohybu.

8. Ak chcete zobraziť, umiestnite červený posúvač na 1. snímku a kliknite na kláves Enter.

Úprava dráhy pohybu

Cestu pohybu môžete transformovať rovnakým spôsobom ako ktorýkoľvek iný grafický objekt.

Vyberte bezplatný transformačný nástroj(Free Transform) na paneli s nástrojmi a kliknite na dráhu pohybu.
Okolo cesty pohybu sa objavia úchopy transformácie.

Cestu pohybu môžete priblížiť alebo otočiť. Zakrivenie dráhy môžete vytvoriť pomocou nástrojov na výber a Previesť kotviaci bod(Convert Anchor Point) – tento nástroj sa skrýva pod nástrojom Pen (Pen).

Kliknite na počiatočný bod a presuňte rukoväť začiatku výberu, ktorá riadi zakrivenie cesty.

3 Ak chcete opraviť cestu, vyberte z panela nástrojov nástroj pre podvýber.
4 Kliknutím a ťahaním rukoväte upravte krivku cesty.
Poznámka: S dráhou pohybu možno priamo manipulovať aj pomocou nástroja na výber ().
Vyberte nástroj výberu () a presuňte ho blízko k dráhe pohybu. Vedľa kurzora sa zobrazí ikona krivky, ktorá označuje, že cestu môžete upraviť. Kliknutím a potiahnutím dráhy pohybu zmeníte zakrivenie.

Môžete vybrať objekt, kliknúť naň pravým tlačidlom myši, vybrať z ponuky Vytvorte doplnenie pohybu. Potom posúvajte posúvač pozdĺž časovej osi a synchrónne posúvajte objekt pozdĺž vytvorenej krivky.

Poznámka:
Ak ste trasúcou sa rukou nakreslili príliš nemotornú cestu a zároveň ste priradili príliš málo snímok na to, aby ste sa mohli po tejto ceste pohybovať, program nebude môcť dokončiť úlohu a zopakovať všetky ohyby cesty.
V tomto prípade sa zobrazí reklama:
"Krivka musí byť zjednodušená, aby sa zmestila na počet snímok dostupných v aktuálnom doplnení pohybu. Vyberte jednu z nasledujúcich metód."
Alebo: „Krivka musí byť zjednodušená, aby zodpovedala počtu snímok dostupných v aktuálnom doplnení. Vyberte si jednu z nasledujúcich metód...“ a ponúknu sa dve možnosti, pričom prvou je zjednodušenie cesty.

Pozrite si ďalšie:
Vytvorte si vlastnú cestu animácie


Obrátenie smeru jazdy

Ak chcete, aby sa objekt presunul z koncového bodu do počiatočného bodu, v kontextovej ponuke objektu vyberte Trajektória ( dráha pohybu ) - Obrátená trajektória(Obrátená cesta).

Pozri tiež:

Orientácia objektu v pohybe

Niekedy je dôležitá orientácia objektu pohybujúceho sa po ceste.
V našom príklade sa lietadlo musí pohybovať nielen po svojej trajektórii, ale súčasne sa aj otáčať tak, aby jeho nos bol v smere jazdy.

1 Kliknite na vrstvu doplnenia pohybu na časovej osi (časová os). V našom príklade je to vrstva "lietadlo".

2. Vyberte dráhu pohybu pomocou nástroja na výber ()

3. Správne nastavte objekt vzhľadom na dráhu pohybu v 1. a poslednom snímku animácie.

4. V Inšpektor nehnuteľnosti vyberte Orientácia cesty(Orient to path) vo voľbe cesty.

Editor vkladá okrajové rámčeky na otáčanie pozdĺž hladkej zmeny pohybu tak, aby bol nos lietadla orientovaný pozdĺž dráhy pohybu.

Program automaticky pridáva kľúčové snímky a otáča rovinu pozdĺž trajektórie.

Časová os bude vyzerať takto:

Poznámka: Aby možnosť orientácie fungovala správne, musí byť lietadlo v základnej polohe správne nastavené, t.j. jeho nos by mal smerovať pozdĺž dráhy pohybu.
Ak to chcete urobiť, použite bezplatný transformačný nástroj, otočte lietadlo, aby ste ho správne nastavili.