Titta på
det exempel som handledningen bygger på. Ta hem vandring.zip med de
filer du behöver för att börja öva med stöd av handledningen. Titta på resultatet
av övningen.
Snart kan vi gå runt med mobiltelefon med Internet
och få reda på mera om den plats där vi hamnat. Redan nu går
det bra att använda ljud på webben om du har bredband. Och finns
det något roligare än ljud? En TV utan ljud är trasig!
Stockholms stadsmuseum och Mediecenter Stockholm har i dagarna
utlyst en tävling i att göra guidade stadsvandringar på svenska
och/eller ett annat språk. Vill du veta mera så gå in på
stadsvandring.mediecenter.com.
Det här ska handla om hur du gör en stadsvandring
med hjälp av Flash MX som har strömmande ljud vilket betyder att ljudet
kan börja spelas upp innan hela ljudfilen har laddats ner från webbservern
till webbläsaren. Du får också lära dig använda en
inladdningsmätare så att det går att se och höra stadsvandringen
över ett vanligt modem eller bredband utan att den stannar upp i väntan
på att text, ljud och bild ska laddas ner.
skapa bild och ljud Börja med att gå ut och fotografera – människorna, gatorna och
husen. Prata med dem du möter. Forska lite i traktens historia. Tala sen
in en berättelse till bilderna.
Du behöver ha ljudkort och ett ljudredigeringsprogram
på datorn och en bra mikrofon med en "strumpa" på så
att inga dånande "P"-ljud spelas in till ljudfilen. Spara ljudet
som .wav eller .mp3.
Bilderna behöver du se till att få ut i digitalt
format på kasett, CD eller nedladdningsbara från webben när
du beställer framkallning och kopiering. Eller använd en digital kamera.
Eller skanna in vad du ritat och målat så att du får du lite
mer poetiska bilder än vad ett knäpp på kamerans avtryckare
kan ge. En liten varning! Inskannade bilder och digitalfoton kan bli stora så
du måste skala ner dem i ett grafikprogram till den storlek du tänker
använda dig av på webben om inte dina besökare ska få
vänta olidligt länge på att bilderna laddas ner.
ta hem vandring.zip och packa upp den
För att skapa en egen stadsvandring så börja med att ta hem
och packa upp filen vandring.zip som du hittar på DIU:s webbplats.
Efter att ha packat upp den så har du fått sex nya filer. För
att du på egen hand ska kunna följa min handledning innan du har
egna bilder och ljud så har jag lagt med bildfilerna - glasskiosk.jpg
och korvkiosk.jpg - och ljudfilen - nyvandring.mp3.
Du hittar också filen vandring.html som är
en webbsida som du kan öppna i din webbläsare. På sidan finns
vandring.swf inlagd som är en komprimerad Flash-film för webben.
För att den ska fungera måste du ha insticksprogrammet Flashplayern
6 som du kan hämta på www.macromedia.com/downloads. Där kan
du också hämta en fullversion av Flash MX som du kan använda
i 30 dagar.
Det första du får syn på i vandring.swf
är en knapp. Klickar du den får du höra mig säga: Slottet
- Stortorget samtidigt som bilder på Slottet och Stortorget i Gamla Stan
dyker upp. Det är en väldigt kort vandring endast gjord för att
det ska bli lätt för mig att förklara hur du ska kunna göra
en egen vandring med massor av bild och ljud.
ta in ljud och lägg ut det på tidslinjen
Den sjätte filen du hittar heter vandring.fla. Den ska du använda
när du gör din egen stadsvandring. Starta Flash MX och gå till
Arkiv > Öppna för att leta reda på vandring.fla. Klickar
du på ENTER-tangenten så spelas filmen upp. Du kan också dra
i den röda markeringen ovanför tidslinjen för att lyssna till
ljudet och se bilderna på Slottet och Stortorget dyka upp. Har du testat
klart så gå till Arkiv > Spara som för att spara
vandring.fla med ett annat namn. Jag sparade den som nyvandring.fla.
För att slippa problem när du skickar in vad du gjort till en webbserver
så använd i filnamnet bara små bokstäver och inga mellanslag
eller svenska bokstäver.
Gå till Arkiv > Importera och leta reda på
nyvandring.mp3 eller ditt eget ljud. Fönster > Bibliotek tar
fram .fla-filens eget bibliotek där du hittar den importerade ljudfilen.
Fönster > Egenskaper tar fram Egenskapsmenyn som du behöver
för att lägga in det nya ljudet. Markera nyckelbildrutan på
ruta 3 på Lager 1 och välj från en rullgardinsmeny den importerade
ljudfilens namn. Under ljudfilens namn ska det stå Synk: Ström
för att det ska gå att lägga in bilder i takt med ljudet.
Klicka sen knappen Redigera på Egenskapsmenyn
för att få fram en ny meny där du kan välja att bara en
viss bit av ljudet spelas upp eller se till att hela ljudfilen spelas upp genom
att dra åt höger i knappen mellan höger- och vänsterljudkanal.
Klickar du knappen med en filmremsa så får du reda på hur
många rutor det behövs på tidslinjen för att spela upp
ljudet. Ljudfilen nyvandring.mp3 behöver cirka 27 rutor. Klicka OK! för
att komma tillbaka till scenen.
Högerklicka en ruta längre fram på tidslinjen
för att på den meny som kommer fram välja Infoga bildruta.
Om inte hela ljudfilen syns så scrolla dig framåt längs tidslinjen
och infoga nya bildrutor. För att också den bild som finns på
nyckelbildruta 14 på Lager 2 ska synas så högerklicka den ruta
på Lager 2 som finns ovanför den sista rutan på Lager 1 med
ljudet och välj Infoga bildruta.
ta in bilderna och placera dem på nyckelbildrutor
längs tidslinjen Gå till Arkiv > Importera och leta reda på dina
egna bilder eller välj glasskiosk.jpg och korvkiosk.jpg. vandring.fla är
gjord för att få plats på skärmen på en handdator.
Behöver du göra scenen större för att dina bilder ska synas
så gå till Ändra > Dokument och skriv in en ny bredd
och höjd. Flash har som standard en scen med bredden 550 pixels och höjden
400 pixels som passar alla skärmar på stationära och bärbara
datorer och också ger plats för webbläsarens menyer.
De importerade bilderna lägger sig på scenen.
Fönster > Verktyg tar fram verktygsmenyn med ritverktyg för
vektorbilder. PS. Det är mycket enkelt att skapa vektorbilder i Flash som
du sen kan exportera till bitmapbilder genom att gå till Arkiv > Exportera
bild. Bitmapbilder som fotografier och inscannade bilder går bra att importera
till Flash men det går inte att redigera dem inne i Flash.
Använd den svarta pilmarkören på verktygsmenyn
för att markera de importerade bilderna och klicka sen Delete-tangenten.
Bilderna är borta från scenen men finns kvar i biblioteket som du
tar fram genom att gå till. Fönster > Bibliotek.
Bilderna kan du dra ut från biblioteket till scenen.
För att kunna placera en bild i höjd och sidled på scenen så
behövs en nyckelbildruta. Vanliga bildrutor visar sen bara fram vad som
finns på en tidigar nyckelbildruta. För att skapa nya nyckelbildrutor
och ta bort gamla nyckelbildrutor så högerklicka en ruta och välj
från den meny som kommer fram Infoga nyckelbildruta, Infoga tom nyckelbildruta
eller Rensa nyckelbildruta.
För att du lättare ska kunna flytta runt bild och
text också utanför scenen så se till att Visa > Arbetsyta
är förbockat.
skapa en .swf-fil för att testa
Innan du testar så gå till Arkiv > Publiceringsinställningar.
På fliken Format se till att Flash och HTML är förbockat.
Välj sen fliken Flash för att ställla in den kvalitet/komprimering
du vill ha på .jpg-bilder. För Ljudström bör du ange minst
24 kbps och Bäst. Tänk dock på att högre kvalitet på
bild och ljud ger längre nedladdningstid. På fliken HTML finns
en del inställningar att experimentera med. Sen OK!
För att all programmering ska fungera så behöver
du gå till Kontroll > Testa film för att skapa en .swf-fil.
Det är en komprimerad version av .fla-filen lämplig för webben.
Du behöver ta reda på hur många bits som behöver laddas
ner från webbservern i förväg innan stadsvandringen startar
för att inte stadsvandringen ska stanna upp i väntan på att
text, bild och ljud ska laddas ner från webbservern till webbläsaren.
Välj därför under Felsök den modemhastighet
du anser dina besökare måste ha för att kunna se din stadsvandring.
En modemhastighet på 56 kbps är normalt. Gå sen till Visa
och bocka för Bandbreddsprofilering och du får fram ett stapeldiagram
som visar hur text, bild och ljud kommer att laddas ner. Det som befinner sig
ovanför den röda linjen på diagrammet kan ställa till med
problem. Gå därför till Visa > Visa Strömning
och du får se hur inladdningsmätaren laddar in ett antal bits i förväg.
När mätaren kommer upp i 100 procent får du se och höra
stadsvandringen.
Stannar den upp så behöver du se till att inladdningsmätaren
laddar in flera bits i förväg. På raden under Inläst: 100%
så hittar du det totala antalet bits som behöver laddas ner - i det
här fallet 102729 B. Gå till Arkiv > Stäng och du
kommer tillbaka till .fla-filen.
testa igen och publicera Fönster > Åtgärder tar fram programmeringsmenyn. Det
här med programmering kanske skrämmer en och annan men det finns ingen
anledning till att vara rädd. Den programkod som du behöver hittar
du under Åtgärder > Filmkontroll i den högra delen
av programmeringsmenyn. De tre vanligaste kommandona brukar räcka långt:
stop(), gotoAndPlay() och gotoAndStop(). Programmeringsfönstret har två
lägen. Normalläge med hjälp och Expertläge
som är lite lättare att skriva i.
Markera nyckelbildrutan med ett litet a på rua 1 på
Lager 1. Nu står där bits = 100 000; Det totala antalet bits
som behöver laddas ner är 102729 B. Det går alltså att
välja ett lägre värde och låta de resterande bitarna laddas
ner under uppspelningens gång. Ju lägre värde man väljer
ju kortare blir väntetiden på att få se och höra något.
Du kan testa med att skriva in bits=80000 OBS! Du får inte använda
mellanslag i talet och semikolonet på slutet av raden behövs inte
om satsen står på en egen rad.
Gå sen till Kontrol > Testa film och välja
Visa > Visa Strömning för att se om det går att spela
upp stadsvandringen utan att den stannar upp. När det fungerar så
gå till Arkiv > Publicera och du får en .html-fil och
en .swf-fil som du kan skicka in till en webbserver. Tyckte du det verkade svårt.
Öva lite och du kan sätta igång och göra egna stadsvandringar
eller presentera vilket ämne som helst med text, bild och ljud.
flashprogrammering en barnlek För att se att programmering i Flash inte innebär några
konstigheter, så klicka nyckelbildrutan med ett a på ruta 2 på
Lager 1. Det enda som står där är stop(). Ett vanligt nybörjarfel
är att man inte sätter stop() för Flash som då automatiskt
spelar upp - utan all ände - vad som finns på tidslinjen.
Markera sen knappen på scenen på ruta 2. Den
har tre rader med kod. on (release) { på första raden ser
till att något händer när mustangenten släpps upp(eng.
release). Krullparentesen på första raden har en motsvarande krullparentes
} på rad 3. Allt som ska hända när knappen släpps
upp måste finnas på rader mellan de två krullparenteserna.
Nu finns bara rad 2 och det enda som står på raden är play();
för att ett klick på knappen ska få Flash att gå
vidare till ruta 3 och spela upp det som finns längs tidslinjen. Knappen
är en färdig knapp som jag hämtat från ett bibliotek som
finns under Fönster > Vanliga bibliotek. Om du väljer Normalläge innan du programmerar en knapp så
slipper du tänka på vad du ska skriva. Då är det bara
att klicka det kommando du vill att knappen ska få t.ex. play och de extra
raderna som behövs skrivs in automatiskt.
Mer programmering än så här ska du inte behöva
kunna så jag tror inte att du behöver vara rädd för experimentera
lite med Flash och upptäcka en ny värld av rörlig bild och ljud
som gör dig och dina elever glada - förenar nytta med nöje!