SEZNAMTE SE - FLASH 4 - VI - 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

SEZNAMTE SE - FLASH 4 - VI

14. února 2000, 00.00 | Malá Flashová diskotéka frame by frame. Animování postaviček.

Dnes si uděláme malou animovanou diskotéku, ale bohužel bez hudby (je příliš velká). Budme potřebovat několik gif obrázků, samozřejmě můžete použít svoje a tenhle tutorial využít jako vodítko, ale pokud nemáte žádné při ruce, jsou k dispozici tyhle. Nemusíte se obávat, jsou v zipu velikém 14 kB.

Začínáme jako obvykle nastavením velikosti jeviště a dnes můžeme i zabarvit pozadí. Modify -- Movie. 350x200, pozadí černé.
* Animujeme první postavu -- Ctrl + F8 -- Movie Clip -- zapíšeme jméno.

Vložíme první obrázek -- File -- Import -- p000.gif (pokud používáte moje soubory). Flash se Vás zeptá, zda chcete importovat celou sérii obrázků -- Ano. V timeline se nám obrázky naskládaly za sebe, po přehrátí animace vidíme, že postava tancuje pouze do jedné strany. Abychom ji trošku víc rozhýbali, zanimujeme ji i do druhé strany (Tahle akce se dá udělat buď ve Flashi přímo, nebo si můžeme všechny obrázky připravit předem a pootáčet je třeba v Photoshopu a poté je všechny v řadě importovat. Pokud jsou to takové malinké obrázky jako v našem případě můžeme to udělat předem, ale pokud by byly větší, musíme mít na mysli, že zvětšujeme výsledný soubor a prodlužujeme dobu stahování.)

Označíme všechny keyframy (viz obr.) -- pravý klik -- Copy Frames -- na poli 7 -- Paste Frames. Nyní máme pole 1 a 7, 2 a 8, 3 a 9 shodná. Klik na pole 7 -- Modify -- Transform -- Flip Horizontal. Klik na pole 8 a provedeme to samé na všech polích do konce. Enterem si animaci přehrajeme a vidíme, že pohyby postavy jsou hodně rychlé, tak ji zpomalíme. Modify -- Movie -- upravíme Frame Rate na rychlost 5 fps. V timeline klik na Scene 1. Otevřeme knihovnu -- Window -- Library. Vidíme, že zde máme uloženy všechny obrázky a animace. Tuto uchopíme a tažením ji umístíme na jeviště (viz obr.)

* Vytvoříme další animaci. Ctrl + F8 -- Movie Clip -- zapíšeme jméno. File -- Import -- po000.gif.(zase jen pokud používáte moje gify) Flash se zeptá, jestli importovat sérii -- Ano. Vybereme jako v první ukázce všechny keyframy a zkopírujeme na pole 11. Tady klik -- Modify -- Transform -- Flip Horizontal. Tento krok opakujeme až na pole 20. Vrátíme se na Scene 1 a z knihovny animaci přetáhneme na jeviště.

* Ctrl + F8 -- Movie Clip -- další postava. File -- Import -- poh000.gif -- vložíme sérii. Zde máme pouze 6 obrázků a abychom se naučili přetahovat a kopírovat keyframy, tak vhodným střídáním z nich vytvoříme animaci.( postup viz obr.)

Takže jsme vytvořili 10 keyframů, které způsobem výše popisovaným okopírujeme a horizontálně otočíme. Vrátíme se na Scene 1 a tažením umístíme animaci.

* Ctrl + F8 -- Movie Clip -- a vložíme poslední postavu. File -- Import -- pohy000.gif.

Podle obrázku přidáme a přesuneme keyframy, poté je všechny okopírujeme, přidáme a horizontálně pootáčíme. Na Scene 1 tažením animaci umístíme. Tanečníci jsou hotovi, chtělo by to ještě nějaká světla.

* Na Scene 1, v první vrstvě, kterou jsem si pojmenoval postavičky, na poli 4 přidáme keyframe -- F6. Pak přidáme vrstvu -- Add Layer. pojmenujeme ji třeba světla. Na poli 1, nástrojem Oval bez okraje barvou viz obrázek, nakreslíme kruh.

Dvojklik na kruh -- Insert -- Convert to Symbol -- Graphic -- a napíšeme jméno. Dvojklik na obrázek -- Color Effect -- Alpha -- 60%.

Nástrojem Rotate jej zkosíme a nástrojem Scale zvětšíme.

Klik na pole 2 -- F6, pravý klik nad bílým oválem -- Cut -- a nástrojem Oval nakreslíme další barvou, červenou, kruh. Celou akci opakujeme ještě s modrou a zelenou barvou a diskotéka je hotova.

Příště - pár ukázek animací textu.

Starší články:
SEZNAMTE SE FLASH I - seznámení
SEZNAMTE SE FLASH II - tweening
SEZNAMTE SE FLASH III - tweening po dráze
SEZNAMTE SE FLASH IV - animace shape
SEZNAMTE SE FLASH V - používání hintů

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: