Flash - jdoucí Elvis. - Grafika.cz - vše o počítačové grafice

Odběr fotomagazínu

Fotografický magazín "iZIN IDIF" každý týden ve Vašem e-mailu.
Co nového ve světě fotografie!

 

Zadejte Vaši e-mailovou adresu:

Kamarád fotí rád?

Přihlas ho k odběru fotomagazínu!

 

Zadejte e-mailovou adresu kamaráda:



Webdesign

Flash - jdoucí Elvis.

4. září 2001, 00.00 | Jednoduchá animace chůze za použití Motion Tween.

Dnešním malým tutoriálkem bych chtěl začít takový malý seriál o Flashi, který by se ovšem týkal pouze a jen animací, které jdou v tomto programu vytvořit. Z toho jasně vyplývá, že se v mých článcích budete shledávat s pouze velmi malým množstvím ActionScriptu, který nebude předmětem těchto článků. Vyžití tedy najdou hlavně tací, kteří spatřují v animačních schopnostech Flashe jeho hlavní přednost.

Tak a do práce .... v tomto prvním díle si ukážeme jak vytvořit jednoduchou chodící postavu a to pomocí MotionTweenů, nikoliv tedy frame by frame.

Nastavení pracovní plochy nechám pouze na vás, neboť to není nejdůležitější. Já osobně jsem zvolil 550 x 400 px a pozadí bílé.

V první řadě si vytvoříme v knihovně symbolů 5 nových "grafik". Budou to: hlava, lýtko, ruka, ruka zadní, stehno, sukně a tělo. Plus budeme potřebovat Movie Clip se jménem "final".

Nejdříve nakreslíme lýtko ...

... naše "lejtko" bude včetně chodidla, ovšem nekladou se meze fantazii a je možné vytvořit chodidlo ze dvou samostatných částí, aby byl jasně vidět pohyb tohoto chodidla při chůzi - my ovšem zůstaneme pouze u hromadného zobrazení obou těchto částí.

 

Dále vytvoříme ruku ...

... taktéž ruka bude v této ukázce kompletní - celá paže " v kupě". Dalším krokem bude vytvoření symbolu "ruka zadní", do kterého můžeme jednoduše okopírovat symbol "ruka" a pouze dodělat dlaň ....

... stehno bude mít velice zvláštní tvar - bude to jakási elipsa, u níž si stejně jako u ruky můžeme dopřát stínování apod.

Symbol "sukně" doporučuji udělat až na konec, protože slouží jako jakási kamufláž, aby nebyly vidět nepravidelné pohyby stehen.

Předposlední - tělo - vytvoříme rovněž dle vlastní fantazie, ale nesmíme zapomenout na "vyboulené" zakončení krku a pasu a to opět z podobného důvodu jako u "sukně", tedy kvůli kamufláži.

No a poslední je hlava - vzhledem k tomu, že já jsem použit "Elvise v sukni", tak hlava v mém provedení vypadá asi takto:

Tak ... všechny symboly jsou hotovy a nezbývá než je dát dohromady. To vše provedem v symbolu "final".

Vytvoříme si celkově 9 vrstev. Do první - nejnižší - si vložíme "ruka zadní", do druhé "stehno", do třetí "lýtko", do čtvrté "tělo", do páté "hlava", do šesté a sedmé vrstvy zkopírujeme vrstvy druhou a třetí, tedy opět "stehno" a "lýtko", do osmé "sukně" a do deváté "ruka".

Nyní dojde k samotné animaci - celková délka motion tweenů bude 26 snímků, takže doporučuji "roztáhnout" ji na tuto úroveň, aby byla pozdější práce snažší. Nejdříve začneme se zadní rukou:

1. určíme si nový střed pro rotaci - Modifikace-transformace-upravit střed - který bude umístěn v místě ramene. Koncový snímek Tweenu bude na 14. políčku, kdy bude tato ruka rotována asi v úhlu 45° dozadu. Na 26. snímek zkopírujeme snímek 1. kvůli pozdější plynulosti.

Dále budeme animovat stehno a to totožným způsobem jako ruku. Velice důležité je nezapomenout nadefinovat střed pro rotaci jak na prvním, tak na koncovém snímku animace, neboť v případě neprovedení tohoto kroku by pozdější rotace nebyla pouze rotací, ale také posunováním, což my nechceme.

Animace lýtka probíhá také stejným způsobem, ovšem musíme dávat na koncovém a počátečním snímku pozor na to, aby vzájemné spojení obou částí -stehno a lýtko - bylo plynulé, resp. co nejplynulejší ...

Stejné kroky provedeme také u přední ruky a druhé nohy, které je umístěna ve vyšší vrstvě. Tělo samotné dodáme tak, aby pas byl v jistém odstupu od stehen a toto místo poté vyplníme "sukní" - resp. kamufláží.

Hlava se postavě může také trochu houpat a výsledné "animační řady" by měly vypadat asi takto:

Symbol "final" bychom tedy měli hotov, ale stále se nám naše postava hýbe pouze na místě. Přepneme se proto do hlavní scény, kde přetáhneme symbol "final" a dáme mu animaci "přesunu" do pravé části obrazovky a to takových cca 110 políček. Náš výsledek bude tedy vypadat asi takto:

Mnoho lidí může podotknout, že se jedná o hodně zjednodušený model, ale výsledek - podle mne - je více než uspokojující v porovnání s výslednou velikostí - cca 9 kB. Je jasné, že pomocí metody frame by frame se dá vytvořit věrohodnější pohyb, ale ..... to až příště.

A abych nezapomněl, tady je zdroják ZDE.

Obsah seriálu (více o seriálu):

Tématické zařazení:

 » Rubriky  » Go verze  

 » Rubriky  » Webdesign  

 

 

 

 

Přihlášení k mému účtu

Uživatelské jméno:

Heslo: