← Back to work

IMDb Ad Creatives

A Sketch plugin that turns designers’ artboards into live IMDb ad units.

Client
IMDb
Type
Tool
Role
Design & engineering
Year
2021
IMDb Ad Creatives preview: a mobile hero ad with a trailer inside an IMDb phone page, beside a panel of device, width and height options.

Brief

At IMDb, designers made each ad in Sketch, and the design technologists on my team rebuilt it by hand in code for every campaign. That took up time we could have spent on other opportunities. So the team built a Sketch plugin together in about a month, covering all of IMDb’s ad formats. Designers now keep full control of the design and any changes, and set up, test and launch the ad themselves.

My part

  • Built the plugin with the other design technologists, with a template for each ad format and guidelines for every editable part.
  • The preview shows the ad inside a real IMDb page, on different devices and screen sizes.
  • Publishing uploads the assets and returns the ad’s config and HTML, ready to traffic.
  • Date overrides let one creative swap its assets on set dates, for example a new trailer on release day.

The work

Sketch's Plugins menu opened to IMDb Ad Creatives, Create, listing ad formats such as Premium Billboard, Video Wall and Mobile Hero.
Every ad format starts from a template.
Sketch document with artboards for the ad's creative, static background, overlay and play button, each with a written guideline card below.
Each part of the ad is its own symbol, with its guidelines next to it.
Zoomed-out Sketch canvas showing every artboard of a mobile hero ad in a row, a general guidelines panel on the left, and a guideline card under each part.
The whole ad on one page, with its parts, guidelines and a build preview.
A plugin dialog over the Sketch canvas with two text boxes, one of JSON and one of HTML tags, each with a copy to clipboard button.
Publishing returns the config and HTML.
The plugin's Utils submenu in Sketch, with options to add a date override, generate, set creative type, submit a bug or feature request, and read release notes.
Date overrides, plus tools for reporting bugs and reading release notes.
Next project
Amazon Beauty FestivalAmazon Beauty’s yearly festival with live streaming on Amazon Live.