Blog & Design Tutorials

Why make websites with Adobe Fireworks?

Raster ImageFirst things first, understanding the difference between vector and raster graphics. Raster graphics are flat images, like photos, jpegs, gifs, etc. Vector images on the other hand, are barely related. A vector image is geometric, much like CAD drawings. Fireworks, just like Flash and Illustrator create a file made up of points, lines, curves, and shapes.

Say for example you had a blue box on a white canvas. If the file was a raster file, it would be made up of a series of blue pixels on a white background. A vector file would be made up of four points, four lines that connect the points, and a fill that makes our box blue.

Adobe Photoshop, a raster based photo editing program, wasn’t quite right for what was basically a new visual industry – but that’s what designers flocked to as the web grew in popularity. Since Photoshop works by adding or manipulating images on a pixel by pixel basis, what if a client wanted a particular box larger, or the dimensions of a button different? In Photoshop this would mean changing any number of layers and flat bitmap images.Enter Macromedia Fireworks. Using our example above with Fireworks, we can enlarge our box and change our buttons by simply manipulating the raw shapes, characteristics, fills, and effects that make up each shape in the design. But it gets better! Unlike other vector editing programs like Illustrator, Fireworks also lets you edit raster based images right in the same environment. This allows you to import a photo, manipulate it in a similar fashion to Photoshop, and then treat it like any other object in Fireworks. Once you’re ready you can slice, optimize, and export your images for the web. In addition Fireworks creates and exports animations, batch process images, creates drop down menus that seamlessly snap into Dreamweaver, and tons of other things useful for a web designer.

I’m quite sure I can convince any web professional that Fireworks is an invaluable tool, and if you continue reading I’ll attempt to do just that for you, dear reader. ;-)

For a more in depth read on Fireworks, I highly recommend the following read from Stéphane Bergeron at the Adobe Developer Center.

Then continue on to my first tutorial, Setting the Stage: A New Fireworks Document.


Did you enjoy this post? Share it with others:

  • Reddit
  • Digg
  • del.icio.us
  • StumbleUpon
  • Propeller
  • NewsVine
  • Slashdot
  • Technorati
  • Yahoo! Buzz
  • Facebook

Tags: , , ,

2 Responses to “Why make websites with Adobe Fireworks?”

  1. Jaclynts says:

    nice work, brother

  2. Barbara says:

    Joey,

    I just wanted to thank you for answering my question on Adobe forum 2/11/09 (whuzthere). I have asked many questions in the past & you are only the second person to respond. I almost always figure things out myself, in time, but this is an emergence. I was using TracVia & will now look at the other companies you mentioned. TracVia keeps getting put on Comcast’s “Black List” and parents were not getting the emails about their children’s class changes.

    Thanks again for your response.

    Barbara

Leave a Reply