UXP プラグインは、Photoshop にパネルやメニューのコマンドを足す、今の方式の拡張機能です。
作るときは、Adobe の UXP Developer Tool(UDT)を使います。
- UDT は Creative Cloud デスクトップアプリの「Apps」から入れる
- 「Create Plugin…」でテンプレート(quick-layers-starter など)から作る。対応する版は利用するAPIとmanifestに合わせる
- Photoshopを起動し、Load & Watchで読み込む。manifestの変更後はUnloadして読み込み直す
- 配るときは Package で .ccx を作る
この記事はAdobe公式資料をもとに、UDTでテンプレートを作成して読み込む流れを説明します。2026年10月24日に、現行のUDT入門手順とManifest v5の資料を照合しました。
本記事の手順は実機で再現していません。画面名は公式資料の英語表記で、UDTの版によって配置やテンプレート名が異なります。
UDTを入れる
- Creative Cloud デスクトップアプリを開く
- 「Apps」から UXP Developer Tools を入れる
- 初めて起動すると Developer Mode を有効にするよう求められるので、「Enable」を押す(管理者の権限が要る)
UDTからDeveloper Modeを有効にできない場合は、UDTを終了して次の場所にsettings.json(中身は {“developer” : true})を作成し、UDTを起動し直します。手動設定にも管理者権限が必要です。
| OS | 場所 |
|---|---|
| Windows | %CommonProgramFiles%/Adobe/UXP/Developer |
| macOS | /Library/Application Support/Adobe/UXP/Developer |
プラグインを作る
- UDT で「Create Plugin…」を押す
- Plugin Name・Plugin Id・Plugin Version を入れる
- Host Application で Photoshop、Host Application Version を選ぶ
- Templateを選ぶ(現行のPhotoshop入門例はquick-layers-starter。汎用テンプレートにはquick-starterやreact-starterもある)
- 保存先のフォルダーを選んで作る
Photoshopを起動し、UDTが検出したHost Application Versionを確認します。以前の入門資料には23.0.0の例がありますが、すべてのプラグインに同じ最低版を設定するわけではありません。下のManifest v5の例は23.3.0を指定しています。利用するAPIに、さらに新しい版が必要なら対応する最低版を引き上げます。
manifest.json
プラグインの設定は manifest.json に書きます。
公式ドキュメントの例から設定項目を抜粋したものです。これだけではパネルは作れません。まずテンプレート一式を使い、生成されたentrypoints、HTML、JavaScriptを残したまま設定を確認してください。
{
"manifestVersion": 5,
"id": "YOUR_ID_HERE",
"name": "Name of your plugin",
"version": "1.0.0",
"main": "index.html",
"host": {
"app": "PS",
"minVersion": "23.3.0"
}
}| 項目 | 意味 |
|---|---|
| manifestVersion | 5(基本となるv5機能の要件はPhotoshop 23.3.0以降。後から追加されたAPIや権限には別の最低版がある) |
| id | プラグインの ID。外に配るときは公式に発行されたものに変える |
| host | 対応するアプリ(PS)と最低の版 |
| entrypoints | “type”: “command”(メニューのコマンド)と “type”: “panel”(パネル) |
| requiredPermissions | クリップボード・ネットワークのドメイン・ファイルなど、使う権限を宣言する |
Manifest v5では、pluginのdestroyやpanelのcreate・show・hide・destroyなどのライフサイクル処理でPromiseを扱えます。公式資料の300ミリ秒のタイムアウトはこれらのentrypointメソッドに関する説明で、プラグイン全体の処理時間を300ミリ秒に制限する意味ではありません。
読み込んで試す
Photoshopを起動した状態で、UDTにホストとして表示されることを確認します。現行の入門手順ではプラグイン行のLoad & Watchで読み込みます。旧版ではLoadとWatchが分かれています。manifest.jsonを変更した後は、自動更新だけに頼らずUnloadしてから読み込み直してください。quick-layers-starterで読み込みを確認するには、生成されたindex.htmlの見出しLayersをPhotoshop Layersへ変更して保存し、Photoshop側のパネル見出しも変わるかを確認します。変わらない場合は、保存したファイルがUDTに登録したプラグインのものか、ホストが起動中か、Load & Watchが有効かを確認してください。
| 操作 | 働き |
|---|---|
| Load / Load & Watch | 起動中のPhotoshopに読み込む。Load & Watchは変更の監視も開始する |
| Watch | HTMLやJavaScriptなどの変更を監視して再読み込みする。manifest変更はUnloadして読み込み直す |
| Reload | 読み直す |
| Debug | Chrome のデバッガーに似た画面で、止める・1行ずつ進める |
| Logs | ログを見る |
| Package | 配布用の .ccx を作る |
配る
配布の形式は .ccx で、中身は zip ですが、自分で作らず UDT の Package で作るよう案内されています。
外に配る前に、Developer Distribution portal で正式な ID を取り、manifest.json の id に入れます。Package後は、出力した.ccxを自分の環境にインストールし、パッケージ版でも動くことを確認してから配布します。Packageに失敗した場合はDetailsで原因を確認してください。この記事ではパッケージ作成・インストールの実機検証はしていません。
| 配り方 | 内容 |
|---|---|
| Creative Cloud Plugin Marketplace | Developer Distribution portal から出す |
| .ccx を直接渡す | 受け取った人がダブルクリックし、警告で「Install locally」を押す |
パネルの要らない1回きりの処理なら、プラグインではなく UXP スクリプト(.psjs)でも作れます。
スクリプトとの違いは、PhotoshopのUXPスクリプト(.psjs)の書き方で紹介しています。
まとめ
- UDT は Creative Cloud の Apps から。初回に Developer Mode を有効にする
- Create Pluginでテンプレートから作る。最低版はmanifestと使用APIの要件に合わせる
- Load & Watchで試し、Debugで調べる。manifest変更後はUnloadして読み込み直す
- 配るときは Package で .ccx。ID は公式に発行されたものにする
参考:Adobe「Set up developer tools」「Build Your First Plugin」「Manifest v5」「Packaging Your Plugin」「Distribution Options」(2026年10月24日照合)。
よくある質問:PhotoshopのUXPプラグインの作り方
UXPプラグインとは、何ですか?
Photoshopにパネルやメニューのコマンドを足す、今の方式の拡張機能です。作るときは、AdobeのUXP Developer Tool(UDT)を使います。
UDTは、どうやって入れますか?
Creative Cloudデスクトップアプリを開き、「Apps」からUXP Developer Toolsを入れます。初めて起動するとDeveloper Modeを有効にするよう求められるので、「Enable」を押します(管理者の権限が要ります)。手動設定が必要ならUDTを終了し、settings.json(中身は {“developer” : true})をWindowsなら%CommonProgramFiles%/Adobe/UXP/Developer、macOSなら/Library/Application Support/Adobe/UXP/Developerに作成して、UDTを起動し直します。
プラグインは、どう作りますか?
UDTで「Create Plugin…」を押し、Plugin Name・Plugin Id・Plugin Versionを入れます。Host ApplicationでPhotoshop、Host Application Versionを選び、Templateを選びます(現行のPhotoshop入門例はquick-layers-starter)。ホストの検出版を確認し、manifestの最低版は使用するAPIに合わせます。本記事のv5抜粋例は23.3.0です。
manifest.jsonには、何を書きますか?
記事の整理では、manifestVersionは5(基本要件はPhotoshop 23.3.0以降ですが、追加機能の最低版は個別に確認)、idはプラグインのID(外に配るときは公式に発行されたものに変える)、hostは対応するアプリ(PS)と最低の版、entrypointsは”type”: “command”(メニューのコマンド)と”type”: “panel”(パネル)、requiredPermissionsはクリップボード・ネットワークのドメイン・ファイルなど使う権限の宣言です。v5のPromise対応と300ミリ秒のタイムアウトは、panelのcreateなどのライフサイクル処理についての説明です。プラグイン全体の実行時間の上限ではありません。掲載JSONは抜粋なので、テンプレートのentrypointsやHTML、JavaScriptも必要です。
作ったプラグインは、どうやって試しますか?
Photoshopを起動してUDTで検出されることを確認し、Load & Watchで読み込みます。quick-layers-starterではindex.htmlの見出しLayersをPhotoshop Layersへ変更して保存し、パネルの見出しも変わるか確認します。manifest.jsonの変更後はUnloadして読み込み直します。旧版ではLoadとWatchが分かれています。Debugはデバッグ、Logsはログの確認、Packageは.ccxの作成に使います。
プラグインを、人に配るにはどうしますか?
配布の形式は.ccxで、中身はzipですが、自分で作らず、UDTのPackageで作るよう案内されています。外に配る前に、Developer Distribution portalで正式なIDを取り、manifest.jsonのidに入れます。配布前に、生成した.ccxを自分の環境へインストールしてパッケージ版の動作も確認します。配り方は、Creative Cloud Plugin Marketplace(Developer Distribution portalから出す)か、.ccxを直接渡す(受け取った人がダブルクリックし、警告で「Install locally」を押す)かの2通りです。
パネルが要らない1回きりの処理も、プラグインにするのですか? 記事の内容は最新ですか?
パネルの要らない1回きりの処理なら、プラグインではなく、UXPスクリプト(.psjs)でも作れます。スクリプトとの違いは、関連記事「PhotoshopのUXPスクリプト(.psjs)の書き方」で紹介されています。2026年10月24日にAdobe公式のUDT手順とManifest v5の説明を照合しましたが、実機での作成・読み込み・配布テストはしていません。画面名は公式資料の英語表記です。利用するUDTとPhotoshopの版に合わせ、公式資料を確認してください。
