65 besökare, 3 medlemmar och 1 Student är online nu
Loopia

Flash

Om Flash och grunderna om objekt

Flash är en teknik som nu blivit standard för användning på webbsidor. Flash kan ofta vara lösningen när HTML-standarden inte räcker till. Programmets styrka är att det hanterar Vektorgrafik (läs mer om vektor- och Bitmapp-grafik här »), bitmappbilder, animationer, ljud och andra händelser som du kan påverka med ett scriptspråk (Flash script). Du kan bygga en hel webbplats med Flash!
Ofta upplever du kanske Flashfilmer som långsamma och tidskrävande att ladda ner i webbläsaren? Det beror inte på Flashformatet i sig utan på att den som gjort presentationen använt för "tung grafik" i form av foton och övriga bitmappbilder. I guiderna om Flash kommer du att få lära dig att skapa snabba och bra Flashfilmer :-)
Det var alla goda sidor, nackdelar då? Den största nackdelen är att det krävs ett speciellt program (Flash player ») för att se Flash. De senare webbläsarversionerna installeras ofta med Flashspelare, annars måste användaren ladda ner programmet för att kunna se din Flashfilm. Samma problematik gäller ju även för andra tekniker som tex Java, Acrobat (PDF-dokument), Shockwave, Real player, QuickTime mfl.
Idag kan ca 98,3% av alla Internetanvändare se Flash i någon version, antalet sjunker för senare versioner.
(Siffrorna avser mars 2005, läs mer om statistiken på www.macromedia.com »)

Övningen är uppdelad i följande avsnitt:

  1. Arbetsytan i Flash »
  2. Rita och markera objekt: Oval och Rektangel, arbeta med Lager »
  3. Markera och gruppera objekt »
  4. Rita och redigera objekt: Pennan »
  5. Rita och redigera objekt: Penseln »

 

Arbetsytan i Flash

När du installerat Flash och startar det första gången ser arbetsytan ut så här:

När du jobbar i Flash skapar du filmer (movies) och det gör du på arbetsytan som kallas scen (scene). Slutresultatet sparas som en Flashfilm (Flash movie) med filtilläget .fla som är redigerbar och slutligen publiceras den som en Flashspelarfilm (Flash player Movie) med filtilläget .swf och är då inte längre redigerbar.

Tips! Om du vill återställa visningen av palettfönster använder du menyn "Fönster/Paneluppsättningar/Standardutseende" (Window/Panel Sets/Default Layout) Saknar du ändå vissa verktyg och menyer visar du dem med menyn "Fönster/Verktyg" och "Fönster/Verktygsfält" (Window/Tools, Window/Toolbar)

Innan du börjar med en Flashfilm bör du också ställa in storleken i bredd och höjd och vilken bildhastighet som ska användas i animationerna. I menyn "Ändra/Film..." (Modify/Movie...) visar du inställningarna:

Bildrutehastighet
(Frame rate) avser det antal animeringsbildrutor som ska visas per sekund. För de flesta animeringar som ska visas på bildskärm, tex på en webbplats, kan du använda 8 till 12 bildrutor per sekund (12 bilder är standard). Fler bildrutor per sekund ger "mjukare" rörelser och effekter men resulterar även i att filmens lagringsstorlek blir större.

Bilder per sekund (Frames per second, fps):
12 = standard för web
24 = används i tecknad film och på video
36 = antal bilder som det mänskliga ögat kan uppfatta. Att ange högre hastigheter är alltså meningslöst...

Dimensioner
Du anger storleken på Flashfilmens scen i pixlar. Minsta storlek är 18x18 pixlar och största storlek är 2880x2880 pixlar.
Om du redan skapat objekt på scenen och innan du sparar vill ange scenstorlek så att det finns lika stort utrymme på alla sidor runt innehållet, klickar du på Matcha innehåll (Match content). Om du vill minimera filmstorleken ordnar och justerar du alla objekt i scenens övre vänstra hörn och väljer sedan Matcha innehåll. OBS! Det är bra om du vet vilken storlek du ska ha på Flashfilmen innan du bygger den eftersom det är ett tidskrävande jobb att i efterhand justera alla scener och objekt som ligger utanför den slutliga storleken på scenen.

 

Rita och markera objekt: Oval och rektangel

Innan du börjar använda tidslinjerna (timelines) och skapar animationer är det viktigt att du har kunskap i hur du arbetar med objekt i Flash. Utnyttja i första hand de verktyg som finns i programmet innan du importerar objekt du skapat i andra program, då blir filstorleken oftast betydligt mindre. Du kan importera vektorgrafik från tex Macomedia Freehand och Adobe Illustrator och foton i de flesta bitmappformat.

Tips! När du testar ritverktygen mm kan det vara en bra idé att backa/ångra med CTRL+Z och testa igen och igen och igen tills du behärskar tekniken...

 

Oval

Verktygen "Oval" och "Rektangel" skapar objekt som kan ha fyllning och kantlinje. Standardinställningen är blå fyllning och svart kantlinje:

För att ställa in färgerna till "standard" (svart och vitt) använder du knappen och för att växla färgerna används knappen

  1. Välj verktyget "Oval" och rita en form. Om du håller SHIFT intryckt när du ritar får du en Cirkel. Du kan även se när formen ären cirkel då "handtaget" blir en tjock rund ring:


  2. Markera din oval med verktyget "Pil" (Arrow). Du kan markera objekt på flera olika sätt. Viktigt är att du kontrollerar vad som är markerat: fyllning, kantlinje eller båda. De är nämligen egna objekt och hänger inte samman förrän du grupperar dem.

    klicka på objektets fyllning


    ...för att markera fyllningen


    dubbelklicka på objektets fyllning


    ...för att markera både fyllning och kantlinje


    klicka på objektets kant


    ...för att markera kantlinjen

  3. Oavsett vilken del av objektet du markerat så kan du flytta det genom att klicka på den del du vill flytta och dra den till önskad position.

    klicka och dra del av objekt


 

Redigera objekt

En enkel redigeringsmöjlighet av objekt är att med verktyget "Pil" (Arrow) klicka på ett objekts kant och samtidigt dra, släpp inte musknappen, alltså klicka+dra direkt annars flyttas objektet!

  1. Klicka+dra i kanten på ett fyllt objekt med kantlinje



    ...och både fyllning och kantlinjen ändras


  2. Klicka+dra i ett objekt utan fyllning



    ...och linjen ändrar form

  3. Klicka+dra i ett objekt utan kantlinje



    ...och fyllningen ändrar form


  4. Klicka+ALT+dra i ett objekt



    ...för att få en vinkel på den ändrade punkten

Jag älskar redan Flash!!! ... eh, eller vad?

 

Använd Lager

Innan du provar de övriga verktygen kan du skapa nya Lager att rita dem i. Lager fungerar likadant som i Photoshop, Illustrator och Freehand. Fördelen är tex att du kan låsa och dölja Lager. När du sedan börjar med animationer i Flash, vilket ju är den egentliga poängen med programmet, så använder varje Lager en egen tidslinje. Genom att rita objekt i egna Lager redan nu så har du rätt arbetssätt för kommande animationer...

Skapa lager genom att klicka på knappen "Lägg till Lager" (Insert Layer)

Namnge dina Lager så håller du bättre ordning på dem. Dubbelklicka på Lagernamnet och skriv ditt nya namn

 

Rektangel

Med verktyget "Rektangel" skapar du rektanglar och kvadrater. Tillvägagångssättet är detsamma som med Oval men du har har även möjlighet att bestämma om du vill ha runda hörn med knappen "Radie" (Radius).

 

Markering av en rektangel sker på nästan samma sätt som en cirkel men rektangeln innehåller fyra sidor som var och en är ett eget objekt.

  1. Klicka på rektangeln för att markera Fyllningen


  2. Dubbelklicka på rektangeln för att markera både fyllning och kantlinje


  3. Klicka på en sidas kantlinje för att markera en del av hela kanlinjen

  4. SHIFT+klicka på annan sidas kantlinje för att markera flera linjedelar

  5. Dubbelklicka på kantlinjen för att markera hela kantlinjen

 

Markera och gruppera objekt

Som du sett i tidigare avsnitt är markering av objekt speciell då fyllning och kantlinje består av egna och ofta flera objekt. Ett bra sätt att "hålla ihop" de objekt som hör ihop är att gruppera dem.

Markera objekt

Välj verktyget "Pil" (Arrow) och markera de objekt som ska ingå i gruppen. Ett sätt är att SHIFT+klicka på varje delobjekt vilket kan ta lite tid. Då kan det vara enklare att dra en markeringsram runt de objekt som ska ingå. Se till att hela objekten ingår i markeringen annars blir det ännu fler delar!

Markeringsområdet täcker inte hela objekten...

...och endast delar av objekten blir markerade.

Dessutom kan du flytta de markerade delarna...

...så har du ännu fler objekt att hålla reda på!

Om du vill ha sammanhållna objekt ser du till att
markeringsområdet täcker hela objekten...

...så blir resultatet att alla delar är helt markerade :-)

Gruppera objekt

När du markerat de delar som ska ingå i en grupp väljer du menyn "Ändra/Gruppera" (Modify/Group) och din markering ändrar utseende:

Så här ser din grupp ut. Notera den blå ramen:

Om du vill redigera objekt i en grupp dubbelklickar du
på ett objekt för att "komma in" i gruppen. Markeringen
som visade gruppen försvinner då:

Du ser att du är i gruppen längst upp till vänster i scenens fönster:

Dubbelklicka igen för att markera det objekt du vill bearbeta:

När du är klar med bearbetningen och vill gå ur gruppen
klickar du på scenens namn för att komma tillbaka till scenen:

OBS! När du senare börjar med animeringen så gruppmarkeras de animerade objekten ("aktörerna") på ungefär samma sätt och du markerar dem som ovan. Bra att ha koll på det redan nu alltså...

 

Rita objekt: Pennan

Innan du ritar med Pennan är det en bra idé att skapa ett nytt Lager igen:

OBS! Om du behöver ändra ordningen på Lager så klickar+drar du dem. Vilken ordning Lagren ligger i påverkar senare animering av objekt, du kan tex inte få ett objekt som ligger i ett ovanliggande Lager att läggas underst ordningsmässigt.

Med "Penna" (Pencil) ritar du linjer på fri hand. Du kan välja tre typer av ritning med pennan: Räta ut (Straighten), Jämna ut (Smooth), och Bläck (Ink):

Räta ut (Straighten)

Jämna ut (Smooth)

Bläck (Ink)

 

Markera och redigera linjer

Markera linjer
Linjer kan liksom rektangeln beståav flera kantlinjedelar. Om linjen ritats med valet "Jämna ut (Smooth) är det ofta en linje men om den ritats med "Räta ut" (Straighten) består den av flera linjedelar. Du kan markera del av linje eller hela linjer.

  1. Klicka på linjen för att markera del av linjen

  2. Dubbelklicka på linjen för att markera hela linjen

 

Redigera linjer
Redigering av linjer sker genom att ändra en kurvpunkt eller en vinkelpunkt. Du kan se på markören vilken del av linjen du redigerar.

  1. För markören över en vinkelpunkt


    ... klicka+dra för att redigera vinkelpunkten


  2. För markören över en kurva


    ...klicka+dra för att redigera kurvan


 

Rita objekt: Penseln

Med Penseln (Brush) målar du befintliga eller nya objekt. En väsentlig skillnad jämfört med bildbehandlingsprogram som skapar Bitmapp-grafik är att Flash skapar vektorgrafik även vid målning. Det innebär att du sedan kan ändra det målade områdets ankarpunkter (Beziérpunkter).

Målade områden kan sedan bearbetas som vektorgrafik med beziérpunkter:

Du kan välja egenskaper för hur penseln målar med "Alternativ" (Options):

I exemplet nedan målar vi den oval vi ritade tidigare. Innan du målar kan du välja färg genom att klicka på Fyllningsfärgsrutan:

Med alternativet Måla normalt (Paint Normal) kan du måla över linjer och fyllningar i samma lager.


Med alternativet Måla fyllningar (Paint Fills) kan du måla fyllningar och tomrum, utan att måla över linjerna.

Med alternativet Måla bakom (Paint Behind) målar du runt ett objekt utan att påverka linjer och fyllningar.

Med alternativet Måla markering (Paint Selection) målar du i ett markerat område (se punkt 3 ovan).

Alternativet Måla inuti (Paint Inside) målar över fyllningen där du börjar penseldraget, utan att måla över några linjer. OBS! Om du börjar måla i ett tomt område påverkas inte redan fyllda områden, börja alltså målningen i ett redan fyllt område för att få ett resultat!


Puh! Det var en hel del om objekten i Flash. Nu vill du börja animera eller hur? Vi föreslår att du har tålamod och tittar på guiden "Färger, fyllning och toning" » först!