最近Adobeが押しまくりのExpressです。メルマガでも最近Express Expressとノリノリ(死語)なアプリケーションです。それでそもそもExpressってなんぞやという方も多いでしょう。 Expressとは？ Adobe ExpressとはFigmaみたいに基本ブラウザで動くアプリケーションで用途としてはブログ、SNS用の画像やビデオなんかを難しい知識がなくても用意されたテンプレートや簡単な機能を使って作れるというアプリケーションです。ライバルのアプリケーションはCanvaがそれにあたるのではないでしょうか。 Add-ons ここからが本題ですがAdd-onsとはAdobe Ex
ExtendScript用のXML解読アプリケーション作りました。ExtendScriptではExtendScript Toolkitに用付属しているXMLにExtendScriptのオブジェクトモデルが書いてあります。 場所はMacなら /Library/Application Support/Adobe/Scripting Dictionaries CC WinならC:\Program Files (x86)\Common Files\Adobe\Scripting Dictionaries CC 尚PremiereだけC:\Users\username\AppData\Roaming\A
インストールが複雑怪奇だったUXP SWCでしたが簡単にインストールできるパッケージが公開されました。UXP SWCですが一からインストールする場合、詳細について知りたい場合はこちらの記事を参照してください。パッケージのインストールからwebpackの設定まで一通り完成した状態でインストールできるの簡単に導入できます。Vanilla.JSとReactに対応したものが二種類公開されています。 ちなみにパッケージのURLは以下になります。InDesignもPhotoshopも対応しています。XD…? create-swc-uxp-app create-swc-uxp-react-app
Spectrum Web Component(以下SWC)が2024のPhotoshopよりベータ版の実装から正式な実装になりました。従来のSpectrum UXPより充実したコンポーネントのパーツが使えるようになります。尚SWC,Spectrum UXPといったこの辺の基本は過去の記事、Photoshop 24.5ベータ UXP 7.0追加APIをご覧ください。使用にあたってwebpackとyarnを使いますがある程度事前の知識が求められるのは覚悟してください。実装にあたっては公式のドキュメントと
前回の記事でNext + Vercelでサイトを作ったという記事を書きましたがちょっとあまりにも良くなかったので今回大幅に作り直しました。新しいサイトでも主にAdobeScript関係のまとまった情報を載せてゆく予定ですが単発の記事、新しい情報は今まで通りブログとTwitterで更新してゆく予定です。特に目新しいことはやってないのですがどんな風に開発したかの記事です。 ちなみに該当のサイトはこちらになります。 導入した技術 前回同様今回もTypeScript + React + Styled-componentで作成したのですがそれ以外にもコンタクトフォームの作成のためにGoogle reCA
振り返ったらPhotoshop UXPとNode.jsについてまとまった記事を書いていない事に気づいたので書くことにしました。まあ結論から言うとUXP上でNode.jsは使えないです。しかし下記のコードを見ると誰しもがNode.jsベースで動いたコードと思ってしまうとは思います。 requireでPhotoshopモジュールを呼び出してPhotoshop関係のメソッドを実行しています。見た目そのままNode.jsではありますがそれでは以下はどうでしょうか。 結果は以下。 pathモジュールもfsモジュールも一見使えそうではあります。そのpathモジュールのメソッド、例えばextnameやdir
*2022年 1月 11日developer consoleのredirect URIフォームでエラーが出た場合の対処方法を追記 Adobeのソフトウェアにクラウドの環境が用意されてから既に結構時間も経ちました。ドキュメントを保存する時もローカルかクラウドか求められて段々Adobeも押してる感があります。実はExtendScriptでもいつの間にかクラウド関係のプロパティーがドキュメントオブジェクトに追加されていたりします。以下Illustratorの例です。 一応クラウド上のパスも取得できるのですがサーバーに実際にアクセスできる訳ではないようです。Creative Cloud Librari
PhotoshopやIllustratorで特定のファイルやフォルダーが更新、追加されたら自動的に書き出し等を行うExtensionを開発します。Adobeのソフトを通じて何かのファイルをPDFやjpgを書き出すといった作業がいろんな分野で多いと思ってファイルの監視を発火イベントとして使用したいと思ったのが始まりです。 まずは手始めとしてPhotoshopによる自動jpeg書き出し機能を開発したいと思います。仕様としては。 最初に監視対象のフォルダーを選ぶ ボタンを押して監視をスタートさせる psd、tiffファイルが追加されたらPhotoshopで自動的にjpegに書き出す。 Nodeではデ
Extensionのパネル自体クロームベースであるためブラウザ同様Imageオブジェクトから画像サイズを取得できる事は前回述べたができる事がかなり限られてしまう。しかしCEP側からはNode.jsモジュールが使用できるので何かしらモジュールを使用すればパネル上で画像データの取得ができる。という事今回はNodeモジュールの使用方法も含めて画像データを取得方法を記載する。まずこちらで画像サイズを取得するimage-sizeというモジュールが公開されている。PSDも含めた幅広い拡張子に対応しているそうなので今回はこれを使ってみよう。 というわけでまずはpackage.jsonの作成。
今回はトランスパイルやら何やらの環境構築をしたいと思います。前述の通りCC2017ですらECMA2015もまともに動かないのでAdd on等で公開する事を前提に開発する私としてはトランスパイル自体必須の作業です。 ここの階層にmoduleなんかを設置していきます。というわけでまずはpackage.jsonを作成 トランスパイラですが私はいつもwebpackで環境構築しています。babelのついでにCSS向けのベンダープレフィックス対策やsassの使用環境構築なんかもしてゆきます。このあたりの環境構築に関しましてはicsさんの記事を参考にしました。 babelのインストール。 sass load