Flash CS4

Flash CS4 ^Adobe®

Grundkurs

Adobe®

Flash CS4

Grundkurs

Till denna bok medföljer ett antal övningsfiler på cd-skiva (filerna finns i mappen

Flash CS4 Grundkurs

). Kopiera filerna till lämplig mapp på din hårddisk.

Du kan även ladda ner övningsfilerna från vår webbplats www.docendo.se:

Starta webbläsaren, skriv

1.

i adressfältet och tryck på

. Skriv artikelnumret,

2.

, i sökrutan och klicka på

. Klicka på titeln

3.

.

Klicka på filen

4.

högst upp på sidan.

Klicka på

5.

, välj var du vill spara filen, exempelvis på skrivbordet, och klicka på

.

När filen har hämtats stänger du dialogrutan och avslutar webbläsaren.

6.

Om du har valt att spara filen på skrivbordet visas den som en ikon med 7.

namnet

. Dubbelklicka på ikonen för att packa upp filerna till lämplig mapp.

Copyright © Docendo AB

Detta verk är skyddat av upphovsrättslagen. Kopiering, utöver lärares rätt att kopiera för undervisningsbruk enligt BONUS-avtal är förbjuden. BONUS-avtal tecknas mellan upphovsrättsorganisationer och huvudman för utbildningsanord- nare, exempelvis kommuner/universitet.

Våra böcker och tillhörande produkter är noggrant kontrollerade, men det är ändå möjligt att fel kan förekomma. Vi tar gärna emot förbättringsförslag.

Produkt- och producentnamnen som används i boken är ägarens varumärken eller registrerade varumärken.

Tryckeri: Fälth & Hässler, Sverige 2009 Första upplagan, första tryckningen ISBN: 978-91-85437-80-1

Artikelnummer: 3069-S

Författare: Ulrika Nilsson

Omslag: Ulrika Nilsson

3

1 Inledning ...5

Adobe Flash Player ... 5

Utbildningsmaterialet ... 5

2 Arbetsytan ...6

Starta programmet och öppna en fil ... 6

Starta Flash... 6

Skapa en ny fil ... 7

Översikt över programfönstret ... 8

Menyrad och namnflik ... 8

Scenen ... 8

Tidslinjen ... 9

Lager ... 9

Paneler ...10

Arbetsyteväxlaren ...10

Bibliotek ... 11

Verktygspanelen ... 11

Panelen Egenskaper ...12

Hjälpfunktionen ...13

Stänga en fil och avsluta programmet ...13

Stänga en Flash-fil ...13

Avsluta programmet ...13

3 Verktyg och inställningar ...14

Dokumentegenskaper ...14

Verktygspanelen ...15

Markeringsverktygen...15

Omforma fritt och övertoningsomformning ...16

Verktygen 3D-rotation och 3D-förflyttning ...16

Lasso ...17

Ritstiftsverktyget ...17

Text- och linjeverktygen ...17

Rektangel-, oval- och polygonverktygen...17

Penn- och penselverktygen ...19

Verktyget Deco ...19

Verktygen Ben och Bindning ...19

Färg- och retuschverktyg ...19

Ändra färg på objekt ... 20

Markera/Avmarkera ... 20

Ritinställningar ... 22

Användbara paneler och verktygsfält ...24

Panelen Justera ...24

Panelerna Färg och Färgrutor ...24

Panelen Omforma ... 25

Verktygsfältet Standard ... 25

Tillämpningsuppgifter ... 25

4 Symboler och bibliotek ... 27

Symboltyper ...27

Skapa en symbol ... 28

Redigera symboler ... 29

Bibliotek i Flash ... 30

Skapa symbol från biblioteket ... 30

Ta bort mapp eller symbol från biblioteket ... 30

Delade och externa bibliotek ... 30

Hämta symboler från externa bibliotek ...31

Tillämpningsuppgifter ...32

5 Tidslinjen och lagerpanelen ... 33

Tidslinjen ...33

Bildrutor och olika nyckelbildrutor ...33

Nyckelbildruta för egenskaper ... 34

Ta bort bildrutor ... 34

Bildrutehastighet ... 34

Lager ...35

Arbeta med lager ... 36

Ändra ordningsföljd på lager ... 36

Lageregenskaper ...37

Redigera lager ...37

Stödlinjelager ... 38

Rörelsestödlinjelager ... 38

Maskeringslager... 39

Lagermappar ...41

Tillämpningsuppgifter ... 42

6 Text ...43

Teckensnitt ... 43

Sammanhangsanpassa teckensnitt ... 43

Textinställningar ... 44

Formatera, justera och flytta text ... 46

Redigera och omforma text ... 46

Sök och ersätt ... 48

Stavningskontroll ... 49

Tillämpningsuppgift ... 50

7 Animera ...51

Animeringar ...51

Skapa en klassisk interpolering ... 52

Skapa en rörelseinterpolering ... 54

Förinställda rörelser ... 56

Använda Förinställda rörelser ... 56

Interpolera längs en klassisk rörelsestödlinje ... 58

Forminterpolering ...61

Innehållsförteckning

4

Figurtips ... 62

Bild-för-bild-animering ... 63

Lökskal ... 64

Använda lökskal ... 64

Ändra visning av lökskal ... 65

Redigera flera bildrutor ... 66

Rörelseredigeraren ... 66

Animera masklager... 67

Animera text... 68

Tillämpningsuppgifter ... 69

8 Importera bilder ...70

Vektorbaserad grafik och bitmappgrafik ... 70

Vektorbaserad grafik ... 70

Bitmappgrafik ... 70

Filformat vid import ...71

Importera Illustrator-filer ... 72

Redigera importerad bild ...74

Kopiera och klistra in ...74

Förbereda bilder för import ...75

Importera bitmappbilder ...76

Importera Photoshop-bilder ...76

Importera bildsekvenser ...77

Kapsla in animering ...77

Tillämpningsuppgifter ... 78

9 Knappar...79

Använda befintliga knappar ...79

Skapa en egen knapp ...81

Förändra utseendet vid olika knapplägen ...81

Ändra storlek på knappen ... 82

Duplicera knappsymbol ... 82

Tillämpningsuppgifter ... 84

10 Interaktivitet ...85

Att skapa interaktivitet ... 85

Beteenden ... 85

ActionScript ... 85

Förbereda för interaktivitet ... 86

Tillbaka-knapp... 90

Andra funktioner på panelen Beteenden ...91

Ladda upp en bild ... 92

Länka till webbsida ... 93

Stoppa och spela upp inbäddad film ... 94

Ta bort beteende... 95

Panelen Åtgärder ... 96

Kombinera Beteenden med Åtgärder ... 97

Skapa en åtgärd som startar en film ... 99

Ange parametrar på panelen Åtgärder ...100

ActionScript 3.0 ...102

Tillämpningsuppgifter ...102

11 Filter ...103

Filter i egenskapspanelen ...103

Lägga till filter ...104

Ta bort filter ...104

Kopiera och klistra in filter ...105

Skapa ett filterbibliotek ...106

Tillämpningsuppgifter ...107

12 Ljud ... 108

Använda ljud ...108

Olika slags ljud i Flash ...109

Händelseljud ... 110

Direktuppspelningsljud ... 110

Ljud för mobila enheter ... 110

Import av ljud ... 110

Redigera ljud ...111

Knappar med ljud ...113

Samordna ljudet med animeringen ... 114

Export och komprimering av ljud ... 114

Tillämpningsuppgifter ... 115

13 Mallar ... 116

Använda en mall ... 116

Skapa en egen mall ... 116

Device Central ...117

Tillämpningsuppgift ... 118

14 Publicera Flash-filer på webben ... 119

Inför publicering ... 119

Testa filmen innan publicering ... 119

Arbeta med flera dokument ...120

Skapa mappar i biblioteket ...120

Visa innehållet i alla mappar ... 121

Ta bort mapp eller symbol ... 121

Skapa ny symbol ... 121

Publiceringsinställningar ...122

Publicera filmen ...126

Maximera Flash-filmen ...127

Exportera filmer och bilder...128

Exportera film...128

Exportera bild ...129

Tillämpningsuppgifter ...129

Kortkommandon ...131

Sakregister ...132

52

7 Animera

Skapa en klassisk interpolering

Innan du går in på objektbaserad animering ska du först pröva att göra en egen klassisk interpolering som utgår från tidslinjen och dess nyckelbildrutor.

Skapa en ny Flash-fil (AS3) som du ger namnet

1.

.

I Flash-filens befintliga lager (

) ser du en tom nyckelbildruta i tidslinjen.

2. Döp det befintliga lagret till

. Rita upp en cirkel med ovalverktyget (håll

nedtryckt). Placera cirkeln på scenens vänstra sida.

Välj en valfri men enhetlig linje- och fyllningsfärg i panelen

3.

.

Konvertera cirkeln till en grafiksymbol och ge symbolen namnet

. Studera tidslinjepanelen och notera att

bildruta 1 nu är en nyckelbildruta.

Markera bildruta 20 i tidslinjen och tryck

4.

för att infoga nyckelbildrutan.

När du har infogat en nyckelbildruta är det en dags att göra förändringen som du vill ska ske vid den här punkten på tidslinjen. Eftersom du vill att ”bollen”

ska studsa till motsatt sida av scenen, flyttar du grafiksymbolen

till motsatt sida av scenen samtidigt som den sist infogade nyckelbildrutan är markerad.

Se till att bildruta 20 är en nyckelbildruta och att den är markerad. Välj 5.

markeringsverktyget, klicka och dra symbolen

till motstående sida av scenen. Klicka på bildruta 1 i tidslinjen för att kontrollera skillnaden.

Nu ska du skapa den klassiska interpoleringen.

6. Högerklicka mittemellan nyckelbild- rutorna i tidslinjen och välj

i snabbmenyn som visas.

Du kan också gå via

-menyn och välja

.

Tidslinjen mellan nyckelbildrutorna blir lila med

en pil mellan nyckelbildrutorna vilket indikerar en

klassisk interpolering, se bilden nedan.

53 7 Animera

Testa filmen

Du bör alltid testa filmen efter förändringar och tillägg. Du kan testa filmen direkt via tidslinjen genom att ställa spelhuvudet på bildruta 1 och trycka

eller manuellt, klicka och dra spelhuvudet över tidslinjen. För att generera en .swf- fil, en version av den slutgiltiga Flash-filen, måste du välja

,

eller trycka kortkommandot

+

.

Testa filmen genom att generera en .swf-fil välj

1.

,

eller

tryck kortkommandot

+

.

Som du ser rör sig cirkeln åt ett håll och börjar därefter om i en pågående mycket snabb omtagning, vilket vanligen kallas loop. När spelhuvudet nått bild- ruta 20 börjar den hela tiden om vid bildruta 1. Om du vill att cirkeln ska röra sig tillbaka till utgångsläget igen (utan att hamna där automatiskt), måste du pla- cera ut ytterligare en nyckelbildruta på tidslinjen i vilken du placerar objektet på ursprungsplats-en igen.

Infoga en nyckelbildruta på bildruta 40, se till att den nya nyckelbildrutan 2.

på tidslinjen är markerad och flytta tillbaka cirkeln till ursprungsläget (där cirkeln är, på bildruta 1).

Skapa en klassisk interpolering mellan bildruta 20 och bildruta 40. Testa 3.

sedan filmen igen (

+

eller

,

). Notera hur cirkeln rör sig fram och tillbaka i stället för att hela tiden återgå från samma punkt.

Kopiera och klistra in bildrutor

Kanske upplevde du, i föregående steg, att det var svårt att få objektet att hamna exakt på utgångsläget i bildruta 1. För att kringgå det problemet kan du åter- använda bildrutor genom att kopiera och klistra in dem.

• I stället för att utföra steg 2 i föregående övning, placerar du en så kallad tom nyckelbildruta på bildruta 40 i tidslinjen, genom att högerklicka på den bildrutan och välja

i snabbmenyn som visas.

Högerklicka på bildruta 1 och kopiera utgångsbildrutan genom att välja

•

Kopiera bildrutor

. Markera bildruta 40 igen. Du ska nu klistra in den kopierade bildrutan på samma plats som tidigare (då räcker det inte att högerklicka och välja

). Öppna i stället

-menyn och välj

eller ange kortkommandot

+

+

. Nu återanvänder du bildruta 1 på bildruta 40.

Spara filen under valfritt namn och stäng den när du är färdig.

4.

54

7 Animera

Skapa en rörelseinterpolering

Nu när du har lärt dig grunderna för en klassisk interpolering ska du lära dig objektbaserad animering och skapa en rörelseinterpolering, det vill säga en inter- polering med utgångspunkt från själva objektet.

1. Skapa en ny Flash-fil (AS3) som du ger namnet

.

2. Rita ett objekt på scenen med ovalverk- tyget och konvertera det till en symbol.

3. Växla till markeringsverktyget, markera objektet på scenen och högerklicka. Välj

Skapa rörelseinterpolering

i snabb- menyn som visas (studera samtidigt tids- linjepanelen).

Notera att Flash lägger till ett antal bildrutor i tidslinjen när du skapar rörelsein- terpoleringen. Antalet bildrutor som läggs till, baseras på det beräknade antalet bildrutor som visas under en sekunds tagning. Denna beräkning bygger på vald bildrutefrekvens för filmen.

Du kan granska och ändra bildrutefrekvensen via dialogrutan

som du öppnar via menyn

,

. Du kan också studera och anpassa bildrutefrekvensen under

i egenskapspanelen (visas när du klickar på scenen med markeringsverktyget).

Du kan granska och ändra bildrutefrekvens via dialogrutan Dokumentegenskaper eller via panelen Egenskaper.

I samband med att Flash lägger till bildrutor, när du högerklickar på ett objekt och väljer

, följer även spelhuvudet med och placerar sig i sista bildrutan för rörelseinterpoleringen. Den är därmed klar för nästa steg.

Undvik att använda Å, Ä, Ö i filnamn.

Kom ihåg att alltid konvertera objekt till symboler, särskilt om de ska animeras.

55 7 Animera

Det enda som behöver göras för att färdigställa rörelseinterpoleringen är att flytta objektet på scenen så att det inträffar en förändring.

Välj markeringsverktyget, klicka och dra objektet diagonalt till motstående 4.

sida av scenen. Flash infogar automatiskt den speciella nyckelbildrutan,

Nyckelbildruta för egenskaper

, som behövs för att sammanställa rörelse- interpoleringen.

Nyckelbildruta för egenskaper

Den nya objektbaserade animeringstekniken i Flash CS4 erbjuder en ny typ av nyckelbildruta inom rörelseinterpoleringar och utgör värdet för en viss egenskap, vid en viss tidpunkt eller en viss bildruta i en rörelseinterpolering.

Den kallas Nyckelbildruta för egenskaper och skiljer sig utseendemässigt, då nyckelbildrutan för egenskaper ser ut som ett ”ruteress” i stället för som en fylld cirkel.

Rörelsebana

I samband med att du sammanställer rörelseinterpoleringen, skapas en bana från utgångsläget till slutpunkten för interpoleringen, det är den rörelsebana som objektet rör sig efter. Den här rörelsebanan går också att ändra genom att klicka och dra den med markeringsverktyget.

Med markeringsverktyget kan du ändra och anpassa rörelse- banan för att på så sätt ändra objektets rörelse på scenen.

Testa filmen, pröva att ändra banan med markeringsverktyget och testa 5.

filmen ännu en gång.