32 besökare, 1 medlem och 2 Studenter är online nu
Loopia

Flash

Att använda Bitmapp-grafik

Eftersom Flash är ett vektorbaserat program kan det vara svårt att få Bitmapp-grafik att visas med kvalitet. Det är därför viktigt att importera selektivt och att veta en del om de olika formaten. Inte minst är det viktigt att välja optimala komprimeringsinställningar i förhållande till användarens behov.

 

Importera

Importera Bitmapp-grafik gör du antingen genom att kopiera och klistra in från ett bildbehandlingsprogram eller genom Importera (Import) på Arkivmenyn. Valet Importera till Bibliotek (Import to library) använder du om du vill importera många bilder, en bildsekvens för att använda senare eller använda som fyllningar.

Importera bilden du vill använda just nu:

...eller importera flera bilder samtidigt för senare användning:

OBS! Tänk på att importera bitmappar i Flash med försiktighet. Detta för att undvika väldigt stora filmer. Undvik framför allt att animera Bitmapp-grafik genom förflyttningar i x- eller y-led. Resultatet kan lätt bli en långsam och ryckig animation eftersom Flash måste rendera bilden på nytt för varje bildruta som spelas upp.

Tänk också på följande:

  • Bitmapp-grafik förlorar i kvalitet om de visas på en bildskärm med lägre upplösning än själva bilden.
  • Funktionen "Kalkera bitmap" (Trace bitmap) fungerar bäst på bilder som är relativt enkelt uppbyggda. Ju mera komplex bitmappen är desto mindre lämplig är metoden.
  • När du kopierar och klistrar in en PNG-bild från Photoshop komprimerar Flash den som vanligt men inte om man gör detsamma från Fireworks.
 

Kvalitet

Naturligtvis kan det vara önskvärt att ibland uppnå bästa kvalitet på bitmappbilder. Då bör du tänka på följande grundregler.

Använd rätt storlek på bilden

Skala alltid bitmappen utanför Flash. Förbered bilden i ett bildbehandlingsprogram så att du inte behöver ändra storleken i Flash.

Gör bilden till en Symbol

Om bilden förekommer i fler än en nyckelbildruta (Keyframe) bör du göra om den till en Symbol. Dela då först upp bilden med menyn "Modifiera/Dela upp" (Modify/Break apart). Lägg till bilden i ditt Symbolbibliotek med menyn "Infoga/konvertera till Symbol -> Grafik (Insert/Convert to Symbol -> Graphic):

Dela upp bilden:
...och gör den till en Symbol:

Använd rätt publiceringsinställningar

Förbered Flashfilmens kvalitet vid publiceringen redan när du importerat bilden så att du inte glömmer det senare. Använd menyn "Arkiv/Publiceringsinställningar" (File/Publish Settings). Välj fliken "HTML" och välj Kvalitet: Bäst (Quality: Best):

Ställ in bildens egenskaper

I paletten "Bibliotek" (Library) (CTRL+L) högerklickar du på bilden och väljer "Egenskaper" (Properties):

Tips! Huvudregeln är är att om bilden innehåller många färger och toner som tex fotografier eller tonade bilder väljer du "Photo (JPEG)" och om bilden innehåller enklare former och relativt få färger väljer du "Lossless (PNG/GIF)". OBS! Du kan testa hur dina val påverkar bilden med knappen "Test" som visar resultatet i nederkant av dialogrutan.

Undantaget från huvudregeln

Bilden i exemplet är ett fotografi men då det är en relativt liten bild så ger faktiskt PNG/GIF bäst resultat även om formatet innehåller färre färger än JPEG som ju ofta är det bästa valet för fotografier. Detta är alltså ett bra exempel på att du måste prova dig fram för varje bild du importerat. Använd Test-knappen ofta!

I dialogrutan avmarkeras "Tillåt kantutjämning" (Allow smoothing) och valet blir Förlustlös (PNG/GIF) (Lossless(PNG/GIF) för den här exempelbilden:

Om du importerat en bild i JPEG-format kan du avaktivera valet att behålla kvaliteten vid import och själv ange en egen komprimering:

Om du importerat en bild i andra format kan du ändå välja att komprimera dem med egna värden för JPEG:

Prova dig fram vilken inställning som är bäst för just din bild och använd Test-knappen!

 

Komprimering

Genom att komprimera bilden med olika metoder kan du själv kompromissa mellan kvalitet och storlek. De tillgängliga formaten är PNG, GIF och JPEG.

GIF (Graphic Interchange Format) använder maximalt 256 färger och är bäst för bilder och illustrationer med få färger utan tonade ytor. Exempel är knapppar, ikoner, logotyper. GIF använder en förlustfri (Lossless) komprimering för att minska bildens storlek.

JPEG (Joint Photographic Experts Group) är det dominerande formatet för fotografier och tonade illustrationer då JPEG kan innehålla miljotals färger. JPEG använder en förlustkomprimering (Lossy) vilket innebär att information i bilden försvinner. Du väljer själv hur mycket en JPEG-bild ska komprimeras.

PNG (Portable Network Group) är ett patent- och licensfritt alternativ till GIF och har liknande egenskaper. Dessutom stöder PNG Alpha-kanale och transparens. En nackdel med PNG vid användning i HTML-filer är att alla webbläsare ännu inte har fullt stöd för formatet. Vid användning i en Flashfilm är detta inget problem.

Exemplet nedan visar hur JPEG kan vara ett sämre alternativ för illustrationer. Komprimeringen innebär att intillliggande pixlar med liknande nyanser får samma färgvärde och det ger ett "plattliknande" utseende:

GIF: JPEG:

Exemplet nedan visar hur GIF kan vara ett sämre alternativ för fotografier då antalet färger (max 256) inte räcker till för att ge en jämn övergånge mellan pixlarna i bilden:

GIF: JPEG:

 

Bildtyper och lämpliga filformat
Illustrationer i svartvitt och gråskala, ”ClipArt”, Logotypes GIF/PNG
Illustrationer i färg och toningar JPEG
Text, färg, fylld eller med effekter GIF/PNG
Fotografier i fullfärg JPEG
Fotografier i gråskala GIF/PNG

 

Bildformaten i Flash

Flash använder de riktlinjer som gäller för fotografier. Om du importerar illustrationer eller små fotografier kan det löna sig att själv ändra standardinställningarna som finns på två ställen; Publiceringsinställningar och Biblioteket (Library).

Standardinställning för Publiceringsinställningar i Flash är att Komprimera filmen och Kvaliteten Hög (alltså inte bäst).

Standardinställning i Biblioteket för bitmappbilder är "Tillåt Kantutjämning" (Allow Smoothing), komprimering Photo (JPEG) och "Använd dokumentets standardkvalitet" (Use imported JPEG Data):

Vad som händer vid import av en enkel och medelstor bild i Flash MX kan du se av följande översikt. Bilden i exemplet är ursprungligen inscannad och sparad i TIF-format. Storleken är 260 x 195 pixlar med upplösningen 150 dpi. Innan konvertering är filstorleken 162 kb utan komprimering. Bilden har därefter sparats i PNG, JPEG, GIF och BMP innan den importerats till Flash. Notera att det skiljer mycket i storlek med eller utan kantutjämning (Smothing). Det beror på att kantutjämningen består av extra pixlar med nyanser som ger kanten ett jämnare utseende:

filformat filstorlek val i "Egenskaper för bitmapp" filmstorlek (.SWF)
png interlaced 115 kb Photo JPEG 10 kb
    Förlustfri PNG/GIF + kantutjämn 142 kb
png-24 web 97 kb Photo JPEG 10 kb
Förlustfri PNG/GIF + kantutjämn 142 kb
JPEG 100 52 kb Photo JPEG 65 kb
Importkvalitet 100 % 45 kb
Förlustfri PNG/GIF + kantutjämn 134 kb
JPEG 50 10 kb Photo JPEG 10 kb
GIF 40 kb Photo JPEG 37 kb
bmp -24 149 kb Photo JPEG 6 kb
Förlustfri PNG/GIF + kantutjämn 143 kb

De här siffrorna säger ju inte allt, men kan förhoppningsvis ge en fingervisning om hur format och inställningar påverkar Flashfilmens storlek. Tänk på att GIF endast förmedlar 256 färger, har liten filstorlek men begränsad kvalitet. JPEG låter dig ange differentierad komprimering och kombinerar komprimering med kvalitet. PNG bevarar alfainformationen och komprimerar med standardinställningen bättre än JPEG. Formatet BMP kan inte importeras i Flash för Macintosh.

Du kan läsa mer om import av olika filformat i Flash i guiden "Importera grafik" »