After presenting at the Designer/Developer Workflow Conference and seeing recent discussions on the Twittersphere, I started to realize that a lot of designers do not use Adobe Fireworks when creating comps for the web. In fact, a lot of posts would lead you to believe that Fireworks is useless, which is not an accurate perception.
Currently, many designers use Adobe Photoshop to create a webpage design and then pass it off to a developer. The developer will dissect the file, add in some code behind the scenes and output the final comp for the client. In this current workflow, it increases the project expense every time a developer has to touch this file just for comping/proposal purposes. But what if a designer could very easily add interactivity to the comp? Perhaps you need to mock up an entire site and not just a splash page? Well then this is where Fireworks steps in.
Fireworks allows you, the designer, to import layered .psd files (including live text) AND native vector files from Illustrator. You can then use those assets to flush out an entire website, not just a page. It enables you to create animations, rollovers, buttons and links for navigation and more with very easy-to-understand menus and tools. You can then add additional pages to your site using a Master Page (sound familiar?), keeping design elements and navigation consistent throughout.
The argument against Fireworks is “Photoshop has slicing and a Save for Web command, so I will just use that.” My rebuttal is yes, you can use Photoshop to create a flat page with slices with html links and some animation. Now create an entire site to show a client. You would have to create a different Photoshop file or worse yet, a single bloated file with multiple layer comps. Then, try to create a rollover or image swap without using Dreamweaver. Finally, assume that your client comes back with changes to the content or interactive elements of the site (they never do that, right?). Think of how you would have to edit either multiple files or an html file from Dreamweaver.
Editing elements in Fireworks is easy. You can make a change on either the Master Page and it propagates to the rest of the site, or manually choose to distribute to all pages on the site.
In the end, Fireworks is another way Adobe Creative Suite allows designers to take their flat, static designs and push them further into the next phase. Fireworks is something that should be in every designer’s arsenal of skills.
If only Fireworks could start from (import) an Indesign file.
[...] Why Designers Should Use Fireworks – a good explanation of the purpose of Adobe Fireworks, and why Photoshop shouldn’t be used for everything. [...]
[...] that can help you get almost anywhere you need. However, Fireworks has a set of tools that are streamlined for web use, and apparently give you more tools for creating an entire website, with features like [...]
Thank you so much for this article. One would think a clear, concise article answering why using FW is beneficial would be easy to find. Not the case. THanks again.
Well said, Kevin! Fireworks is an awesome creative and production tool for anything screen based. There’s a lot more flexibility in FW than many people realize.
Thank you for this article, Kevin. I have been designing in Fireworks since MX and have always liked it. Photoshop has it’s advantages, yes, but when I started designing I was mostly teaching myself and I found that the learning curve was much smaller on Fireworks. Nowadays, Fireworks is my secret weapon. Most clients assume I used Photoshop, when in reality I used Fireworks and Dreamweaver.