post

Now is a Good Time to be a Fireworks Evangelist

I could not imagine my creative process without Adobe Fireworks. I have been using that application since version 2.0 sometime in 1999. 10 years ago, Fireworks was not an obvious choice but the workflow advantages over Photoshop were immediately evident to me and my creative process never was the same. Unfortunately, it took almost all those years for Fireworks to be taken seriously in the industry. Being a Fireworks evangelist 5 or 6 years ago felt like preaching in the desert. But not anymore.

Today, Fireworks is finally thriving. After a couple false starts and dud versions (yes I’m looking at you Fireworks 8 and CS2!), versions CS3 and CS4 have finally brought Fireworks to a level where many industry heavyweights are now paying attention. It is also crossing over into new fields like User Experience and Interaction Design where many practitioners who are not traditional Web designers (read visual/graphic designers) use Fireworks for rapid prototyping and quickly iterating interface and interaction designs.

It is an exciting time for Fireworks which proves that Adobe’s decision to keep it alive after acquiring Macromedia was the right one. Not only that but the application itself has finally started to really improve again after stagnating for a few years under Macromedia’s watch. There are new books being written about it or with chapters about it, new (and not so new) Web sites covering how to use it or who is using it. Can’t wait to see what’s in store in Fireworks’ future.

If you have never tried it, do yourself a favor and do so. If you are coming from Photoshop, leave your pixel pushing Photoshop mindset at the door and embrace Fireworks vector based workflow. Regardless of Fireworks’ very capable bitmap editing tools, its real strength lies in its hybrid workflow based on a vector based core. Until you really give it a try, you will never know how much difference working in a vector based environment does for any kind of layout work.

Comments

  1. says

    Hi Stéphane,
    I am happy to see you so optimistic about Fireworks. I’ve learned recently in the forum that it seems that Fireworks is not a vector based core application but more bitmap like Photoshop.

  2. says

    Fireworks not a vector application? Since when? ;) I know you know better Thierry but who told you such a thing? Do you have a URL to that post? Maybe they were thinking that because of the rendering which is limited to 72 PPI?

  3. says

    Hi Stéphane… Good post. I agree that Fireworks is far more better than it was. By adding it to the Suite as a bonus application I think Adobe give it a second breath. I honestly don’t use it much, but their is some aspect of it I want to give it a try soon.

  4. says

    Hi,
    I had a conversation with Arun concerning the blurry aspect of fonts in Fireworks (compare to Illustrator and even Photoshop) and he replied:

    "Fireworks is totally a bitmap based application meaning, what you see on the screen is what you get even if you export it as gif/jpg/png. Whereas Illustrator is vector based application, thus you see that smoothness in everything it renders on canvas. You wont get what you see always there, when exported.
    Fireworks is more closer to Photoshop and even there if you zoom in to 400% as you have mentioned in your sample .png file, you will see the same pixels."

    What do you make of this?

  5. says

    @Thierry

    He’s talking about rendering as I suspected. Fireworks is at its core a vector application with some bitmap tools. It is a hybrid. Yes, its rendering is "pixelyzed" (no pun intended) but you still manipulate and edit vector objects (if you work with the vector tools of course). Photoshop’s vector features are "tacked on" over its purely raster engine. Smart Objects and the ability to create and edit vector paths change nothing. You cannot simply select a shape with the arrow tool for example and change its stroke color, weight or its fill color like in Fireworks (or Illustrator, InDesign, FreeHand, etc). That’s the efficiency of a vector application.

    @Jean-Claude

    Fireworks in a way is like InDesign for the Web but with real bitmap/pixel editing tools too. But its vector nature make it a much more efficient design and layout tool than Photoshop on its own has ever been. If you have any questions when you get to use it, don’t hesitate to ask!

  6. Mikko says

    Good times and much love. FW CS4 is now the new definition of web design workflow. More and more of the Photoshop users are now more aware of alternative method to enchange their workflow and giving a chance to FW.

    There are tons of PS tutorials, but im pretty sure that there will be lot of good FW tutorials. Well least im going to deliver FW tutorials to the world much as i can :)

  7. says

    @mikko:

    Adobe.com and adobe TVhave some excellent tutorials on Fireworks, and I’ve written many FW-based tutorials for Communitymx.com. There’s lots out there. :-)

  8. mcantera says

    Good topic and post. I’m just learning Fireworks and like what I see so far.

    In your opinion, which CS4 product is best-suited to everyday webpage composition — as in, combining the graphic elements together into a single page that will eventually become an HTML/CSS webpage?

    I see a lot of overlap between Ps and Fw, and would just like to know which one is considered best practice for designing a full page (as opposed to an individual element or a prototype).

  9. says

    @mcantera I’ve used PS for at least 15-yrs and a good chunk of that time with designing web sites. Once I started to use FW I never wanted to open PS when designing web sites, applications (desktop, web, iPhone), wire frames. Both PS and FW will give you the same end results. It really boils down to which software you feel more comfortable using. Sure there are features in FW in IMO is much better to use then PS for designing web sites. Having the ability to share layers within pages along with master pages saves me time. I think all of use can list the features that would make one better then the other but I would try both and see which one works best for you.

  10. says

    Yes, there is hope for Fireworks! :-)

    Now, especially after the much-needed 10.0.3 update was released (for CS4), things have improved, and a lot!

    I expect Adobe to promote Fireworks better, and I also expect version CS5, when it comes out, to be one of the best Fw versions, ever!

    Fireworks is an important part of my workflow, too. I cannot imagine my everyday design work without it…

  11. bikeman says

    Fireworks may natively use 72dpi but it is more than capable of print quality output. You can easily set the dpi to 300dpi when creating a new doc, finish the artwork and save as .ai.
    Remembering to convert to CMYK in Illustrator is the last step.
    Voila print ready vector graphics created with the ease of Fireworks.

  12. says

    Hi Marcus,

    If you do try Fireworks, you will find that the workflow is far more efficient for this kind of work than Photoshop as Fireworks is at its core a vector application more like Illustrator.

    On the other hand, there are several factors that should be considered when using a prototyping app. It depends on where you are in the process, what level of interactivity you need and who is the audience for the prototype.

    That is why I often turn to Axure instead of Photoshop for this these days as I can work at a lower visual fidelity (wireframes-like) but higher interactive fidelity and quickly create tabs or form interactions depending on variables and much more.

    The advantage Fireworks has though is reuse. You can start right from your prototype and create the final visual mockup. It’s also easier to make basic, early protos look nicer too but neither factors have been very important.

    But what is certain is that, working in any vector based application for this will enable you to work a lot faster and iterate changes easier than with a pure raster based app like Photoshop. Let it deal with photos… for design work, choose tools that are better suited for the task ;)

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>