TIPS 06：【Photoshop】ツールの認証を自動化しよう

記事の目次

はじめに
Step 01：自作エクステンションを配布するには
Step 02：認証作業を自動化しよう
まとめ：Photoshopツールの有用性について
次回は......Pythonを使ってPhotoshopのツールを作ってみる！
Profile.

クリーク･アンド･リバー社の社内CGスタジオであり、ゲームの3DCGグラフィックス制作を中心に手がけているCOYOTE 3DCG STUDIO。本連載では、同社のTAチームによる制作に役立つ技術TIPSを紹介していく。

TEXT＿中林伸和 / Nobukazu Nakabayashi（COYOTE 3DCG STUDIO）
EDIT＿小村仁美 / Hitomi Komura（CGWORLD）

はじめに

戦国三英傑の徳川家康の好きなところは戦の終わった後の世界を維持する方法を考えたところです。現在の維持だけでなく、未来を見据えて行動をできる姿はTAとして見習いたいです。こんにちは、COYOTE 3DCG STUDIO テクニカルアーティスト（以下、TA）戦国大好き人間の中林です。

当社ブログにも掲載したPhotoshop内製ツール紹介『CRPS_指定ファイル保存』の制作を例として、Photoshopのツール制作に関するTipsを3回に分けてお届けしています。今回はその最終回、第3回です。

1：オープンソースエディタBracketsを使ってHTMLでUI作成（第4回）
2：スクリプトで処理の内容を作ろう（第5回）
3：ツールの認証を自動化しよう（今回）

制作事例として紹介するツール「CRPS_指定ファイル保存」は、「複製→レイヤーを統合→画像解像度の変更→フォルダ選択→保存→複製削除」を1クリックで行うというシンプルなものです。

◀「CRPS_指定ファイル保存」UI

前回までで外側のUI、中身の処理とツールとしての体裁は整いましたので、今回はツールを社外でも使ってもらうための配布方法について説明していきたいと思います。

Step 01：自作エクステンションを配布するには

前回の記事では、自作したエクステンションをデバッグモードで起ち上げていました。環境変数を変えてデバッグモードでリリースするのは、個人のPCや社内などの限定された環境下なら使用範囲を把握できるのでぎりぎりセーフだと思います。

しかし、エクステンションによっては協力会社のPCで使いたいという要望もあります。さすがに社外のPCを勝手にデバッグモードに変更するのはアウトです。そもそもツールのリリース方法として、微妙な気がします......。

そこで、デバッグモードに変更せずにリリースする方法、エクステンションのフォルダを認証付きの「.zxp形式」の圧縮ファイル（以下、zxpファイル）にして配布できる方法を紹介します。

ZXPはzipベースのパッケージ形式です。拡張機能の公開元を示すデジタル署名を付加することができます。

●ADOBE EXTENSION MANAGER ヘルプとチュートリアル（PDF）
helpx.adobe.com/jp/pdf/extension_manager_reference.pdf

1-1：証明書発行と圧縮のツールをダウンロードしよう

zxpファイルの作成には「証明書」が必要になります。証明書はAdobe公式の「CC Extensions Signing Toolkit」というツールで発行できます。以下のGitHubから最新版をダウンロードすることをオススメします。

●Adobe-CEP/CEP-Resources
github.com/Adobe-CEP/CEP-Resources/tree/master/ZXPSignCMD

ダウンロードをして解凍したフォルダで、

Windowsなら「ZXPSignCMD\4.1.103\win64」
Macなら「ZXPSignCMD\4.1.2\win64」

の中の「ZXPSignCmd.exe」がツールの本体です（※2021年4月情報）。

1-2：コマンドプロンプトで証明書発行をしよう（Windows）

Macユーザーの人ごめんなさい。筆者の環境の関係でMacの方法は検証できませんでした。ここからWindowsのみの説明になります。

Windowsでは任意のフォルダに「ZXPSignCmd.exe」を入れてコマンドプロンプトから実行します。ここでは説明用にDドライブ直下に「CoyotePhotoshop」フォルダを作っています。

●console


【ZXPSignCmd.exeのパス】 -selfSignedCert 国名 地域 組織 名前 パスワード 出力ファイルパス.p12

以下はコマンドのサンプル例です。組織と名前、パスワードは適当で構いません。

●console


D:\CoyotePhotoshop\ZXPSignCmd -selfSignedCert JP Tokyo Coyote TATeam pass D:\CoyotePhotoshop\COPSExtension.p12

成功すると上の画像のように「Self-signed certificate generated successfully」と表示され、末尾で指定したファイル名.p12の証明書データができます。

また、ツールを外部にもち出す場合には日数の制限を設けたいこともあるかもしれません。その場合は末尾に「-validityDays 日数(int)」を付けます。コマンドのサンプル例です。この場合は30日間のお試しをイメージしてます。

●console


D:\CoyotePhotoshop\ZXPSignCmd -selfSignedCert JP Tokyo Coyote TATeam pass D:
\CoyotePhotoshop\COPSExtension.p12 -validityDays 30

このコマンドの弱点は、30日間などの日数指定は楽ですが、2021年8月8日まで、といった日付指定には向かないところです。

1-3：ツールをコマンドプロンプトで「.zxp形式」に圧縮しよう

圧縮もコマンドプロンプトで行います。今回は説明しやすくするためにエクステンションのフォルダも同じフォルダにもってきていますが、フォルダパスさえ指定すれば別フォルダでも生成可能です。

●console


【ZXPSignCmd.exeのパス】 -sign 【Extensionのフォルダパス】【圧縮zxpの出力パス】
【証明書のパス】 【証明書のパスワード】

この時点ですでにわかりづらいですね。サンプルのコマンドを以下に載せておきますが、パスだらけでわかりづらいです（書いてる筆者でも毎回コマンドを確認するのが辛く感じます）。

●console


D:\CoyotePhotoshop\ZXPSignCmd -sign D:\CoyotePhotoshop\COYOTE_changePsd2Image' D:
\CoyotePhotoshop\COYOTE_changePsd2Image'.zxp D:\CoyotePhotoshop\COPSExtension.p12 pass

成功すると上の画像のように「Signed successfully」と表示されてzxpファイルが生成されます。

1-4：ExMan Command Line Toolでインストールしよう

zxpファイルをPhotoshop及びAdobe製品にインストールするには「ExMan Command Line Tool」が必要です。以下のページからダウンロードしてください。

●ExMan Command Line Tool
partners.adobe.com/exchangeprogram/creativecloud/support/exman-com-line-tool.html

Windows用のファイルを解凍すると「ExManCmd_win」フォルダの中に「ExManCmd.exe」ファイルがあります。こちらもコマンドプロンプトで実行します。

●console


【ExManCmd.exeへのパス】 /install 【zxpパス】

今回もDドライブ直下の「CoyotePhotoshop」フォルダに必要なデータを入れてコマンド例を書きます。シンプルに「ExManCmd_win」フォルダとzxpファイルのみにしています。

●console


D:\CoyotePhotoshop\ExManCmd_win\ExManCmd.exe /install D:\CoyotePhotoshop
\COYOTE_changePsd2Image'.zxp

これで、デバッグモードを使わなくてもPhotoshopにエクステンションをインストールして使うことができます。こちらはCEPフォルダは存在していませんがツールが入っています。

以上が自作したエクステンションを配布する手順です。

次ページ：
Step 02：認証作業を自動化しよう

Step 02：認証作業を自動化しよう

筆者もしばらくの間、手作業で認証付きのzxpファイルを作成したときは、毎回秘伝のマニュアルを見ながら証明書を作るか既存の証明書を使って圧縮をしていましたが、手順は複雑だし、毎回行うのは正直大変ですよね。

特に出向先にもっていく際、「何年何月何日まで使いたい」と言われると証明書から作るのに日数計算が本当に面倒でした。なので、この作業を自動化することにしました。

2-1：面倒なので認証作業を自動化しよう

以下は簡単なPythonのソース例です。筆者はMayaのMELからMayaのPythonを通してPythonを覚えたので、個人的に書きやすいPythonで作りました。ファイル名は仮に「COYOTE_makeZXP_XXXXXX.py」としています。

●python


# -*- coding: UTF-8 -*-
import os
import sys
import datetime

def main():
	_args = sys.argv # ドラッグ＆ドロップしたフォルダ名を取得
	_team = 'team' # パラメーターは後で変更しやすいように変数
	_name = 'name'
	_pass = 'pass'
	_file = 'Extension.p12'
	_date = '20' + _args[0][-10:-4] # ファイル名から日付を取得
	_now = datetime.datetime.now() # 作成日の日付を取得
	_days = 0

	# 証明書の使用期限の計算
	if _date.isdecimal():
		_days = datetime.datetime(int(_date[0:4]), int(_date[4:6]),int(_date[6:8])) - datetime.datetime(_now.year, _now.month, _now.day)
		_days = _days.days

	# 証明書の発行
	_exePath = os.path.dirname(_args[0])
	_cmd = ('{}\ZXPSignCmd -selfSignedCert JP Tokyo {} {} {} {}\{}'.format(_exePath, _team, _name, _pass, _exePath, _file,))
	if _days > 0: # 証明書の使用期限
		_cmd = ('%s -validityDays %s' % (_cmd, _days))

	os.system(_cmd)

	# 繰り返しで圧縮ファイルの作成
	del _args[0] # 最初の変数はお払い箱
	for _folder in _args:
		_expotName = _folder.split('\\')[-1]

		# ZXPSignCmdまでのパス -sign ソースフォルダのパス 出力ファイルパス.zxp 証
明書.p12 設定した証明書のパスワード
		try:
			_cmd = ('{}\ZXPSignCmd -sign {} {}\{}.zxp {}\{} {}'.format(_exePath,_folder, _exePath, _expotName, _exePath, _file, _pass,))
			os.system(_cmd)
		except:
			print('[%s] is Error' % _expotName)
		os.remove('{}\{}'.format(_exePath, _file) ) # 必要の無くなった証明書の削除
		os.system('pause')

main()

このソースを「pyinstaller」モジュールのonefileコマンドで1つの.exeファイルにまとめています。今回の主旨から外れるので詳しい説明は省きますが「pyinstaller」はPythonのソースをexeファイルにまとめられるので他ユーザーにツールを渡すときに便利です。また、今回のようにドラッグ＆ドロップで実行するexe作成に便利です。

完成した「makeZXP_XXXXXX.exe」と「ZXPSignCmd.exe」が同じフォルダ内にある状態にして、エクステンションフォルダをドラッグ＆ドロップするだけで証明書の組み込まれた.zxpファイルができます。ファイル名は末尾の「_XXXXXX」部分が重要で、ここを西暦の末尾2桁と月日に変更をしてから作成すると、その日まで有効なエクステンションとして簡単に作成できます。

証明書に関してはスクリプトで簡単に作れるので、作るたびに消すというストロングスタイルでやっています。同じことのくり返しなので自動化した結果......、実は筆者が手動でのやり方を忘れていてブログで書くために思い出すのと、手順通りにできるのか確認するのに苦労しました（汗）。そんな苦労をするのは大変なので、自動化はぜひオススメしたいですね。

2-2：インストールもバッチで自動化

単純にアーティストのインストールが楽になるので、補助的に作成しています。バッチに関しては特別なことはしていないので書くことはありませんが、同じフォルダ内にバッチファイルとExManCmd.exe、zxpファイルを入れて1行実行するだけです。

●console


%~dp0\ExManCmd_win\ExManCmd.exe /install %~dp0\COYOTE_changePsd2Image'.zxp

一応、ツールを消しやすいようにアンインストールの選択肢を入れてあります。


%~dp0\ExManCmd_win\ExManCmd.exe /remove COYOTE_changePsd2Image

個人的には、TAとしてアーティストの作業を1クリックでも減らすところにこだわりたいですね。

まとめ：Photoshopツールの有用性について

以上、3回を通してPhotoshopのツール制作のながれを説明してまいりました。この手順でPhotoshopのツールを作って他の人のマシンに配信できます。

では、そもそもPhotoshopでツールを作る必要性について考えたいのですが、ツールを作った立場からすると、大いに必要を感じています。

この記事を書くきっかけになった「CRPS_指定ファイル保存」ツールですが、これは1分強の手間を1クリック1秒にするという、一見すると地味なツールです。しかし、仮に60回別形式保存すれば1時間かかった作業が1分に短縮されます。アーティストが1つの画像を作成する上で、一体何回別形式で保存をするか考えると、どれだけ作業が短縮できるかわかるでしょう。

これはあくまで一例で、普段Photoshopを使うアーティストがアクションで解決しない単純作業で苦しんでいることはたくさんあります。

筆者はまだPhotoshopのツールに関しては未熟な部分もあります。でも、ツールを作成して周りのアーティストに使ってもらい、新たな要望をこなしつつツールもスクリプト知識も高めている途上です。

元々JavaScriptやHTMLの知識に乏しかった筆者でも、このようにPhotoshopのツールが作れたので、作ろうと思えば意外と簡単に作れるのではないでしょうか。

次回は......Pythonを使ってPhotoshopのツールを作ってみる！

さて次回ですが......
Photoshopのスクリプトの記事は全3回と予告したな......あれは嘘だ！

筆者のTAチームでメインに使っているスクリプトはPythonです。最近は社内向けPhotoshopツールにおいてPythonでの作成を試みているのですが、この試みを基に、次回はPhotoshopのツール開発の話・番外編として「PythonによるPhotoshop操作」を紹介します。

ここまでのお話は主にJSXを使ったツール開発のお話でしたが、これらを踏まえた上で次回のPythonでのツール開発と比較すると、その有効性がわかりやすいと思います。

ではまた次回。今宵はここまでに致しとうござりまする。

Profile.

中林伸和 / Nobukazu Nakabayashi（COYOTE 3DCG STUDIO）

ゲーム開発会社にてマップデザイン、レベルデザイン、エフェクト作成など様々な経験をする中でMELと出会い、DCCツール作成の面白さに目覚めてテクニカルアーティストに転身。現在は株式会社クリーク･アンド･リバー社　COYOTE 3DCG STUDIOにて、Mayaに限らずPhotoshopやMotionBulderのグラフィックソフト、Unityなどのゲームエンジンと言語にとらわれずユーザーフレンドリーのツール開発に従事