Photoshop to Fireworks: Workflow Tip
Ever since the merger between Macromedia and Adobe, I’ve been enjoying exposing Photoshop users to Fireworks. For those of us from the Macromedia world, we’ve long been aware of the advantages of using Fireworks in our web workflow. I even know web designers that do all of their comps in Fireworks instead of Photoshop. That’s not to say they don’t use Photoshop at all, but rather they use Photoshop for their image edits and adjustments. But when it’s time to do a layout, they feel more comfortable in Fireworks’ more object oriented mode of working – and the fact that Fireworks is a hybrid application, working with bitmaps and vectors equally.
Since the merger, the Fireworks team has been hard at work, getting Fireworks more closely aligned with Photoshop. With CS4, Fireworks understands even more about Photoshop files that it is opening. In fact, opening a Photoshop file inside of Fireworks results in an identical image and layout. That is, unless you have done one very common thing in Photoshop – used an Adjustment layer.
If you open a PSD that contains an Adjustment layer in Fireworks, you’ll quickly see that the adjustment layer has been lost. Here’s the tip: before moving your PSD into Fireworks, you need to flatten any layers that use an Adjustment layer. Simply right-click on the Adjustment layer and choose Merge Down from the contextual menu. Save the PSD (although you will probably want to do a Save As in order to be able to return to the Adjustment layers in your original, if needed) and open the PSD in Fireworks.
Hope this saves you some frustration… Skål!
November 5th, 2008 at 1:15 pm
Hi Greg,
Seen you at the web session at the CS4 tour in Rotterdam yesterday!
The session was great! as i expected from you, yopu are great!
I’ve learned a lot from you short talk about Fireworks and the new abilities and the great workflow to Dreamweaver and out of Photoshop.
We’ll i will see you again at Adobe MAX, Milan and hope to have the change to do a (video) interview with you.
I will be there with 10 o my collegeau’s from the ‘Grafisch Lyceum Rotterdam” which is the largest Graphic Design school in the Netherlands.
Keep up the good work! and take your time to rest between the tours :) because six weeks is a long time!!!! to be on the road.
ciao!
P.S. we’ve started a website for MAX 2008 (max2008.wordpress.com) it’s mainly in Dutch (Sorry!) we’ll write down the things we’ll see and hear at MAX.
November 10th, 2008 at 8:34 pm
I’ve been looking at using Fireworks for web layouts and just bought CS4. After installing found out that Fireworks doesn’t use the monitor ICC profile in Windows to display correct colors. Strange for a graphic design tool.
Maybe you could ask the Fireworks group to have Fireworks use the monitor ICC profile to display accurate colors? Clients like to see their colors and when I use Photoshop they do…would love to do comps in fireworks if it would also.
December 2nd, 2008 at 6:26 am
There is no need for ICC in Fireworks.
Monitors are sRGB so as browsers, so there is no need to work in a different colorspace at any point in a web graphics pipeline since your output will always have the same colorspace (sRGB ~2.2 – 2.5 gamma).
ICC is only usefull when you need to mimic a different output in a display (IE: print, video, film, etc).
February 10th, 2009 at 2:40 pm
Hi
Picking up on something that was talked about on Twitter, which is the smaller size of jpegs that are sized to be uploaded to the web.
I use ‘Save for Web and Devices’ in CS3, or if I want to do a batch, then I save edits as full size jpegs, import into Lightroom and export.
Either way, when I make images for uploading, there is of course a lower limit to the percentage quality beyond which I cannot go without artefacts showing.
So can FW do a better job – allow me to make smaller KB jpegs for the same quality…. etc. ?
thanks
February 10th, 2009 at 3:02 pm
David,
Yes – Fireworks will consistently make a smaller JPG using the same optimization settings. There are a couple of reasons for this, but one major one is the lack of a lot of meta-data that Photoshop puts in the file. For certain purposes, you may need the metadata – however, for the majority of users and uses, the smaller file size is desired.
In general, you will see about a 40% difference in file size between FW and PS.
February 10th, 2009 at 3:43 pm
Greg,
Thanks for that.
What is the comparison if the ‘minimize metadata’ box is checked in Lightroom?
March 5th, 2009 at 10:08 am
[...] it out: http://blog.assortedgarbage.com/?p=127 No [...]
March 5th, 2009 at 11:21 am
Well…
Flattening psd files in order to re-open them in Fireworks ?
I don’t see your point. Since you can copy / paste directly from PS to Dreamweaver… Sorry guys but i really don’t see any interest in using Fireworks.
And about color management… Yes Windows monitor are in sRGB but not Mac’s. And what about if you are using a file created for print? Opening them in a software that don’t understand color management it will be a mess.
March 10th, 2009 at 8:25 am
@Vincent
If you are using the copy/paste from Photoshop to Dreamweaver, then you ARE actually using Fireworks. The optimization panel in Dreamweaver uses the optimization engine of Fireworks. My point is that there are a lot of things that you can do in Fireworks, specifically in the prototyping area that Photoshop can’t do – or other things that are simply more tedious in Photoshop, such as slicing and exporting.
In terms of color management, that doesn’t really exist on the web, and therefore is really out of the realm of this discussion. As for print, you are absolutely correct, I would not open a file in Fireworks if it were headed for print – but, since I can save a PSD file from Fireworks, I could use Fireworks to do things that Photoshop has difficulty with (ever try to make text flow around an image in Photoshop? It can be done, but is a multistep, very involved process that most users can’t do… In Fireworks, it’s a single command).
August 21st, 2009 at 11:54 am
I would much appreciate some help with tipsin getting colors to be consistent from Photoshop to Fireworks.
I find that the colors in my files come out washed out. Why is that?
I could just adjust the layers all over again, but there’s got to be an easier way.
I remember in Image Ready (remember that program?) there used to be a quick way you could select the color profile so that colors would match.
Thanks in advance,