 |
 |
|
|
|
Parkland College > Center for Excellence > Fireworks II > Lesson 3
MACROMEDIA FIREWORKS II
Lesson 3: Vector Graphics
Instructor: Paul
Young
|
| |
Overview
|
|
Vector graphics are also known as "outline-fill." Vectors have a distinct advantage over raster (bitmap) images. Vector art is resolution-independent, is much smaller in file size than bitmap images and can be easily edited.
In this lesson, we'll work with Fireworks's vector drawing tools
to create a flow-chart that can be optimized for web as well as
print.
|
| |
Procedure
|
|
prepping for the lesson
- download lesson starter files
- examine downloaded files
- launch Fireworks
- file > open "lesson3/3-before.png" (note size, zoom)
- file > save as "lesson3/after.png"
- practice navigation shortcuts: SPACE, SPACE+CTRL, SPACE+CTRL+ALT, CTRL+1, CTRL+0
- note toolbox, properties, panels
- note layers (hint: layers can be collapsed, renamed, restacked)
adding type
- select "type" layer
- text tool: type "Lesson 2" (Arial 16, centered, black)
- copy text block (drag, add ALT+SHIFT)
- edit > repeat (ctrl+Y)
- change text to "Lesson 3", "Resources" (hint: double-clicking the upper right corner toggles "auto-sizing" on/off)
- window > align: horiz center, distribute top edge (hint: panels can be docked/ungrouped by dragging the "gripper" upper left corner)
adding boxes and rules
- new layer "boxes" (lock other layers); restack to bottom
- draw box: fill=white, stroke=black (2px)
- copy box (drag, add ALT+SHIFT)
- edit > repeat (ctrl+Y)
- align and distribute (if needed)
- new layer "rules" (lock other layers); restack to top
- draw rules: stroke=black (2px, basic>hardline) (hint: zoom in)
- duplicate rules as needed
- align and distribute (if needed)
optimize for web & print
- file > save
- choose 2-up (note file sizes, download time)
- window > optimize: GIF 128
- file > export: "after.gif"
- modify > canvas > image size: resolution=300 PPI
- file > export: "after.ai" (Illustrator 7)
- file > save as "after-hires.png" (for importing into Word)
|
|
|
