Photoshopのスクリプト機能でフォルダの名づけや連番作業を省力化

Live2D制作やイラスト制作において、レイヤーの構成だとか名付けだとか、ある一定のルールに基づいて作業する、いわば作業の下準備があるかと思います。

管理するためだったり複数人でチームを組む以上、整理整頓は非常に大事だけれど毎回同じことを行うのは非常に手間出し時間がもったいない！
ということで、Photoshopの機能の一つであるスクリプト機能を使って作業の自動化を進めましょう。
簡易なものであればアクション機能で記録・再生もしっかり使えるのですが、今回はフォルダの名前をまとめて変更したり、連番をつけるスクリプトを自分用にカスタムしたので、その備忘録となります。

そもそもスクリプトとは何のことか
Photoshopスクリプトの編集にチャレンジ
1. 参考スクリプトの動作の流れ
2. 選択しているフォルダの名前を事前に指定した変更する
完成！作業に合わせてスクリプトをカスタマイズ

そもそもスクリプトとは何のことか

プログラミングです。英語の羅列です。
なので、画面を見ただけで「うっ！！」ってなる人も、英語は問題なくてもプログラミングで使う変数や繰り返しの概念に「えー……」ってなる人もいるかと思います。
プログラムを自分で組むので、正直敷居は高いかな～とは思いますが、1から組めなくても自分用カスタムできる程度に読めるととっても便利なので、気になった方はぜひ頑張ってみてください。

公式の紹介はこちら
https://helpx.adobe.com/jp/photoshop/using/scripting.html

なお、言語はこの記事ではJavaScriptを使用します。
また、動作については2025年2月末時点で自環境では動くことを確認していますが、他環境での保証はできかねます。ご注意ください。

Photoshopスクリプトの編集にチャレンジ

ここでは以下のような方（つまり自分）を想定しています。

日常的にプログラミングをやっているわけではない
当然、環境構築とかコードエディターとか言われても困る
とりあえず1クリックで今選んでいるフォルダーの名前を操作したい。
絵を描きたいのであってキーボードを打ちたいわけじゃない

ですので編集は「メモ帳」機能にコードをコピペして使用していきます。
保存時に「.jsx」の拡張子をつけることを忘れずに。

コードエディターのサポート機能がありませんから、下記に注意して進めます。

英語と数字は全部半角で書く（全角と半角は別の文字。つまり、AとＡは別扱いです）
スペースもすべて半角で書く＆不要なスペースを突っ込まない
動作テストは必ず予期しない結果になっても構わないテスト用ファイルかコピーしたファイルを使うこと
コードの末尾は半角の;で止めること
カッコは必ず閉じる

今回、カスタマイズ元として参考にしたスクリプトはこちら。
https://artawa.hatenablog.com/entry/2016/10/20/014917

ありがたいことに公開いただいているこのスクリプトを使用するのも良いのですが、私はそもそもキーの打数をとにかく減らしたいので、こちらをさらになるべくちょっとだけいじって自分用にカスタマイズしていきます。
当然ですが自己責任です。

カスタムなんかできないけど使ってみたい！方はいくつかのスクリプトをまとめている方がいるので、こちらを参考にするのも〇。
https://efficiencydesign.info/photoshop/2307/

でも結局、公開ツールって「みんなが使えるように」する関係で、「あとちょっとこうできれば……！！」から逃れられないんですよね。

参考スクリプトの動作の流れ

本当にざっくりですが下記のように動いているようです

設定を初期化する
UI画面を描画する
実行ボタンが押されたら選択内容（選択レイヤーorすべて選択、リネーム・追加・削除・連番などの指定）に合わせたプログラムが起動

上記のうち、3番目の作業を速やかに行ってほしいので、下記あたりをやります

UI画面の設定は不要
代わりにあらかじめ、リネームなのか連番をつけたいのかなどの設定を埋め込む

選択しているフォルダの名前を事前に指定した変更する

【作成例：3つある前髪パーツの名前を全て「hair_front」にして末尾に連番をつけたい】

とりあえず、カスタムしたコードをまとめておきます。

/*================================================================================
# LayerRenamer for Photoshop
# レイヤーのリネームツール
================================================================================*/

#target photoshop

//================================================================================
const SCRIPT_TITLE = "LayerRenamer";
const STATIC_TEXT_MIN_WIDTH = 60;
const EDIT_TEXT_MIN_WIDTH = 100;
const EDIT_TEXT_MIN_HEIGHT = 30;

//================================================================================
// 実行部
app.activeDocument.suspendHistory("LayerRenamer","Rename()");

//================================================================================
// 各リネーム処理の反映処理
function Rename() {
var targetLayerList = [];

// 対象レイヤーの設定
GetSelectedLayers(targetLayerList);

// リネーム方式の設定
RenameAdd(targetLayerList);

}

//================================================================================
// 追加の処理
function RenameAdd(targetList) {
var addText = "hair_front";
var num = 0;

for (var i = 0; i < targetList.length; i++) {
num++;
targetList[i].name = addText + num;
targetList[i].visible = true;
}
}

//================================================================================
// 選択レイヤーを取得
function GetSelectedLayers(targetLayerList) {
var idGrp = stringIDToTypeID( "groupLayersEvent" );
var descGrp = new ActionDescriptor();
var refGrp = new ActionReference();
refGrp.putEnumerated(charIDToTypeID( "Lyr " ),charIDToTypeID( "Ordn" ),charIDToTypeID( "Trgt" ));
descGrp.putReference(charIDToTypeID( "null" ), refGrp );
executeAction( idGrp, descGrp, DialogModes.ALL );

for (var i = 0; i < app.activeDocument.activeLayer.layers.length; i++) {
targetLayerList.push(app.activeDocument.activeLayer.layers[i])
}

Undo();
}

//================================================================================
// Undo処理
function Undo() {
executeAction(charIDToTypeID("undo"), undefined, DialogModes.NO);
}

フォルダを選択したら諸々の選択ウィンドウを飛ばしたいので、ウインドウ設定あたりは丸っと削除して、function Rename に進むように変更。

function RenameAdd　でフォルダの名前をGUIから取得していた状態なので、変数に直接、”hair_front”を指定。
連番もつけたいので変数numを作って、私の使い方だと桁合わせは必要ないので、諸々削除。
targetList[i].name の名前変更の指定に「addText + num」と変数を入れる

カスタマイズができたら、メモ帳に任意の名前.jsxの拡張子をつけて保存。
Photoshopを開いて、ファイル＞スクリプト＞参照　からさっき保存したjsxファイルを選んで読み込み。
不要な部分もあるかと思いますが、とりあえず試して動いたのでこれでOK！
フォルダが開いちゃうのはどうにかならないかな…。