Working with graphics in Fireworks
Below is a brief guide to help you get started creating a splash page design in Adobe Fireworks.
Import existing graphics
To place an existing graphic file in your document:
1.
2.
3.
4.
Go to File>Import.
Navigate to the file, select it and then click Open.
The mouse icon changes to this:
Click where you want the graphic to appear.
To resize the graphic as you insert it, click and drag the mouse to create a
selection area; release the mouse when the area is the size you want.
Create graphics in Fireworks
Drawing tools are available on the Tools panel. They
include both bitmap and vector tools.
Bitmap graphic consists of patterns of dots or pixels.
A vector graphic is composed of elements such as
lines and shapes described mathematically.
Tools with a drop down arrow ( ) have other options.
When you select a tool, its options appear and can be
set in the Properties panel.
Go to Adobe’s online Help for information on how to use the tools.
Common Library
Fireworks Common Library panel (Window menu) contains symbols.
You can drag instances (copies) of these symbols into your document.
Editing a symbol updates all instances (unless you have broken the link).
Modify aspects of the graphic using tools and commands as well as by
applying filters in the Properties panel (see next page). Modify the text in a
symbol in the Properties panel.
Some library objects, such as buttons, include interactions and animation.
For more about assets in the Common Library, see Adobe Help.
© NSW Department of Education and Training, 2010
Layers
Place graphic elements on separate layers or sub layers so they
can be manipulated individually. Each layer can have multiple sub
layers. Layers are displayed on the Layers panel (Window menu).
Use the icons at the bottom of the panel to create and delete
layers and sub layers. Drag layers and sub layers to reorder them.
To move a sub layer into a different layer, select it and click the
circle beside the layer you want to move it to. Use the pop-out
menu in the top-right of the panel to complete other tasks.
Use grids and guides to align elements
Go to View>Grid>Show Grid to display the grid. To change the grid spacing, go to
Edit>Preferences…>Guides and Grids and change the ‘Grid settings’.
Guides are lines which you can drag onto your document
and use to align elements. To create a guide, first ensure
the rulers are visible (if not, go to View>Rulers). Click on
the ruler and drag the mouse; release the mouse where
you want the guide to appear.
To reposition a guide, hover over it and, when the cursor
changes to , drag the guide. To delete a guide, drag it off
the page.
Modifying graphics
To resize, rotate, skew or flip a graphic, select it and then choose the appropriate tool by going to
Modify>Transform. To crop, resize and skew, drag one of the handles around the object.
To crop a graphic, select the Crop tool on the Tools panel ( ), select the
area of the image you want to use, then press Enter on the keyboard.
To recolour a graphic or apply effects such as a drop shadow or bevel, select
the graphic and go to the Properties panel. Click on the ‘plus’ icon beside
Filters and choose an option. Adjust the settings as desired. You can add
multiple effects. To remove an effect, click on it in the pane below the word
‘Filter’ and then click the ‘minus’ icon above.
Fireworks documents can have multiple pages. Each page can have multiple states. States can
have multiple layers and all states on a page share the same layer structure; the layer objects (the
sub layers) can be shared across states or be unique.
By default a new Fireworks document has one page which consists of one state with two empty
layers — a web layer and ‘layer 1’.
© NSW Department of Education and Training, 2010