前置き(Fireworks Dis)
AdobeがMacromediaを買収して早10年。AdobeがFireworksの開発を終了して早2年。IllustratorやPhotoshopにウェブデザイン関連の機能が実装されてきて、Fireworksで作業をするメリットが徐々に薄れてきた昨今ですが、未だにその人気は根強く、WEBデザイナーさんから送られてきたデザインデータが *.fw.png になってることがままあります。
正直、Fireworksはバギー過ぎてまともに動かないことが多々あるし、できることなら使いたくないし、いまだFireworksを使ってるひｔ（ｒｙ
とはいえ、*.fw.png が送られてきてしまった以上は仕方がないし、おそらくFireworksのデータを送ってくる人はPhotoshopで起こし直すなんてことしない（できない）だろうから、スライス切って書き出すにしても、この *.fw.png でどうにかしないといけないのです。
というか、中途半端にFwデータをPSDに変換されてしまうと、いろいろ面倒くさいので、 もらうときは制作データ（＋アウトライン化データ）をもらいましょう。
FireworksデータをPhotoshopデータに書き出す
Fireworksにはアリガタイことに、Photoshopデータとしての書き出し機能があります。別名保存からファイルタイプとして「Photoshop PSD(*.psd)」を選ぶだけです。これでとりあえずはPSDデータとして書き出してくれるので、あとはPhotoshopで頑張ることができます。
PSD書き出しの問題点
ただ、このまま保存してしまうと、いくつか問題が生じてしまいます。
具体的には、
- 「グループ」がラスタライズされたレイヤーとして書きだされてしまう
- 境界線が消える
という特徴があります。
なかでも「境界線が消える」という問題は、見た目のデザインが変わってしまうため、どう考えても適切ではありません。レイヤー構造もあまり変わっては欲しくないけど、最低限、見た目は保持してもらえないと、WEBデザイナーさんに作ってもらった意味がなくなってしまうので、オプションをいじって、見た目が保持されるようにしましょう。
PSD書き出しオプション
ファイル形式を選ぶプルダウンの横に「オプション…」というボタンがあるので、それをクリックして、 質素なダイアログを開きます。
通常は画像のように「設定：外観よりも編集性を保持」が選ばれています。このままだと、いろいろPhotoshopから編集ができる（パスデータやテキストデータなどが編集可能なまま変換される）一方、「境界線が消える」という問題が生じてしまいます。
そこで、このプルダウンを変更して、 「設定：Fireworksの外観を保持」にしてください。こうすることで レイヤーは分かれたまま、完全に見た目を保持してくれます。一方で、パスデータやテキストデータをラスタライズしてしまうので、後からの編集ができません。要注意。
各設定項目の役割については、下記にざっくりまとめときます。
テキストだけは編集可能にしたいなー
FireworksのPSD書き出し機能はトテモスバラシイので、そのような設定も可能です。設定プルダウンを「カスタム」に変更すると、その下にある4つの項目が自分で選べるようになります。この中で、編集可能なままにしたいものは「編集性を保持」にして、見た目が重要なところは「外観を保持/ エフェクトのレンダリング」を選びましょう。
設定まとめ
| 設定名 | 詳細設定 |
|---|---|
| 外観よりも編集性を保持 | オブジェクト：Photoshopレイヤーに変換 / エフェクト：編集性を保持 / ベクトル：編集性を保持 / テキスト：編集性を保持 |
| Fireworksの外観を保持 | オブジェクト：Photoshopレイヤーに変換 / エフェクト：エフェクトのレンダリング / ベクトル：外観を保持 / テキスト：外観を保持 |
| Photoshopのファイルサイズを小さくする | オブジェクト：Fireworksレイヤーを統合 |
オブジェクト
| 詳細設定名 | 効果 |
|---|---|
| Photoshopレイヤーに変換 | 各レイヤーをPhotoshop用のレイヤーに変換する。ただし、Fw内でグループになっているものはラスタライズされ、1つのレイヤーとなってしまう。 |
| Firewroksレイヤーを統合 | 全レイヤーを1つのPhotoshopレイヤーに統合する。そのため、その他のプルダウンが設定できなくなる。PSD変換として取り扱う意味あるのか？ |
エフェクト
| 詳細設定名 | 効果 |
|---|---|
| 編集性を保持 | 「光彩」や「カラーオーバーレイ」などのフィルターが、Photoshopの効果として残したまま保持される。Photoshopから 編集が可能だが、効果のアルゴリズムが違うと 見た目に差異が出る。 |
| エフェクトのレンダリング | 「光彩」や「カラーオーバーレイ」などのフィルターが、レイヤーにラスタライズされる。ビットマップデータになるので、 見た目は維持されるが、 編集ができない。 |
ベクトル
| 詳細設定名 | 効果 |
|---|---|
| 編集性を保持 | パスデータがシェイプレイヤーとして書き出される。Photoshopの方から 編集が可能。 |
| 外観を保持 | パスデータがラスタライズされ、ビットマップレイヤーとして書き出される。 パスデータとして編集することはできない。 |
テキスト
| 詳細設定名 | 効果 |
|---|---|
| 編集性を保持 | テキストがテキストレイヤーとして書き出される。Photoshopで 編集が可能。 |
| 外観を保持 | テキストがラスタライズされ、ビットマップレイヤーとして書き出される。 テキストとして編集はできない。 |
「グループがラスタライズされる」問題は？
グループ解除してから変換しましょう。コレ以外にない。