PREMISE: We have just started working in Macromedia Fireworks, learning how to create some basic vector graphics and manipulate some colors and shapes. As a way to practice this art, we will be recreating the look of a popular website, using only Fireworks tricks and tools.
To start, click on a website below that might be of interest to you. If you are comfortable with the Fireworks practice that we have done so far, please select one of the more difficult or complicated websites. If Fireworks has not come easily to you, you may wish to select a more simple site.
Webpage screenshots to
emulate, click thumbnail for larger image.
|
||||
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
|
 |
 |
 |
 |
 |
 |
 |
 |
 |
||||
HOW TO PROCEED: Once you have selected a website to emulate, open a new canvas in Fireworks of the same proportions as your original website graphic. Using some of the Fireworks tools that we have learned so far: Lines, Shapes, Stroke, Fill, Text and so forth, begin recreating your picture as best you can.
Save your work often by clicking File >Save As. Call your file
lastname_EMULATION.png
TUTORIALS THAT YOU WILL FIND USEFUL:
Basic Fireworks Tools, Tips and Techniques:
- Opening Fireworks and Creating a New Canvas.
- LINES and STROKES in Fireworks.
- RECTANGLE TOOL and FILL in Fireworks, including SOLID FILL, GRADIENT FILL, PATTERN FILL and TEXTURE FILL.
- Creating SHAPES and using the PEN TOOL, TEXT and LAYERS in Fireworks.
- Miscellaneous Tools in Fireworks: SCALE, SKEW, DISTORT, OPACITY, COPY and SAVING files in Fireworks, .png and .jpg files and when to use them.
- Bonus Video Tutorial: Saving Files in Fireworks!
Fireworks Effect and Line Adjustment Tools:
Fireworks Walkthroughs for THIS ASSIGNMENT:
- Fireworks Walkthrough: Setting up the Webpage Emulation Canvas, Zoom Tools and Creating Basic Shapes.
- Fireworks Walkthrough: Using the Pen Tool for Detailed Emulation.
SOME STUDENT EMULATIONS FROM YEARS GONE BY:
Student Emulation |
Original Website |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
TURNING IN YOUR WORK: When you have completely recreated your webpage, please File >Export Preview>.jpeg (pull down the upper left corner drop down menu, where it says GIF) and then EXPORT your picture as:
lastname_EMULATION.jpg.
Make sure to submit your final JPG file to my M: Drive Drop Box when
completed!