Photoshopアーカイブ

普段の作業を手抜き楽にするためにPhotoshopを自動化させてみる。CS3でやるよ。

単純な作業を自動化するのって「アクション」を使うことが多いけど、ほんとに決まったことしかできないです。条件に合わせたいくつかのアクションを考えるよりも「スクリプト」機能を使った方がいろいろできるようです。

Photoshopで使用できるスクリプトにはVBScript、AppleScript、JavaScriptがあります。VBScriptはWindows、AppleScriptはMacでしか動きません。JavaScriptだと両方使えるのでJSで組んでいくことにします。もちろんそれぞれにできることが少し違ったりするんですが、Photoshop上で動かすぶんにはJSで十分です。

テキストを外部ファイルから読み出してメニューを動的に生成してみる

とにかく作ってみる。上のようなPSDを用意します。テキストレイヤーを作って位置を合わせます。レイヤー名を「default」とつけて、非表示にしておきます。この「default」レイヤーを複製→外部ファイルからテキスト１行づつ処理→読み込んだテキストを内容とファイルネームに分解、内容をレイヤーに反映→web用のGIFをファイルネームで保存。複製したレイヤーを非表示→次を処理。というのが一連の作業となります。

// web用に保存（GIF）の設定
webOpt = new ExportOptionsSaveForWeb(); // 保存Objectを作成
webOpt.format = SaveDocumentType.COMPUSERVEGIF; // GIF
webOpt.colorReduction = ColorReductionType.ADAPTIVE; // パレット
webOpt.colors = 128; // 色数
webOpt.dither = Dither.DIFFUSION; // ディザーの種類
webOpt.ditherAmount = 100; // ディザーの割合


// テキストファイルを読む
folderObj = Folder.selectDialog("フォルダを選択してください"); // フォルダを選択するダイヤログを出す
fileList = folderObj.getFiles("*.txt"); // フォルダ内をなめてtxtをフィルタリング
fileObj = new File(fileList[0]); // 外部ファイルを読む
flag = fileObj.open("r");

// メインここから
if (flag == true)
{
 while (!fileObj.eof) {
  text = fileObj.readln(); // テキストを１行読む
  values = text.toString().split(","); // カンマでsplit→配列
  newLayObj = activeDocument.artLayers["default"].duplicate(); // PSDの"default"という名前のレイヤーを複製
  newLayObj.textItem.contents = values[0]; // テキストレイヤーにテキストを反映
  newLayObj.name = values[0]; // レイヤー名を反映
  
  outputFile = new File(folderObj + "/" + values[1] + ".gif"); // ファイル名を生成
  app.activeDocument.exportDocument(outputFile, ExportType.SAVEFORWEB, webOpt); // web用に出力
  
  newLayObj.visible = false; // 複製したレイヤーを非表示
 }
}else{
 alert("ファイルが開けませんでした");
}

適当な場所に保存。拡張子は.jsx

読み込む外部ファイル（CSV）を用意します。

会社情報,menu_company
事業案内,menu_business
製品案内,menu_product
お問合せ,menu_contact
サイトマップ,menu_sitemap

適当な場所に保存。txtでいいです。
title.psdを開いたままにして
ファイル ＞＞ スクリプト ＞＞ 参照...
からスクリプトのファイルを選らんで実行。
読み込んだ外部ファイルと同じフォルダに、GIFファイルが生成されているはずです。

ソース一式も置いておきますね。
→AdobeScript01.zip

リファレンスはローカルのアプリケーションフォルダの中にPDFがあります
・Adobe\Adobe Photoshop CS3\Photoshop CS3 Scripting Guide-J.pdf
・Adobe\Adobe Photoshop CS3\Photoshop CS3 JavaScript Ref.pdf

サンプルはOpenSpaceさんの「Adobe Photoshop CS3自動化作戦 」に大量にありますんで。この辺のを読めばさくっとできるはず。

参考資料：

• OpenSpace - Adobe Photoshop CS3自動化作戦