振り返ったらPhotoshop UXPとNode.jsについてまとまった記事を書いていない事に気づいたので書くことにしました。まあ結論から言うとUXP上でNode.jsは使えないです。しかし下記のコードを見ると誰しもがNode.jsベースで動いたコードと思ってしまうとは思います。 requireでPhotoshopモジュールを呼び出してPhotoshop関係のメソッドを実行しています。見た目そのままNode.jsではありますがそれでは以下はどうでしょうか。 結果は以下。 pathモジュールもfsモジュールも一見使えそうではあります。そのpathモジュールのメソッド、例えばextnameやdir
Photoshop UXPが導入されて巷ではどちらかというと今までCEPやExtendScriptで出来たことが出来なくなって悲鳴の方が大きい気がします。なのでUXPで出来ない事（ダイアログを呼び出さずにファイルを指定のパスに保存、特定のファイルを開く等）をやるためにどうにかExtendScriptを実行できないかみたいな話題も出てきています。そして結論から言うと通常の機能ではできません。そして今回それを無理矢理やろうという話です。 *5月31日storageに関する記述を修正。secureStorageは今回使用する必要がありませんでした。 そもそもUXPで出来ない事とは あまり公式ドキュメ
Photoshop 2022 になってUXPに待望のsave.asメソッドが追加されました。これはPhotoshopで開いているファイルをjpe,tiffなどの決まったフォーマットで保存できるメソッドで前回までbatch playを通さないとできなかった保存処理がdocumentのオブジェクトモデルに追加されました。しかしこちらの記事でも説明した通りにstring型の保存パスをそのまま渡しただけですとエラーが返ってきます。公式ドキュメントでも触れられていますようにentryオブジェクトを渡さなければいけません。entryオブジェクトに関しては公式ドキュメントのこちらに詳細が載っています。とはい
Illustratorで画像を写真画像なりその他の素材を配置することはよくあることだと思います。そしてフォルダーを別の場所に移動させると配置した画像ががいつの間に似たような画像に置き換わったりすることも誰しもが経験することでしょう。Illustratorは配置された画像をaiファイルから見て配置データを相対パスで取得して管理しているのでしょうがこれがたまに上手くいかず同じ名前のファイルの別のディレクトリーに保存されているファイルを読み込んだりします。今回前回の保存ファイルのパスと更新日付をjsonファイルに保存して再度aiファイルを開いた時に前回更新時のデータを比較して前回の状態と新しい状態で
jsとhtmlとcssでアプリが作れるElectronによるドロップアイコンを作る、のwindows版です。アイコンにファイルをドロップしてアプリケーションにファイルの情報を渡すシステムを使用した具体的な完成されたアプリケーションはこちらの記事をご参照ください。 macの場合はwill-finish-launchingイベントとopen-fileイベントでアイコンにファイルがドラッグされるのを待ってドラッグされたらコールバックでドラッグされたファイルを受け取りました。しかしこれらのイベント、ドキュメントを見るとわかるのですがopen-fileイベントはmac OSのみでwindowsではpro
jsとhtmlとcssでアプリケーションが作れるElectronでドロップアイコンを作ってみます。Photoshopでいうドロップレット ですね。アップルスクリプトなんかでも作れるのですがそこはアップルスクリプト覚えるのめんどくさい、やりづらいという方向けにやっていきます。入門を済ませた方なんかはお分かりですがElectronはnpmでインストールするところから始めます。今回パッケージ化も行うのでそれを見越してパッケージ用のモジュール、electron-builderもインストールします。この時devDependenciesでインストールしてください。dependenciesでインストールする
Adobe scriptを書く方にとってはもはや当たり前となりつつあるJavascript。しかしAdobe周辺の作業に関わらずPC周りのあらゆる作業を自動で捌きたいと思った方も多いと思います。でも別言語はよくわからない、PowerShell?WSH?VBA何それ？Apple script?それ食えるの？という方にぴったりのネイティブアプリの開発方法、フレームワークがあります。Electronです。 Electron Electronとはhtml,cssでUI周りを作って内部の動きjsで作れるフレームワークです。つまりweb siteを作る技術でそのままアプリが作れる代物です。Adobe CE
Photoshop用フォルダー監視Extension 特定のフォルダーを監視してファイルが投げ込まれたら自動的にPhotoshop上で開いて保存したりアクションを実行するExtensionを大幅アップデートしました。元々こちらの記事で作っていたものを改良していろんな画像拡張子に対応させました。よくわかりませんが前回の記事のアクセスがいまだに多かったので更新しました。 使い方 監視するフォルダーを設定してwatchボタンを押します。監視開始後に監視フォルダーに画像ファイルが投げ込まれるとPhotoshopが自動的に画像ファイルを開きます。オプションによってはそのまま特定のフォーマットで保存できま
jsからjsxに通信する場合、jsx内でエラーが起きても具体的にどこで起きているのか分かりにくい、$.write関数（console.logのjsx版）が使えないなどかなり不便です。これをもう少しやりやすくします。とりあえずVSCodeでデバッグするためにExtendScript Debuggerを使用します。CEPの開発をしながらjsxのデバッグもしたいのでvscodeのlaunch.jsonをCEPフォルダーの直下に作ります。 launch.json CEPのフォルダーからjsx内のjsxのテストを実行できるように“program“を “${file}&
webpackについては何度か触れましたが今回もっと深く触れたいと思います。webpackの役割はいくつかのファイルに分割されたjsファイルを一つにまとめるツールです。コードが複雑化するにつれファイル、一つあたりのコードが長くなって読みづらくなったり変数の管理が大変になります。なので各モジュールに役割事にコードを分割してメインのjsファイルで読み込ませる事で読みやすく、管理のしやすいコードが実現できます。まとめるついでにjsのコードを古いECMAに変換したりsassをcssに変換してモダンなコード書きつつ古いブラウザに対応させることが可能です。ReactやVueを使用する場合もこういった変換作