Fireworks Lover Advent Calendar 2012の7日目の記事です。
スマートフォン対応の案件も増える中、少々面倒なモノの1つにRetina対応の画像準備があったりします。もちろんFireworks Loverな私ですから、FireworksでRetina対応画像の書き出しができる拡張機能を探してみるわけですが、バシャログさんの拡張機能しか見当たりませんでした。
参考：【Fireworks】Retina対応用にページを分けるFireworksコマンド | バシャログ。
こちらで十分機能は満たしているんですが、ちょっと違うアプローチで俺得拡張機能を作ってみました（半分ネタです）。
@2xで作成するのが通常だと思いますが、過去の資産を利用するにあたり、あえて拡大する方向に。ほら、Retina向けに×2倍とかで作成して、奇数ピクセルでストローク引いてるところとか、縮小したらボケちゃうじゃない？スクリプトの処理を拡大から縮小に変更するのは、まぁ比較的簡単にできるので…。あとは、書き出したあとに不要な画像の整理をしないでもいいように、接尾辞が付いているもののみRetina向けの書き出しします。
Retina画像の書き出しを補助する［Fireworks拡張機能］
できること
- 非Retinaで作成した特定の接尾辞の付いたスライスを、Retina対応（2倍の大きさ）で書き出しができます。
- 非Retinaの画像も同時に書き出しを行います。
使い方
Retinaで書き出をしたいスライスの名前に、特定の接尾辞を付けます。デフォルトは「_x2」です。
スクリプトを実行すると、接尾辞の入力を促されるので、スライスに付けた接尾辞を入力してください。
2回ほど書き出しダイアログが表示されます。1回目のダイヤログがRetina向け画像の書き出し、2回目のダイヤログが通常画像の書き出しです。それぞれ書き出しが必要なスライスを選択した状態になっていますので、適当に設定して書き出ししてください。
きちんと書き出しができました。
x
注意点
- ページを複製して拡大しているので、割と負荷が大きいと思います。
バシャログさん作のコマンドとの違い
- スライス名に接尾辞が必要。
- ページを増やさない。（処理のため一時的な複製あり）
- 画像を拡大し、Retina向けの画像を生成。
- 書き出しまでやってしまうお節介。
ちょっと詳しい動作説明
- まずは、Webレイヤーにオブジェクトがあるかどうかを判定しています。
- オブジェクトがあるようなら、現在のページを複製します。
- @1x向けの画像を書き出しし、複製したページを削除します。
- スライス名に接尾辞があれば、またページを複製します。
- ページを拡大（解像度を2倍）して、接尾辞がついたスライスを@2x向けの画像を書き出しします。
- 書き出しのダイヤログを出し、処理が終わったら複製したページを削除します。
というわけで、半分ネタ半分本気の俺得拡張機能の紹介でした。
