Så gjordes bilden i Fireworks MX 2004

1. Inledning

På den här sidan kommer du att få följa ett arbetsflöde. Jag kommer att gå igenom hur jag gjorde en bild i Fireworks MX 2004. Sidan bygger vidare på de tidigare sidorna om Fireworks, som du hittade i innehållsförteckningen.

När jag gjorde min JavaScript-skola behövde jag en logotyp. Utifrån följande bilder gjorde jag sedan logotypen. Här skall jag visa hur jag gjorde.

Jag utgick från följande bilder:
Klicka på bilderna för att se dem i större storlek!

Slutresultatet blev så här:

2. Skapa ny tom bild

Vi börjar med att skapa en ny bild. Den kommer att vara tom tills dess att vi gjort klart de olika delarna av loggan. De färdiga delarna skall vi sedan sammanfoga i den tomma bildens arbetsyta.

Uppgift 1
Skapa en ny bild genom att rycka Ctrl+N eller gå in via Fil-menyn och välja Nytt.

Välj en ganska stor arbetsyta, t.ex 500x500 pixlar. Detta behövs för att kunna flytta runt bildens delar.

Spara bilden på lämpligt ställe med lämpligt namn. Jag valde namnet javascriptskolan_logga.gif.

Tips!
För dig som använder Mac ser kommandona lite annorlunda ut. Man använder då Cmd i stället för Ctrl. Man använder också Ctrl+klick i stället för högerklick. Läs mer >

3. Kaffekoppen

Vi skall nu göra iordning kaffekoppen. Längst upp på den här sidan ser du en miniatyr av den.

Kaffekoppen hade jag i ett köksskåp. Jag fyllde den med kaffe och ställde den på en blå bakgrund och såg till att solen föll in på ett sätt som gav en fin skugga.

Uppgift 2
Klicka på kaffekoppen för att öppna den större versionen. Högerklicka på bilden och välj att spara den på samma ställe som den tomma bilden du just sparade.

Uppgift 3
Öppna den sparade bilden i Fireworks. Vi skall börja med att ta bort bakgrunden.

Välj lassoverktyget. Dubbelklicka på det för att få fram dess egenskaper. Se till så att markeringen får hård kant:

Uppgift 4
Markera de olikfärgade delarna i översta hörnen och tryck på delete för att ta bort.

Tips!
Du kan markera flera ställen samtidigt genom att hålla nere Shift och markera på nytt.

Nu skall det markerade området bli tomt. Bilden här bredvid visar hur det ser ut.

Om det markerade området inte blir tomt beror det antingen på att bakgrunden inte är inställd på genomskinlig eller på att du valt fel lager.

Ändra dukfärg:
Gå in under Modifiera - Duk - Dukfärg. Ställ in att dukfägen skall vara genomskinlig. Vit går också bra.

Byt lager:
I lagerpaletten väljer du rätt lager. Syns inte lagerpaletten tar du fram den under Fönster - Visa lager.

Uppgift 5
Nu skall resten av bakgrunden tas bort. Byt verktyg till trollstaven (wand). Dubbelklicka på trollstaven för att få fram dess egenskaper i den särskilda paletten. Ange

• Tolerans: 40 pixlar
• Kant (Edge): hård

Om 40 är för mycket (eller för lite) märker du. Det kan variera på olika datorer eftersom bilder tolkas något olika.

Meningen är att verktyget skall markera det blå området, men inget av koppen. Ställ in värdet efter hur markeringen blir.

Ta bort genom att trycka delete.

Glöm inte området inne i skuggan för handtaget.

Pixlar som inte markerats stannar kvar, som bilden visar. Dem kan man lätt ta bort genom att markera dem med lassot eller rektangulär markering.

Tips!
Ett sätt att se alla pixlar som inte tagits bort är att ändra dukens bakgrundsfärg. Välj en färg som kontrasterar mot det blå, t.ex vitt. Glöm sedan inte att ändra tillbaka då bilden är färdig!

Uppgift 6
När hela koppen är frilagd skall bilden beskäras. Detta är ett sätt att ta bort överflödiga pixlar ur bilden. Det finns ett kortkommando för detta: Ctrl+Alt+T. Man kan också gå in under Edit och välja "Crop Document".

Om man inte är nöjd kan man också använda beskärningsverktyget (Crop) i verktygspaletten och skära för hand.

Uppgift 7
Spara bilden så att du har en kopia av den. Kopian består nu av en helt frilagd kopp.

Uppgift 8
Nu skall vi förminska koppen något. Gå in under Modifiera - Duk - Bildstorlek (Modify-Canvas-Image size). Det räcker om koppen är c:a 200 pixlar bred.

Uppgift 9
Välj Pekverktyget (Pointer), den svarta pilen längst uppe till vänster i verktygspaletten. Ta tag i koppen och dra över den till den nya bildens arbetsyta (den vi skapade i Uppgift 1).

Tips!
Om du inte vill dra och släppa kan du också kopiera och klistra in.

Stäng sedan den gamla bilden. Du behöver inte spara den eftersom du redan har en kopia.

4. Scriptarket

Vi skall nu göra likadant med scriptarket. Principen är densamma för att skapa friläggningen. Däremot måste två saker göras för att få arket rätt: det måste vändas.

Felvänt	Rättvänt

Uppgift 10
Se till så att scriptarket är markerat. Det gör du genom att klicka på det med pekaren.

Gå in under menyn Modifiera. Välj alternativet Omforma (Transform). Vänd (Flip) först vågrätt och sedan även lodrätt.

Uppgift 11
När man har dragit ner storleken något (se Uppgift 8) kan man ocks öka skärpan. Markera bilden och välj Filter - SKärpa - Oskarp mask (Filetrs-Sharpen-Unsharp mask).

Jag valde följande värden:
Mängd (Sharpen amount): 50
Pixelradie (Pixel radius): 4.1
Tröskel (Threshold): 0

Spara en kopia. När du är nöjd drar du över bilden till den där koppen redan finns.

5. Fjädern

Här gör vi enligt samma principer som tidigare. Först frilägga, sedan förminska och lägga till en oskarp mask om man vill. Fjädern dras till sist över till bilden med koppen och scriptarket.

Uppgift 12
Gör iordning fjädern på egen hand!

6. Skapa bakgrunden

Nu har alla delarna lagts på en och samma bild. Det du har framför dig ser ungefär ut så här:

Dessa delar skall vi nu placera på en rektangel. Vi måste därför göra denna yta.

Uppgift 13
Välj rektangelverktyget i verktygspaletten.

Rita upp en rektangel som är "lagom" stor. Du ser ungefär storleken i den bild jag gjort i bilden.

Uppgift 14
Om rektangeln inte är markerad väljer du pekverktyget och markerar den. I egenskapspaletten ser du då dess egenskaper: storlek, linje- och fyllningsfärg.

Linjefärg:
Klicka på den färgade rutan till höger om pennan. Muspekaren omvandlas nu till en pipett. Välj en svart färg. Välj även bredden till höger genom att skriva in en etta. Linjen skall vara 1 pixel bred (hård eller mjuk spelar ingen roll).

Fyllningsfärg:
Denna väljer du genom att klicka på den färgade ytan till höger om spannen. För pipetten över kaffet i kaffekoppen. Du skall försöka hitta en färg för rektangeln som harmoniserar med kaffet.

Tips!
Om du tycker det är svårt att pricka rätt kan du förstora kaffekoppen genom att använda zoomverktyget eller zoomlägena.

Zoomverktyget finns ganska långt ner bland verktygen. Zoomlägena hittar du nere till höger i det fönster du arbetar i.

7. Sätt samman delarna

Nu har vi bakgrunden klar och skall bara placera de olika delarna på rätt ställe. För att få delarna att passa in väljer man kommandot Omforma fritt (Free transform).

Det hittar man antingen via snabbkommandot Ctrl+T eller "Modifiera - Omforma - Omforma fritt" (Modify-Transform-Free transform).

Uppgift 15
Placera scriptarket på bakgrunden. Använd Omforma fritt för att anpassa arkets storlek.

Genom att ta tag i hörnen kan du också rotera arket så att det kommer i rätt vinkel.

Tips!
För att inte ändra proportionerna när du förminskar skall du ta tag i hörnen och dra inåt, samtidigt som du håller Shift-tangenten nertryckt.

Uppgift 16
Placera koppen och pennan på motsvarande sätt. Jag visar i bilden här bredvid hur det ser ut.

Tips!
De olika objekten ligger i olika lager i den ordning de skapades i dokumentet. Det betyder att om du lagt delarna i "fel" ordning kan de skymma varandra.

För att ändra ordningen går du antingen till lagerpaletten och drar och släpper dem där de skall liga.

Eller markerar du ett objekt med pekaren och går sedan in under Modifiera - Ordna (Modify-Arrange) och väljer det alternativ som passar bäst. För detta finns sedan också kortkommandon, som du ser i menyerna.

8. Skapa bläckplumpen

Det sista vi skall göra är att skapa en liten bläckplump. Detta görs enklast med ritstiftet.

Uppgift 17
Välj ritstiftet i verktygspaletten.

Genom att klicka bygger man upp en form.

Klicka och dra samtidigt ger en mjuk linje.

När du är klar väljer du pennverktyget och markerar formen. Välj samma fyllningsfärg som bakgrunden (eller kaffet). Använd ingen linje.

Se till så att fjäderns spets hamnar ovanpå fläcken, som jag visar i den uppförstorade bilden här ovan.

9. Exportera den färdiga bilden

Nu är bilden klar och det enda som återstår är att beskära och exportera den. Beskärningen visade jag i Uppgift 6. Snabbkommandot är Ctrl+Alt+T.

Innan du exporterar bilden skall du spara den så att du har en originalbild.

Uppgift 18
Exporten går till så att man väljer Fil - Förhandsvisa export (File - Export Preview). Kortkommandot är Ctrl+Shift+X.

Välj GIF som format

Klicka på Export.

Spara filen på lämpligt ställe.

Klart!