Web Design: Photoshop vs Fireworks – no contest

There have been many a showdown lately about whether fireworks or Photoshop is the better tool for the web. I hate to say this, but Fireworks is the better tool to go to the web. (Let me say I am a Photoshop ACE (Adobe Certified Expert) and Certified Instructor, and have been using it since version 2.0, but it’s a matter of the right tool for the right job) I love Photoshop, I do, but hands-down Fireworks is better for many things like:

– It slices better than Photoshop hands down.
– It has Pages, which let you carry on your design to other pages with a Master page for all common elements.
– With Pages, it allows for you to start with a wireframe and have the client approve of the basic structure before you move on to full blown design. It’s called rapid prototyping.
– From that wireframe or design you can make your navigation work and post it to a site, or make a PDF to send to the client.
– It exports much better CSS without having to slice everything up, as we use background images now, and Fireworks understand that and lets you choose when something is a background image.
– It’s a vector-based drawing program, and since most people use Photoshop, you can make your page more unique, plus making vector shapes is much easier.
– Makes symbols to go into Flash if necessary. (Yes you can bring in a Photoshop file into Flash, but it’ll still be a bitmap, not vector art, thus a bigger file)
– Makes skinning application super easy, like for Flex since it also exports as MXML.

(Flash Catalyst (formally Thermo and to come in 2009) will allow the designer to design a web application in Photoshop, Illustrator or Fireworks and bring it into Catalyst and make scroll bars and buttons, and other things function, then hand that off to the developer to let Flex finish things off.)

Photoshop has many positives, and it is by far the standard for image manipulation. I will say for simple image manipulation, i.e., color correction fireworks does a fine job. I can do most things to my images right inside of Fireworks that I need.

The problem as I see it, is Fireworks was just added to the Creative Suite in 3.3 of the Design Premium. Designers haven’t had years to play with it, except for us old groupies of the Macromedia Studio collection. I won a copy of Ultra Dev (Dreamweaver) and Fireworks 3 years ago, 2000 I think. Many current designers just don’t bother learning something new. They already have Photoshop and why learn a new tool. Didn’t Photoshop take what ImageReady had and they incorporated that into it? Well the answer is yes, to a degree.

Can I slice in Photoshop and name it and even make it text? Yes
Can I export as html, and some CSS and have my images go into a folder? Yes
Can I easily make an animated GIF? Yes
Can I make rollover images easily? Whoa, ah, well, ummm, no. This is where the buck stops to a degree. If I want to make a rollover image in PS, I’d have to rename the slice and re-export it.

So, can I save time in Fireworks? Yes. Could I convince others to join me there and save time and frustration? Maybe. For every designer who has CS4, I’d say come on in, open up Fireworks and see how it can change your life by freeing up time spent making Photoshop mockups.

Advertisements

10 comments

  1. wow, I’d like to learn web design, I;m quite experienced in print design. but when it came to web design I know next to nothing, Thank you for your post! At least I know for sure fireworks do a better job when it comes to web designing 😀 – cheers –

  2. So this is where the discussion on linkedin came from 😀
    Anyway, younger generation of web designers maybe are more open to Fireworks. But the older 1.0 generation, i still say its very hard to break the habit of doing everything in Photoshop, Illustrator, Flash. One of Fireworks nicest feature that i like the most is its support of some flash function, really saves some time. Still not as strong as Flash, but for some basic function, its more than enough.

  3. The question on LinkedIn came from an interest to see who uses what as a designer. I am an instructor, and Adobe Community Expert and User group manager. I often feel I am inside the Adobe bubble looking out, and I wanted to see what a real poll of designers would turn up. I am definitely biased, even though I have been using Photoshop the longest of all Adobe products.

  4. Dont worry, Fireworks still has its share of user. I have also teached webdesign here in Indonesia (they used to sell adobe certified too but stopped a few years back because its too expensive to the students here) and what i can say is, newer student really like Fireworks because its a triple play between photoshop illustrator and flash. But as they progressed (to became full time webdesigner), they will want to deepen their knowledge of flash.
    I also know some of non-designer fireworks users. Usually they are some office worker with design as a hobby, or they receive web design task from their office, and surely fireworks will cover most of their basic needs.

  5. Just wanted to say I’m loving Fireworks lately. I use it to make quick, static, clickable mockups of a proposed solution. Then I’ll take our laptop around to our users, navigate to the mockup in the browser and have them run through a quick test. Saves so much time testing options and helps us get to the real requirements. I’m still using CS3 at work, though, and there are some annoying quirks which have been fixed in CS4 (e.g. no way to specify object outlines as “inside” or “outside”)

  6. you missed one great advatage of FW. the option to tell the program that an edge of a vector should be hard. No more anti-aliasing scale-scale-scale-until-i-have-a-single-pixel-line!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s