Celtra Ps & Ae plugins

Celtra Ps & Ae plugins

In:
7 min read
R&D of a more efficient workflow between Adobe CS and Celtra. The integration streamlined production from hours to minutes with responsive video, integrated ad format specifications, and automated hand-off.

Context

Company: Celtra
Timeframe: 2018
Role: VP of Product

Every quarter, Celtra’s team analyzed ads running on our platform and published reports. Our findings consistently revealed that:

  1. The best-performing ads are tailored for each ad format and use interactive features to engage the user in the brand narrative.
  2. Only a small segment of all ads on our platform was aligned with the creative best practices; the long tail were uninspiring animated GIFs and 30s TV ads that used our creative platform just for Ad Ops trafficking.

Meanwhile, everyone in the industry was grappling with declining campaign performance. Until the subsequent rise of social media platforms disrupted the entire digital display advertising business.

Mission

By common sense, if customers’ ads are not performing well, it’s only a matter of time before they start questioning the value of their creative platform.

If we could help them consistently deliver better ad performance by improving production quality, that wouldn’t just mitigate churn risk; it would also be a major selling point. Based on this rationale, I instigated an R&D initiative to determine

  1. Why customers aren’t putting the platform’s creative capabilities to better use despite being aware of the correlation between the quality of ads and performance.
  2. Find solutions for raising the bottom line of quality.
  3. Explore how our core product could deliver value for social media ads we were starting to support.

Contributions

I was responsible for spearheading the project from product discovery through MVP development and alpha testing.

Hands-on contributions:

  • Designed the Adobe-Celtra integration architecture in collaboration with engineering
  • Designed the UX+UI of the Photoshop plugin
  • Designed the responsive video feature behavior and specifications
  • Interviewed customers to validate emerging product concepts and recruit beta testers
  • Mapped the campaign lifecycle and creative workflows to identify production bottlenecks.

The initiative ran on a product strategy I wrote and pitched to the executive team to secure development resources.
I directed the quantitative research, brought in external partners specialized in Adobe plugins, and led efforts of a cross-functional team across design, data science, and engineering.

Results

  1. Alpha reduced production time from hours to minutes.
  2. Secured commitment from target customers before development.

Highlights

Quantitative research

We analyzed platform usage based on the following metrics to gauge customers’ workload:

  • Median number of campaigns published (per account per month);
  • Median volume of ads published (per account per month);
  • Median number of users with designer permissions (per account per month);
  • Median number of ads designed (per user per month);
  • Median production duration (from ad creation to publish date).

We found that the majority had smaller design teams but produced a competitive volume of work compared to those with bigger teams. These findings gave us confidence in our hypothesis, validated the opportunity, and identified target users.

Customer interviews

Tight deadlines. Creative is just a means to the media-buying end. The value of premium ad slots is very time-sensitive. Whatever little time is planned for ad production ends up shorter in practice due to frequent changes and ineffective coordination via spreadsheets and emails. Creative staff on the publisher side tend to be risk-averse to avoid missing deadlines and being blamed for revenue losses. Creative agencies focus on TV ads, not digital banners.

Fragmentation of ad formats. In addition to the standard IAB formats, there’s also a plethora of publisher- and market-specific ones. There are just too many specifications to memorize (dimensions, durations, encoding, max. file sizes, etc.). Finding accurate information online can be challenging, and creatives are often blocked by waiting for answers from people up the chain of command.

IAB Flexible Size Ad Specifications

Most weren’t aware of Celtra’s existing Ps plugins. Those that were complained about it imposing a workflow incompatible with theirs.

Validated demand. After the interview, we pitched them our idea for an integrated workflow from Adobe Ps and Ae to Celtra. All of them committed to participating in a beta release program on the spot. In the following weeks, our customer success team informed other clients about the project during QBRs, and we got more inbound requests for beta testing.

Product strategy

We mapped out the creative production process, approximated time spent on each stage, and explored possibilities for automating or shortening superfluous steps from the workflow.

Product strategy and add-ons integration architecture sketches

Seamless hand-off

The core of the project was to automate the handoff from Adobe Ps and Ae into Celtra. Exporting layers to files was the easy part. The real value lay in reconstructing the entire composition, which users were currently doing manually for each ad format.

User interviews also exposed several other requirements we would have to solve: support for editable text layers and web fonts, support for the @2x retina standard, advanced manual controls, and exporting the same layer only once for all formats in the highest resolution (which would be downsampled and compressed on the server).

Missing format specifications

If we wanted a bulletproof solution, we would have to somehow integrate ad specifications into Ps and Ae. Like New File dialogue presets, but for ads. The only way we could update preset files in the future was by implementing a custom wizard.

Adobe Photoshop with Celtra's new creative dialog
Adobe Photoshop with Celtra's new creative dialog format selection

Architecture & integration mapping

Video formats were straightforward, but to support the entire lineup of display ad formats, we needed a system for binding multiple ad sizes and optional expandable units.

If we implemented it so that each format was a standalone Ps file, the only way we could bind them into one Celtra creative was to enforce a strict file-naming convention for specifying logic. That would be a serious point of failure due to a steep learning curve, clashing with user-preferred naming conventions, and unbinding problems in case of human error.

A much more elegant way was to package multiple creatives into a single Ps file with all available format units mapped as artboards. Their names could be predefined without relying on user input. More expensive implementation, but a bulletproof solution. We pushed the entities mapping logic further by mapping Ps’s layer groups to Celtra’s, and explored options for developing a nomenclature system that would convert layers into Celtra’s interactive components (e.g., carousel).

Adobe Photoshop with Celtra's preset format specifications as artboards

Enabling users to specify Celtra’s destination account and campaign to upload work from plugins also required extending Celtra’s API and implementing log-in.

Celtra's add-on Photoshop panel for platform log-in
Celtra's add-on enabling upload directly to a specific target account and campaign

Automating adaptation to multiple sizes

For display ads, the Photoshop plugin would convert fixed width/height and x/y pixel values to Celtra’s responsive layout. That way, a single ad format input composition could be interpolated into all others. Users could use the same layers on multiple artboards to define different compositions for landscape, portrait, and square aspect ratios to achieve optimal results.

For video ads, we developed a responsive layout engine for After Effects that reflows the entire composite from any source to any target aspect ratio.

0:00
/0:56

Responsive video engine demo

Creative guides and video player simulation

While we were creating an inventory of format specifications, we noticed that video player controls often obstruct important elements of the creative. There were also significant differences between the desktop and mobile player UIs.

We got the idea of creating “safe area guides” layers (unlike those used in TV production) and player simulation Ae comps, which would enable designers to preview and proof the creative content to downscale gracefully on-the-fly without needing to render and upload to each media platform.

0:00
/0:35

Format safe area guides for Facebook and Instagram demo

0:00
/1:17

Format safe area guides for YouTube demo

Future-proofing for dynamic & generative use-case

Both solutions had to extend gracefully into creative automation, which we were already exploring through external data ingestion and ML generation experiments. We designed the integration architecture so that a single After Effects template could drive server-side generation at scale, and proved it with the proof of concept below: hundreds of video variants generated from one creative template and content provided as structured data in Google Sheets.

0:00
/1:09

Data feed powered generative video engine demo

Conclusion

Development was put on hold after alpha in favor of higher-priority initiatives. The Photoshop plugin was later revived in a different implementation, while the After Effects plugin was retired as the company sunset most of its video production solutions.

Credits

Data science: T. Rostan
UX+UI Design: G. Furcolo
Engineering Celtra: P. Bradey, U. Pirnat, G. Kozak, et al.
Engineering Videobolt: M. Stojkovic, U. Stojanovic, I. Halilovic