Skip to main content

What are Display Ads and how do you use them?

Display Ads are a new interactive ad format in Pencil that lets you create HTML5 ads with built-in interactivity.

L
Written by Laura Cecilli
Updated over a week ago

Instead of relying on static visuals or time-based video playback, Display Ads allow people to actively engage with your creative and click through to content that is most relevant to them.

This article explains what Display Ads are, how they work, and how to use the Display Ads editor.


What are Display Ads?

Display Ads are interactive ads that support user-driven experiences such as clicking, hovering, and navigating between different scenes.

Unlike static or video ads, Display Ads:

  • Respond to user interactions

  • Support multiple click-out URLs in a single creative

  • Allow non-linear navigation between scenes

This makes them well suited to product showcases, carousels, and interactive storytelling.


How does interactivity work in Display Ads?

Interactivity in Display Ads is built using two core concepts: Events and Actions.

Events

Events describe how someone interacts with your ad. Common events include:

  • Seeing the ad for the first time

  • Clicking on a button or image

  • Hovering over an element


Actions

Actions define what happens after an event occurs. For example:

  • Playing an animation

  • Moving to another scene

  • Opening a destination URL

You decide how Events and Actions are combined, which allows you to build anything from a simple click-through ad to a carousel-style experience.



Can you use more than one destination URL?

Yes. Multiple destination URLs are supported within a single Display Ad.

You can:

  • Assign different URLs to different elements

  • Link each scene to a unique destination

  • Offer multiple product links within one creative

This helps you keep the experience relevant while giving people more choice.


What is the Canvas used for?

The Canvas represents the environment where your ad appears in the wild, such as on a website or ad placement.

Using Canvas Settings, you can define what happens when the ad first comes into view. For example, you might trigger an animation when the ad appears for the first time to draw attention to a key element.

This is especially useful for shaping the first impression of an interactive ad.


How do Scenes work in Display Ads?

Scenes are where your layers live, including images, text, and buttons.

In Display Ads:

  • Scenes are not time-based

  • Scenes do not play in a fixed order

Movement between scenes is controlled by Events and Actions

For example, you can set a click in one scene to take someone directly to a different scene, with an animated transition if needed. This makes it easy to build carousels or branching pathways.


How do animations work?

Animations can be created using presets or keyframes, just like in the video editor. The difference is how they are triggered.

Animations in Display Ads:

  • Do not play automatically

  • Must be triggered with an Action

  • Can vary depending on the Event that triggers them

You can set multiple animations on the same layer and link each one to a different action. Just make sure the correct animation is linked to the correct event.


How do you preview interactive behaviour?

The Interactive Preview lets you test your Display Ad as you build it.

Use the preview to:

  • Experience the ad as if it were live

  • Test clicks, hovers, and scene navigation

  • Confirm animations and URLs behave as expected

What you see in the preview is how the ad will behave when published.The only difference is you are not seeing the ad in its compression quality. This is maybe a future enhancement.


How do you export a Display Ad?

You can export a Display Ad as an HTML5 zip package.

This format is designed for digital ad placements and will support additional ad server integrations in future releases.


What is coming next?

Upcoming enhancements include:

  • A file size counter to help keep ads lightweight

  • Direct export to ad servers

  • Interactive components such as buttons and pannables

  • Pre-built carousel layouts

These updates will build on the foundations introduced in this first version.

Did this answer your question?