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:
-
27. ledna 2025
-
20. března 2025
-
4. dubna 2025
-
14. dubna 2025
-
17. dubna 2025
-
17. dubna 2025
-
18. dubna 2025
-
22. dubna 2025
-
19. března 2025
-
31. března 2025

Webdesign
FLASH XIV - intro a menu
22. března 2000, 00.00 | Vytvoření malého intra s menu a obrázkem na pozadí a několik užitečných tipů a triků.
Dnes se podíváme na vytvoření malého intra, včetně odkazů na další scény. Budeme potřebovat nějaký obrázek, jako pozadí, musí být rozumně zkomprimovaný, aby bylo rozrznat co na něm je a také aby nebyl moc velký.
Nastavíme velikost jeviště - 450x500. Vložíme obrázek na pozadí -- File -- Import. Začneme vytvářet rolovací bloky. Otevírání obrázku jsem zvolil zprava a zespodu. To znamená, že dva krycí bloky budou pevné a dva pohyblivé. Při práci s nimi budeme pracovat v malém měřítku a je dobré pracovat v režimu s obrysy, kvůli orientaci.
Začínáme nakreslením levého bloku na poli 25. Nakreslíme obdélník s linkou, vetší než je jeviště. protože chceme, aby nám zůstaly vidět linky, musíme nechat pouze tu, která má být vidět a ostatní musí ven. U levého bloku zůstane pravá, u pravého levá, u spodního vrchní a u vrchního spodní. na obrázku vidíme jak se bloky budou otvírat.
Protože animované jsou pouze vrchní a levý blok, ostatní dva budou mít v timeline jen statické framy. Na obrázku timeline vidíme, že úvodní text jsem umístil nad sérii bloků a vrchní blok, aby se zobrazoval kvůli nápisu od začátku animace je zajištěn statickými framy až do pole 25.
Když máme hotové otvírání scény, budeme animovat buď text, nebo jestli máte svoje logo, záleží na Vás. Zvolil jsem všeobecný text - Flash. Ukážeme si jak se tvoří dvojbarevný a průhledný text. Napíšeme text s použitím mezery za každým písmenem.
Modify -- Break Apart (Ctrl + B)
Modify -- Curves -- Soften Edges -- nastavíme :
Distance (vzdálenost)= 6 px
Number of steps (počet kroků) = 1
Direction = Expand (vně)
Pod tento text si napíšeme stený, pouze jinou barvou.
Nový text zase rozbijeme -- Modify -- Break Apart (Ctrl+B). Potom jej uchopíme a vložíme do textu minulého.
Dvojbarevný text máme hotový a můžeme jej animovat. Pokud animujeme tweening, musíme jej uložit jako symbol do knihovny. Kdykoliv jej můžeme zase rozbít (Ctrl+B), označit s přidržením klávesy Shift vnitřní text a vymazat, tím zůstane pouze vnější a vnitřek je průhledný. Tento způsob jsem použil ve své animaci. A samozřejmě potom jej opět vložit jako symbol do knihovny.(viz obr)
Vlastní animaci textu nebudu popisovat, můžete si ji prostudovat, pokud si stáhnete .fla soubor. Je to vrstva FLASH 1+2, ukončená na poli 162 akcí -- Go to and Play (150), aby se scéna neustále vracela na poslední rotaci textu FLASH a čekala tím na další povely. Nad ni jsem umístil animaci čárky, je to animace shape.
Nad animaci čárky umístíme tlačítka. Na poli 150 nakreslíme rámeček, bez výplně a Ctrl + F8 -- Button. Objeví se nám v knihovně a dvojklikem ho začneme editovat. Na políčku Up ho necháme jak je, F6 na políčku Over. Odznačíme a nástrojem kyblík přebarvíme vnitřek tlačítka. Ale tady pozor, barvu můžeme vybrat jakoukoliv, ale musíme skočit do editace barev a nastavit Alpha 0%.(viz obr)
Toto nastavení je proto, aby po najetí myší nám zůstalo tlačítko průhledné. Nakonec na vnitřek tlačítka naneseme nápis. Klikneme na políčko Over a zkopírujeme jej do dalších políček Down a Hit. Vrátíme se na Scénu 1. Abych nemusel všechna tlačítka dělat znovu, stačí v knihovně označit jedno a pravý klik -- Duplicate. Potom pouze v editaci tlačítka zaměníme nápisy. Pokud je máme hotovy, tak ke každému tlačítku přidáme vrstvu a umístíme je na jeviště. Aby tlačítka zůstala viditelná během neustále se opakující animace textu FLASH, musí být v timeline zapsána od pole 150 až do pole 162. A nemusí být statická, můžete je v timeline během těchto 12 polí animovat, záleží na každém.
Přidáme si další scénu a vidíme, že je prázdná. Pokud chceme, aby druhá scéna navazovala
vzhledově na druhou, je tady jednoduchý, ale velice šikovný trik. Můžeme přetahovat koncové
keyframy nejen ze scény 1 do scény 2, ale i mezi jednotlivými animacemi:
Nechejte si otevřené obě animace, v našem případě máme samozřejmě otevřenu jednu. V příslušné
vrstvě na scéně 1 označte keyframe, který chcete zkopírovat a pomocí stisknutíCtrl + X
ho eliminujte. Otevčete Scénu 2 a do příslušné vrstvy pomocí Ctrl + Shift + V jej
umístěte. Vrátíme se na Scénu 1 a vidíme, že na místě eliminovaného keyframu se objevil
prázdný keyfram. Aplikujeme na něj Ctrl + Shift + V a máme jej zase zpátky. Takto
pokračujeme u všech keyframů, které chceme zkopírovat. pokud přetahujeme z jedné animace do
druhé, je nutné, aby měly obě animace stejnou velikost.
Když máme hotovy všechny scény, vrátíme se na Scénu 1 a přiřadíme tlačítkům akce. Na
jevišti dvojklikem na tlačítko MENU 1 nastavíme akce takto:
On (Release)
Go to and Stop (Scene 2, 1)
End On
U MENU 2:
On (Release)
Go to and Stop (Scene 3, 1)
End On
U tlačítka zpět jsem použil návrat na pole 150 na animaci textu FLASH:
On (Release)
Go to and Play (Scene 1, 150)
End On
A nakonec u tlačítka HOME, návrat na začátek animace:
On (Release)
Go to and Play (1)
End On
Nakonec jsem vytvořil animaci s hudbou a podle minulé lekce jsem tyto dvě animace provázal.
Stažení celého dnešního tutoriálu i s hudbou (361 kB) je TADY a bez hudby (142 kB) je TADY
Obsah seriálu (více o seriálu):
- FLASH - vyčkávající Trojský kůň
- FLASH - vyčkávající Trojský kůň - druhý díl
- FLASH - vyčkávající Trojský kůň - třetí díl
- FLASH - ANIMAČNÍ TECHNIKY I.
- SEZNAMTE SE - FLASH 4 - I
- SEZNAMTE SE - FLASH 4 - II
- SEZNAMTE SE - FLASH 4 - III
- SEZNAMTE SE - FLASH 4 - IV
- SEZNAMTE SE - FLASH 4 - V
- SEZNAMTE SE - FLASH 4 - VI
- SEZNAMTE SE - FLASH 4 - VII
- SEZNAMTE SE - FLASH 4 - VIII
- SEZNAMTE SE - FLASH 4 - IX
- FLASH - X - animace bitmapy
- JAK DOSTAT ČEŠTINU DO FLASHE ?
- FLASH XI - 3D hvězda, zvuk na pozadí
- FLASH XII - akce pro tlačítka
- FLASH XIII - jak na preloader a jak ho umístit
- FLASH XIV - intro a menu
- FLASH XV - animace tlačítka
- FLASH XVI - jednoduché menu
- FLASH XVII - akce Tell Target poprvé
- FLASH XVIII - akce Tell Target podruhé
- FLASH XIX - akce Tell Target potřetí
- FLASH XX - konverze MP3 na WAV
- FLASH XXI - vlnění, kruhy na vodě
- FLASH XXI - dokončení
- FLASH 4 - Text Field Properties
- FLASH 4 - Zvláštní výběr křivek a čar
- FLASH 4 - Optimalizace křivek
- Flash 4 a QuickTime video
- FLASH 4 - preloader
- FLASH 4 - Duplikování filmového klipu
- FLASH 4 - pohybování textem pomocí kurzoru
- FLASH 4 - Speciální textové vlastnosti
- Macromedia FLASH 4 - postupné vypisování textu
- FLASH 4 - Spirála
- FLASH 4 - natažení externího .swf
- Macromedia FLASH 5 - načítaní HTML souboru
- FLASH - komunikace mezi dvěma SWF soubory
- FLASH - hrátky s křivkou
- FLASH - menu s posuvníkem
- FLASH - menu s posuvníkem (dokončení)
- FLASH 5 - pseudo 3D menu (dokončení)
- FLASH 5 - menu
- FLASH - Color Effect
- Macromedia FLASH 5 - analogové hodiny
- FLASH 5 - "smart" clip
- Vánoční přání v Macromedia FLASH 5
- FLASH 5 - ohňostroj
- Macromedia FLASH 5 - preloader
- FLASH 4 - animované menu
- Macromedia FLASH 5 - změna kurzoru
- Flash - Efekt založený na nedokonalosti bitmap
- Flash 4 - on-line výpočet ceny - 1. díl
- Flash 4 - on-line výpočet ceny - 2. díl
- Odeslání dat z formuláře ve Flashi 4 - II.
- Macromedia FLASH 5 - odesílání formuláře
- FLASH 4 - postupné odkrývání textu - tzv. maskovací efekt
- FLASH 5 - jednoduchý kaleidoskop nebo projekce?
- Flash 4 - menu pomocí ovládání Movie Clipu
- FLASH 5 - Vypisování textu
- Flash 4 - efektní ukončení *.exe prezentace + práce s více scénami
- Macromedia FLASH 5 - ovládání hlasitosti
- FLAX 1.12 - program na textové efekty v SWF
- FLASH 5 - matematické objekty (1. část)
- Flash4 - animace obličeje
- Flash 4 - Hra na způsob šipek
- Flash 4 + Swift 3D - dokonalá souhra!
- Macromedia FLASH 5 - změna barvy pozadí a textu
- Flash 5 - aktuální datum a čas
- Flash - 2D animace - 3D efekt
- FLASH 5 - prohlížečka obrázků s maskováním
- FLASH A JAVASCRIPT
- FLASH 5 - reversní pohyb
- Jpeg2Swf v1.0 beta - převod jpeg do swf aneb flashwebkamera
- SWISH v2 - Flash bez Flashe
- Jak docílit plynulé animace ve formátu Flash
- Flash - jdoucí Elvis.
- Flash - running man.
- Macromedia Flash - posun pozadí
- Flash - mořská hladina.
- Flash - animace hořící sirky
- Flash - mávání na rozloučenou
- Flash - vzhůru v let
- Flash - animace řeči
- FLASH 5 - Kalkulačka v 1.0
- Flash - BOXující Elvis
- Flash + Flashamp - animace řeči
- Flash - ženský běh
- FLASH 5 - Kalkulačka v 2.0
- FLASH - Programy na analýzu a úpravu SWF souborů
- FLASH 6 - Jaký bude a kdy bude?
- FLASH - Programy na analýzu a úpravu SWF souborů 2
- FLASH MX - novinky pod lupou
- Flash desatero
-
14. května 2014
Jak vkládat snímky do galerií a soutěží? Stručný obrazový průvodce
-
23. dubna 2014
Konica Minolta přenesla výhody velkých zařízení do kompaktních modelů
-
12. června 2012
-
9. dubna 2014
-
5. ledna 2017
-
6. září 2004
OKI snižuje ceny barevných laserových tiskáren C3100 a C5200n
-
13. května 2004
-
19. ledna 2004
QuarkXPress Passport 6: předvedení nové verze na konferenci Apple Forum 27.1.2004
-
6. února 2001
-
30. listopadu 2014
Nový fotoaparát α7 II: první plnoformát s pětiosou optickou stabilizací obrazu na světě
-
14. října 2024
-
4. února 2025
-
23. února 2025
-
1. dubna 2025
-
28. dubna 2025