Flash - Efekt založený na nedokonalosti bitmap - Grafika.cz - vše o počítačové grafice

8. února 2001, 00.00 | V tomto článku si ukážeme, jak lze využít nedokonalosti bitmap pro docela pěkný efekt ve Flashi.

V tomto článku si ukážeme, jak lze využít nedokonalosti bitmap (resp. zkomprimovaných do formátu Jpeg nebo Gif) pro docela pěkný efekt ve Flashi. Výsledný efekt po přejetí myší přes šedé tlačítko bude vypadat následovně:

Pro náš efekt potřebujeme jakýkoliv obrázek nebo fotku. Já jsem si vybral následující o velikosti 150 x 150 pixelů. Z tohoto obrázku budeme vycházet a v našem oblíbeném grafickém programu si připravíme ještě dalších šest obrázků postupným zmenšováním výchozího.

Konečně si můžeme otevřít Flash, pokud jsme tak neudělali již dříve. Nastavíme si velikost jeviště (Dimensions) například na 160 x 180 pixelů (CTRL M), počet snímků za sekundu necháme nastavené na 12 (Frame Rate), barvu pozadí (Background Color)  například modrou. Na jevišti si vytvoříme šedý nevyplněný čtverec o velikosti původního obrázku a konvertujeme ho do grafického symbolu s názvem ctverec (F8). 

Přidáme druhou vrstvu ( Insert Layer) s názvem tlacitko, do níž přidáme tlačítko na spouštění efektu po přejetí myši. Namalujeme si grafický objekt, převedeme ho opět na grafický symbol s názvem tlacsede, abychom mohli udělat animované tlačítko. Duplikujeme tento symbol (Duplicate), přejmenujeme (Rename) na tlacitko a změníme ve vlastnostech (Properties) jeho podobu na Button. Tlacitko editujeme a vytvoříme jen dvě pozice - Up a Over. Pro dosažení jednoduché animace, přidáme další vrstvu (animace) a v prvním snímku umístíme grafický symbol tlacsede, změníme jeho velikost v panelu Transform na 75 % a přebarvíme v panelu Efekty (Effect) nástrojem Odstín (Tint) na tmavší odstín šedé,  F6 se dostaneme na další snímek a přebarvíme symbol na barvu pozadí, tím máme tlačítko hotové.

Vytvoříme klip, první frame necháme prázdný a do druhého naimportujeme (CTRL R) obrázky, každý z nich umístíme na pozici (0;0) klipu a zvětšíme je na velikost 150 x 150 pixelů pomocí panelu Info. Označíme snímky mimo prvního a obrátíme jejich pořadí (Reverse Frames) pomocí menu, které se nám zobrazí kliknutím pravým tlačítkem myši nad označenými snímky. Do prvního a posledního rámečku umístíme akci stop z Objekt Actions (v menu Actions).

Nyní nám už zbývá umístit klip na hlavní scénu do nejspodnější vrstvy a přiřadit mu instanci "klip" (Panels - Instance). Definujeme tlačítko tak, aby reagovalo po přejetí myší "Roll Over" a také akci "Tell Target" odkazující se na instanci "klip" a zajistíme spuštění klipu příkazem "gotoAndPlay".

Na hlavní scéně máme teď umístěn v první vrstvě s názvem ctverec prázdný čtverec, ve druhé tlacitko a v poslední klip.

Ukážeme si, jak bude efekt vypadat, když na jednotlivé postupně zmenšované snímky mimo největšího (150 x 150)  použijeme navíc např. ve Photoshopu filtr mozaika (Filter - Pixelate - Mosaic) o velikosti 5.

Pro efekt můžeme použít filtrů mozaika, krystalizace, rozmazání, impresionismus atd. v některém grafickém programu postupně na všech nejdříve zmenšených obrázcích. Stejného efektu dosáhneme, použijeme-li daných filtrů jen na prvním největším obrázku s různou intenzitou a zanimujeme snímek po snímku. Takto vytvořený efekt by byl sice téměř dokonalý, ale výsledný swf soubor by se podstatně zvětšil. Pokud se vám zdá i velikost 9 kB moc, můžete dosáhnout menší velikosti na úkor kvality připravených obrázků, protože lidské oko to při animaci nepozná, ale poslední obrázek (největší) nechme v dostatečné kvalitě, protože zůstane stát a budete se na něj dívat.

Na závěr přikládám zip soubor obsahující zdrojový soubor Flashe i použité obrázky pro první efekt.