Benefits of Adobe Fireworks over Photoshop

Non-Fireworks users assume that Fireworks is some kinds of ImageReady, not understanding how great, powerful, intuitive and useful the tool really is.

Fireworks was originally created as an image editing and web design application by Macromedia, for quick web mock-ups, and optimizing images for the Web. It has since been transformed into a powerful environment for designing and prototyping applications that integrates easily with Dreamweaver, Flash and Photoshop &ndash making it, perhaps, the most powerful (that’s controversial) and versatile graphic editor.

Fireworks has always had the reputation of being Adobe Photoshop’s little brother and a graphic editor for amateurs. The truth is, some Photoshop users have underappreciated the power of Fireworks, misunderstood its purpose, and seem to be reluctant to move their design workflow to Fireworks.

When Macromedia Fireworks first appeared back in 1998, it made a huge impact. At the time Web imaging functionality usually boiled down to a photo editing program’s basic ability to export to GIF and JPEG. In comparison Fireworks provided a dedicated approach that offered the benefits of vector-based handling and pixel-based formatting along with advanced optimization and HTML output.

One of the immediate benefits of Fireworks is that it saves images natively in the PNG file format (pronounced “ping”), which stands for Portable Network Graphics. It is a lossless compression format, supporting alpha transparency and millions of colors. You might be thinking: “What about layers? Isn’t the PNG format only for flattened files?” Normally that would be the case, but Fireworks automatically retains the layers you create, just like Photoshop.

For whatever reason, this allows for a significantly reduced file size compared to the equivalent Photoshop document. In fact, after doing a few non-scientific tests – saving layered files as both PNG and PSD – it turns out that the Fireworks file is typically 61% smaller. Another key benefit of Fireworks is compatibility, when it comes to sharing your work with others.

As a general rule of thumb, anything that can read JPEG or GIF files will most likely support PNG as well. Unlike the PSD format used by Photoshop, PNG files are readable by a variety of freely available applications, the most important of which are web browsers.

Another strength of Fireworks has always been rapid prototyping. This is even more true with the latest CS4 version. It now features pages, enabling you to make master templates from which other subsequent layers can descend.
From there, you can easily export to HTML for a quick and dirty client walk-thru (never do this for production code). Likewise, because of the tight integration with Flash, stemming from the days of Macromedia, you can seamlessly import your PNG design in Flash as a FLA vector interface. Not only that, but Fireworks can directly create functional SWF animations as well.

When slicing up images for production use in XHTML and CSS layouts, no other program beats Fireworks in terms of compression. As of yet, Photoshop does not feature the algorithm originally patented by Macromedia. These minutia add up when considering the amount of images in large sites. This has implications for page rendering and monetary savings in bandwidth.

Fireworks can also export MXML, the native interface format for the Adobe Flex platform. Flex powers database driven RIA sites. In this regard, Fireworks is to Flex as Expression Blend is to Silverlight. Essentially a visual design tool, Blend generates XAML, Microsoft’s application interface file format for Vista. It can then be used in conjunction with their .NET Framework.

Since Adobe acquired Macromedia, they have worked hard to ensure that each line of products are interoperable with the others. Though Photoshop still cannot recognize layers in PNG documents, Fireworks can read and write in the PSD format. Despite issues with PSD layers and clipping masks, transition is near seamless. In the event of a disagreement amongst designers, peacemakers using Fireworks can mitigate compatibility problems.

f I have accomplished nothing else by writing this article, I hope that you will at least consider Fireworks as an option for improving the way your creative team works.
Do yourself a favor and make time to explore its versatility.

5 Responses to “Benefits of Adobe Fireworks over Photoshop”

  1. Scott “The Insane Webmaster” Miller says:

    Great article write-up!

  2. James says:

    Great eye opener Greg…taking your valuable insight into consideration along with the fact that the price tag for CS4 is $300, it’s safe to conclude that Fireworks is also a more cost effective solution for designers with a tight budget as well. I’m sold :)

  3. HipKat says:

    Absolutely. With Fireworks, you can not only edit images with a great level of versatility, you can set up templates, as mentioned for pages in a mutli-page document and create rich HTML pages.

    Many of the similarities between Fireworks and Photoshop are actually a bit easier and with less “clicks” in Fireworks.

    Fireworks has a few tricks that Photoshop doesn’t, including a much more versatile Transform Tool.

    Thanks for the props, guys!

  4. Optimizing Workflow…

    I enjoyed reading your blog. What a great thing it is to be able to share information like this on the Internet….

  5. [...] Photoshop en vez de Fireworks. Si tu posición en esta dicotomía es la misma que la de Skeku, HipKat o John Skinner y eres de los que prefieren usar Fireworks a Photoshop para diseño web entre otras [...]

Leave a Reply

 

Powered by WP Hashcash