• WEB

JavaScriptでPhotoshopを自動化してみよう!基礎編②

  • めい
    めい レタッチちーむ
  • このエントリーをはてなブックマークに追加
JavaScriptでPhotoshopを自動化してみよう!基礎編②

こんにちは、レタッチチームのめいです。

だいぶ間が空いてしまいましたが……
今回は前回の記事の続きで、JavaScriptによるPhotoshopの自動化についてご紹介したいと思います。

↓前回の記事はこちら!↓

JavaScriptでPhotoshopを自動化してみよう!基礎編①

こんな記事書いたなあ…と懐かしい気持ちに浸りつつ、今回は前置きトークをする余裕がなさそうなので、さっそく作業に移ります!

超簡単!「jsxファイル」を自力で作ってみよう!

前回はサンプルの「jsxファイル」を実行してみましたが、今回はその「jsxファイル」を一から作成する方法をご紹介いたします。
プログラムに知識は一切いりませんので、お気軽に試していただけたらと思います~♪

※筆者は執筆当時CS5.5を使用しています。

「ScriptListener.8li」の設定方法

まずは今回の作業の肝である「ScriptListener.8li」を設定しましょう。

Photosopには実行した動作をJavaScriptとして書き出してくれるありがた~~いツールが用意されています。

しかしデフォルトではオフの状態になっているので、オンに設定します。
設定方法は簡単です!

Scripting\Utilitiesにある「ScriptListener.8li」をコピーして、
(..Adobe\Adobe Photoshop CS5 (64 Bit)\Scripting\Utilities\ScriptListener.8li)

Plug-ins\Automateにペーストするだけ。
(..Adobe\Adobe Photoshop CS5 (64 Bit)\Plug-ins\Automate)

「ScriptListener.8li」をコピペ

なんとたったの2ステップ!
Photosopを起動し、適当に新規ファイルを作成してみて下さい。
(Photosopを既に起動済みの場合は、再起動して下さい。)

新規ファイルを作成した後、デスクトップに2つのログファイルが生成されたと思います。
今回使用するのはJavaScriptなので、「ScriptingListenerJS.log」のログを開いてみて下さい。

「ScriptingListenerJS.log」

なにやら解読困難な文字列が…
これは「新規ファイルを作成する」という内容のJavaScriptです。

このように、「ScriptListener.8li」をオンにすると、Photoshopで行った動作がJavaScriptとして書き出されます。
なんてプログラム音痴に優しいツールなんだ…!(キラキラ)

各作業工程は「//」で区切られています。
JavaScriptで「//」はコメントアウトの記述ですので、「//」の横に作業内容をメモしておくと便利です。

例:「//新規ファイル作成」
コメントアウトに作業メモ

ログはPhotoshopを操作する度に追加されていくので、新規メモを作成し、そこに必要な記述だけコピペしていきましょう。

ちなみにAutomateフォルダの「ScriptListener.8li」を削除することで設定をオフにすることができます。
オンにしたままだとログが更新され続けて重くなってしまうので、記録が不要な際はオフにしておくことをオススメします。

試してガッテン!

それでは前回のテーマと同様に、「Hello, World」というテキストが配置されたファイルを自動で生成する「jsxファイル」を作ってみましょう!

※設定の作業で生成されたログファイルは、予め削除しておいて下さい。

新規ファイルを作成する

Photoshopを起動し、新規ファイルを作成します。
新規ファイルはこのように設定しました。

新規ファイルを作成

まずはここまでの作業をログからコピペし、メモを取ります。

メモ

記録させたい動作を実際にPhotoshopで再現する

Photoshopで自動化させる動作を実際に再現します。
ここでもひとつひとつの動作毎にメモを取ることを忘れないで下さい。

①「Hello,world」というフォントを配置。

フォントを配置

②フォントを任意の位置に移動。(今回は中央に移動させてみました。)

フォントを移動

ここまでで作成したメモはこんな感じになりました。
(破線内のスクリプトは長すぎる為割愛しました。)

メモその1

メモその2

メモを「jsxファイル」として保存する

最後にメモを「.jsx」の拡張子で保存して、前回と同様にPresets\Scriptsの中に配置します。
(今回はファイル名を「test2.jsx」としました。)

「jsxファイル」を配置

photoshopを再起動し、スクリプトメニューに追加された「test2」を選択してみて下さい。

「test2」を選択

自動化成功です!

「test2」を実行

まだまだ続きますよ!

いかがでしたでしょうか?
「ScriptListener.8li」を使用すれば、JavaScriptの知識がなくても簡単に「jsxファイル」が作成できますね!

次回は応用編としてもう少し複雑なスクリプトに挑戦してみたいと思います!
「jsxファイル」による自動操作が本領発揮するのはこれからなので、良かったらまた見て下さいね~☆

このエントリーをはてなブックマークに追加

めいが最近書いた記事

WRITERS POSTS もっと見る

他にもこんな記事が読まれています!

  • WEB
  • マーケティング
  • サーバー・ネットワーク
  • ライフスタイル
  • お知らせ