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
Adobeの各種アプリケーションがアップデートされました。IllustratorにもAIが搭載されて自動でベクターが作れる機能とか来ましたがここではいつも通りスルーしてUXPの話題です。Photoshop UXPの25.1の変更内容がアップされました。主にSpectrum Web Component(以下SWC)のReact対応でしょうあ。Web-Components版は既に対応していましたが今後はReactのコンポーネントも扱えます。ちなみにSWCとかWeb-ComponentsとかSpectrumUXPあたりの違いはこちらのページを参照してください。 実装してみる 公式のサンプルコードがあ
Reactで今までろくにアニメーション関係を扱ってなかったのでちょっと何かライブラリーがないか探してちょっと試すためだけに簡単なサイトをNext.jsで作ってみたという簡単な感想のような記事です。 サイトの趣旨 ただのよくある写真サイトです。東京の各場所の写真を載せたサイトです。スクロールで画像が出てきて写真をクリックするとスライドが出ててくる本当によくある感じのサイトです。 Next.jsで作っているので以下、vercelにあげています。 Tokyo Gallery Site アニメーション 今までアニメーションといったらwebアニメーションを使っていたのですがいまいちReact上だと扱いに
React関連のぼやきをTwitterで呟いたら外国のアカウントから返信が色々きて驚いた最近です。Adobe Spectrumの挙動など外国の方から教えてもらって今回その事を主に取り上げたいと思います。 まず何度も申し上げてますがUXPはブラウザーに似ているようで異なるシステムの上に成り立っています。CEPはChromeのシステムがベースになっていたのでブラウザーで動く事はおおよそその通りの仕様で動くようになっています。しかしUXPは細かい仕様が異なるのでつまづく箇所がそこそこ出てきます。そこで最近何度かつまづいた箇所を（主にSpectrum関連）をまとめておきます。 manifest5よりパ
前回の記事でNext + Vercelでサイトを作ったという記事を書きましたがちょっとあまりにも良くなかったので今回大幅に作り直しました。新しいサイトでも主にAdobeScript関係のまとまった情報を載せてゆく予定ですが単発の記事、新しい情報は今まで通りブログとTwitterで更新してゆく予定です。特に目新しいことはやってないのですがどんな風に開発したかの記事です。 ちなみに該当のサイトはこちらになります。 導入した技術 前回同様今回もTypeScript + React + Styled-componentで作成したのですがそれ以外にもコンタクトフォームの作成のためにGoogle reCA
前回の記事で取り上げましたAdobe Creative Libraries APIへのアクセスですが前回はサンプルのコードをそのまま動かしただけでした。サンプルコードではejsでHTMLの生成を行なっていましたがejs自体自分が慣れなてないのとやはりクライアントサイドはReactで構築したいということで試行錯誤してやってみました。自力でサーバーサイドレンダリングの環境を構築とかも考えたのですが色々難しそうなので結局Next.jsを使用。なお今回とりあえずAdobe Creative Libraries APIにアクセスするReactの環境を作ることが目的なのでReactやNext.jsの基本の
Electron,ExtensionとかれこれずっとReactで開発してきたのでそろそろNext.jsでサイトでも作ってみたいなと思ったところだったので簡単なサイトを作ってみました。勿論おおよそ普段のReactと同じような感じで開発できたのですが少し戸惑った部分もあったので備忘録としてまとめました。本当にメモ書き程度の内容です。サイトはこちら。 Next.jsの導入 チュートリアル的なものが書かれたサイトで他にもっと詳しいサイトがあるのでここでは簡単にしか書きません。まずはインストールです。 これだけでベースとなるパッケージがインストールされます。ただし今回これに加えてtypescriptとs
Adobe CEPとか作ってるとフォームの実装が多いと思います。テキストボックスとかラジオボックス等。自分でいろいろ実装して使いまわす事なんかも多いのでフォーム関係の実装を一つのサイト（というかGit hub）に自分用に集めました。勿論たかがCEPです。ほとんどの人が自分自身でこういったフォームを作る必要性はあまり無いとえます。top coat、Adobe spectrumもしくはデフォルトの状態でも問題無いかもしれません。それでも自分でやりたいという方にも向けてGitHub、GitHubPageでサイトを公開しました。ただ今回React+styled-componentsで構築しているので普
Photoshop UXPのドキュメントを見るとReactの名前が何度か出てきます。今後Reactを使った開発がさらにサポートされるのかもしれません。実際マルチウインドウの開発のサンプルもReactを使うことを前提のサンプルが上がっていました。というわけで今回はReactを使ってマルチウインドウを開発してみます。 開発環境 今回React,Redux,typescript,styled-componentsを使って開発します。typescriptとstyled-componentsはいつも使っているので今回も使うだけです。今回グローバル変数もパネル間で共有してみたいのでReduxを使用してパネ
基本的に一枚のパネル上でインターフェイスを構築する必要があるExtensionでは多機能なパネルを開発しようと思うと表示の切り替え機能が必要になったりそれに伴いhtmlのコード量が莫大になったりします。結局ある程度の規模のパネルを開発する場合は何らかしらのフレームワークの導入も視野に入ってくる、という事で今回はReactの環境構築をAdobeCEP上で行う場合につまづいた点を載せたいと思います。まずは最低限必要なnpmパッケージから。 React、webpack、babelの一連のパッケージになります。 Node.jsのためにexternalsをインストール async,awaitを使用するた