REDLINE MAGAZINE | Fireworks トリミング画像を一括書出 CS4編

Fireworks トリミング画像を一括書出 CS4編

バシャログ。さんのFireworksネタが大好きでいつも拝見して勉強させて頂いてます。先日こんなエントリがあったので、自分でも試してみました。サムネイル用等に複数の画像ファイルをFireworksでトリミングする際、効率よく楽にファイル書き出しする方法のお話。

【Fireworks】トリミングした画像をたくさん書き出したいときに思い出してください | バシャログ。
【Fireworks】トリミングした画像をたくさん書き出したいときに思い出してください2 | バシャログ。

バシャログ。さんではバージョンがCS3っぽいのですが、じぶんは今CS4を利用してるので、そのバージョンでのお話。

新規作成～カンバスサイズの設定～画像の読み込み

上記記事同様、複数の画像ファイルを一気に1つのFWページ内で編集するという前提で、まず「ファイル」>「新規作成」でトリミングしたいサイズにカンバスサイズを設定して新しいドキュメントを作る。

新規ドキュメント内に使いたい画像ファイルを一気に全部読み込んで配置。

もしでっかいサイズの画像をある程度縮小してからトリミングしなきゃなんない時は一旦その元サイズで全部読み込んでからプロパティパネルの「画像サイズ」で一気に適当な大きさに縮小しちゃえば早いかなと。

レイヤーをステートに配分

CS3以前は「フレーム」と呼ばれていたものはCS4では「ステート」という名称に変わっている模様。アニメーションGIFを作る機会も少ないので個人的には馴染みは薄めなのですが･･･。

先ほど読み込んだファイルはそれぞれ1つずつレイヤーに分かれているので、レイヤーパネルで全部選択。

レイヤーを全て選択した状態のまま、今度はステートパネルへ移動。今はステートは1しかない状態のはずなので、ステート1を右クリック -> 「ステートに配分」をクリック。

これで各画像ファイルがそれぞれ1つずつステートに分かれた状態となる。

先ほど読み込んだ画像の個数分ステートが現れてるのが確認できる。

トリミング位置あわせ

各ステートを確認してトリミングする位置を確認。まぁ全部そのままでいいわって場合はそのままでオッケー。その他シャープかけておきたいとか、ちょこちょこ手を入れたい時はこの段階でお手入れを。

スライス～書き出し

普通にスライスを追加して最適化。スライス名はつけてもつけなくてもどっちでもいいと思う。

「ファイル」>「書き出し」をクリック。ファイル名は何か適当に。(スライス名を付けてたらそれが表示されてるはず)今回はsampleとしました。書き出しの選択で「ステートからファイルへ」を選択し、「保存」。

そうすると「sample_s01.jpg」「sample_s02.jpg」のような形で連番が付いたファイルが書き出しされる。

特に何も書き出し時のファイル名の設定をした記憶はないんだけれども、なんか最初からこういう名前で書き出しされた。パシャログ。さんでは命名規則をちゃんと設定してたんだけどな･･･。（もしかしたら自分で昔設定をいじったのかもしれないけど）一応「ファイル」>「HTMLの設定」内の「ドキュメントの詳細」も確認してみました。

めっちゃシンプル。ここまで何の設定もされてないと多分過去に自分でいじってプレーンな状態にしたんだろうなっていう気がしてきました･･･。この設定はあまり使ったことがなくてよく分からないんですが、一気にhtmlや画像書き出す際のオプションか何かだったと思う。

書き出す時のファイル名の何かをいろいろ選べる模様。まぁなんせ私のように全部「なし」になってる状態で一気にステート全部書き出すと、書き出し名＋「 _ 」＋0付き連番という名前になるらしいです。

書き出したファイルの名前を変更

で、普通にアンダースコアの次は0付き連番でいいのに勝手に「s」ってついてますね。なんのsでしょう･･･。ステートのs？スライスのs？よく分かりませんが邪魔なのでこれらのファイルの名前もFireworksで一気に変更します。

「ファイル」>「バッチ処理」をクリック。すると処理するファイルを選択する画面になるので名前を変更したいファイルを全部選択して「次へ」をクリック。（ここでファイルの選択をスルーしても後でまた出てくる）

バッチ処理のバッチオプションの「名前を変更」を追加。下の「名前を変更」の部分で「置換」「空白を次と置換」「接頭辞を追加」「接尾辞を追加」と4つ並んでいるんですが、今回は「置換」を選択。置換前の文字列に「_s」、置換テキストに「_」を入れました。そして「次へ」

次にリネームした画像をどこに保存するかの選択。オリジナルと同じ場所か、もしくは任意の場所か選択して「バッチ」をクリック。また「スクリプトを保存」をクリックすると、今回のこのバッチ処理の内容をファイルに保存しておける。

バッチ処理の最初で処理するファイルの選択をスルーした場合は次にどれを処理するんだ？と聞かれるので、該当するファイルを全部選択した状態で「完了」をクリック。「バッチ処理が正常に完了しました」とか処理されたファイル数が表示されれば無事完了。

処理されたファイルを確認してみると、先ほど書き出した「sample_s01.jpg」が「sample_01.jpg」のようにリネームされているのが確認できる。

ちなみにさっき途中でスクリプトの保存をした場合は、その際出来たファイルをダブルクリックするといきなり処理するファイルの選択画面が出てくる。何回かに分けて上記の作業を繰り返す時は保存しておくと便利なのかも。

そういうわけで。

Fireworksでもこんな簡単にこういうコトができたんだーと感動して嬉しかったわけですが、実のところ、トリミングが必要ないケースでのサムネイル化やリネームはフリーソフトを使ってました。

HTMLThumb

サムネイル化にはコレ使ってました。が、しかし作者さんのサイトが！Not Found状態になってるではないですか･･･。ガーン。

Vector：HTMLThumb

jpegしか対応してないそうなんですが、トリミングの必要なくそのまま縮小だけしたいって場合は便利。ただ、一気にガシっと縮小したいのに100ファイル中、数枚だけ縦長のファイルがあるって場合はそいつだけおかしいことになるので別途対応は必要。

まるたけ

リネームはコレが一番お気に入りです。かゆい所にもバシバシ手が届く感じです。なんとも味のあるアイコンがたまりません。

Vector：まるたけ

ということで、超久々の更新はFireworksネタでした。ちゃんちゃん。

そうそう、まったく話は変わるんですが、ロリポップのサーバーが、6月29日より値段はそのままで、今まで200MBだった容量が1GBになるそうでヽ(´ー｀)ノ
ずっとここの容量については気にはなっていたのでこれで一安心です。

2009年06月25日 21:15 | Red | パーマリンク