Pete Curley

How Adobe ruined Fireworks CS4/CS5

By Pete Curley | 3 years ago | 11 Comments

Adobe Fireworks is my secret weapon as a web-designer. It has the power of Photoshop but sports an interface and tool-set geared towards rapidly creating multiple versions of pixel-perfect mockups. Two of my favorite features: “Pages” where I can quickly create different versions in one file, and “Styles” where I can save our styles (buttons, dropdowns, etc.) and re-use them over and over again. I still do my finished pixels in Photoshop but the layout, margins, and typesetting is all Fireworks.

I’m a stickler for mockups that look EXACTLY how they will look in the browser. We like working off of pixel-perfect mockups when implementing new features. I don’t waste time making complicated specs and they don’t have to question what they’re building. The new versions of Fireworks (CS4/CS5) have made this impossible to do.

Why Fireworks CS3 is awesome

Fireworks has several text alias options. The one I always choose is “System Anti-Alias.” This will render fonts exactly how that font will look in a web browser.

Font rendering in Fireworks CS3

Font rendering in Fireworks CS3

Why Fireworks CS4 and CS5 are not awesome

When Adobe released Adobe CS4 I was shocked to see that when they updated the text engine, they removed the System Anti-Alias option. It is now actually impossible to get your mockups to duplicate browser text. For me, this was a clear deal-breaker.

Font rendering in Fireworks CS4/CS5

Font rendering in Fireworks CS4/CS5

Here are all of the alias options that Fireworks CS4/CS5 have:

All the font options in CS4 and CS5

All the font options in CS4 and CS5

It’s too bad, because Adobe has updated Fireworks CS4 and CS5 to be faster and more stable. The hardest part now is finding places to acquire Fireworks CS3 legally.

HipChat is group chat and IM built for teams. Learn more
  • http://twitter.com/rhuk rhuk

    We use fireworks extensively at rockettheme, Although as you state there are some weird inconsistencies now fireworks has switched to the photoshop text rendering engine, the feature, speed and stability improvements with CS5 vastly out-weigh the text engine differences. When we mock up stuff we just know the text will look different, and account for that in the final design, not a huge deal when you get used to it. I simply could not imagine going back to CS3 or CS4 at this point.

  • http://twitter.com/petecurley Peter Curley

    Thanks rhuk, I’ll give it a spin for real. I know you’re right, CS3 is really showing it’s age for speed and stability. I’ll post a follow up post with how it goes.

  • Marinka Vioen

    Is there already a solution for the Anti-Alias option? I hope so because it’s impossible to get your mockups to duplicate browser text.

  • Jeremy Leff

    Any solution to this? I just tried building a site is PS and quickly realized why I love Fireworks, but it’s useless for logo or textual graphics creation because the anti-aliasing is SO bad.

  • http://www.hipchat.com Pete Curley

    Nope. I upgraded to Fireworks CS5 (it’s a lot faster and more stable). Anytime the fonts really tick me off I make them in fireworks and just copy it over haha. It’s almost Impossible to design a full site in Photoshop.

  • Han

    I think I have a work around for this for Fireworks CS5!!! I noticed that the anti-aliasing craziness happened when fonts had the Bold option enabled via the [B] button. Instead, toggle off the [B] button, then change the drop down menu “Regular” to “Bold” next to the font name and the fonts will adhere to your anti-aliasing option (like No Anti-Alias). I’ve done a successful test with Verdana and Arial, these fonts look exactly like they did in Fireworks CS3/Web browser.

    PS. I only just upgraded today to CS5 and stumbled across this blog =)

  • http://pulse.yahoo.com/_TPESQLI7U6G7TX6KPPFJQ3AFGA Seattle Dev

    Has anyone found a workaround for this?

    This worked perfectly in Macromedia Fireworks but now it seems to be impossible to make pixel perfect mockups.

    Anyone?

  • Dominic Michael

    The workaround would be, choose the Custom Anti_Alias and set correct sampling value. Hope this helps.

  • Kemalemin

    I couldn’t agree more! Any fix from adobe lately??

  • Petenorris

    try custom anti-alias sharpness=60 strength=80. looks pretty good.

  • http://profile.yahoo.com/OKZI4NIUQKD3JFAYHEDCZSA6OQ andre

    Can’t help but agree. I hope there is already an update for this issue.

    FLV to MP4
    Converter