Photoshop 的擴展插件要用什麼開發?

Photoshop的插件或者說擴展是用什麼工具、語言開發的?
搜索了一些資料,有的說要Flash,有的說用html,感覺這方面資料好少


Photoshop 的擴展插件分 3 種,一種是

  1. 純 ExtendScript 腳本
  2. 8li 的濾鏡插件
  3. CEP 擴展

1. 純 ExtendScript 腳本
----------------------------------
ExtendScript 是 Adobe 為旗下軟體的提供的自動化腳本,它提供了 DOM 來操作軟體的各種功能,ExtendScript 可以使用 JavaScript、 AppleScript、VBScript 三種語言。其中 AppleScript 的版本功能要少一些,而 JavaScript 是最為常用的版本。
PhotoShop 的菜單里的 「文件-腳本」 就是指 ExtendScript:

通常 ExtendScript 是沒執行一些批量任務,沒有界面,不過 ExtendScript 提供了繪製界面的功能,可以代碼做界面,類似用 win32 api 畫窗口的感覺,比如 UI 設計師都熟悉的下面這個腳本工具 Corner Edit:

ExtendScript 使用 Adobe ExtendScript Toolkit 編輯和調試,由於只是腳本,如何文本編輯器都可以,不過 Adobe ExtendScript Toolkit 調試更為方便

Adobe ExtendScript Toolkit 可以在 Adobe Creative Cloud 桌面客戶端里免費下載,果不想用 Adobe Creative Cloud 下載 http://prodesigntools.com/trials3/AdobeProducts/KETK/4/win32/AdobeExtendScriptToolkit_4_LS22.exe

由於純 ExtendScript 腳本在 Photoshop 中沒有很好的入口,只能用 「文件-腳本」 打開,所以一般只用純 ExtendScript 腳本做一些簡單的工具。

Adobe 腳本資源和教程:Adobe Photoshop Scripting:http://www.adobe.com/devnet/photoshop/scripting.html
我寫個過個簡單的教程:
Adobe CEP 擴展開發教程 「 5 」 Photoshop ExtendScript 入門:http://nullice.com/archives/1822
Adobe CEP 擴展開發教程 「 6 」 Photoshop 中文腳本參考:http://nullice.com/archives/1790


2. 8li 的濾鏡插件
----------------------------------
8li 是用 Adobe Photoshop SDK 開發的插件,實際上是一種動態鏈接庫(DLL),它主要的特點是可以直接操作 Photoshop 里的像素,濾鏡都是使用用這種方法開發的。


3. CEP 擴展
----------------------------------

CEP (Common Extensibility Platform:通用擴展平台)擴展是 Adobe 各種軟體擴展的通用開發標準,現在常見的 Photoshop 擴展都是 CEP 擴展,這也是 Adobe 推薦的開發方式,不僅 GuideGuide、fonTags 這些第三方工具是 CEP 擴展,像 Adobe Color Themes 、庫、甚至「導出為」這些 Photoshop 自帶的功能都是 CEP 擴展:

CEP 擴展過去(還被稱為 CSXS 的年代)是使用 Flash 開發的,那時還有個拖控制項的開發工具 Adobe Configurator(這個功能極其簡陋,基本上就是給 ExtendScript 一個帶按鈕的界面),不過現在已經不能用了,Adobe Configurator 最後支持到 Photoshop CC,:

而後來眾所周知,Adobe 放棄了 Flash 擁抱了 HTML5 ,現在(從 Photoshop CC 2014 以後的版本)的 CEP 都是使用 HTML5 + Node.js 開發的。

簡單來說現在的 CEP 擴展就是一個本地運行的 Web 應用,面板實際就是一個網頁,使用各種網頁開發的工具開發可以了,會網頁前端的肯定會很熟悉:

另外 CEP 擴展操作 Photoshop 的方式是使用 ExtendScript ,所以還是得會 ExtendScript 。

關於 CEP 開發,可以看的是官方文檔:
CEP-6-HTML-Extension-Cookbook-for-CC-2015:
https://github.com/Adobe-CEP/CEP-Resources/wiki/CEP-6-HTML-Extension-Cookbook-for-CC-2015#development_debugging

另外我寫了一個教程,英文不是很好的可以看看來入門:
Adobe 擴展開發教程 CEP :http://nullice.com/archives/category/note/%E8%BD%AF%E4%BB%B6%E6%95%99%E7%A8%8B/adobe-cepCEP


推薦閱讀:

初創團隊的交互設計和視覺設計和前端 UI 誰來做?
如何在網頁中豎排顯示中文?
吳亦凡即將入伍h5是怎麼製作的?
Web 排版中,左對齊和兩端對齊各有什麼優缺點?不同情況下應該如何選用?

TAG:AdobePhotoshop | 前端開發 | 軟體開發 | Photoshop插件 |