PSD から レイヤー情報ぶっこ抜くのにもう jsx とか使わなくて良い


こんにちわ、ユニバの MJ です。

今日は、ある案件で PSD ファイルから座標とってそれを json 形式で管理したいという課題が出た時の対処について話します。
この話って業界的には当たり前なんですかね。。。?
当たり前だったら恥ずかしい話やで〜

よくある既存の方法

photoshop では 作業効率を爆上げするスクリプトを .jsx という拡張子を使って実装する。
ただ、これを作るのはだるい。
photoshop で debug しなければいけないし、別に PSD 開きたいわけではなく、純粋にデータが欲しい。
ExtendScript Tookkit なるものがあるが、これで書く気にもならなかった。

psd.js

神ツールがあった。
psd.js

これを使えば、psd をパースして、中身を見れます。便利な関数つき。

how to use

psd.js は node module です。
次のような構成を例にしましょう。

- node_modules (`npm install psd` を実行しましょう)
- app.js
- test.psd
app.js
var path = require('path');
var PSD = require('psd');
var psd = PSD.fromFile(path.resolve(process.argv[2]));
psd.parse();

console.log(psd.tree().export());

こうしたら terminal で

node app.js test.psd

を実行します。
すると terminal では psd の情報がベローっと出ているはずです。神。

終わりに

node 経由で psd の中身が見れるなんて夢が広がりますな。