Adobe Creative Team Adobe Flash Professional CS6 Oficiální výukový kurz Computer Press Brno 2013
Adobe Flash Professional CS6 Oficiální výukový kurz Adobe Creative Team Překlad: Libuše Gieblová Obálka: Adobe Creative Team Odpovědný redaktor: Roman Bureš Technický redaktor: Jiří Matoušek Translation Libuše Gieblová, 2012. Authorized translation from the English language edition, entitled ADOBE FLASH PROFESSIONAL CS6 CLASSROOM IN A BOOK, 1st Edition, 0321827333 by ADOBE CREATIVE TEAM, published by Pearson Education, Inc., publishing as Adobe Press. Copyright 2012, Pearson Education, Inc., publishing as Adobe Press. All rights reserved. No part of this book may be reproduced or transmitted in any form or by any means, electronic or mechanical, including photocopying, recording or by any information storage retrieval system, without permission from Pearson Education, Inc. CZECH language edition published by Albatros Media a. s., Copyright 2013. Autorizovaný překlad z anglického jazyka publikace nazvané ADOBE FLASH PROFESSIONAL CS6 CLASSROOM IN A BOOK, první edice, kterou vytvořil ADOBE CREATIVE TEAM, vydalo nakladatelství Pearson Education Inc., publikující jako Adobe Press. Objednávky knih: http://knihy.cpress.cz www.albatrosmedia.cz eshop@albatrosmedia.cz bezplatná linka 800 555 513 ISBN 978-80-251-3802-1 Vydalo nakladatelství Computer Press v Brně roku 2013 ve společnosti Albatros Media a. s. se sídlem Na Pankráci 30, Praha 4. Číslo publikace 16 880. Albatros Media a. s. Všechna práva vyhrazena. Žádná část této publikace nesmí být kopírována a rozmnožována za účelem rozšiřování v jakékoli formě či jakýmkoli způsobem bez písemného souhlasu vydavatele. 1. vydání
OBSAH ZAČÍNÁME.............................................................15 O knize........................................................ 15 Co je nového.................................................. 15 Předpoklady pro používání knihy.............................. 16 Instalace aplikace Flash........................................ 16 Kopírování souborů k lekcím................................... 17 Kopírování ukázkových filmů a projektů........................ 18 Práce s lekcemi................................................ 18 Další zdroje informací.......................................... 18 Certifikace od společnosti Adobe.............................. 19 PRVOTNÍ SEZNÁMENÍ...................................................22 Spuštění programu Flash a otevření souboru................... 24 Vytváření nového dokumentu................................. 24 Seznámení s pracovní plochou................................. 26 Výběr nové pracovní plochy................................... 27 Ukládání pracovní plochy...................................... 27 Vymezená plocha.............................................. 27 Změna vlastností vymezené plochy............................ 28 Práce s panelem Knihovna..................................... 29 O panelu Knihovna............................................ 29 Importování položky do panelu Knihovna...................... 29 Přidání položky z panelu Knihovna na vymezenou plochu...... 30 Časová osa.................................................... 30 Přejmenování vrstvy........................................... 31 Přidávání vrstvy............................................... 32 Vkládání snímků............................................... 33 Vytvoření klíčového snímku.................................... 34 Přesouvání klíčového snímku.................................. 36 Uspořádání vrstev na časové ose............................... 37 Vytváření složek pro vrstvy..................................... 37 Přidávání vrstev do složek vrstev............................... 38 3
Změna vzhledu časové osy..................................... 39 Inspektor Vlastnosti............................................ 40 Změna polohy objektu na vymezené ploše..................... 40 Panel Nástroje................................................. 43 Výběr a použití nástroje........................................ 43 Vracení kroků v programu Flash................................ 47 Náhled filmu.................................................. 48 Změna obsahu a vymezené plochy............................. 49 Změna velikosti vymezené plochy a jejího obsahu.............. 50 Ukládání filmu................................................. 51 Využití funkce automatického ukládání......................... 51 Využití funkce automatického obnovení pro zálohování........ 52 Ukládání dokumentu SFL...................................... 53 Úprava dokumentu XFL........................................ 53 Publikování filmu.............................................. 54 Vyhledávání zdrojů pro aplikaci Flash.......................... 56 Kontrola aktualizací............................................ 57 PRÁCE S GRAFIKOU.....................................................60 Začínáme..................................................... 62 Seznámení s tahy a výplněmi.................................. 62 Vytváření tvarů................................................ 63 Použití nástroje Obdélník...................................... 63 Použití nástroje Elipsa.......................................... 63 Provádění výběrů.............................................. 64 Výběr tahů a výplní........................................... 64 Úprava tvarů.................................................. 64 Použití nástroje Volná transformace............................ 65 Použití příkazů Kopírovat a Vložit............................... 65 Změna obrysů tvaru........................................... 66 Změna tahů a výplní........................................... 66 Použití přechodových a bitmapových výplní................... 68 Vytvoření barevných přechodů................................. 68 Použití nástroje Transformace přechodu........................ 70 Přidání bitmapové výplně...................................... 71 Seskupování objektů.......................................... 71 4 OBSAH
Vytváření vzorů a dekorací..................................... 72 Vytvoření symbolu pro vzor.................................... 72 Použití štětce Symetrie u nástroje Deco........................ 73 Zarovnávání objektů........................................... 74 Rozdělování a seskupování objektů............................ 76 Použití Dekorativního štětce u nástroje Deco................... 76 Použití štětce Květina u nástroje Deco.......................... 77 Převod vektorového obrázku do bitmapového formátu......... 78 Tvorba křivek.................................................. 79 Úprava křivek pomocí nástrojů Výběr a Dílčí výběr.............. 80 Odstraňování a přidávání kotevních bodů...................... 81 Vytváření průhledností........................................ 81 Úprava hodnoty alfa u výplně.................................. 81 Sladění barvy se stávajícím objektem.......................... 82 Tvorba a úprava textu.......................................... 83 Použití nástroje Text........................................... 83 VYTVÁŘENÍ A ÚPRAVA SYMBOLŮ.........................................86 Začínáme..................................................... 88 Importování souborů aplikace Illustrator....................... 88 Seznámení se symboly......................................... 90 Symboly filmových klipů....................................... 92 Symboly tlačítek............................................... 92 Grafické symboly.............................................. 92 Vytváření symbolů............................................. 93 Importování souborů aplikace Photoshop...................... 94 Úprava a správa symbolů...................................... 96 Přidání složek a uspořádání knihovny.......................... 97 Úprava symbolů z knihovny.................................... 99 Úprava symbolu na místě..................................... 100 Rozdělení instance symbolu.................................. 101 Změna velikosti a umístění instancí........................... 102 Použití pravítek a vodítek..................................... 103 Změna barevného efektu instancí............................. 105 Změna jasu................................................... 105 Změna průhlednosti.......................................... 106 ADOBE FLASH PROFESSIONAL CS6 OFICIÁLNÍ VÝUKOVÝ KURZ 5
Pochopení možností zobrazení................................ 107 Nastavení viditelnosti filmových klipů......................... 107 Efekty prolnutí................................................ 108 Možnost Exportovat jako bitmapu............................ 108 Aplikování filtrů pro speciální efekty........................... 109 Aplikování filtru rozostření.................................... 109 Umisťování objektů v 3D prostoru............................. 110 Změna 3D Natočení objektu.................................. 111 Změna 3D pozice objektu..................................... 112 Obnovení původního natočení a polohy...................... 113 Úběžný bod a úhel perspektivy............................... 113 PŘIDÁVÁME ANIMACI................................................. 116 Začínáme.................................................... 118 O animaci.................................................... 118 Seznámení se souborem projektu............................. 119 Animování polohy............................................ 120 Využití panelu Ovladač k náhledu animace................... 122 Změna tempa a časování..................................... 123 Změna doby trvání animace.................................. 123 Přidávání snímků............................................. 124 Přesouvání klíčových snímků.................................. 125 Animování průhlednosti...................................... 125 Animování filtrů.............................................. 128 Animování transformací...................................... 133 Změna cesty pohybu......................................... 136 Přesouvání cesty pohybu..................................... 137 Změna měřítka nebo natočení cesty.......................... 137 Upravování cesty pohybu..................................... 137 Orientace objektů podle cesty................................ 138 Prohození cílů doplnění....................................... 139 Tvorba vnořených animací.................................... 140 Vytváření animací uvnitř symbolů filmových klipů............. 140 Editor pohybu................................................ 142 Nastavení možností pro zobrazení Editoru pohybu............ 143 6 OBSAH
Změna hodnot vlastností..................................... 145 Vkládání klíčových snímků.................................... 146 Úprava klíčových snímků..................................... 147 Obnova hodnot a mazání vlastností........................... 147 Náběh a doběh............................................... 148 Nastavení náběhů a doběhů doplnění pohybu................ 148 Použití přednastavených náběhů a doběhů................... 150 Animace 3D pohybu.......................................... 154 Testování filmu............................................... 157 PROPOJENÝ POHYB A MORFOVÁNÍ..................................... 160 Začínáme.................................................... 162 Propojený pohyb s inverzní kinematikou...................... 162 Definování kostí.............................................. 163 Vkládání pozic................................................ 167 Izolování rotací jednotlivých uzlů............................. 169 Přidržení jednotlivých uzlů.................................... 170 Omezování spojů............................................. 171 Omezování otáčení spojů..................................... 171 Omezování posunutí spojů................................... 174 Inverzní kinematika u tvarů................................... 178 Definování kostí uvnitř tvaru.................................. 178 Úprava tvaru................................................. 180 Úprava kostí a armatury...................................... 182 Možnosti armatury........................................... 185 Vývojové a běhové armatury.................................. 185 Řízení náběhu a doběhu...................................... 186 Morfování pomocí doplnění tvarů............................. 189 Vytvoření klíčových snímků s různými tvary................... 189 Aplikování doplnění tvaru.................................... 190 Pomocné body tvaru......................................... 192 Přidávání pomocných bodů tvaru............................. 192 Odstraňování pomocných bodů tvaru......................... 194 Simulace fyzikálních jevů pomocí inverzní kinematiky......... 195 Definování kostí v armatuře................................... 195 ADOBE FLASH PROFESSIONAL CS6 OFICIÁLNÍ VÝUKOVÝ KURZ 7
Nastavení síly pružin pro jednotlivé kosti..................... 196 Vkládání dalších pozic........................................ 198 Přidání efektu tlumení........................................ 200 TVORBA INTERAKTIVNÍ NAVIGACE..................................... 202 Začínáme.................................................... 204 O interaktivních filmech...................................... 204 Tvorba tlačítek................................................ 204 Vytvoření symbolu tlačítka.................................... 205 Duplikování tlačítek.......................................... 209 Zaměňování bitmap.......................................... 210 Rozmisťování instancí tlačítek................................. 212 Pojmenování instancí tlačítek................................. 214 Seznámení s jazykem ActionScript 3.0......................... 215 O jazyku ActionScript......................................... 215 Terminologie skriptovacích jazyků............................ 216 Používání správné syntaxe ve skriptech....................... 217 Práce s panelem Akce......................................... 218 Příprava časové osy........................................... 219 Přidávání akce stop........................................... 220 Vytváříme obsluhy událostí pro tlačítka....................... 220 Přidání posluchače události a funkce.......................... 221 Kontrola syntaxe a formátování kódu.......................... 223 Tvorba cílových klíčových snímků............................. 224 Vkládání klíčových snímků s odlišným obsahem............... 224 Popisy na klíčových snímcích................................. 226 Tvorba tlačítka hlavní nabídky pomocí panelu Fragmenty kódu 228 Přidání další instance tlačítka................................. 229 Použití panelu Fragmenty kódu k přidání kódu jazyka ActionScript............................................... 229 Možnosti fragmentů kódu.................................... 232 Vytváření vlastního fragmentu kódu.......................... 233 Sdílení fragmentu kódu....................................... 234 Přehrávání animace v cíli...................................... 235 Tvorba přechodových animací................................ 235 Použití příkazu gotoandplay.................................. 238 8 OBSAH
Zastavování animací.......................................... 238 Animovaná tlačítka........................................... 240 Tvorba animace v symbolu filmového klipu................... 240 PRÁCE S TEXTEM...................................................... 244 Začínáme.................................................... 246 Pochopení textu TLF.......................................... 247 Vnoření knihovny textového modulu TLF...................... 248 Přidání jednoduchého textu.................................. 250 Přidání nadpisů............................................... 250 Tvorba svislého textu......................................... 253 Úprava znaků................................................. 254 Přidání sloupců............................................... 258 Úprava textového kontejneru................................. 260 Použití pravítka karet TLF..................................... 261 Obtékání textu............................................... 262 Přidání grafiky................................................ 262 Navazování textových kontejnerů............................. 264 Přidání obsahu do navázaných textových kontejnerů.......... 267 Odstraňování a vkládání textových kontejnerů................ 268 Rozpojení a opětovné navázání textových kontejnerů......... 270 Hypertextový odkaz v textu................................... 272 Přidání hypertextového odkazu............................... 272 Tvorba textu přijímajícího uživatelský vstup................... 273 Přidání prvků statického textu................................ 273 Přidání zobrazovacích polí.................................... 274 Vkládání písem............................................... 276 Pojmenování textových kontejnerů........................... 277 Změna obsahu textových kontejnerů......................... 278 Testování kalkulačky.......................................... 280 Načítání externího textu...................................... 280 Pojmenování textových kontejnerů........................... 280 Vkládání písem............................................... 282 Načtení a zobrazení externího textu........................... 283 ADOBE FLASH PROFESSIONAL CS6 OFICIÁLNÍ VÝUKOVÝ KURZ 9
PRÁCE SE ZVUKEM A VIDEEM.......................................... 290 Začínáme.................................................... 292 Seznámení se souborem projektu............................. 293 Používání zvuků.............................................. 294 Importování zvukových souborů.............................. 294 Umisťování zvuků na časové ose.............................. 296 Přidávání snímků na časovou osu............................. 298 Ořezání konce zvuku......................................... 298 Změna hlasitosti zvuku....................................... 301 Mazání a úpravy zvukového souboru.......................... 303 Nastavení kvality zvuků....................................... 303 Přidání zvuku do tlačítek...................................... 305 Video v dokumentu Flash..................................... 306 Aplikace Adobe Media Encoder............................... 307 Přidání videosouboru do aplikace Adobe Media Encoder...... 307 Převod videosouborů do formátu Flash Video................. 308 Možnosti kódování........................................... 310 Oříznutí videa................................................ 311 Úprava délky videa........................................... 314 Nastavování pokročilých možností zvuku a videa.............. 315 Uložení pokročilých možností zvuku a videa................... 317 Přehrávání externího videa.................................... 318 Ovládání přehrávání videa.................................... 321 Práce s videem a průhledností................................ 322 Importování videoklipu....................................... 322 Použití startovacích bodů..................................... 325 Vkládání startovacích bodů................................... 325 Detekování a reakce na startovací body....................... 327 Přidávání synchronizovaných prvků Flash..................... 330 Poslední úpravy.............................................. 332 Vkládání videa Flash.......................................... 333 Kódování videa určeného pro vložení......................... 334 Vložení videa na časovou osu................................. 335 Používání vloženého videa.................................... 336 10 OBSAH
NAČÍTÁNÍ A OVLÁDÁNÍ OBSAHU FLASH................................ 340 Začínáme.................................................... 342 Načítání externího obsahu.................................... 344 Použití panelu Fragmenty kódu............................... 348 Odstraňování externího obsahu............................... 351 Ovládání filmových klipů..................................... 353 Vytváření masek.............................................. 354 Definování masky a maskovaných vrstev...................... 355 Vytvoření masky.............................................. 357 PUBLIKOVÁNÍ DOKUMENTŮ FLASH..................................... 362 Začínáme.................................................... 364 Testování dokumentu Flash................................... 365 Seznámení s publikováním................................... 367 Publikování filmu pro web.................................... 367 Specifikace nastavení souboru Flash.......................... 367 Zjišťování verze přehrávače Flash Player....................... 370 Změna nastavení zobrazení................................... 371 Změna nastavení přehrávání.................................. 374 Seznámení s profilováním šířky pásma........................ 374 Zobrazení Profilování šířky pásma............................. 374 Testování výkonu stahování................................... 375 Přidávání metadat............................................ 376 Publikování desktopové aplikace.............................. 378 Vytvoření projektoru.......................................... 378 Vytváření aplikace AIR........................................ 380 Instalace aplikace AIR........................................ 384 Publikování pro mobilní zařízení.............................. 385 Simulace mobilní aplikace.................................... 385 Organizace projektů.......................................... 389 Založení nového projektu.................................... 389 Sdílení symbolů z Knihovny................................... 390 Úprava symbolů ze sdílené knihovny.......................... 392 Další kroky................................................... 392 REJSTŘÍK............................................................. 395 ADOBE FLASH PROFESSIONAL CS6 OFICIÁLNÍ VÝUKOVÝ KURZ 11
PRACOVNÍ SOUBORY K JEDNOTLIVÝM LEKCÍM Pracovní soubory k jednotlivým lekcím knihy Adobe Flash Professional CS6: Oficiální výukový kurz si můžete stáhnout z adresy http://knihy.cpress.cz/k2060 po klepnutí na odkaz Soubory ke stažení. Naleznete tam všechny soubory, jež jsou potřebné k vypracování cvičení v této knize, a dále užitečné odkazy na další výukový materiál v anglickém jazyce, který vám usnadní práci s programem Adobe Flash Professional CS6. Soubory z jednotlivých lekcí Každá lekce má svou vlastní složku ve složce Lekce. Tyto složky s lekcemi je potřeba před zahájením studia stáhnout z výše uvedené internetové adresy. Internetové zdroje Uvnitř souboru HTML naleznete odkazy na nápovědu Adobe Community Help, nápovědu k produktu, stránky podpory, Adobe Press, programy certifikace Adobe, Adobe TV a na další užitečné internetové zdroje. Stačí otevřít soubor v internetovém prohlížeči a klepnout na odkazy, mezi nimiž je i speciální odkaz na produkt z této knihy, kde naleznete aktualizace a bonusový materiál.
ZAČÍNÁME Aplikace Adobe Flash Professional CS6 nabízí komplexní vývojové prostředí pro tvorbu interaktivních a datově náročných aplikací. Aplikace Flash je široce rozšířená technologie používaná především k tvorbě poutavých projektů zahrnujících video, zvuk, grafiku či animace. V této aplikaci můžete svůj originální obsah přímo vytvářet nebo do ní můžete importovat zdroje z jiných aplikací společnosti Adobe, jako jsou Photoshop či Illustrator, v rychlosti navrhnout nějaké animace nebo multimedia a pomocí jazyka Adobe ActionScript 3.0 do nich následně zaintegrovat důmyslnou interaktivitu. Aplikaci Flash můžete využít k vytváření pokrokových a působivých webových stránek, k tvorbě samostatných aplikací pro váš stolní počítač nebo aplikací určených pro mobilní zařízení se systémem Android nebo ios. Díky rozsáhlé sadě ovládacích prvků animací, intuitivním a flexibilním kreslícím nástrojům a výkonnému objektově orientovanému kódovacímu jazyku aplikace Flash nabízí ojedinělé robustní prostředí, které promění vaše představy ve skutečnost. O knize Kniha, kterou držíte v ruce, je součástí oficiální výukové řady zaměřené na grafický a publikační software společnosti Adobe, která byla vyvinuta ve spolupráci s jejími produktovými odborníky. Jednotlivé lekce jsou navrženy tak, abyste je mohli procházet svým vlastním tempem. Pokud s aplikací Flash teprve začínáte, naučíte se zde základní pojmy a funkce nezbytné k používání programu. Kromě toho vám v této knize představíme také celou řadu pokročilých funkcí, včetně rad a postupů týkajících se nejnovější verze této aplikace. Co je nového Lekce v této knize nabízejí příležitost k využití některých nových funkcí a zlepšení, která aplikace Flash Professional CS6 přinesla, jako jsou například: Zdokonalený panel Dokument (Document) umožňující rychlejší přístup k nastavení dokumentu. Efektní ovládací prvky pro správu vrstev. Změna velikosti vymezené plochy zaručující proporcionální změnu veškerého jejího obsahu. Nové funkce Automatické ukládání (Auto-Save) a Automatická obnova (Auto-Recovery), které vám ulehčí od starostí s potencionální ztrátou dat v případě pádu aplikace. Dodatečné možnosti pro symboly jako Převést na bitmapu (Convert to Bitmap) a Exportovat jako bitmapu (Export as Bitmap), které umožňují lepší kontrolu nad manipulací s grafikou. Výstup animací v podobě přehledu pohyblivých symbolů (tzv. Sprite sheet) nebo sekvencí PNG podporujících alternativní přístupy k animaci. Nová funkce pro inverzní kinematiku s názvem Přidržení (Pinning), umožňující jemnější ovládání armatur. ADOBE FLASH PROFESSIONAL CS6 OFICIÁLNÍ VÝUKOVÝ KURZ 15
Pravítko tabulátorů pro text TLF sloužící k umístění textu s precizním rozvržením. Vylepšený panel Fragmenty kódu (Code Snippets) představující rychlý vizuální způsob použití kódu na objekty na vymezené ploše. Dodatečné fragmenty kódu dostupné z panelu Fragmenty kódu (Code Snippets), spousta z nichž slouží zejména k interakci mobilních zařízení. Ještě efektivnější dialogové okno Nastavení publikování (Publish Settings). Lepší průběh práce při sdílení zdrojů v rámci většího počtu souborů FLA. Vylepšené rozhraní aplikace Adobe Media Encoder pro efektivnější zpracování vašich mediálních souborů. Simulátor interakce mobilního zařízení umožňující vyzkoušení gest, jako je shrnutí či přejetí prstem přímo v aplikaci Flash. Mnoho dalších dílčích vylepšení funkcí a celkově lepší výkon. Předpoklady pro používání knihy Dříve, než se pustíte do četby, ujistěte se, že je váš systém správně nastaven a že jste si nainstalovali potřebný software. V rámci této knihy se předpokládá pracovní znalost počítače a operačního systému. Měli byste umět pracovat s myší i se standardními nabídkami a příkazy a kromě toho byste měli také vědět, jak otevírat, ukládat a zavírat soubory. Potřebujete-li si tyto dovednosti osvěžit, projděte si tištěnou či online dokumentaci, která je součástí vašeho operačního systému (ať už Microsoft Windows, či Apple Mac OS). Instalace aplikace Flash Aplikaci Adobe Flash CS6 si musíte zakoupit buď jako samostatnou aplikaci, nebo jako součást balíku Adobe Creative Suite. Přitom minimální požadovaná konfigurace vašeho počítače zahrnuje následující specifikace: Windows Procesor Intel Pentium 4, Intel Centrino, Intel Xeon či Intel Core TM Duo (nebo jiný kompatibilní procesor) Microsoft Windows XP s aktualizací Service Pack 3 nebo Windows 7 Minimálně 2 GB paměti RAM (doporučeno 3 GB) Monitor s rozlišením 1024 768 2,5 GB volného místa na pevném disku (další volné místo je nutné při instalaci) Internetové připojení potřebné k aktivaci produktu Přehrávač QuickTime 7.x potřebný pro multimediální funkce a importované sekvence PNG Rozhraní DirectX verze 9.0c nebo vyšší 16 ZAČÍNÁME
Mac OS Vícejádrový procesor Intel Mac OS X verze 10.6.x či 10.7.x Minimálně 2 GB paměti RAM (doporučeno 3 GB) Monitor s rozlišením 1024 768 2,5 GB volného místa na pevném disku (další volné místo je nutné při instalaci) Internetové připojení potřebné k aktivaci produktu Přehrávač QuickTime 7.x potřebný pro multimediální funkce a importované sekvence PNG Aktuální požadavky na systém a veškeré instrukce týkající se instalace programu jsou k dispozici na webové stránce http://www.adobe.com/cz/products/flash/tech-specs.html. Aplikaci Flash je nutné nainstalovat z DVD nebo z obrazu disku staženého ze stránek společnosti Adobe na pevný disk. Přímo z instalačního disku ji spustit nelze. Při instalaci se řiďte pokyny na obrazovce. Před zahájením instalace se ujistěte, že máte k dispozici sériové číslo. Obvykle jej naleznete na zadní straně obalu instalačního DVD nebo jej obdržíte e-mailem, pokud jste si aplikaci Flash stáhli ze stránek společnosti Adobe. Kopírování souborů k lekcím Lekce v této knize využívají jisté zdrojové soubory, jako jsou obrázky vytvořené v aplikaci Adobe Illustrator, videa z programu Adobe After Effects, zvukové nahrávky a předem připravené flashové animace. Abyste si mohli lekce v této knize projít, musíte si soubory z přiloženého CD (které najdete uvnitř knihy na jejím zadním obalu) zkopírovat na svůj pevný disk. Při kopírování postupujte následovně: 1 Na pevném disku si nejprve na příhodném místě vytvořte složku FlashProCS6_OVK. Windows: Ve Windows 7 nebo Vista klepněte pravým tlačítkem a vyberte příkaz Nový (New) Složka (Folder). Následně složku pojmenujte. Mac OS: V aplikaci Finder zvolte příkaz Soubor (File) Nová složka (New Folder). Zadejte název složky a pak ji přetáhněte na místo, kde si ji přejete uložit. Nyní již můžete na svůj pevný disk překopírovat zdrojové soubory. 2 Složku Lekce (obsahující složky Lekce01, Lekce02 atd.) přetáhněte z přiloženého CD na svůj pevný disk do nově vytvořené složky FlashProCS6_OVK. Pokaždé, když budete začínat novou lekci, přejděte do složky s příslušným názvem, kde najdete veškeré zdroje, ukázkové filmy a ostatní projektové soubory nezbytné k jejímu dokončení. Máte-li na svém počítači omezený úložný prostor, můžete si jednotlivé lekce kopírovat až v momentě, kdy je budete potřebovat, a průběžně je zase mazat, až je dokončíte. Některé lekce vycházejí z předchozích lekcí. V takových případech máte u navazující lekce či projektu k dispozici také výchozí soubor projektu původního. Dokončené projekty si ukládat nemusíte, pokud sami nechcete nebo pokud máte na pevném disku omezený prostor. ADOBE FLASH PROFESSIONAL CS6 OFICIÁLNÍ VÝUKOVÝ KURZ 17
Kopírování ukázkových filmů a projektů V některých lekcích budete vytvářet a publikovat animační soubory SWF. Ukázky dokončených projektů z jednotlivých lekcí najdete ve složkách, jejichž jméno končí řetězcem Výsledný (01Výsledný, 02Výsledný atd.) a které se nacházejí ve složkách jednotlivých lekcí. Tyto soubory můžete použít pro referenci, budete-li chtít svůj rozpracovaný projekt porovnat s projektovými soubory použitými k vytvoření ukázkových filmů. Velikost těchto souborů se do značné míry liší a pohybuje se od relativně malých až po projekty o velikosti několika megabytů. Máte-li dostatečný prostor na svém pevném disku, můžete si je zkopírovat všechny naráz, pokud ne, můžete si dle potřeby zkopírovat pouze výsledný projektový soubor probírané lekce a po jejím dokončení jej opět smazat. Práce s lekcemi Jednotlivé lekce této knihy popisují krok za krokem postup při vytváření jednoho či více konkrétních prvků skutečného projektu. Přestože některé lekce vycházejí z projektů vytvořených v předchozích kapitolách, ve většině z nich se vytvářejí samostatné projekty. Na druhou stranu však jednotlivé lekce vycházejí z předpokladu znalosti pojmů a dovedností probíraných v těch předchozích. Nejlepší je tedy lekce procházet popořadě jednu za druhou, a to také proto, že jsou některé techniky a postupy podrobně vysvětleny a popsány pouze při několika prvních použitích. Jednotlivé lekce jsou uspořádány spíše podle projektů než podle funkcí. To znamená například to, že se symboly nebudete pracovat pouze v jedné kapitole, ale hned v několika různých lekcích při vytváření skutečných návrhových projektů. Další zdroje informací Tato kniha nemá za cíl nahradit dokumentaci dodávanou k programu Flash CS6 ani se stát vyčerpávající příručkou k veškerým funkcím. Jejím cílem je objasnit pouze ty příkazy a volby, které se používají v jednotlivých lekcích. Ucelenější informace o funkcích a výukových programech najdete v následujících zdrojích: Nápověda komunity Adobe: Nápověda komunity svádí dohromady aktivní uživatele produktů společnosti Adobe, členy produktových týmů společnosti Adobe, autory a odborníky, kteří vám poskytnou ty nejužitečnější, nejrelevantnější a neaktuálnější informace o produktech společnosti. Jak přistupovat k Nápovědě komunity: Pro vyvolání nápovědy stiskněte klávesu F1 nebo zvolte možnost Nápověda (Help) Nápověda programu Flash (Flash Help). Obsah Adobe je aktualizován v závislosti na zpětné vazbě a příspěvcích této komunity. Také vy do ní můžete přispívat, a to buď přidáváním komentářů k obsahu či diskuzím na fóru (včetně odkazů na obsah na webu), publikováním vlastního obsahu pomocí aplikace Community Publishing anebo přidáváním vlastních receptů do Kuchařky nápadů (Cookbook Recipes). Bližší informace k příspěvkům najdete na webové stránce www.adobe.com/cz/community/publishing/ download.html. Odpovědi na často kladené dotazy vztahující se k Nápovědě komunity najdete na webové stránce http://community.adobe.com/help/profile/faq.html. 18 ZAČÍNÁME
Centrum nápovědy a podpory Adobe Flash CS6 Professional (viz www.adobe.com/cz/support/ flash) je místo, kde si můžete procházet nápovědu a podporu obsažené na webu společnosti Adobe. Diskusní fóra Adobe (viz http://forums.adobe.com) vám umožňují nejen si vyměňovat zkušenosti, ale také klást otázky týkající se produktů společnosti Adobe a dostávat na ně odpovědi. Adobe TV (viz http://tv.adobe.com) je online zdroj videí obsahujících odborné instrukce a inspiraci k produktům společnosti Adobe, včetně kanálu Jak na to (How To), který vám pomůže s vaším produktem začít. Adobe Design Center (viz www.adobe.com/designcenter) nabízí promyšlené články na téma návrhu a problémů s ním spojených, galerii prací prvotřídních designérů, výuková videa a další materiály. Adobe Developer Connection (viz www.adobe.com/devnet) je vaším zdrojem technických článků, ukázek zdrojového kódu a videí Jak na to pokrývajících vývojové produkty a technologie společnosti Adobe. Zdroje informací pro vzdělávání (viz www.adobe.com/cz/education) nabízí bohatý zdroj informací pro školitele, kteří vyučují kurzy o softwaru společnosti Adobe. Najdete zde řešení vzdělávání pro všechny úrovně, včetně bezplatných vzdělávacích plánů založených na integrovaném přístupu k výuce softwaru Adobe, které lze uplatnit v přípravě na zkoušky pro Certifikovaného zástupce společnosti Adobe. Dále se vám také mohou hodit následující odkazy: Adobe Marketplace & Exchange (viz www.adobe.com/cfusion/exchange) je centrální zdroj pro hledání nástrojů, služeb, rozšíření, ukázek zdrojového kódu a dalších inovací doplňujících a rozšiřujících produkty společnosti Adobe. Domovská stránka produktu Adobe Flash Professional CS6 (viz www.adobe.com/products/ flash). Adobe Labs (viz http://labs.adobe.com) vám nabízí přístup ke starším verzím nejmodernějších technologií i do diskuzních fór, kde můžete komunikovat jak s vývojovými týmy společnosti Adobe, které danou technologii vyvíjejí, tak také s dalšími podobně smýšlejícími členy komunity. Certifikace od společnosti Adobe Školicí a certifikační programy společnosti Adobe jsou navržené tak, aby zákazníkům a lektorům pomohly zdokonalit jejich odborné dovednosti v rámci jednoho či více produktů společnosti Adobe a pozvedly je na vyšší úroveň. Existují čtyři úrovně certifikace: Certifikovaný zástupce společnosti Adobe (Adobe Certified Associate ACA) Certifikovaný expert společnosti Adobe (Adobe Certified Expert ACE) Certifikovaný instruktor společnosti Adobe (Adobe Certified Instructor ACI) Autorizované školicí centrum společnosti Adobe (Adobe Authorized Training Center AATC) Osvědčení Certifikovaný zástupce společnosti Adobe potvrzuje, že daná osoba ovládá základní dovednosti nezbytné pro plánování, navrhování, budování a udržování efektivní komunikace pomocí nejrůznějších forem digitálních médií. ADOBE FLASH PROFESSIONAL CS6 OFICIÁLNÍ VÝUKOVÝ KURZ 19
Program s názvem Certifikovaný expert společnosti Adobe poskytuje zkušeným uživatelům možnost k obohacení životopisu. Tuto certifikaci můžete použít k rychlejšímu povýšení v zaměstnání, nalezení práce či propagaci vlastní odborné kvalifikace. Pokud se z vás stane instruktor pro úroveň ACE, pak pomocí programu s názvem Certifikovaný instruktor společnosti Adobe dostanete své dovednosti na další úroveň a získáte přístup k pestré škále zdrojů společnosti Adobe. Autorizovaná školicí centra společnosti Adobe nabízejí kurzy a školení vedené instruktory z oblasti produktů společnosti Adobe, přičemž zaměstnávají pouze své vlastní certifikované instruktory. Katalog těchto center je k dispozici na adrese http://partners.adobe.com. Více informací ohledně certifikačních programů společnosti Adobe najdete na webové stránce www.adobe.com/support/certification/main.html. 20 ZAČÍNÁME
1 PRVOTNÍ SEZNÁMENÍ nemáte. Obsah lekce V této lekci se naučíte následující: Vytvářet nové soubory v aplikaci Flash Upravovat nastavení vymezené plochy a vlastnosti dokumentu Přidávat vrstvy na časovou osu Spravovat klíčové snímky na časové ose Pracovat s importovanými obrázky v panelu Knihovna (Library) Posouvat a přemisťovat objekty na vymezené ploše Otevírat panely a pracovat s nimi Vybírat a používat nástroje v panelu Nástroje (Tools) Zobrazovat náhled animací Flash Ukládat soubory Flash Přistupovat k online zdrojům aplikace Flash K dokončení této lekce budete potřebovat nejvýše jednu hodinu. Z CD přiloženého ke knize si zkopírujte složku Lekce01 na svůj pevný disk, pokud ji tam dosud 22
V aplikaci Flash se veškerý děj odehrává na vymezené ploše, časová osa slouží k uspořádání snímků a vrstev a ostatní panely pak umožňují další úpravy a ovládání vytvořeného projektu. ADOBE FLASH PROFESSIONAL CS6 OFICIÁLNÍ VÝUKOVÝ KURZ 23
Spuštění programu Flash a otevření souboru Při prvním spuštění aplikace Flash uvidíte uvítací obrazovku s odkazy na standardní šablony souborů, výuková videa a další zdroje. V této lekci vytvoříte jednoduchou animaci předvádějící několik snímků z dovolené. Do projektu přidáte fotografie a nápis a přitom se dozvíte něco málo o umisťování prvků na vymezenou plochu a jejich rozmisťování podél časové osy. Je důležité, abyste pochopili, že vymezená plocha slouží k prostorovému uspořádání vizuálních prvků, zatímco v časové ose je organizujete podle časového hlediska. 1 Spusťte aplikaci Adobe Flash Professional CS6, což lze ve Windows provést například zvolením položky Adobe Flash CS6 v nabídce Start Všechny programy (All Programs) a v Mac OS poklepáním na ikonu Adobe Flash Professional CS6 ve složce Applications nebo v panelu Dock. 2 V nabídce Soubor (File) zvolte příkaz Otevřít (Open), v dialogovém okně Otevřít vyberte soubor 01_výsledný.swf umístěný ve složce Lekce01\01Výsledný, klepněte na tlačítko Otevřít (Open) a prohlédněte si výsledný projekt. 3 Zvolte příkaz Soubor (File) Náhled publikování (Publish Preview) HTML. Flash vytvoří potřebné soubory (HTML a SWF), aby mohl dokončenou animaci přehrát ve výchozím prohlížeči. Spustí se animace, ve které se postupně objeví několik překrývajících se fotografií a nakonec ještě nápis. 4 Zavřete prohlížeč. Poznámka: Aplikaci Flash můžete spustit také poklepáním na soubor Flash (*.fla nebo *.xfl), jako je například soubor 01_výsledný.fla, který obsahuje dokončený projekt. Poznámka: Pokud ve vašem počítači chybí písmo použité ve výsledném projektu, aplikace Flash zobrazí výstražné dialogové okno. Pokud chcete, můžete si zvolit nějaké náhradní písmo nebo jen kliknout na možnost Zvolit výchozí (Use Default) a aplikace Flash písmo vybere automaticky. Vytváření nového dokumentu Vytváření jednoduché animace, kterou jste si právě zobrazili v náhledu, zahájíme otevřením nového dokumentu. 1 V nabídce Soubor (File) zvolte příkaz Nový (New). Otevře se dialogové okno Nový dokument (New Document). 2 V záložce Všeobecné (General) zvolte možnost ActionScript 3.0. ActionScript 3.0 je nejnovější verzí skriptovacího jazyka aplikace Flash, pomocí něhož budete svým animacím přidávat interaktivitu. V této lekci sice s jazykem ActionScript pracovat nebudeme, ale i přesto je potřeba vybrat verzi, se kterou bude váš soubor kompatibilní. Vybráním 24 LEKCE 1 PRVOTNÍ SEZNÁMENÍ
verze ActionScript 3.0 vytvoříte nový dokument, který bude nakonfigurován k přehrávání v prohlížeči (jako je například Chrome, Safari nebo Firefox) pomocí přehrávače Flash Player. Další možnosti v této záložce pak slouží k přehrávání v alternativním prostředí. Například AIR for Android a AIR for ios vytvářejí nové dokumenty nakonfigurované k přehrávání v aplikaci AIR na Androidu nebo na mobilním zařízení značky Apple. 3 Na pravé straně dialogového okna můžete nastavit rozměry vymezené plochy v obrazových bodech přiřazením nových hodnot parametrům Šířky (Width) a Výšky (Height). Vložte hodnotu 800 pro šířku a 600 pro výšku. Jednotky pravítka (Ruler units) ponechejte nastavené na možnost obrazových bodů. Kmitočet snímků (Frame rate) a Bar vu pozadí (Background co lour) vymezené plochy ponechejte v jejich výchozím nasta vení. Jak se dozvíte později v této lekci, tyto vlastnosti dokumentu můžete kdykoliv změnit. ADOBE FLASH PROFESSIONAL CS6 OFICIÁLNÍ VÝUKOVÝ KURZ 25
4 Klepněte na tlačítko OK. Aplikace Flash vytvoří nový soubor v jazyku ActionScript 3.0 s použitím veškerých specifikovaných nastavení. 5 V nabídce Soubor (File) zvolte příkaz Uložit (Save), soubor pojmenujte 01_pracovníkopie.fla a v rozevírací nabídce Formát/Uložit jako typ (Format/Save as Type) zvolte možnost Dokument Flash CS6 (*.fla). Soubor následně uložte do složky 01Původní. Okamžité uložení souboru je dobrým pracovním návykem, díky němuž máte jistotu, že vaše práce nebude v případě pádu aplikace nebo systému ztracena. Svůj soubor Flash byste měli vždy ukládat s příponou.fla, která určuje, že se jedná o zdrojový soubor aplikace Flash. Poznámka: Pro jednoduché projekty, jako je například animace vytvářená v rámci této lekce, stačí vytvořit jediný dokument FLA. Pokud se však jedná o komplexnější projekty, které vyžadují spolupráci více tvůrců, anebo o projekty určené pro přehrávání v různých prostředích (např. na stolním počítači a v telefonu), je lepší použít při jejich vytváření panel Project (Projekt), který otevřete zadáním příkazu Okno (Window) Projekt (Project) a který vám pomůže s organizací většího množství zdrojů. O panelu Projekt (Project) se dozvíte více v lekci 10 s názvem Publikování dokumentů Flash. Seznámení s pracovní plochou V horní části pracovní plochy aplikace Adobe Flash Professional se nacházejí příkazové nabídky a pestrá škála nástrojů a panelů sloužících k úpravě a přidávání prvků do filmu. Všechny objekty, které budete potřebovat do své animace, si buď můžete vytvořit přímo v aplikaci Flash, nebo můžete importovat prvky, které jste si vytvořili v aplikacích Adobe Illustrator, Adobe Photoshop, Adobe After Effects nebo jiném kompatibilním programu. Ve výchozím nastavení se v aplikaci Flash zobrazuje řádek nabídek, časová osa, vymezená plocha, panel Nástroje (Tools), inspektor Vlastnosti (Properties) a několik dalších panelů. Při práci v této aplikaci si můžete otevírat, zavírat, ukotvovat, uvolňovat a přesouvat panely po obrazovce tak, aby vyhovovaly vašemu pracovnímu stylu nebo případně rozlišení monitoru. Panel Nástroje (Tools) Vrstvy Vymezená plocha Časová osa Inspektor Vlastnosti (Properties) 26 LEKCE 1 PRVOTNÍ SEZNÁMENÍ
Výběr nové pracovní plochy Aplikace Flash nabízí několik přednastavených rozložení panelů, která mohou lépe vyhovovat potřebám některých uživatelů. Tato odlišná rozvržení pracovní plochy najdete v rozevírací nabídce v pravém horním rohu pracovní plochy nebo v nabídce Okno (Window) Pracovní plocha (Workspace). 1 V pravém horním rohu pracovní plochy klepněte na tlačítko Základní (Essentials) a vyberte některou z ostatních předdefinovaných pracovních ploch. Uspořádání a velikost jednotlivých panelů se liší v závislosti na jejich důležitosti pro konkrétního uživatele. Například pracovní plochy Animátor (Animator) a Návrhářská (Designer) mají časovou osu umístěnou v horní části, kde je k ní při častém použití jednodušší přístup. 2 Pokud jste některé z panelů přemístili a chcete se vrátit k přednastavené pracovní ploše, vyberte příkaz Okno (Window) Pracovní plocha (Workspace) Obnovit (Reset) název přednastavené pracovní plochy. 3 Pro návrat k výchozí pracovní ploše stačí klepnout na příkaz Okno (Window) Pracovní plocha (Workspace) Základní (Essentials). V této knize budeme používat právě tuto Základní pracovní plochu. Ukládání pracovní plochy Pokud najdete určité uspořádání panelů, které více vyhovuje vašemu pracovnímu stylu, můžete si jej uložit a následně se k němu kdykoli v budoucnu vrátit. 1 V pravém horním rohu pracovní plochy klepněte na tlačítko Základní (Essentials) a vyberte možnost Nová pracovní plocha (New workspace). Objeví se dialogové okno se stejným názvem. 2 Zadejte název nové pracovní plochy a klepněte na tlačítko OK. Aplikace Flash uloží aktuální rozložení panelů. Vaše pracovní plocha se přidá do seznamu možností v rozevírací nabídce Pracovní plocha (Workspace), kterou máte neustále k dipozici. Vymezená plocha Velkému bílému obdélníku uprostřed obrazovky se říká vymezená plocha. Vymezená plocha v programu Flash je v podstatě divadelní scéna, kterou diváci při přehrávání filmu uvidí. Obsahuje text, obrázky a video, které se mají objevit na obrazovce. Přesunutím prvků na vymezenou plochu či jejich odstraněním v podstatě určujete, zda je diváci uvidí či nikoliv. Pro snadnější ADOBE FLASH PROFESSIONAL CS6 OFICIÁLNÍ VÝUKOVÝ KURZ 27
umístění položek na vymezené ploše pak můžete využít pravítka [Zobrazit (View) Pravítka (Rulers)] či mřížky [Zobrazit (View) Mřížka (Grid) Zobrazovat mřížku (Show Grid)]. Kromě toho můžete použít také panel Zarovnat (Align) či další nástroje, o kterých se více dozvíte v jednotlivých lekcích této knihy. Ve výchozím stavu uvidíte kolem vymezené plochy šedou oblast, kam můžete umisťovat prvky, které nebudou pro vaše publikum viditelné. Této šedé oblasti se říká pracovní plocha. Chcete-li vidět jen vymezenou plochu, zrušte v nabídce Zobrazit (View) výběr možnosti Pracovní plocha (Pasteboard). Prozatím však ponechte tuto možnost vybranou. Chcete-li upravit velikost vymezené plochy tak, aby vyplnila celé aplikační okno, zvolte v nabídce Zobrazit (View) Zvětšení (Magnification) možnost Do celého okna (Fit in Window). Kromě toho můžete také k přenastavení možnosti zobrazení použít rozevírací nabídku nad vymezenou plochou. Změna vlastností vymezené plochy Nyní se naučíme měnit barvu vymezené plochy. Tu můžete podobně jako další vlastnosti dokumentu, jako jsou rozměry vymezené plochy či kmitočet snímků, měnit v inspektoru Vlastnosti (Properties), což je svislý panel po pravé straně vymezené plochy. 1 V dolní části inspektoru Vlastnosti (Properties) si můžete všimnout, že aktuální rozměry vymezené plochy jsou 800 600 obrazových bodů, přesně podle vašeho nastavení při vytváření tohoto dokumentu. 2 Klepněte na tlačítko Barva pozadí (Background color) a ze zobrazené barevné palety vyberte novou barvu vymezené plochy. Zvolte tmavě šedou barvu (#333333). Vaše vymezená plocha má nyní od liš nou barvu. Vlastnosti vy mezené plochy můžete měnit kdykoliv. 28 LEKCE 1 PRVOTNÍ SEZNÁMENÍ
Práce s panelem Knihovna K panelu Knihovna (Library) se dostanete pomocí záložky umístěné po pravé straně inspektoru Vlastnosti (Properties). Tento panel slouží k ukládání a organizování nejen symbolů vytvořených aplikací Flash, ale také nejrůznějších importovaných souborů, jako jsou bitmapy, grafiky, zvukové soubory či videoklipy. Symboly jsou v podstatě často používané grafické prvky, které se používají při vytváření animací či interaktivity. Poznámka: O symbolech se dozvíte více v lekci 3 s názvem Tvorba a úprava symbolů. O panelu Knihovna Panel Knihovna (Library) umožňuje uspořádání jednotlivých položek do složek, ověření počtu použití daného prvku v dokumentu či setřídění položek podle typu. Při importování položek do aplikace Flash se můžete rozhodnout, zda je chcete importovat přímo na vymezenou plochu nebo do knihovny. Přitom se však každá položka, kterou importujete na vymezenou plochu, automaticky přidá také do knihovny, podobně jako každý symbol, který vytvoříte. Díky tomu pak můžete k těmto položkám snadno přistupovat, opětovně je přidávat na vymezenou plochu, upravovat je nebo zobrazovat jejich vlastnosti. Pro zobrazení panelu Knihovna (Library) použijte příkaz Okno (Window) Knihovna (Library) nebo stiskněte kombinaci kláves Ctrl+L (Windows) nebo Command+L (Mac). Importování položky do panelu Knihovna Často budete vytvářet grafické prvky přímo pomocí kreslicích nástrojů programu Flash a ukládat je jako symboly, které se uchovávají v knihovně. Jindy budete importovat média, například obrázky typu JPEG nebo zvukové soubory MP3, která se také ukládají do knihovny. V této lekci naimportujete do knihovny několik obrázků typu JPEG, které následně použijete při vytváření animace. 1 Zvolte příkaz Soubor (File) Importovat (Import) Importovat do knihovny (Import to Library). V dialogovém okně Importovat do knihovny (Import to Library) přejděte do složky Lekce01\01Původní, vyberte soubor pozadí.jpg a klepněte na tlačítko Otevřít (Open). 2 Aplikace Flash naimportuje zvolený obrázek typu JPEG a umístí jej do panelu Knihovna (Library). 3 Stejným způsobem importujte ze složky 01Původní také soubory foto1.jpg, foto2.jpg a foto3.jpg. Poslední obrázek foto4.jpg zatím neimportujte. Ten použijete až později v této lekci. Podržíte-li klávesu Shift, můžete označit více souborů a následně je všechny importovat najednou. ADOBE FLASH PROFESSIONAL CS6 OFICIÁLNÍ VÝUKOVÝ KURZ 29