Wednesday, November 18, 2009

lite flashövningar

Förra veckan gjorde vi lite olika övningar i Flash, närmare bestämt sex stycken. Slutligen fick vi till uppgift att länka ihop dem i en navigationsstruktur (ungefär som startsidan på en hemsida med en meny med länkar till olika undersidor).
Jag ska göra ett försök här nedanför att beskriva hur vi gjorde de sex olika övningarna...

# Frame by frame
I en frame-by-frame animation ritar man ruta för ruta hur en figur ska röra sig. Det ser ut ungefär som när man ritar en gubbe i olika positioner på ett ritblock, och sedan när man bläddrar snabbt i blocket så ser det ut som att gubben rör på sig.
Jag gjorde ett "movieclip" där jag först ritade en streckgubbe som log och vinkade med ena handen. I nästa ruta bryts armen av vid armbågen och det står "snap" och små röda sträck spretar ut runt ordet. Rutan efter det innehåller samma sak, fast gubbens ansikte börjar bli rött. I de fyra kommande rutorna har "snap-ordet" försvunnit och istället börjar det droppa blod från armbågen och det kommer tårar från gubbens öga. Sedan drar jag in mitt movieclip till "scenen" och så kan man spela upp filmen.

#Shapetween
Den här typen av animation liknar frame-by-frame men det går fortare att göra eftersom man inte behöver göra varje ruta för sig. Istället gör man en startruta (keyframe) på tidslinjen i ett movieclip där tex en gubbe har armarna utefter sidorna. Sedan flyttar man fram tio rutor och gör en ny keyframe. I denna keyframe kanske gubben har armarna rakt upp i vädret.
Markerar man den första keyframen och väljer tween-->shape så kommer det bli en liten pil från den första keyframen till den andra på tidslinjen. När du sedan spelar upp filmen på scenen så kommer gubben att röra armarna från startpositionen (armarna rakt ned) till slutpositionen (armarna rakt upp).

#Shape-motiontween
Först gör man en shapetween i ett movieclip, som i exemplet ovan. Sedan drar man in movieclipet på scenen och väljer att skapa en sk guide för hur movieclipet ska röra sig på scenen. Vill jag att min gubbe ska hoppa fram på scenen så ritar jag en taggig linje. Därefter "fäster" jag gubben vid linjen. När jag sedan spelar upp filmen så följer gubben den osynliga linjen.

#Bitmapssekvens
I min bitmapssekvens laddade jag in en bild från Photoshop. Det var en bild på mig där jag satt på en balkong och i Photoshop hade jag gjort lite ändringar på den och sparat i olika lager. Till exempel i det första lagret ändrade jag en fantaflaska som stod bredvid mig så att den såg väldigt smal ut på mitten, i det andra lagret gjorde jag min arm väldigt smal.
När man sedan laddar in bilden med tillhörande lager i Flash blir det ungefär som en frame-by-frame animation där varje lager är en frame. Fantaflaskan blir först tjock, sen vanlig, sen smal osv.

#Bildspel
I bildspelet laddar jag in bilder från Photoshop i olika lager. Genom att använda keyframes och shapetween så kan jag få bilderna att tona in och ut så att det blir ett bildspel.

#Ljudsynkroniserad animation
Här gäller det att ladda in ljud i Flash och sedan få sin gubbe att göra munrörelser som passar till ljudet (pratet). Det gör man genom att i ett movieclip göra gubben med ungefär fyra olika munrörelser. Varje munrörelse lägger man i en egen "keyframe" (tänk blad på blädderblocket) och sedan när man spelar upp filmen ser det ut som om han pratar. Men ibland kanske gubben drar ut på någon bokstav lite extra långt, då får man låta samma keyframe gå över tex tre rutor, så det ser ut som att han stannar upp i den rörelsen någon extra sekund.

#Navigationsstruktur
Efter att vi hade gjort alla ovanstående övningar var det dags att stoppa in dem i navigationsstrukturen (det som ser ut som en webbsidas startsida).
Det gör man enklast genom att länka in varje fil för sig. Jag placerade alla swf-filer i en mapp och skapade ytterligare ett dokument som fick heta index. I den flashfilen gjorde jag olika keyframes, en för varje övning(dokument) som jag ville länka in. Sedan skapade jag ett lager där jag gick in i "actions" (där man skriver kod som talar om vad som ska hända), där talade jag om för programmet att om man klickade på en knapp med en text som jag hade döpt till framebyframe så skulle Flash börja spela upp mitt framebyframe-klipp osv.

Lite krångligt att beskriva allt med bara ord, men jag hoppas att det är hyffsat begripligt iallafall :)

No comments:

Post a Comment