aescripts UXP Framework

UXP
Adobe Creative CloudPhotoshopInDesign

Background

One of the top plugin platforms for After Effects and tons of other apps, aescripts + aeplugins, was looking to make their licensing framework compatible with the all new UXP standard for Adobe plugins.

As longtime friends of the aescripts team, having launched several of our tools on their platform since 2018, they reached out to us to start planning the development for their new UXP framework.

The Challenge

Their proprietary licensing framework had implementations for Adobe Scripts, CEP Extensions, and C++ Plugins, however with the rise of UXP Plugins in Adobe apps, starting with Photoshop and InDesign, they now needed to port their system to UXP.

UXP Support

This migration came with a host of challenges and limitations as UXP does not come built-in with a Node.js backend, CLI external binary access, or full CSS support the way that CEP Extensions did, but we were up for the challenge to find a solutions for these to make a successful UXP migration.

Open Source Collaboration

We have maintained the leading open source framework for Adobe CEP Extension development for years, Bolt CEP, but with Adobe's gradual migration from CEP to UXP, we have had a UXP equivalent project on our roadmap for some time.

Bolt UXP Backed

This project was a perfect opportunity to both fund our open source project Bolt UXP and accomplish construction of the aescripts UXP framework at the same time.

When we pitched this to aescripts, they loved the idea of their framework funding Bolt UXP and being built on Bolt's solid foundation.

This would both fast-track Bolt UXP development for the whole community to start using, and provide a solid ongoing foundation for the aescripts framework that could reap the benefits of an open source active development in years to come.

The Solution

The first step would be to build, debug, and finalize an initial release for the open source framework Bolt UXP.

Once Bolt UXP was solid and working well, we would move onto constructing the aescripts UXP framework as a wrapper around Bolt UXP.

aescripts wrapper for Bolt UXP

Step 1: Building Bolt UXP

First up we got to work constructing Bolt UXP from the ground up. We took as many principles and features as possible from what developers loved about Bolt CEP, and created equivalents in Bolt UXP that fit this new format.

Just like Bolt CEP, users could start a new project in React, Svelte, or Vue, and customize core configuration settings like apps supported, unique id, and panel name, and more.

UXP Plugins also have a unique ability to access C++ functions, referred to as a UXP Hybrid Plugin. As this would be a requirement for the aescripts licensing framework to function, we added MacOS and Windows templates for developing, building, signing and notarizing these hybrid binaries to work in a UXP plugin.

While there were several pros and cons to UXP compared to CEP in general, we worked to streamline all points possible in the development cycle including project creation, configuration, debugging, and delivering.

Write Scripts

Once Bolt UXP was built and tested, we added hooks for the framework to be extended by other frameworks like what we would build next for aescripts.

Step 2: The aescripts UXP Framework

Now that Bolt UXP was solid, we began work on the aescripts UXP framework. This framework would contain a wrapper for the create script, build script, and a settings window for users to navigate to and license their tools purchased on aescripts.com.

The CLI Wrapper

Once we were done building the wrapper around the create and build scripts, a developer could easily create a new UXP Plugin with the aescripts licensing framework from the command line in seconds.

Write Scripts

The UI

We rebuilt the previous settings window UI from the CEP Framework to be compatible with UXP. This task was more challenging than it appears since UXP only supports a small subset of the CSS Styling syntax, require lots of creative problem solving to get elements to appear the way we wanted them to, but for each problem we found a solution.

aescripts UI

The C++ Hybrid Plugin

Additionally, with Bolt UXP providing support for UXP C++ Hybrid Plugins, we were able to embed the existing proprietary aescripts licensing system into a UXP panel.

Vite plugin

Finally at build time, the aescripts Vite plugin would make various required changes for everything to publish smoothly to CCX for distribution.

The Result

The result was a massive win for both aescripts and the Adobe developer community in general.

aescripts now had their existing licensing framework integrated into the UXP ecosystem, so any new developer wanting to build a tool on aescripts platform could quickly and easily start the development process with their licensing system.

At the same time, we released Bolt UXP to the public, an open-source and 100% free framework to start building UXP plugins, with aescripts as a founding backer. And as we update and make Bolt UXP better in the future, all of these new features and enhancements will continually make their way into the aescripts UXP framework.

If you’re interested in starting a new UXP plugin with Bolt UXP, check out our product page here:

Check out aescripts post on Bolt UXP! And of course, be sure to check out their massive library of time-saving plugins:

Lloyd Alvarez - aescripts + aeplugins
Lloyd Alvarez
aescripts + aeplugins
starstarstarstarstar

Highly recommend Hyper Brew! Extremely professional and knowledgeable.

Working with them on projects is always very smooth.