Learning by Doing: Porting “Free Stock Search” from CEP to UXP in Adobe XD

Thomas Zagler
Feb 12 · 5 min read

Our guest developer post this week is Thomas Zagler, founder and developer at pixelsucht (which means “pixel dependency” in German). In addition to working as a designer and photographer, he focuses on building plugins for Creative Cloud apps. After many years of experience with CEP panels, Thomas published his first plugin for Adobe XD based on UXP in 2019.

— Ingo Eichel, Sr Manager, Creative Cloud Ecosystem Development, EMEA

Photo of Thomas Zagler of pixelsucht
Photo of Thomas Zagler of pixelsucht
Thomas Zagler of pixelsucht

This article is intended for developers who have either built CEP panels for flagship Creative Cloud products and want to port those panels to UXP, or to those who would like to develop entirely new UXP plugins for Adobe XD. UXP is shorthand for “Unified Extensibility Platform,” the new API platform that powers plugins in Adobe XD.

I have developed a number of CEP extensions for multiple Adobe Creative Cloud apps (like Photoshop, InDesign, Illustrator, and much more). You can find my CEP panels on Adobe Exchange and on my website.

To learn UXP, I decided to port my free CEP panel Free Stock Search to Adobe XD. In this article, I want to share my experience with UXP and the Adobe XD Plugin Manager, the in-app experience that lets users discover and install XD plugins.

UXP in comparison with CEP

The biggest differences between UXP and CEP are:

Important to know

UXP is under active development and Adobe XD is the first Adobe product that allows third-party developers to work with it. In the future, UXP will also be available in other Creative Cloud products as a plugin development platform.

Porting my CEP panel to UXP

My plugin Free Stock Search allows the user to search on Unsplash, Pixabay, Pexels, Adobe Stock and Shutterstock for photos and download and open them with one click in Photoshop, InDesign, Illustrator, Premiere Pro and After Effects with the CEP version, or in Adobe XD with the new UXP version of the plugin.

With the Pro version of Free Stock Search for XD, which was released recently, users can search for free vectors or icons from Pixabay additionally or download photos, in a range of different file sizes.

On the left, the CEP panel version of Free Stock Search in Photoshop. On the right, the UXP panel in Adobe XD.
On the left, the CEP panel version of Free Stock Search in Photoshop. On the right, the UXP panel in Adobe XD.
On the left, the CEP panel version of Free Stock Search in Photoshop. On the right, the UXP panel in Adobe XD.

To get started with UXP there are a lot of useful resources:

If you are familiar with modern Javascript it’s quite easy to create your first plugin with UXP. The built-in developer console for debugging is also a big help.

Since UXP does not use a complete browser for rendering, there are advantages but also disadvantages compared to CEP:

While you have to completely define the appearance of each UI element in CEP using CSS yourself, UXP, provides predefined layouts for each UXP UI element. This makes them fit much better into the layout of the host app and also saves a lot of work.

However, one disadvantage compared to CEP is that UXP is limited in some parts (e.g. support for some Javascript events and some HTML element attributes of UI elements).

Therefore not every Javascript library can be used in UXP. Some libraries may need adjustments to work in UXP. For Free Stock Search I needed a responsive masonry grid view for the results. The library React Responsive Masonry worked without problems with UXP.

The Adobe XD Plugin Manager

The Plugin Manager in Adobe XD has proven to be a major advance over Adobe Exchange (the platform through which CEP panels can be purchased and installed).

In Adobe XD, users can discover new plugins easily and find all the information they need to install it in one click inside the app. The installation of UXP plugins works seamlessly with the Plugin Manager.

I published the plugin Free Stock Search for Adobe XD without further marketing or advertisements. The number of new users per day is many times higher than with my CEP panels on Adobe Exchange.

When users start the plugin for the first time, I ask them to activate it via email. That is how I know about download numbers and geos. Would like to see Adobe implementing such a feature natively (and at least it is on the XD Extensibility Roadmap already).

graph of user downloads
graph of user downloads

Within four months the plugin was installed by 7700 users from 37 countries. That is about 64 new users per day, without any promotion, or extra marketing.

Get started with UXP in Adobe XD

I’m glad that I built a UXP version of my plugin for Adobe XD:

1. I’ve been able to reach new audiences with my plugin, with the Plugin Manager providing great visibility for users to discover my plugin. The number of people finding my plugin grows faster and with less effort than on Adobe Exchange.

2. With the additional Pro version, I can generate some additional revenue for my company.

3. After learning UXP with this plugin, I will be able to develop other UXP plugins faster than CEP plugins. I will use my new knowledge to build on UXP when it’s available for other apps as well.

4. I like how UXP is evolving and growing. The team is open for feature requests and improvements and the developer community in the forums is helping each other.

If you’re ready to give UXP-based plugin APIs in Adobe XD a try, all of the resources to get started can be found on adobexdplatform.com.

For more stories like this, subscribe to our Creative Cloud Developer Newsletter.

Adobe Tech Blog

News, updates, and thoughts related to Adobe, developers, and technology.

Thanks to Rob Kleiman

Thomas Zagler

Written by

I am self-employed as a media designer and programmer. I have specialized in the development of extensions for Adobe Apps.

Adobe Tech Blog

News, updates, and thoughts related to Adobe, developers, and technology.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade