The Present And Future Of Adobe Fireworks

Advertisement

Unless you’ve been on Mars for the last few months, you’ve already heard the news that Adobe is feature-freezing Fireworks1. And Adobe is not offering a replacement tool for Fireworks users (at least, not for now.)

What does this mean for you if you use (and rely on) Fireworks to design user interfaces and screens? What are your options?

In this article, we’ll take a close look at Adobe Fireworks, explaining why it is a unique and powerful design tool, how we can continue to use it effectively, and what our alternatives are for the future.

But first, a bit of background.

I have been using Fireworks since the Macromedia2 days, and I find it indispensable in my daily design workflow. Fireworks is like a small (but powerful) Swiss Army knife, or a superhero3. In short, Fireworks is extremely versatile and powerful for screen design.

In fact, I am so passionate about this tool that when Vitaly Friedman asked me to be the editor of the Fireworks section1304 of Smashing Magazine a couple of years ago, I instantly said “Yes!” Fast-forward to today: We’ve published over 20 high-quality articles about Fireworks and received many positive comments from our readers.

The news earlier this year that Adobe is abandoning Fireworks made me very sad. Looking at the over thousand comments5 on the Adobe Fireworks blog, it seems that I am not alone and that Fireworks will be missed by many.

So, what can you do if you also use Fireworks?

The good news is that we have quite a few options to continue using it, as well as some new apps on the horizon that could take its place. Let’s explore them!


1. Adobe Fireworks: The Current Situation

First, let’s look at the bad news official status of Fireworks. In May 2013, Adobe announced that it was “feature-freezing Fireworks CS66”, meaning that no new features would be added to Fireworks and that Adobe has ceased active development.

Adobe Fireworks
The future of Adobe Fireworks is quite uncertain. (Image: by Ryan Hicks7.)

The good news? Adobe has stated that official patches (i.e. minor updates) will be provided from time to time so that Fireworks CS6 continues to work on the latest versions of Mac OS X and Windows — hopefully, for a few more years. The first update (12.0.18) was released in June, and I hope we’ll see a few more in the next year or two. Fireworks CS6 is still available to all Adobe Creative Cloud (CC) subscribers, and it can be also purchased as a standalone version.

(Note: Unfortunately, it is very unlikely that Adobe will ever open-source Fireworks, even if there was a petition9 with thousands of signatures asking Adobe to allow the community to continue developing and enhancing Fireworks. Fireworks is tightly integrated with software that Adobe continues to develop and sell.)

Now, the better news? While Adobe will not add features to the latest (and last) version of Fireworks, a great community of developers continues to add valuable new functionality to Fireworks through the release of free extensions. For example, SVG export10 was recently added to Fireworks, then SVG import11 and many other new features. (We’ll talk about extensions in detail later.)

So, while Fireworks’ future does not look bright, you can continue to safely use it for your work today and at least for some time. Also, alternative apps could replace Fireworks in the future. Within weeks of Adobe’s announcement about feature-freezing Fireworks, several competing tools were announced. Clearly, Fireworks is an important tool for many designers, and there is a clear place for it (and tools like it) in our workflow and processes. (We’ll talk a bit about these alternatives later in this article, too.)

2. Why Fireworks Is So Awesome (Today)?

Designers, especially ones with little or no experience with Fireworks, often ask, “Why should I use Fireworks for UI design and screen graphics? Why not use Photoshop (as most visual designers do), combined with Illustrator? Or why not some other tool?”

Many features make Fireworks an excellent (and even indispensable) tool for screen design. We’ll quickly list a few below.

Focus on Screen Design

Fireworks is a tool to design for screens; thus, it is focused. It has features that help the UI designer work quickly and accurately, and clutter is kept to a minimum (for example, it has no print or 3-D features). It is also intuitive to use and has wireframing and prototyping capabilities. Fireworks is like a Swiss Army knife for UI design.

Powerful Vector Tools

Fireworks has powerful vector tools, too. In this regard, you could easily compare it to Adobe Illustrator — yet Fireworks’ tools are easier to master. You can go from the simplest of wireframes to the most complex of screen graphics, illustrations, icons, and full-page designs and comps, and then export the entire page or just selections as optimized bitmaps or SVG, without ever needing to switch to another app!

Good Bitmap Editing Tools

Fireworks also has full bitmap editing tools, so you don’t need to jump from Fireworks to another app when you want to modify bitmaps (for example, when you have to make a quick color correction on an imported photo, crop an image, apply a vector mask, etc.).

Create Live Prototypes

Create live (i.e. HTML) without ever leaving Fireworks? Yes, that’s possible. We’ve covered this in the past12. Fireworks is also invaluable for other types of live prototypes; for example, you could quickly create a prototype of a music player13?

Create Live iOS Prototypes

Fireworks can also create iOS prototypes. From wireframes to an iOS prototype to the final polished design — all of these steps can be done without leaving this one design tool!

The topic of iOS live prototyping with Fireworks and TAP14 was covered in great detail in the three-part article by Shlomo Goltz, “iOS Prototyping With Adobe Fireworks and TAP” (part 19615, part 29716, part 39817).

The (Smart) Fireworks PNG File Format

Fireworks saves to a special editable PNG format, which offers many advantages18: small file size (multi-page Fireworks PNG files are usually less than 10 MB in size, while a single PSD file can easily reach a few hundred MB, even for a one-page design!), the ability to embed custom meta data (such as annotations19, notes and comments) within the source file itself, the ability to preview files in Finder and Explorer, the ability to make special libraries of symbols (which can be indexed and searched, as in the example of the Evernote and Fireworks workflow20) and, last but not least, the ability to view a live preview of a single-page Fireworks PNG in any browser or device.

Excellent Exporting, Opening, Importing and Saving Options

Fireworks can export to the following formats, with excellent compression and quality: PNG32 (i.e. PNG24 + alpha transparency), PNG24 (with no transparency), PNG8, PNG8 + index or alpha transparency, JPG and JPG progressive, selective JPG, GIF and GIF animated, SVG21, and ICO22 (for favicons).

In addition to all of these “flat” file formats (and, obviously, the editable file-name.fw-opt.png), Fireworks can open most Photoshop (PSD) and Illustrator (AI) files, Encapsulated PostScript (EPS) files and most SVG23 files.

Fireworks saves to the editable Fw PNG (file-name.fw-opt.png) format by default, but it can also save to PSD (file-name.psd) and AI (file-name.ai) formats.

(Note: Support for PSD and AI files has some limitations, especially as the features of Photoshop and Illustrator continue to change.)

Pages and Master Page, Layers, States (and Objects)

Nearly all websites and mobile apps have more than one page or screen, and many pages and even many states (or variations) of those pages have to be designed. One of the most powerful features of Fireworks is its ability to contain many pages in a single file, as well as contain many states for both pages and individual objects in a design (the article “Using Pages, States and Layers in Fireworks24” discusses this thoroughly).

Pages, layers and states in Fireworks
Pages, layers and states

Those of you familiar with Photoshop might know about layer comps, but the pages feature in Fireworks is much easier to use and understand; multiple artboards in Illustrator serve a similar purpose, but once again, the concept of pages is more intuitive and corresponds more closely to our mental model of the pages in a website or app. Additionally, the Master Page in Fireworks enables us to create a standard structure (for example, header and navigation) for all of the pages on a website in one place and have it appear on all pages automatically. Thus, if you edit the Master Page, the changes will instantly and automatically appear on all pages.

The text, images and graphics that are placed on pages are organized in layers; layers may contain multiple objects and even sublayers. Because Fireworks is an object-based design tool (that is, each object is independent of the others — you simply click on an object on the canvas to select it), we use the layers primarily to organize our source files. We can share layers to multiple pages (so, editing on one page would change that layer on all pages), control the visibility of layers, and even export the objects of selected layers.

Fireworks also enables us to create multiple states (previously called “frames” because they were originally used for animated GIFs and Flash animations) of pages and individual objects. This is important and very useful for UI design, because many screens and screen elements have multiple possible states (for example, buttons could have hover or focus and down states), and sometimes you’ll design a few options for the same object to show variations to your client. States are also important for symbols (both graphic and animation) and rich (or component) symbols, because we can encapsulate many variations in a single symbol and then reuse that symbol in different states throughout the design and across pages, and we can even share symbol libraries with others to use them across files and projects!

Copy And Paste Attributes

Want to apply all properties of a particular object (colors, stroke, fill, live filters, etc.) to another object (or group of objects)? Easy! The super-powerful command Control/Command + C and then Control/Command + Alt + Shift + V will do it for you!

And what if you want to apply only certain properties of one selected object to another? This is possible, too, with the Paste Selected Attributes25 extension!

Excellent Tool for Mobile Design

Because Fireworks is (primarily) a vector design tool (which means easy scalability), it can be used equally well for all kinds of mobile design26: iOS27, Android, Windows Mobile.

Design From A to Z in Fireworks

Fireworks could be the right tool for every stage of a screen design project28. You can start with ideas and sketches on paper, move to wireframes, then to (live) prototypes, then to the final polished design (and design assets), without ever leaving Fireworks. No need to constantly jump between tools depending on the task at hand — this workflow could save you quite some time.

Symbols and Rich Symbols

Fireworks has a two types of symbols: graphic symbols and rich (or component) symbols. The value of symbols is that they can be created once and then used multiple times throughout a design wherever needed. Then, if you edit a symbol, those changes will immediately appear in every occurrence (or instance) of the symbol in the document. The key difference between a graphic symbol and a rich symbol is that the former has the same appearance in all instances (for example, icons are typically created as graphic symbols), whereas rich symbols are much more complex, and each instance can be customized (for example, a button might have the same shape, but its text label can be edited and its color changed to indicate alternate states, such as hover and disabled), yet the core design of the rich symbol would be shared by all instances.

While graphic symbols are common to many design tools, rich symbols are especially powerful because they combine graphics, editable properties and even code, so that we don’t need to draw and redraw similar objects repeatedly. Their efficiency alone is great enough, but rich symbols can also be saved in libraries and shared with others, because they use the same editable Fireworks PNG format as all other Fireworks documents. There are even techniques to create cloud-based symbol libraries29 that can be shared and managed by an entire team!

Here are a few resources to teach you more about using symbols in Fireworks:

Styles

Styles are like CSS for Fireworks files: Define text and graphic styles once, then apply them as needed throughout an entire document. If you edit a style, all instances of that style in the document will be updated. Creating, saving and sharing style libraries with others to ensure design consistency across a team is also easy. Fireworks even enables you to apply a style to an object and change how that instance appears without breaking the link to the original style; then, you can revert to the original, save the modifications as a new style and even use the modifications to redefine and update the original style, with those changes being applied to all instances of the style in the document.

In fact, styles are so much like CSS that an extension exists33 to export styles as CSS!

Styles in Adobe Fireworks

Styles in Fireworks: Creating, redefining, copying and breaking a link to a style are easy to do.

Here are some sources that you might find useful:

Slicing

Slicing is a common way to extract and save specific graphics from a complete design, such as background patterns, button graphics, icons and illustrations. Fireworks makes it easy to slice multiple graphics quickly. Simply select all of the objects that you want to save as graphics, click Edit → Insert → Rectangular Slice (or right-click and choose Insert Rectangular Slice from the context menu), and choose “Multiple Slices” from the dialog that appears.

Slices will then be automatically drawn around each object individually. Each slice can be named (in the Properties panel) and can have its own optimization settings, so exporting PNGs, GIFs and JPGs all from the same document and all at the same time is possible! Slices remember their name, saved file location and optimization settings, so you can edit the design and re-export the new graphics without having to re-slice and re-optimize.

If you need to slice just a portion of a design or object, rather than the whole thing, then the Slice tool in the “Tools” panel makes it easy to draw borders around exactly what you want to export as a graphic.

Note: While you can easily export slices from a Fireworks PNG design, creating an individual slice for each element that you want to export might be a pain. With the “Generate Web Assets8937” command, exporting different parts of your document becomes so much easier. Simply specify how you want an object to be exported (i.e. change its name to include an image-based file extension, like header-opt.png or company-logo-opt.png), and then export. Voilà! PNG, GIF and JPG file formats are supported.

Here are some resources that might help you:

Pixel Perfection

Fireworks always works with whole pixels, and objects fall on a pixel-perfect grid. There’s no need to activate any setting to “snap to pixel” because, by default, everything snaps to the whole pixel. In rare cases when an object or a particular object property falls off the pixel grid, such as when scaling a vector object up or down and the nodes fall between pixels, the intuitive command Modify → Snap to Pixel (or Control/Command + K) fixes any problems. If you modify a vector object with anti-aliasing applied to the stroke and/or fill and you notice blurry edges, then just select the object and snap it back to pixel to make it sharp and clear again.

Properties Panel and Direct Interaction

In Fireworks, you interact directly with the objects on the canvas (without having to dig through hundreds of layers in the Layers panel) using the Select and Subselect tools. When an object is selected, the Properties panel (also called the “Property Inspector”) automatically updates to display information about that object and shows nearly all of the properties that may be edited. This makes it easy to draw, select and modify almost any type of object directly: vector objects, text blocks, bitmap objects, vector masks, hotspots and so on. Auto shapes (which are special types of complex vector objects — more on these below) can be modified, too, using the Properties panel, but you can also modify them directly on the canvas by using their control points.

The Fireworks Properties panel.40
The Properties panel allows you to intuitively edit (and check) the properties of any object or group of objects selected on the canvas. (View large version41)

So, regardless of the type of object on the canvas (text, vectors, symbols, slices, hotspots, groups or bitmaps), as soon as it is selected, the Properties panel will tell you what it is and will enable you to modify it instantly.

As you see in the illustration above, the Properties panel intelligently adapts to the type of object. In the following screenshots, you can see when various objects are selected:

Gradients Made Easy

Creating gradients is easy with Fireworks because they are edited in live mode. You can intuitively control all gradient properties directly from the Properties panel.

Gradients in Fireworks
Gradients in Fireworks are powerful yet easy to use. (Image: “Optimizing the Design Workflow With Fireworks Extensions, Part 346,” Ashish Bogawat)

Also worth noting is that Fireworks offers many more types of gradients than other graphic editors. Here are all of the gradient types supported: linear, radial, rectangle, cone, contour, satin, starburst, folds, ellipse, bars, ripples and waves.

Two free extensions make working with gradients even easier: Gradient Panel and Gradient Direction Editor (both of which we’ve reviewed in detail47).

Blending Modes

Believe it or not, Fireworks has more blending modes than Photoshop, and some of these unique blending modes are pretty useful. Blending modes can be applied to any type of object, not just bitmaps, and can be used to adjust an appearance as well as to create special effects.

Fireworks blending modes
Fireworks’ blending modes

9-Slice Scaling Tool

Sometimes when scaling an object up or down, we want to maintain the appearance of some parts of the object so that it does not appear stretched or distorted. If we just made it large or smaller, everything would change in scale proportionally; if we made it just wider or just taller, then it would appear distorted. 9-Slice Scaling enables us to identify which parts of the object should scale (and in which direction) and which parts should maintain their shape and proportion.

For example, buttons often have rounded corners, and these should not be distorted, no matter how wide or narrow a button becomes.

9-slice scaling in Fireworks (example with button).
Maintaining the appearance and proportions of certain parts of an object (in this case, the radius of a button’s corners) is easy with the 9-Slice Scaling tool.

Modal dialog boxes also often have rounded corners as well as a title bar with icons and a text label, but the amount of content in the dialog will vary, so the dialog box will sometimes need to be large and sometimes small, but the corners, title bar and icons should always have the same proportions and scale.

9-slice scaling in Fireworks (example with modal dialog).
Maintaining the appearance and proportions of certain parts of an object (in this case, the title bar with icons and the rounded corners of a modal dialog box) is easy with the 9-Slice Scaling tool.

A Versatile Alignment Panel

With the help of the Align panel, you can align and distribute objects relative to the canvas or to each other. You can space them evenly or specify a precise value (in pixels). The options here are almost limitless.

Find and Replace in Fireworks48
The Align panel in Fireworks offers many options.

Live Filters

Fireworks’ live filters can be easily applied to any type of object, and they are non-destructive, which means that you can add and modify filters without altering the original object or image. The stacking order of applied live filters can be changed with simple dragging and dropping; the visibility of an applied live filter may be turned on and off; and multiple filters of the same type may be applied to a single object on the canvas. Live filters can be used for color adjustment, shadows and glows, and blur effects, and even to add and edit Photoshop live effects if you have opened a PSD file.

Fireworks live filters (example)
This simple example shows two “Inner Shadow” live filters applied to the same object.

Linked Images

Other products in Adobe’s Creative Suite support the “smart objects” feature, which lets you import objects from one app to another. When the source object changes, the imported one will update as well. Thanks to the Linked Images49 panel, achieving almost the same functionality in Fireworks is now possible!

Scale Stroke and Effects

Because Fireworks was built from the ground up as a screen design tool, it has many little things that help the UI designer. One of these is the option to toggle on and off the “Scale Stroke and Effects” option, which is very useful when you’re working on a design that has to be rescaled later (for example, if you’re working on both a Retina and non-Retina design for iOS).

Scale stroke and effects50
“Scale Stroke and Effects” is easy to enable and disable.

Auto Shapes Super-Power!

Fireworks’ vector auto shapes are a unique feature and superb! You can easily create (and then later edit) rounded rectangles, stars, polygons, arrows, cog wheels and many other types of objects with only a couple of clicks of the mouse or by using the Auto Shape Properties panel. New auto shape objects can be placed on the canvas from the “Vector Tools” section of the Tools panel and from the Auto Shapes panel. You can change all of the properties of these special objects easily and with numeric precision. Auto shapes may be edited both as special auto shape objects and as vector objects.

Creating custom auto shapes is also possible, and many such objects exists as free extensions — the Multi-Border Rectangle51 auto shape, the Lorem Ipsum52 auto shape and the Filter Light Source and Sunburst53 auto shapes, to name just a few.

CSS Properties

In Fireworks CS6, you can easily extract any CSS properties of a selected object with the help of the CSS Properties panel54. Combined with Matt Stow55’s excellent free extension, Fireworks CSS Professionalzr56, the feature can save you development time and help you read, copy and reuse CSS properties more quickly.

Find and Replace

Find and replace — most applications have this feature, so nothing special, right? Wrong! Find and replace is much more powerful in Fireworks.

Fireworks can search (and search and replace) in Fireworks PNG documents for the following objects and object properties:

  • text strings,
  • fonts,
  • colors,
  • URLs.

You can restrict a search to a particular page, a state, a manual selection of objects or layers, a particular Fireworks PNG document or even a set of closed Fireworks PNG documents located in a particular folder!

Find and Replace is also very flexible. For example, when searching for a particular color, you can target the following: fills and strokes, only fills, only strokes, live filters, or all properties! Similarly, Find and Replace can be adapted to search for text strings, fonts used, etc.

Find and Replace in Fireworks57
The Find and Replace panel is powerful and customizable.

Batch Processing

Have you ever had to repeat the same actions over and over again, such as editing, resizing, optimizing and renaming hundreds of photos? Batch processing to the rescue!

Fireworks makes it easy to select multiple files and repeat the same actions on each one. Batch processing allows you to change export and optimization settings, change sizes, perform find-and-replace actions, rename files when saved, and even apply any commands (including custom ones!) that appear in the “Commands” menu (for example, “Convert to Sepia,” applying a “Gaussian Blur,” etc.). Batch actions may be saved and reused, too; simply go to File → Batch Processing, select the files and create your own batch script.

And If All of the Above Are Not Enough, Extensions to the Rescue!

With the help of free extensions made by developers, Fireworks becomes a much more functional, robust and productive tool. (We’ll go over some of the best extensions later in this article.)

Let’s Sum It Up: 1 + 1 = 3 !

So many other powerful features are in Fireworks that we couldn’t mention and describe them all in one article.

The most important thing to know is that, while many of Fireworks’ features are not unique (other graphic design apps have similar features), the combination of features that Fireworks offers in one package is unique. You can work with vectors and raster (i.e. bitmap) images in Fireworks simultaneously; simply select an object, and Fireworks’ UI will automatically adapt to give you the tools, properties and options for that type of object. You can go from paper sketches to rough wireframes to a real live prototype (HTML or mobile) to a final polished multi-page design, with optimized exported assets in perfect quality, without ever leaving the app!

You can do nearly everything in Fireworks. Even better, you can work in Fireworks and import assets from other programs, such as Photoshop and Illustrator.

Fireworks is like a Swiss Army knife for screen and UI design. It has all of the tools one might need in a single lightweight package, offering quite a lot of power and versatility. Don’t forget about speed, too — working with Fireworks is all about efficiency and speed. You could, of course, use this Swiss Army knife in conjunction with other apps, but you’ll be relying on this app most of the time, because it has everything in one place, easily accessible, easily learnable and highly intuitive.

This is why thousands of people use Fireworks today: screen and UI designers, illustrators, Web designers, iOS and Android app designers, front-end developers and more.

Is Fireworks the Perfect Tool for UI Design?

No, Fireworks is not perfect. I have used this app for thousands of hours, and I must admit that.

But what tool for UI design is perfect? Is Photoshop the perfect tool for UI design? Is Illustrator? Or Sketch? Or InDesign? Or Pixelmator?

Is there even such a thing as a perfect UI design tool? I don’t think so.

Photoshop is the elephant in the room most obvious example. It was created for photo editing and print design tasks. A few UI design features were later added to it, yet Photoshop still lacks many features that would make it really useful (and easy to use) for screen design. Still, thousands (if not millions) of users worldwide have been working with this imperfect tool for more than a decade and use it successfully for UI design tasks.

Fireworks, on the other hand, was built from the ground up for UI and screen design, and every single feature in it is intended specifically to help the UI designer. Even though Fireworks isn’t the perfect tool, in my opinion it best meets the needs of UI designers. As I said earlier in this article, 1 + 1 = 3. Like a Swiss Army knife, none of the features in Fireworks is perfect, but when you combine them all, you realize that you’re able to design UIs more quickly than any other combination of features would allow and that you are very efficient in the process.

And yes, Fireworks has a few weaknesses. Its color picker feels a bit old. It cannot use more than 2 GB of RAM (because it’s a 32-bit app). If you work with too many pages or symbols in one document, Fireworks can feel a bit slow. Bugs do appear randomly (and then disappear). And so on. But bugs appear in other programs, too, which doesn’t stop us from using them, right? UI designers need the right tool for the job, not the perfect one, and Fireworks manages to be the right tool most of the time.

Finally, there are probably a few features that Fireworks does not have but that would make it even more useful to designers and developers. While Adobe will not likely add any more features, the great community of developers will continue adding extensions to the app, keeping it up to date for quite some time.

3. A Few Fireworks Designs

Let’s look at some excellent illustration and interface design work, done entirely in Fireworks.

58
Kawasaki Vulcan 1700 (vector illustration), by Isabel Aracama59

60
Ferrari 288 GTO (vector illustration), by James Parker61

62
Nikon (iOS icon), by Gianluca Divisi6563

64
TouchCDJPro (iOS UI), by Gianluca Divisi6563


Social bar (UI design), by Lorenzo Franchini66


Expenses app (UI design), by Lorenzo Franchini67


Restaurant navigation (UI design), by Tomas Gajar68


Sample navigation (UI design), by Tomas Gajar69

More Examples? Sure!

At the end of 2010, I wrote a pretty detailed piece for Smashing Magazine, “The Power of Adobe Fireworks: What Can You Achieve With It?70.” In it, I showed many examples of Fireworks being used successfully for UI design, Web design, amazing vector illustrations, logos, elegant icons, digital paintings and comic strips, and even for planning and creating Adobe’s entire CS5 branding. While the article is three years old now, the examples in it are still relevant, and you can take a quick look71 if interested.

Adobe CS5 branding (made with Fireworks)72
Adobe’s CS5 branding can be made right in Fireworks. (View large version73)

4. The Power of Fireworks Extensions

One aspect of Fireworks makes it even more powerful and deserves special mention: extensions. Extensions are written in JavaScript, run directly in Fireworks, and add new features to make the app better and more productive. Extensions can be written to do almost anything, making it possible to configure Fireworks to be exactly the tool you need!

We have published an excellent series of articles, by Ashish Bogawat, that cover in depth some of the best extensions for Fireworks: part 174, part 275, part 376.

Personally, I recommend the following free extensions:

Also worth mentioning is Project Phoenix91, where many indispensable Fireworks extensions are frequently improved and updated!

Using Fireworks Extensions Yourself?

If you’re using Fireworks with extensions, which are your favorites? Which extensions work the best for you and help you the most? Share them with us in the comments!

5. Recommended Articles and Tutorials

Before reviewing the apps that might replace Fireworks in the future, we’ll recommend some articles and tutorials. These articles could prove very useful to you, and they showcase some powerful workflows in the app.

UI and Icon Design

Interactive (HTML and Mobile) Prototypes

Designer Workflows and Techniques

Reasons to Use Fireworks for UI Design

(Note: There are plenty of reasons to use Fireworks for Web, UI and screen design. While it competes partly with Photoshop, Illustrator, Sketch and other tools, Fireworks is a great tool and still relevant, and it offers a modern, powerful workflow for all kinds of screen design, even today.)

6. Replacing Fireworks: Exploring Our Options For The Future

Many designers will continue to use Fireworks CS6 with their favorite extensions as long as it is stable and continues to run on Windows and Mac OS X. But looking at the alternatives110 is important because sooner or later we’ll have to move on. Which apps might replace Fireworks today or tomorrow? Let’s take a quick look.

Today

Many people say that Sketch131111 is great, but it still has a few limitations and lacks many of the features of Fireworks. And unfortunately, it runs only on a Mac. But if you’re on a Mac, I strongly recommend trying it! These three fairly recent articles shed more light on Sketch and its features:

Made with Sketch (by Isabel Arakama)115
Sketch is quite powerful for UI design. This vector illustration was made entirely with Sketch by the talented designer Isabel Aracama116. (View large version117)

Antetype118 is an interesting alternative, as is Pixelmator119. Unfortunately, both are Mac-only, too.

Meanwhile, Xara Designer Pro120 is a UI design tool that runs only on Windows. PC Pro has a quick review121 of it.

Tomorrow

Alan Musselman122 (former Macromedia/Adobe Fireworks project manager and developer) is working on a new project, codenamed Project EvolveUI123. EvolveUI should address many of our modern screen design needs (such as combined vector and bitmap tools, styles, symbols, the ability to build interactive prototypes, etc.), so this sounds like a promising alternative. Bonus points: The app will be open-source and available on all platforms (Windows, Mac and Linux). The first version is expected at the end of 2014, but if you’re interested, you can sign up to the project’s Google Group124 and join alpha and beta testing and the discussions.

A new screen (layout) design tool by Tom Giannattasio125 and Adam Christ126 is in the works: Project Macaw127. A Kickstarter project128 supports it, and the first version for Mac and Windows should be available in early 2014. This app looks promising, too, but unfortunately, it might not replace Fireworks because it will lack vector and bitmap editing tools, and it will be more like InDesign for the Web than a full-featured screen design app.

As far as I know, Adobe is not working on a replacement. Many of Fireworks’ best features have already been added to its other apps (namely, Photoshop, Illustrator and Edge Reflow), so Adobe recognizes the power of Fireworks’ tools and workflow. However, moving features into other apps is not really a replacement — it just means that designers will be spending more time working across multiple apps.

Last-minute update: It seems that Adobe is working129 on a new design tool that could replace Fireworks in the future. I’ll try to update this article once I know more.

A Note to Our Readers

If you currently rely on Fireworks for UI design but have recently discovered an app that suits you better and that might replace Fireworks for you, please let us know in the comments. We’re always looking for alternatives!

7. Conclusion

What are our plans, you may ask? For now, we will keep the Fireworks section1304 open. Many designers out there continue to rely on Fireworks and use it. And, with the promise from Adobe to keep Fireworks available for some time longer, it seems that anyone using Fireworks today is still safe.

Of course, we, too, are exploring alternatives! New tools are emerging every day, and sooner or later a better tool will be created by some talented people who really understand how we design for the screen. (One of those tools might be Sketch131111, to which we’ll dedicate an article in the near future. Another is Project EvolveUI132, which is very promising but still in alpha.)

Finally, thank you to the amazing Fireworks community, a community driven by passion and one that makes Fireworks so much better through the contribution of free extensions, useful articles and tutorials — and love!

Also, thank you to Smashing Magazine’s authors — and readers, of course! You guys rock! Your constant support convinces us that we’re doing the right thing with the Fireworks section. We’ve done our best to provide the community with the highest-quality, most in-depth articles about Fireworks and all of the excellent workflows that it offers, and I feel very proud of our work.

Special thanks to Dave Hogue133 (currently UX Design Manager at Google), who helped me with this article and who has been involved in the Fireworks community around the world for many years. Dave has shared his experience with and knowledge of design, workflow and Fireworks in numerous articles, tutorials and videos (and on Twitter134, of course), and he helped me to make certain that this article doesn’t overlook any of the great features that make Fireworks so amazing and useful.

(mb, al, ea)

Footnotes

  1. 1 http://blogs.adobe.com/fireworks/2013/05/the-future-of-adobe-fireworks.html
  2. 2 https://en.wikipedia.org/wiki/Macromedia
  3. 3 http://www.reinegger.net/adobe_fireworks_a_super_hero_that_is_hard_to_kill.html
  4. 4 http://www.smashingmagazine.com/
  5. 5 http://blogs.adobe.com/fireworks/2013/05/the-future-of-adobe-fireworks.html#comments
  6. 6 http://blogs.adobe.com/fireworks/2013/05/the-future-of-adobe-fireworks.html
  7. 7 http://www.adobe.com/devnet/fireworks/samples/xd_brownbag.html
  8. 8 http://blogs.adobe.com/fireworks/2013/06/fireworks-cs6-update-12-0-1-is-live.html
  9. 9 https://www.change.org/en-GB/petitions/adobe-com-release-adobe-fireworks-to-open-source
  10. 10 http://fireworks.abeall.com/extensions/commands/Export/
  11. 11 http://johndunning.com/fireworks/about/SVG
  12. 12 http://www.smashingmagazine.com/2012/06/25/create-interactive-prototypes-with-adobe-fireworks/
  13. 13 http://www.smashingmagazine.com/2012/07/03/interactive-prototypes-timesavers-adobe-fireworks/
  14. 14 http://unitid.nl/2011/03/touch-application-prototypes-tap-for-iphone-and-ipad-using-adobe-fireworks/
  15. 15 http://www.smashingmagazine.com/2013/01/11/ios-prototyping-adobe-fireworks-tap-part1/
  16. 16 http://www.smashingmagazine.com/2013/01/25/ios-prototyping-adobe-fireworks-tap-part2/
  17. 17 http://www.smashingmagazine.com/2013/02/15/ios-prototyping-adobe-fireworks-tap-part3/
  18. 18 http://www.smashingmagazine.com/2012/10/12/adobe-fireworks-enterprise/
  19. 19 http://www.3revolutions.com/public/fw_annotations.php
  20. 20 http://www.smashingmagazine.com/2012/09/13/create-pattern-library-with-evernote-fireworks/
  21. 21 http://fireworks.abeall.com/extensions/commands/Export/
  22. 22 http://johndunning.com/fireworks/about/ExportAsFavicon
  23. 23 http://johndunning.com/fireworks/about/SVG
  24. 24 http://www.adobe.com/devnet/fireworks/articles/pages_states_layers.html
  25. 25 http://www.smashingmagazine.com/2013/09/20/fireworks-extensions-for-better-workflow-part-2/#modifycommands
  26. 26 http://www.smashingmagazine.com/2012/05/07/refining-designs-adobe-fireworks/
  27. 27 http://www.smashingmagazine.com/2012/12/03/design-ios-apps-with-adobe-fireworks/
  28. 28 http://www.smashingmagazine.com/2012/06/11/developing-a-design-workflow-in-adobe-fireworks/
  29. 29 http://www.smashingmagazine.com/2012/09/13/create-pattern-library-with-evernote-fireworks/
  30. 30 http://tv.adobe.com/watch/learn-fireworks-cs4/understanding-styles-and-symbols/
  31. 31 http://help.adobe.com/en_US/fireworks/cs/using/WS4c25cfbb1410b0021e63e3d1152b00db4b-7fd4.html
  32. 32 http://www.youtube.com/watch?v=1k7ay0Szovg
  33. 33 http://fireworks.abeall.com/extensions/commands/Export/
  34. 34 http://tv.adobe.com/watch/learn-fireworks-cs4/understanding-styles-and-symbols/
  35. 35 http://layersmagazine.com/fireworks-cs4-styles-management.html
  36. 36 http://mtnstonemedia.wordpress.com/2012/12/01/tutorial-adobe-fireworks-cs5-installing-and-utilizing-styles/
  37. 37 http://johndunning.com/fireworks/about/GenerateWebAssets
  38. 38 http://webdesign.tutsplus.com/videos/fireworks-videos/getting-started-with-fireworks-intro-to-using-the-slicing-tool/
  39. 39 http://www.mlwebco.com/2010/08/15/how-to-slice-images-like-a-pro-in-adobe-fireworks/
  40. 40 http://www.smashingmagazine.com/wp-content/uploads/2013/12/pi-panel-all-screens-large-opt.png
  41. 41 http://www.smashingmagazine.com/wp-content/uploads/2013/12/pi-panel-all-screens-large-opt.png
  42. 42 http://www.smashingmagazine.com/wp-content/uploads/2013/12/pi-panel-mask.png
  43. 43 http://www.smashingmagazine.com/wp-content/uploads/2013/12/pi-panel-rectangle.png
  44. 44 http://www.smashingmagazine.com/wp-content/uploads/2013/12/pi-panel-text.png
  45. 45 http://www.smashingmagazine.com/wp-content/uploads/2013/12/pi-panel-group.png
  46. 46 http://www.smashingmagazine.com/2013/11/06/even-more-fireworks-extensions-optimized-design-workflow/#gradientpanel
  47. 47 http://www.smashingmagazine.com/2013/11/06/even-more-fireworks-extensions-optimized-design-workflow/#gradientpanel
  48. 48 http://www.smashingmagazine.com/wp-content/uploads/2013/12/align-panel-opt.png
  49. 49 http://johndunning.com/fireworks/about/LinkedImages
  50. 50 http://www.smashingmagazine.com/wp-content/uploads/2013/12/fw-scale-stroke-effects.large_-opt.png
  51. 51 http://johndunning.com/fireworks/about/MultiBorderRect
  52. 52 http://johndunning.com/fireworks/about/LoremIpsum
  53. 53 http://fireworks.abeall.com/extensions/autoshapes/
  54. 54 http://www.adobe.com/devnet/fireworks/articles/css3-extracting.html
  55. 55 https://twitter.com/stowball
  56. 56 http://mattstow.com/css-professionalzr.html
  57. 57 http://www.smashingmagazine.com/wp-content/uploads/2013/12/search-and-replace.large_-opt.png
  58. 58 http://www.smashingmagazine.com/wp-content/uploads/2013/12/2011-Kawasaki-Vulcan-opt.jpg
  59. 59 http://dribbble.com/Isabel_Aracama
  60. 60 http://www.smashingmagazine.com/wp-content/uploads/2013/12/ferrari-in-adobe-fireworks-large-opt.png
  61. 61 http://dribbble.com/shots/861242-Ferrari-288-GTO-In-Vectors
  62. 62 http://www.smashingmagazine.com/wp-content/uploads/2013/12/nikon-ios-icon-opt.png
  63. 63 http://dribbble.com/graphic4fun
  64. 64 http://www.smashingmagazine.com/wp-content/uploads/2013/12/TouchCDJPro-opt.png
  65. 65 http://dribbble.com/graphic4fun
  66. 66 http://dribbble.com/shots/206827-Social-Bar
  67. 67 http://dribbble.com/shots/1167928-Expenses
  68. 68 http://dribbble.com/shots/1213384-Restaurant-Navigation
  69. 69 http://dribbble.com/shots/1089360-Navigation
  70. 70 http://www.smashingmagazine.com/2010/09/17/the-power-of-adobe-fireworks-what-can-you-achieve-with-it/
  71. 71 http://www.smashingmagazine.com/2010/09/17/the-power-of-adobe-fireworks-what-can-you-achieve-with-it/
  72. 72 http://www.smashingmagazine.com/wp-content/uploads/2013/12/adobe-cs5-branding-large.png
  73. 73 http://www.smashingmagazine.com/wp-content/uploads/2013/12/adobe-cs5-branding-large-opt.png
  74. 74 http://www.smashingmagazine.com/2012/08/28/fireworks-extensions-for-better-workflow/
  75. 75 http://www.smashingmagazine.com/2013/09/20/fireworks-extensions-for-better-workflow-part-2/
  76. 76 http://www.smashingmagazine.com/2013/11/06/even-more-fireworks-extensions-optimized-design-workflow/
  77. 77 http://johndunning.com/fireworks/about/Tables
  78. 78 http://johndunning.com/fireworks/about/SVG
  79. 79 http://fireworks.abeall.com/extensions/commands/Export/
  80. 80 http://johndunning.com/fireworks/about/MultiBorderRect
  81. 81 http://johndunning.com/fireworks/about/LinkedImages
  82. 82 http://johndunning.com/fireworks/about/SmartResize
  83. 83 http://johndunning.com/fireworks/about/SmartPunch
  84. 84 http://mattstow.com/export-responsive-prototype.html
  85. 85 http://fireworks.abeall.com/extensions/panels/Path
  86. 86 http://fireworks.abeall.com/extensions/commands/Modify/
  87. 87 http://fireworks.abeall.com/extensions/commands/3D-Rotate/
  88. 88 http://fireworks.abeall.com/extensions/commands/Paths/
  89. 89 http://johndunning.com/fireworks/about/GenerateWebAssets
  90. 90 http://johndunning.com/fireworks/about/KeyboardResize
  91. 91 http://phoenix-project.tumblr.com/
  92. 92 http://www.smashingmagazine.com/2012/05/07/refining-designs-adobe-fireworks/
  93. 93 http://www.smashingmagazine.com/2012/12/03/design-ios-apps-with-adobe-fireworks/
  94. 94 http://www.smashingmagazine.com/2012/06/25/create-interactive-prototypes-with-adobe-fireworks/
  95. 95 http://www.smashingmagazine.com/2012/07/03/interactive-prototypes-timesavers-adobe-fireworks/
  96. 96 http://www.smashingmagazine.com/2013/01/11/ios-prototyping-adobe-fireworks-tap-part1/
  97. 97 http://www.smashingmagazine.com/2013/01/25/ios-prototyping-adobe-fireworks-tap-part2/
  98. 98 http://www.smashingmagazine.com/2013/02/15/ios-prototyping-adobe-fireworks-tap-part3/
  99. 99 http://www.smashingmagazine.com/2012/06/11/developing-a-design-workflow-in-adobe-fireworks/
  100. 100 http://www.adobe.com/devnet/fireworks/articles/css3-extracting.html
  101. 101 http://www.smashingmagazine.com/2012/07/03/interactive-prototypes-timesavers-adobe-fireworks/
  102. 102 http://www.smashingmagazine.com/2012/09/13/create-pattern-library-with-evernote-fireworks/
  103. 103 http://www.smashingmagazine.com/2012/10/12/adobe-fireworks-enterprise/
  104. 104 http://www.smashingmagazine.com/2013/08/26/mojo-motors-responsive-redesign-with-adobe-fireworks-part-1/
  105. 105 http://barn.headscape.co.uk/articles/the-no-1-reason-i-love-fireworks/
  106. 106 http://www.webdesignerdepot.com/2010/08/7-reasons-why-i-choose-fireworks-over-photoshop/
  107. 107 http://pixelyzed.com/pixelforge/whychoosefireworks/
  108. 108 http://www.further.co.uk/blog/the-features-that-make-fireworks-the-application-of-choice-for-web-designers
  109. 109 http://boagworld.com/design/fireworks-vs-photoshop
  110. 110 http://blog.tawhidkhan.com/replace-adobe-fireworks-uiux-design-tools-comparison/
  111. 111 http://www.bohemiancoding.com/sketch/
  112. 112 http://medium.com/design-ux/c59ff242715d
  113. 113 http://medium.com/design-ux/25545f6cb161
  114. 114 http://www.creativebloq.com/khoi-vinh-using-sketch-instead-photoshop-6133901
  115. 115 http://www.smashingmagazine.com/wp-content/uploads/2013/12/made-with-sketch-opt.jpg
  116. 116 http://dribbble.com/shots/1218993
  117. 117 http://www.smashingmagazine.com/wp-content/uploads/2013/12/made-with-sketch-opt.jpg
  118. 118 http://www.antetype.com/blog/2013/04/guest-post-photoshop-is-not-a-page-layout-tool/
  119. 119 http://www.theverge.com/2013/5/8/4312054/pixelmator-2-2-new-shape-tools-ui-hands-on
  120. 120 http://www.xara.com/us/designer-pro/
  121. 121 http://www.pcpro.co.uk/reviews/software/383914/xara-designer-pro-x9
  122. 122 http://twitter.com/AlanMusselman
  123. 123 http://www.evolveui.com/
  124. 124 https://groups.google.com/forum/#!forum/underdog-discussions
  125. 125 http://twitter.com/attasi
  126. 126 http://twitter.com/gesusc
  127. 127 http://macaw.co/
  128. 128 http://www.kickstarter.com/projects/macaw/macaw-the-code-savvy-web-design-tool
  129. 129 http://www.smashingmagazine.com/wp-content/uploads/2013/12/dm.png
  130. 130 http://www.smashingmagazine.com/
  131. 131 http://www.bohemiancoding.com/sketch/
  132. 132 https://groups.google.com/forum/#!forum/underdog-discussions
  133. 133 http://www.davehogue.com/
  134. 134 http://twitter.com/davehogue

↑ Back to topShare on Twitter

Michel is a freelance web designer, illustrator and photographer. He also happens to work as editor at Smashing Magazine and is very passionate about Fireworks, HTML/CSS, Web Standards and the smell of good coffee. When not designing websites or editing articles, he can often be found reading about design, riding his bicycle or simply looking at the clouds in the sky. Want to know more? You can check his personal blog or Twitter. :)

Advertising
  1. 1

    I stopped using fireworks. I use Sketch now. FW has been, pretty much, feature frozen for a few years now. Thanks Adobe *finger* but you dropped the ball on pretty much all the Macromedia products, and have yet to integrate some of their amazing features into your existing product line. Looking at you Illustrator.

    2
    • 2

      I was once an avid Fireworks user. When I switched to Linux, I used Inkscape: a cross-platform, open source alternative. Not as polished as Fireworks but very nicely designed. Plus, it’s SVG, which we all know is the open vector format of the future ;-) http://inkscape.org

      0
      • 3

        *Shudder* Inscape/GIMP/Blender…

        Illustrator, Photoshop, Modo 3D… The only way to fly.

        Having given Inkscape, GIMP, and Blender a fair chance. I can honestly say I have no qualms with dropping all three of those like bricks.

        I’m not a huge fan of Indi/Free software, but Modo is by far one of the best alternatives to the mainstream products with a strangle hold on the industry. Specifically the 3D/post-prod industry, where entire companies have folded in the face of inflated licensing costs. *cough cough* AutoDesk *cough cough*

        Whatever works for you though. I’ve been with Adobe products since 1998. I would love to jump ship when the alternatives catch up.

        Sketch is on it’s way though. it’s still missing many features.

        0
        • 4

          I tied so hard to give GIMP a chance, but it just sucks so bad . .

          I really want a decent graphics editor but they just all suck so bad. I guess it’s harder to make than it seems.

          0
      • 5

        I too have switched to linux for more 4 years now. I remember being concerned about what apps to use. I loved fireworks. But it’s sad to see such an amazing app being cancelled. I made the decision years ago to learn opensource design apps on linux like: inkscape, gimp, scribus, bluefish, aptana studio, etc. in fact, all my designs are made with these tools. I do all my web mockups in inkscape. Any designer using adobe apps can make the switch, I have. You’ll be surprised how easy it is to switch. You’ll save a lot and make more money as a result. Anyone agree with me?

        0
        • 6

          Well, somewhat. I’m still using Photoshop, but mostly for more complex tasks, because GIMP still can’t hold its own. It’s not its functionality – it does HAVE. IT. ALL – but the clumsy UI still makes a lot of stuff quite hard, and is just so easy to achieve in PS.

          Inkscape has been a great helpting hand in creating UI drafts and sketches thou. As a former Macromedia :P Freehand user, I was delighted to find out that its handling is quite comparable, and that it got all and everything hotkey-ed.

          Also, the commandline incredibely helped for all those nifty, nasty lil batch jobs you always stumble upon. ImageMagick is just so much better than any of the old “actions” PS crap and any kind of batch conversion tool / option built into a graphics viewer (eg. XnView or IrfanView, to name just a few), too.

          Simply said: Yeah, most stuff is much easier done with “replacements”, thou I havent had found one for Photoshop yet. For snobby stick-up-the-pooper elitists, changing their ways they happened to work for the last 15 years might be a bit too much thou. I don’t mind if they die out thanks to this, too :P

          IMHO, anyone complaining about eg. the command line when using Mac OS X should leave that platform and go back to hiding under the rock you’ve been sitting since the Apple II. Unixoid OSes are fun – and they are not ment to be left aside just for some proprietary GUI gadgets like Photoshop, etc. If more professionals would simply quit complaining about the horrible UI/UX of GIMP and INSTEAD haul their asses towards changing this, then this excuse of an interface would certainly change into something better.
          No proper programming is possible without proper concepts, esp. if its a graphical user interface.

          cu, w0lf.

          0
    • 7

      Many people started using Sketch (instead of Fireworks) and love it. Once Sketch expands its list of features in the future (symbols and rich symbols?), it might become a good replacement for Fw.

      It’s a pity that Adobe never truly explored the potential of Fireworks (after they acquired all the Macromedia products), but, on the other hand, I don’t think any other current Adobe app could really profit from simply “borrowing” Fireworks features. Illustrator (which you mentioned) is a tool that is very complex, often hard to use, and very un-intuitive. It’s also mainly a vector graphics tool (raster images in screen design, I look at you!;-), has too many print options, and so it really lacks the focus on UI design which is one of the strongest Fireworks features…

      Future will tell! For now, I will continue to use Fireworks, but I am also trying to explore new, better UI design tools.

      0
      • 8

        I was fed up with Photoshop, Illustrator and Dreamweaver to develop websites.
        I started to tinker with Fireworks last year but with the Adobe news I gave up on it…for now.
        Adobe should have provided better visibility of this great tool and stop pushing Dw as the only web tool. I personally miss HomeSite.

        0
      • 9

        It saddens me to no end that they are killing off Fireworks. I’m a web Designer, fireworks is THE ULTIMATE tool for web design graphics. I keep trying every now and then ever since Adobe bought Macromedia but have never found anything that’s close.

        Photoshop just sucks for web design and they’ve proven with ever version that they just don’t get it web design or even usability.

        Dear God, WHY hasn’t someone else made a photoshop killer like Fireworks. Why did they ever let Adobe buy Macromedia. Is this about the patents from Macromedia or something?

        Thanks for writing such a list of all the amazing things fireworks can do that Photoshop can’t or that Fireworks just does better. I HATE Adobe and I want to boycott them so bad but Dreamweaver and Fireworks are the bomb. They save me so much time. It looks like they are going to force me in a corner soon.

        1
        • 10

          “Why did they ever let Adobe buy Macromedia. Is this about the patents from Macromedia or something?”

          You can thank Stephen Elop for that. He’s built a career out of becoming some poor sucker company’s CEO and then setting it up to be bought by a larger competitor so he can get a nice financial windfall. He cares nothing about any company’s loyal customers, just big fat stock payouts for himself.

          I really hate what Adobe did with Freehand. They killed it because they couldn’t make Illustrator better, and they didn’t even bother putting Freehand’s best concepts into Illustrator.

          Adobe is a bunch of crooks. They abuse their monopoly power and hurt the consumer. If the DOJ was willing to clamp down on Microsoft, it should take a long, hard look at Adobe.

          0
      • 11

        Brandon Richards

        January 7, 2014 2:56 pm

        I’ve used FW since Macromedia 1.2 and I must say that I’ve seen enough Adobe bs to know that they don’t really care about their ‘bought’ macromedia users. The Fireworks dev’s themselves are very passionate but unfortunately some executive somewhere in the Adobe cloud frowns every time that a Macromedia product is brought before ‘him’. As soon as a tool can bust open the industry and Adobe file compatability problems and offer strong set of tools like Fireworks… I will send Adobe a photo of me and my middle finger.

        3
    • 12

      I agree. I am still waiting for an equivalent to FreeHand. Sketch and iDraw are on the way, but still far from it. I really miss FreeHand Graphics Find and Replace feature. There really is nothing like it in any software I’ve ever used. I could literally change all the colors, graphics and text in an entire 100 page FreeHand file in a few seconds.
      I am hoping for a web design tool that actually lets me specify font information as it is in CSS, as well as borders and other information.

      0
      • 13

        Wow, I loved Free Hand! It’s awesome that someone else remembers it!

        0
        • 14

          I miss Freehand too and cry every time I have to use Illustrator instead. I really miss the multi-paging feature as well as find/replace. The tools and interface were just more intuitive.

          I also use Fireworks for my UI work and just can’t get over what a loss it will be to have to move on.

          Illustrator and Photoshop are very good apps but are far too bloated to be nimble.

          0
    • 15

      Sketch is OK but their dev team is a little difficult to deal with. Killing their user forums because they didn’t like us talking about the bugs in their software was a bad move in my opinion.

      0
      • 16

        For me i am a PC person so I would love to give Sketch a run but I do not know of a windows version.

        0
  2. 17

    Great article!
    Definitely highlights why Fireworks is such a fantastically useful tool.
    It also demonstrates the sheer stupidity of killing it. That decision is really beyond my comprehension.
    Fireworks belongs to the rare breed of application programs that fits its intended use so extremely well…

    1
    • 18

      Fully agree with you, Etan! People are still asking Adobe the question: “Why you stopped the development of Fireworks? And why you neglected it for so many years?” but I doubt that we’ll ever get a (meaningful) answer… :(

      I don’t look into the Adobe direction anymore, because my hopes are elsewhere — I hope that someone, somewhere, who really understands UI designers (and their needs), will create a modern tool that will be everything that Fireworks is today… but also much more! The world needs such a new tool!

      1
      • 19

        You think it’s because they are just embarrassed at how much better it is than Photoshop at everything except editing photos?

        1
  3. 20

    I’m designing websites with FW for over years now and I totally agree with everything you mention in the article. Let’s all hope for a good replacement!

    1
  4. 21

    I want Santa Claus to bring me FireWorks CC 2014!

    3
  5. 22

    Fireworks is really awesome, I’ve been using it for many years! Quite recently I started using Sketch as well. But Sketch is still missing a lot of essential features from Fireworks and is full of frustrating bugs, though it has promise. Just curious to find out what Alan Musselman is up to :)

    0
  6. 23

    Geert van der Heide

    December 19, 2013 5:00 am

    I think we’re currently in a transitional period when it comes to design tools. Many people have realised that many of the current tools no longer fulfill our needs when it comes to interface design, and the software creators have realised it, too. Currently, Fireworks and Sketch are the closest thing we have to the perfect apps for UI design, with Photoshop seeing a lot of use by people who work around or accept its limitations. But none of those actually fully work as well as they could, for the modern web or app designer.

    In the next two years, I expect there to be a shift towards new things though. Most prominently, the areas of UI design and front-end development will finally start to come together. We’ve been so used to creating static mockups and then coding them afterwards, or designing in the browser using CSS, that we’ve almost forgotten how cumbersome and time consuming this all is. We need tools that provide us with amazing UI design features, while also handling (a large part of) the front-end coding. Macaw is the most ambitious project to try to achieve just this, with a few other promising apps also on the way, like Adobe Edge Reflow and Webflow. These tools currently focus a lot on the front-end development side, but still lack a lot of the in-depth editing features of Fireworks and similar tools. I hope and expect these tools to grow, in order to become truly fully-featured tools for web and app designers / developers. Other software creators may also take cues from Macaw to create even more complete solutions.

    Personally, I’ve been using Photoshop for many years and, while I’m continuously annoyed by its lack of UI-focussed features and its oldschool workflow, I will continue to use it until something more capable shows up. I’ve tried Fireworks and I think it’s basically a better fit for UI design, but I’ve had trouble transitioning to its logic and workflow from Photoshop. Now that Fireworks is being abandoned, I’ve decided to wait and see what Macaw can deliver, possibly with Photoshop as a support tool for bitmap editing. I’ll wait and see what happens, but I’m fairly confident we’ll be seeing good stuff in the near future.

    I feel bad for Fireworks users though, it looks like a truly nice tool for UI design.

    0
  7. 24

    Interesting article Michael and I agree that FW is an awesome tool. Even though Adobe may be letting it whither on the vine it wouldn’t surprise me to see something like Fireworks appear in the Edge Tools and Services to fill a big, gaping hole in the line up: an image editor.

    As for learning Fireworks, I thought you may be interested to know that I have stuck an entire Fireworks CS6 video course up on my YouTube channel at https://www.youtube.com/channel/UCCjDB7XASezB9lERBF1qwbA .

    I originally did it for video2brain and it was given back to me when Lynda acquired v2b earlier this year. I felt it was the least I could do to keep the FW community rolling.

    0
    • 25

      Thanks, Tom!!

      0
    • 26

      That’s very kind of you Tom!

      Yeah, I had been using Fireworks since the Macromedia days. I found it very hard to convince Photoshop users to see the viability of Fireworks. (Just to note that I had Fireworks updated last week. So I am glad that they are trying to fixing the remaining bugs.) I think Adobe is committing more resources into tools like Reflow and Animate for HTML5.

      0
    • 27

      That’s exactly what I was searching! I’ve always had Fireworks on my computer but never learned it too well and since Adobe(which always makes stupid moves with its products they don’t seem to understand) dropped the support..well, it’s time for me to learn it!

      I’ve always been fascinated by the simplicity of FW even though I can understand just a little part of it and since Sketch is a Mac only program I can’t even consider it to go big enough.
      I will start learning FW better starting now in my spare time, I won’t let this gem die.

      0
  8. 28

    What a read, thanks Mike!

    Yeah, it is really hard to comprehend the decision of killing Fireworks with no anything to substitute some of its awesome features, specially when using them all together in one app…

    I’ll keep using it for now but feel like it is time to start exploring other tools…

    Cheers!

    0
  9. 29

    Great article, thanks Michel
    Small typo in your pixelmator hyperlink though….it links to a 404 now !

    0
  10. 31

    As someone who doesn’t use Fireworks I find this article very one-sided (which is fine, its an opinion) and perhaps doesn’t explore why Adobe have feature frozen it (as well as it could have). I don’t know the answer to this but it would be interesting to see a counter argument.

    My main point: I’m an avid Sketch user. I love it. Sure, it has holes and bugs but the prospect and potential of it make me want to sit it out and see where it goes.

    However your statement here, is very naive when talking about Sketch – “interesting alternative, as is Pixelmator. ”

    Pixelmator is NOT an alternative to Sketch. Obviously some features crossover and thats natural. But they are two different tools at their core. I personally feel Pixelmator in conjunction with Sketch makes for a great repertoire of tools.

    Thats my approach. I’ve thrown out Photoshop. I’ve gone with Pixelmator + Sketch and I love it.

    0
    • 32

      I know Sketch is a great tool, and quite promising. I’ve said it in my article, too! ;-) (And I never tried Pixelmator, but keep an eye on it, too, and hear good things about it.)

      You should know that Fireworks is a tool with more than a decade of history, and at least 12 major versions behind its back. Sketch came much later to the game. I don’t underestimate the power of Sketch, but rather wanted to explain in my article, which features make Fireworks such a great tool for UI design.

      Fireworks combines inside one tool the power of vectors and bitmap editing. This is its major strength. You don’t need to switch between a vector-based tool, and bitmap-editing tool. You have all inside one package. That’s the reason why so many people love it and use it…

      0
      • 33

        Thanks for the reply – my main opinion was that Pixelmator shouldn’t be compared to Sketch nor touted as an alternative. Its like saying the alternative to Illustrator is Photoshop. They have a 10% (number plucked from thin air) crossover in terms of features, but they are different.

        Convergence is both a good and a bad thing, for so many reasons. Fireworks combining bitmap and vector editing in a single package is certainly a plus and no doubt is efficient as a workflow. Thats a good example of convergence. The bad? You’ve already given the example – Fireworks feature-freezing. All of your eggs are in one basket so to speak. Lots of functionality, combined into a single product – now you’re left scrambling for a whole set of tools, rather than perhaps just vector editing tools.

        Convenience means different things to different people. I’m not saying you’re wrong/I’m right, or visa versa. Convenience fits into how you work best, so there’s always a counter argument.

        0
        • 34

          The bad? You’ve already given the example – Fireworks feature-freezing. All of your eggs are in one basket so to speak.

          — This could happen with any app you’re using. What if tomorrow there’s no Photoshop? Or no more Sketch? What if you rely on these programs in your work?

          There’s no problem that a good UI designer is using one app for all screen design tasks, if that app fulfills all his needs. The problem is that Adobe never really cared seriously about Fireworks, even if the tool had great potential. Now Fireworks users only have to hope that some smart software developer will create a tool that is better than Fireworks. (An no, using multiple tools for screen design is certainly not making things easier… The super-slow and clumsy Ps+Ai workflow, practiced by so many designers today, should prove this point.)

          0
          • 35

            Did Adobe care about any of the tech they bought from Macromedia? It seems like they systematically killed it all off.

            0
  11. 36

    Nice article. I look forward to the new UI software you hinted at coming from Adobe. In the meantime, we’ve been really excited at my current company (LOYAL3) to be using Antetype. You guys should all take a look. A great UI tool that is new to the scene and one that is just so great for us. It has changed our entire design process across our company. Features that are unique to our needs in the design space. Antetype.com

    0
  12. 37

    Great article! I rarely read articles that long but I read every sentence.

    Didn’t know about the ‘Modify → Snap to Pixel’ feature! That will come in handy. Long live Fireworks!

    0
    • 38

      Illustrator and Photoshop *both* have the snap to pixel feature in case you use either of those as well. That is a key setting to use with designing for the web in either products vector tools.

      0
      • 39

        Michel Bozgounov

        January 2, 2014 8:29 pm

        In Fireworks, snap-to-pixel is not a feature or an option. In Fireworks, every object, always, snaps to a pixel-perfect grid. In Illustrator and Photoshop, this is an option — but it’s not “ON” by default, and even when it’s “ON”, you can switch it off.

        This clearly shows that Fireworks is a tool for UI/screen design, and Ps and Ai are not such tools.

        P.S. Oh, and the “snap-to-pixel” features were added fairly recently to both Ps and Ai. Fireworks had this since version 1.0. ;-)

        1
  13. 40

    I am a long term Fireworks and Freehand user and still feel bad about the buy out of Macromedia by Adobe.

    I was watching the FreeFreehand community and have also closely followed their alternative app, previously called Stagestack and now rebranded to Gravit Express.

    They have an early preview on their site and a pretty up to date news channel. Might be worth checking out – gravit.io

    0
  14. 41

    I see you mention that Xara Designer Pro “… is a UI design tool that runs only on Windows. PC Pro has a quick review of it.”

    I have been using a Macbook for many years and have been using Xara Designer for at least 3 years on it. Yes, you will need to install a VM, to be able to install Windows and then any Windows based programmes.

    But, I wanted to make it clear that even if you have a Mac, this does not mean that you cannot use the best and fastest vector drawing programmes made by Xara.

    0
    • 42

      Well, similarly, you could install Sketch inside a Mac OS X virtual machine on Windows 7 or 8… but… that’s not the same as if Sketch was available “natively” for Windows users. :)

      0
  15. 43

    Please notice that most the features mentioned in this passage already existed in 2005, which means Adobe has never offered a BIG-UPDATE to Fireworks yet. Instead, they replaced Fireworks text engine in CS4 (consider it as a big update if you’d like) and removed the System-Antialiasing option for text object (which they added to Ps now with a new name: Windows LCD, thanks god Fireworks text looked sucks now). What’s more important, an old software like this is still an excellent UI design and prototyping tool, and it’s convenient to create any extension you need to speed up your work.
    I never use Sketch and Pixelmator as I am a Windows user. Although they’re great, but… hell knows? I have been wondering why there’s no a version for windows. Fireworks is the best, bar none! Based on what I’ve knwon.
    By the way, my favorite Fireworks extensions are ‘JSML Library’ and ‘FWXHR’!

    I write my own Fireworks extensions, btw, you can check them on my site. ;-)

    0
  16. 46

    I’ve had a designer who was a fan of Fireworks. He did everything in Fireworks.

    Once I’ve told him to design a full-door-size sticker. Turned out great and fast. But he could not export scalable vectors for print, and he could only export 6000px max length raster. We printed raster 6000px into 86 inches height door. You can believe it looked shit with that 70 DPI.

    Another turn I asked him to design a t-shirt logo which we wanted later to serigraph (I mean stitching) on cloth. Of course we were asked to submit vectors for production, so I ended up redoing everything in Illustator myself having a PNG from Fireworks as a background layer to vectorize.

    From that time I personally hate this guy and Fireworks. I’m sure its a great software, but use it only where its supposed to be used.

    0
    • 47

      Well instead of hating on the guy you could have helped him learn the error of his ways.

      0
    • 48

      Interesting story, but I see a couple of weak points in it:

      — Fireworks is a screen design tool. Why use it to make designs for print?

      — Fireworks can create a canvas with a maximum size of 6000×6000 px, but there’s a documented “hack” to make the max. size 10000×10000 px.

      — From Fireworks, it’s very easy to copy one or many vector objects and simply paste them as vectors into Illustrator. So I don’t understand, why you went this complex way (“redoing everything in Illustator myself having a PNG from Fireworks as a background layer to vectorize”)? You could have copied the vectors from Fireworks to Illustrator and save a few hours work. Or, you could have saved the vector illustration in Fireworks as *.ai file and then open it easily in Illustrator.

      You see, the moral of your story is that it’s important to know what tool to use and when, and also to use properly the tools for the job. It seems, you and your Fireworks designer guy, did neither. ;-)

      0
      • 49

        Michel, I fully understand what Fireworks is for. I’m 100% in line with the first point you given (and basically everything you’re giving, please read my very last sentence. Unfortunately my designer is not, so after couple of such faults he’s no more my designer. Yes, I’ve told him to use proper tool once I learned he can’t choose one, he just hated everything except Fireworks.

        As for that time I redo everything in Illustrator… Don’t remember exactly, but I think he used effects and tools specific to Fireworks. Yes, I could export/save basic shapes in vector format, but those effects were gone.

        0
        • 50

          Michel Bozgounov

          January 6, 2014 7:01 am

          1) Fireworks is a great tool for UI design. For vectors+print stuff, Illustrator is your tool. I guess we both agree on this point. :)

          2) If you apply live filters (or complex gradients) to vector shapes in Fireworks, then copy and paste the vector shapes into an Illustrator document, yes, you most likely will have to re-do these in Ai. But, the vector shapes will be 100% preserved and you won’t have any issues with that. You could save a lot of time if you “transport” your Fireworks vectors into Illustrator (either with simple copy-paste or by saving to .ai in Fireworks)… You’ll have to work on colors and effects a bit, but vectors will be intact and this alone is a major plus…

          0
  17. 51

    I was gutted when I first heard the news about Fireworks no longer being developed. I started using Fireworks from the very first version when I was about 15 years old and it was probably Fireworks and Dreamweaver that actually got me into the web industry. Photoshop always seemed too clunky to me – I love it’s photo editing features, but as a screen-design application, it’s just not streamlined enough.

    I know so many people that think of Fireworks as an essential part of their toolkit (TheOatmeal creates all of his comics using Fireworks) and I’m going to carry on using it for as long as possible.

    0
  18. 52

    For the last 4 years I’ve been trying to get away from Fireworks because of aforementioned reasons. Feature-frozen and annoying bugs.

    But it’s just sheer impossible to find a worthy replacement that runs on windows. I tried Photoshop many times.. but after being stuck for minutes doing something you’d intuitively do in seconds in FW.. yeah.. forget it. Although PS seems to incorporate new features that help along the way.. it just doesn’t cut it.

    0
  19. 53

    I stopped working with Fireworks when they got sucked by Adobe. And it really proved me right. I’m not too much into designing stuff with Photoshop, but it seems to be the #1 supported way these days while Fireworks got abandoned since they belong to Adobe. Its performance, its interface, its handling has already been frozen ever since so officially freezing it now doesn’t really change too much. It’s such a shame, I really, really loved this software and it broke my screendesigner’s heart to turn my back on it, but today no HTML or MobileAppDev would know what to do if I’d send him a FW-workfile. It’s just one example of how this once great software got completely irrelevant. What I don’t really understand is, that there is a huge gap between Photoshop and Illustrator and noone seems to be able to fill this gap with a software like Fireworks. I’d totally go for that as PS just isn’t a screendesignsoftware at heart, neither is Illustrator and still we are forced to work with those solutions? Actually I’m not even one of those people who don’t like Adobe, I just wish I could understand, what’s driving them. If FW sales got that bad, then surely not because there aren’t enough web/mobile/whatever-designers out there but because no one wants to professionally rely on software with such a bad support. So if they are now freezing it, then PLEASE just because they are developing something superfresh, the time would be right and the states of art also have reached a new generation to allow a step like this. I’d be the first to throw his money into the first developers direction that manages to deliver a real screendesign software solution.

    0
  20. 54

    I truly feel bad for those who really took the time to learn and use Fireworks (myself included). All of these software packages have a learning curve and that means a tremendous amount of time and effort is wasted when they pull the plug.

    I was an advanced Flash user and when it was killed (by a single individual), it destroyed a whole industry. People actually studied this program in college for years!

    Every time they kill a software package, it significantly decreases my value as a creative professional.

    My 2 cents

    -dp

    0
    • 55

      My though is that what we see here is an interesting parallel between traditional print and UI/web design. Technology no matter how effective or good gets replaced by those with an agenda that doesn’t always match the populace.

      When the newspaper industry went from letterpress to offset printing an entire trade was wiped out over night by Rupert Murdock in 1982. Hundreds off Linotype compositors actually lost their jobs overnight (actually not metaphically). The mostly men did seven year apprenticeships and worked their entire careers as “lino” operators.

      It happened similarly when Quark was killed off by Indesign (although not overnight). Having seen a few guys go through both these changes I think you have two choices. Learn something new or start an new trade/career. I think it is always good to be open to new methods of work, JUST IN CASE.

      I started using Corel 3 and miss one or two features but will never be held back by that.

      0
  21. 56

    Earlier this year, I was in a project where developers put hot spots on top of an image through absolutely positioned, invisible div tags. I suggested using image maps, an ancient technique that was created for this particular purpose. With Fireworks, I’d draw the hotspots, and it would generate the image map markup in a snap. Their technique on the other hand, required a lot of trial and error and it was more difficult to correct.

    While I doubt I will ever do another project that involve image maps, this is one of the things that Fireworks does that have no replacement. For the last several months, I’ve been using Sketch, which is faster and more intuitive, but you can’t still do an animated gif, or an image sprite with its generated css, and it works so seamlessly with the Mac OS that I can’t imagine a Windows version ever coming out for it.

    Still, Sketch feels fresh, and makes Adobe software look clunky. I have lived without the need for Microsoft Office for 4 years now. I believe the time an Adobe-less workflow is possible is in sight.

    0
  22. 57

    Anyone had problems running Sketch on Mavericks? I was in the process of buying it from the App Store when I noticed a string of complaints in the reviews seemingly fueled by Mavericks issues. I completed the demo before I upgraded, so I’m not able to give it a go myself.

    0
  23. 58

    Excellent and thorough article! To me it is the user experience of Fireworks that has me hooked. I get 10 times the productivity doing simple vector based manipulations with Fireworks over fighting with Photoshop or Illustrator both of which to me are over complicated most of the time. Haven’t tried Sketch but I’ll definitely be looking into it!

    Edit: Well maybe not, its OSX only.

    0
  24. 59

    Hi!
    I’m a FW addict so for me “Fireworks is the best, bar none!” like said WaveF
    • Photoshop is really to slooooooow in terms of process
    • Sketch is mac only, so impossible to use because I have to share my work with others designers, developpers and even others agencies or clients !
    • Pixelmator … I miss pages
    • Antetype, not bad but mac only

    We, “designers” in my agency, we learn CSS to be fully operational in the future with tools like macaw, webflow, etc.
    We were good for doing html but we’ve missed the “CSS” train, too busy with the production, and now it’s hard to catch up :)

    We are living with a ultra fast web, and in my opinion adobe’s decision was too fast !

    Thanks Michel for what you’ve always wrote about Fireworks !

    0
  25. 60

    Thanks Michael,
    I’ve been a Fireworks fanboy since CS3 and I have to say that you missed one of the biggest drawbacks to Fireworks: If it’s the tool you learn *first*, then you don’t want to learn any others.

    A few weeks ago, I was asked to provide mockups for about 7 pages…. on a Friday afternoon… to be delivered before Monday morning. Using Fireworks, I still logged off early. Had it been PhotoShop, my weekend plans would’ve been shot… not just because PS is more complicated, but because I have never taken time to learn it.

    Using PhotoShop as a web design tool is like using a semi truck as a commuter car. Why do I want to learn something that makes me less efficient?

    Thanks for the recommendation on Sketch, I’ll check it out.

    0
  26. 61

    I was on Mars.

    But hey, very positive article that accepts software changes and falls by the wayside.

    I recall fireworks with a great deal of fondness, although I stopped using it about 5 years ago. It was once an essential tool in my web dev kit.

    What amazes me, is how designers have taken it so far beyond it’s original purpose – and lets hope Adobe makes good on it’s promise to learn from that as it develops it’s next set of tools.

    But… lets also hope the alternatives grow and take some of the market share, for healthy competition.

    It was a pretty bad day when macromedia went and also Corel – it left just one big player.

    0
  27. 62

    Michel,

    Just a small correction: EvolveUI’s codename was “Underdog” not “Project EvolveUI”.

    “EvolveUI” is now the final legal name.

    I know Fireworks is not going away any time soon.

    Great article.

    0
    • 63

      Yep, it all started as “Project Underdog” but it’s now “EvolveUI”. Thanks for the correction; but, no matter the name, I hope Alan will come up soon with a great UI design app! ;-)

      0
  28. 64

    Eyal Kofman Cagan

    December 21, 2013 1:28 am

    Hi Michel, great and extensive article, it seems to describe most Fireworks time saving features*, also if I was considering switch to Fireworks (I use it for more then 10 years, so I don’t need to switch ;)) that article shows Fireworks is alive and will do so for as much as needed
    At this point I can’t see a replacement to Fireworks – I’m a UI designer, so I’m not actually use any other software on a daily basis (the only reason I open Illustrator is when I get to work on other people projects, and it too complicated to re create in fireworks, or when need my Firework exported files to be converted to ’32 Bit bmp files’, that only exist in Photoshop)
    For me adobe announcement of the feature freeze was a very happy day: as it said before, since Fireworks was handed to Adobe, and after CS4, there was no one major new features favoring Fireworks, the feature set needed for my workflow was there since this version – as a prove: my design work flow almost didn’t change in the last few years – except when I find an existing feature or a new extension come out, both cases have nothing to do with Adobe product support.
    Considering the above, after the announcement I bought Fireworks CS6 (mainly for the stability over CS4), with the exciting knowledge and relief that (again) I’m not depended on Adobe anymore, and will not need to pay for a design software in the coming years!
    And as today this is the most important feature of Fireworks for me.
    ———————–
    * I put the asterisk near ‘time saving features’ , because many articles that list Fireworks features regularly missing the most useful ‘Button Symbol’ and the time life saver native spell checker:
    Button symbol – I use it in many cases (and not only as button), it is not smart (and complicated) as smart symbols, so it can be ‘deployed’ with much more ease and therefor quicker to use, it still have contained states (Hover/Press, etc..) and the ability to add dynamic text (that is more accessible then smart symbol text because you can copy and paste in it), it also contain ‘automatic’ slice in it.
    Except for the regular button usage, I find it useful for other objects that need to be deployed across the design and should contain dynamic text, such as: panels with the title in it (modal / Alerts), text boxes, List and grid Item, Tabs, Sliders thumbs with percentage, or even just plain text (Titles /Headers).
    The only limitation I find is that when using states for previewing screens you will get the second or third state presented (I don’t usually use states instead of pages), on the other side this could come handy, For example: making an alert or modal that is contained in the second state of a button symbol, So when having a screen that need it you just duplicate the state and get it to popup ‘automatically’

    Spell Checker: Fireworks contain a spell checker, it come very handy and even a life saver if you using raw text, write the text, or if you get a notice that there is typos in text delivered to you. I don’t think any other tool have it, and it is another contributor to the fact that Fireworks is the only real all-in-one software exist in this domain!
    A use case for example: how long it will take to check for typos that you know are spread all over your ready to present tomorrow GUI design, if made in Photoshop or Illustrator, or any of the other niche tools out there (that not contain Spell checker)?

    Just my 2 cents on this deprecated features;)

    Eyal

    0
  29. 65

    Excellent article which clearly highlights some of the reasons web designers prefer Fireworks over Photoshop.

    If the Photoshop fanboys read it they might see why Fireworks is the best tool for web design.

    Had Adobe bothered to get to know Fireworks they might not have decoded to discontinuing it. Send them a copy of this article so they can understand why web designers think they are such arses.

    I don’t see any need to look for an alternative, Fireworks is still better than the rest and I will continue to use it for the foreseable future and will be shunning Adobe’s creative suite subscription – Fireworks does everything I need.

    My employers insists on Photoshop but don’t tell my boss but I often work in an old copy of Fireworks and export as a psd.

    0
  30. 66

    Been using Fireworks since Macromedia’s version 4. It’s been an indispensable tool in my workflow ever since. Unless a comparable tool comes along that matches and exceeds Firework’s tools and features, I will continue to use FW even if it means I have to run a virtual machine. It’s that awesome and Photoshop is that bad.

    0
  31. 67

    Jeez, if I knew that Fireworks could do all that, I’d definitely be using it right now.

    I took graphic/web design classes in 4 different schools (5 if you count high school) and none of them ever acknowledged Fireworks’ existence.

    I really hope Adobe adds all those nice features to Photoshop, although PS certainly doesn’t need to be even more massive and cumbersome. It’s a shame they didn’t give FW the respect it deserved.

    0
    • 68

      Using Photoshop for Web Design, is like using CSS floats for layout.

      0
    • 69

      Thank you so much for an excellent article with a good summary of what makes Fireworks so valuable.

      Not all schools ignore Fireworks. I am a college professor in the web and interactive media department at my school. I have heavily promoted Fireworks in all my classes for the 5 years I have taught.

      I teach the advanced Photoshop and Illustrator courses at our college and both programs can NOT do what Fireworks so easily accomplishes.

      And if there are any Photoshop Naysayers out there, I just aced the Photoshop CC ACE exam with a 92…. so I think I know a little about Photoshop. I think the ignorance about Fireworks is appalling.

      One last note: long time Fireworks author, guru and instructor Tom Green has put his entire Fireworks course online for free. You can find it here on his YouTube channel:

      http://www.youtube.com/channel/UCCjDB7XASezB9lERBF1qwbA

      0
  32. 70

    Looks like Fireworks features will be absorbed by Illustrator.
    I use Illustrator for UI design and it’s becoming better every year for this. Still, some features from FW are missing.
    Photoshop is a real pain for pure UI design. UI visual design, ok.

    0
    • 71

      That mean to wait a whole year for version improvements? and what you get at the end, some patchy and probably outdated feature, that was there in Fireworks for few years… I will just mention the horror you call ‘Save for web’, that is actually no more then a horrible piece of software called image ready back in the days, you still use it today! where it was actually (very poorly) developed years back to compete Fireworks solid Image export capabilities? or maybe we mention one of the latest update that let you actually write a layer name without opening a pop up? what about handling and exporting slices from within your software, when this update going to come to Illustrator and Photoshop? That is the reason I can never use this piece of software it will be like going back 10 years in matter of workflow. That real shame! this is why one shouldn’t relay on Adobe for UI design, they never been capable in this field

      0
    • 72

      Ill-frustrator… a terrible user experience software, anyway you look at it. No matter how long, how good you know it, the experience and results are always worse than FW or Sketch for its core feature, vectorial drawing. It makes me cry how terribly thought it is, how its learning curve sucks so hard people tend to think drawing with vectors is some sort of magic. The more people experiences good software such as Sketch or FW the more people will achieve excellent results.

      0
      • 73

        Michel Bozgounov

        January 2, 2014 8:37 pm

        I agree with you, Isabel. Illustrator is a great (vector design) tool, but Fireworks is much easier to use and it not only has powerful vector capabilities but can also handle easily bitmaps (something which Ai cannot do). It’s really sad that Adobe is stopping the development of Fireworks…

        0
    • 74

      All of the Fireworks features that looked helpful to me from this article already have been in Illustrator at least since CS5. Maybe the author should give Illustrator another chance.

      0
      • 75

        Hello, Tom,

        Most of the features I mentioned have been in Fireworks since version 1.0 (that’s more than 10 years ago). Perhaps you should give Fireworks another chance! ;-)

        0
  33. 76

    Wow that’s the longest read I’ve seen on FW for a while. I still use it everyday as my main tool. I have no need to stop using it till something better comes along. I don’t understand the need to leave it until something can at least hold it’s weight. Looking forward to seeing the next tool though.

    0
  34. 77

    I started using Fireworks in 2002, and i agree with you, Fireworks is a great tool for webdesigners, i even use it for some of my print work, and i have nice result with it,

    Today 90% of my design work is done by Fireworks, and i was disappointed when i read your article knowing Adobe will stop the development of Fireworks.

    Hope Adobe will maintain Fireworks compatible with newer windows versions, so we can continu using it.

    0
  35. 78

    This is my first comment on your blog, all I can say that, its awosome.

    0
  36. 79

    Let me start this comment off by saying how refreshing it is to read a Fireworks article here on Smashing Magazine from someone that has actually used Fireworks extensively.

    A few months ago, I was originally dismayed when Smashing Magazine posted an initial article about Firework’s demise from a writer and editor who admitted he had hardly ever used Fireworks before so he didn’t really see the big deal in Adobe killing it. THIS is the article that should have taken its place – if only because it highlights all the features that many web and UI designers use on a daily basis as so many previous comments have stated.

    I don’t know if there will ever be an end to a Fireworks vs. Photoshop vs. Illustrator debate. We all use the programs we feel are more intuitive for us. I, myself, LOVED Freehand and hated Illustrator, but once Freehand also died, I went kicking and screaming into the scary world of Illustrator. Now that it’s been a few years since my “Illustrator conversion”, I am much more comfortable using Illustrator than I ever was before but I’m still not the wiz with it as I was with Freehand.

    But this “program preference” attitude will always be a hard thing to overcome – especially with Photoshop enthusiasts. It is almost always difficult to get Photoshop gurus to see ways in which Fireworks can make their lives easier. Again, that’s really the problem I had with that original death of Fireworks article I mentioned above. It was written by someone who obviously preferred Photoshop so it stood to reason why Fireworks’ death kneel really wasn’t a big deal to them.

    This article does the complete opposite… it very clearly demonstrates exactly why Fireworks will be so hard to replace and why other programs are having a hard time duplicating all of the incredible things FW can actually do. So, for that, I very much appreciate this article…

    And that’s from a guy who helped Tom Green write a couple of Macromedia books – especially in the powerful uses of Fireworks when it came to web design.

    0
    • 80

      Michel Bozgounov

      January 2, 2014 8:33 pm

      A few months ago, I was originally dismayed when Smashing Magazine posted an initial article about Fireworks’ demise from a writer and editor who admitted he had hardly ever used Fireworks before so he didn’t really see the big deal in Adobe killing it.

      – Care to share a link, please? I don’t remember reading such an article here on Smashing Mag. Maybe it was posted in some other online magazine? :)

      0
  37. 82

    There’s no way Adobe has not seen the success of apps like Sketch and not immediately reconsider a successor to Fireworks.

    With Project Mighty, you can work with fellow peers to quickly stitch together things like mockups.

    Without Fireworks, there’s really no program to use I’m the family of Adobe Products to make sense.

    Photoshop & Illustrator don’t have a concept of pages and states robust for such a thing to not be a mess.

    0
  38. 83

    I really appreciate your article, Thank you.

    0
  39. 84

    christinajosephone

    December 23, 2013 11:09 pm

    Hi Michel,
    Awesome and very comprehensive post. I like your post most. Keep it up…!!

    0
  40. 85

    And it works great with Adobe Flash. After importing to Flash vector is vector, bitmap is bitmap and fonts import great as well. All filters and blending modes are also mostly valid (sometimes littel tweeks are needed). All other software doesn’t compare to it in means of Flash support. Why it became discontinued is beyond me.

    0
  41. 86

    UI Design is still in its early development stages considering mobile devices are being used more than ever, and come to think of it; maybe thats why EvolveUI isn’t such a bad codename after all.

    0
  42. 87

    It really amazes how people use Photoshop to design websites. I find it really pointless to use a photo editing and retouching tool for this kind of work. It’s like adapting a tractor to run races. I’m designing sites since ’95 and I’ve used every application out there.
    Fireworks used to be my preferred tool but, for the last four 3-4 years, I design directly with code. For photo editing I use various iPad apps. I only need a tool on my macs for SVGs.
    I don’t do mobile app design, but if I did, I would go for sketch. Still an infant but It fells light and fast.

    0
  43. 88

    Fireworks is my main workhorse, but it crashed on me 3 times in an hour yesterday. The very act of saving a file is often the main cause of these crashes.

    I’m trying to move to Sketch, but there’s some basic things that are so vital that I can do in Fireworks that I can’t do in Sketch. Especially around working with images, Sketch still falls short probably due to being a new program. The beauty of Fireworks was its ability to work with both vector and bitmap. Sketch does great with vectors, but I can’t find a smooth way to quickly crop a photo other than masking which feels like a clumsy solution to me.

    Overall, Sketch feels like the best hope since Adobe doesn’t seem to care very much that their decision is damaging to lots of other businesses that have already invested time, money and resources into this tool.

    Thanks for this article, it came at a great time as I’m trying to decide how to best retool as Fireworks dying process seems to accelerate with each and every crash.

    0
  44. 89

    After reading that, my fireworks flame is burning like never!

    Thanks

    0
  45. 90

    So sad to hear that. I am using it for about about 10yrs now, and hate to be forced to use 3-4 slow tools instead of one…
    I guess i will be using it until it is supported by operating systems. Than, i will probably leave outdated operating system until it is supported by hardware manufacturers, and than…
    ..let’s hope Adobe will publish new FW … :)

    0
  46. 91

    If GUI design is your bag, try “Antetype” as a solid post-Fireworks alternative. I love it.

    http://www.antetype.com

    0
  47. 92

    Mircea Cel Batran

    January 1, 2014 4:57 pm

    Adobe failed with Flash, now with Fireworks. Good job ! I hope they will go bankrupt someday and people will forget about their silly tools like Photoshop, which in my view and not only, is a bloated layer monster, in which you fail to ever create something quick and effective. Good job, Adobe. I hope you’ll go bananas for good and quit developing Dreamweaver and illustrator so you lose all your relevance. Please make all your bet on mobiles ! GOGOGO ! There are lots of people who are so sick of Adobe. And those people are not just those who were dumped by this move.
    Steve Jobs once said that Adobe pseudo nerds are a bunch of lazy people, too incompetent to do something right. This proves it once again.
    Designer folks, you, maybe should take a look at COREL. Though, I hope Adobe won’t try to buy them in a desperate move, like they did with Macromedia. Adobe….just go Kodak. Leave design world alone, with your dumb destructive moves.

    Also, designers, you could check on Gimp, Blender or Inkscape. They’re not so polished, but can do the job.

    0
  48. 93

    Hey Michel, it is truly a sad thing that Adobe is getting rid of Fireworks. Have you looked at Axure? These guys might be a great alternative. Can you write an article about this and let me know what you think? I just downloaded a trial, so we will see if this thing is any good.

    0
    • 94

      Michel Bozgounov

      January 2, 2014 8:26 pm

      Axure is a wireframing and prototyping tool. Fireworks is a full-featured design tool. These tools can’t even be compared to each other, sorry.

      0
  49. 95

    Please don’t kill Fireworks, it is the only tool I am best at and others tools like photoshop, indesign, i found nothing infront of it.

    I have been using this more than 7 years and i never try to learn other cause this i find a perfect.

    But its really very very sad that Adobe took such a horrible decision :(

    0
  50. 96

    Well that sucks, I’m a student and was planning on buying my first license after xmas for adobe as my college offers the web creative package for €300. I’ve been clearly pirating to this day but wanted to jump on board for the first time.

    Only reason I wanted the web package was for Fireworks as I love it. Hate Dreamweaver as there is much better alternatives like Sublime and Brackets. I could get the standard creative package for €200 though but feck that I ain’t using Photoshop for creating web templates.

    How long do you guys thing Fireworks would be relevant in the future? Is it still worth my money to buy the web package seeing as the main software in it for me is now abandon-ware? Of course the price is great for Photoshop, Illustrator, Acrobat and some others.

    Got a trial of Xara pro the other day and while its nice, its missing simple things like holding shift and seeing the distances between guidelines which is a pretty big deal to me. There seems to be a lot of alternatives on OSX but I ain’t heading over there unless I really have.

    0
  51. 97

    Project EvolveUI changed name to Project Underdog, since the other name was already taken.

    http://tribaloid.com/

    0
    • 98

      Michel Bozgounov

      January 4, 2014 2:45 am

      No, actually “Project Underdog” evolved into “EvolveUI”! ;-) (I guess the website is still not updated.)

      0
  52. 99

    I switched from Photoshop to Fireworks about 5 years ago now. And I have to say it was a real eye opener. Why the hell designers used a photo editing tool for making websites instead of a tool that was specially created for the task was beyond me.

    Now a days I use it daily and for some reason where ever I end up all my co workers seam to start using Fireworks after a few months of me starting working there :)

    Anyway… I’m not gonna stop using Fireworks as long as there is no suitable programe that does it better. I see people talking about Inkscape and Sketch… I think we’re not using it with the same end goal in mind my friends.

    In my view those programs can not compete with Fireworks any time soon.

    Anyhoo… I’ve uploaded some of my first Fireworks artwork to behance.net so you guys can see I’m not a complete idiot :)

    Have a look. Maybe you’ll like it.

    http://www.behance.net/ooosh

    Bye!

    0
  53. 100

    I really hope Adobe dies in the next few years. Stopped using/caring about it once CC was announced and the utter contempt shown to Australian users by the CEO ensured I’d never give them another dollar http://www.youtube.com/watch?v=78yigV0GYGQ

    Good riddance Adobe

    0
  54. 101

    I believe Serif DrawPlus (Windows only) is excellent software for things such as you mention- http://www.serif.com/drawplus/x6/gallery/ – It’s different but similar I suppose.

    0
  55. 102

    Michael Williams

    January 8, 2014 1:30 am

    What a beautiful Eulogy to a product I love.

    It’s going to take these pretenders a long time to catch up with Fireworks.

    0
  56. 103

    Look guys, it’s simple:

    1. Adobe (a print design and photography company) buys a company with tools that are compelling in the web design space (because print is dead)
    2. One of those tools is so useful that a lot of designers (me, for one) use ONLY it for nearly everything they do
    3. Adobe simultaneously attempts to Bridge(tm) the gap between their disparate, yet functionally cross-cutting (e.g., Light Room should be part of Photoshop, et al) app suite, in an attempt to make it even more of a package deal
    4. Adobe continues to lose Photoshop and Illustrator customers (~$700 combined?) to Fireworks ($300)
    5. Adobe does what Adobe does best, kills innovation, because they have what economists refer to as market control
    6. The customers languish

    What comes next is up to you.

    1
  57. 104

    News like this makes me long for the days when Macromedia was still around. With every release of software you could always tell they put a lot of time and effort into delivering a good product.

    It’s true that since the buyout, Adobe has not used the resources given to them at their fullest. I noticed this back when Director (which at the time before the buyout was years ahead of Flash) was neglected, then Freehand, soon Flash will be gone, and all that will be left of the former will be the Dreamweaver product.

    Adobe has gotten lazy. Their software has become too cluttered and for those who are wanting to begin to learn how to use it, the learning curve is steep. This is a sign of rushing things out the door. It’s all a mess. But it makes for the perfect opportunity for an innovator to step up to the plate and bring back some competitiveness to the industry. If a company out there decided to take back and actually create something new, it could easily put Adobe out of business. One such product that has recently caught my attention is Macaw (which recently had a Kickstarter campaign). Haven’t seen anything quite like it yet out there. http://macaw.co/

    0
  58. 105

    Thank you so much for an excellent article with a good summary of what makes Fireworks so valuable.

    Not all schools ignore Fireworks. I am a college professor in the web and interactive media department at my school. I have heavily promoted Fireworks in all my classes for the 5 years I have taught.

    I teach the advanced Photoshop and Illustrator courses at our college and both programs can NOT do what Fireworks so easily accomplishes.

    And if there are any Photoshop Naysayers out there, I just aced the Photoshop CC ACE exam with a 92…. so I think I know a little about Photoshop. I think the ignorance about Fireworks is appalling.

    One last note: long time Fireworks author, guru and instructor Tom Green has put his entire Fireworks course online for free. You can find it here on his YouTube channel:

    http://www.youtube.com/channel/UCCjDB7XASezB9lERBF1qwbA

    0
  59. 106

    Thanks Michel for another insightful article on Fireworks. While there is much I would like to say/add on Adobe killing FW, late to the party as I am here, I won’t (I did e.g. here after hearing the news last year: http://blogs.adobe.com/jnack/2013/05/is-fireworks-dead.html – one of the few places where we got a bit of communication back from an actual Adobe employee).

    However, I did the exercise of comparing the list of extensions currently active in my Fireworks to those mentioned in the article, and found 19 you did not mention :) Grouped by type, sorted alphabetically, with author’s name in parentheses (it should not become as a surprise to most FW users, that 2 authors tend to stand out).

    Commands
    - Export Selection (John Dunning)
    - Favicon (John Dunning)
    - Fill Handles Assistant (Kleanthis Economou)
    - Filters Commands (Aaron Beall)
    - Frame and Layer Utilities (John Dunning)
    - Grids (John Dunning)
    - Paths Commands (Aaron Beall)
    - Pixelate Selection (Matt Stow)
    - Resize Selected Objects (John Dunning)
    - Smart Knife (John Dunning)
    - Text Commands (Aaron Beall)
    - Web Commands (Aaron Beall)

    Panels
    - Adjust 9-Slice (John Dunning)
    - Adjustments Panel (John Dunning)
    - Guides (Eugene Jude)

    Auto shapes
    - Geometry Guides AutoShape (Aaron Beall)
    - Greeked Text (John Dunning)
    - Grid AutoShape (Aaron Beall)
    - Placeholder (John Dunning)

    0
  60. 107

    I’ve been a fw user since the macromedia days and I can tell you fireworks days is getting numbered. Since the mac os mavericks update, it has been crashing a lot of times and since there’s no support for it , expect in new os updates either in mac or windows it will cause more problems.

    On the other hand , if you plan to use fireworks other than screen design. Like for example logo design or a small tarp or poster. There are things you need to consider.

    - If you plan to save it as a psd file or ai, make sure you don’t use fireworks filters or layers. If it’s all gradients, find a way to make it look like a gradient by using 2 different colors. Exporting to psd sucks unless you convert them to bitmaps.

    - In logo design , I make sure to keep it 100 percent vector unless the client wants special effects etc and plans to use it on screen only.

    - If you plan on printing directly from fireworks ,remember it only supports rgb mode so it’s also one thing you need to consider if you also export it as a psd.

    0
  61. 108

    I will use fireworks till the day I die.

    1
  62. 109

    What a stunning article. I have used fireworks for the past 4 years and I truly cant believe Adobe would feature freeze one of the most capable tools in its line up . Bye Adobe its been highly regrettable knowing you!

    0
  63. 110

    I used to use Fireworks years ago until I got more serious about typography and then found it very limiting. I always knew that Adobe buying out Macromedia would be bad for innovation and time has proven that to be true. If Macromedia had remained independent, Fireworks would be a far more advanced tool today.

    Flash is dead or dying
    Dreamweaver is only used by people who don’t know better
    Fireworks, well see above

    2
  64. 111

    Do yo know any extension or option to use Fw with a retina display Macbook Pro?

    Thanks!

    0
    • 112

      As a long-time Fireworks user, what has forced me to look for an alternative, in light of the feature freeze news, is the fact that it will now never be Retina compatible…it is virtually unusable on those resolutions.

      Fireworks was/is an outstanding tool and it saddens me how few people really gave it a chance. Adobe lost a real opportunity here.

      0
  65. 113

    Never retina support is the knock-out criterion! :( … I don’t believe that it’s possible to fix with an extension. Are there any ideas for workarounds or hacks to get FW retina compatible? I heard about setting up a higher resolution on rMBP could do the trick, but texts and path edges are still blurry.

    I will use my old MBP for now, but it is very confusing for my eyes to change between retina and non-retina. I don’t think this is a solution.

    Are there any news about the new Adobe design tool that could replace Fireworks in the future as you mentioned?

    0
  66. 114

    I am thinking that no more enhancements might be a good thing. Why make it bloated with Adobe’s touch. I used CS3 until this year when I bit the bullet to Creative Cloud. I am not so certain that there will be anything to come close to FW for a long time. So in the mean time I am going to enjoy using what I have and if they make it go away, then I will find a stand alone to use till the OS says no go no mo.

    Thanks for a Great article!
    Steve

    0
  67. 115

    Thank you for this article, you perfectly summarize my views on this software. I use it for version 2 and it remains my view now irreplaceable convenience and productivity to work on the web.
    I still cross my fingers for a tool as well just …

    0

Leave a Comment

Yay! You've decided to leave a comment. That's fantastic! Please keep in mind that comments are moderated and rel="nofollow" is in use. So, please do not use a spammy keyword or a domain as your name, or else it will be deleted. Let's have a personal and meaningful conversation instead. Thanks for dropping by!

↑ Back to top