Playable ads guide

Interactive Video Ads: How to Turn a Video Ad Into a Playable

Most UA teams have far more video than playables. The video already exists and has already been through approvals. The cheapest route to an interactive creative is usually not a new mini-game but that footage, paused at the right moment and handed to the viewer: do the thing the video is about to show, and the video continues because you did it.

That is an interactive video ad, sometimes sold as a video playable. It is a different object from a video followed by an interactive end card. There the viewer watches and then taps a button. Here the interaction sits inside the story, and the footage waits for it.

What changes when a video waits for the viewer

A paused frame with a clear prompt turns a viewer into a participant, and the continuation that follows reads as a consequence of their action. Most of the effect comes from that cause and effect. The viewer attributes the payoff (the glass wiping clean, the sword landing, the lid opening) to themselves, and a payoff you caused holds attention in a way a payoff you watched does not.

The limit is real: a video playable proves less than a built mechanic. The viewer triggers an outcome that was recorded in advance, so the format is good at demonstrating feel, product and spectacle, and weak at proving that a puzzle has depth. If the claim you need to make is that the game rewards thinking, footage will not make it for you. If the claim is that the product does something satisfying, footage is often the strongest evidence you have.

Choose the break point from the footage, not the timeline

The right pause is almost always the frame just before a payoff: the instant before the swing connects, the lid lifts, the streak is wiped away. A frame paused there reads as a question the viewer already wants answered. A frame paused in the middle of nothing reads as a buffering error.

  • The first break comes after the hook, not before it. Something has to have happened in the first second or two, or the viewer never reaches the prompt.
  • The thing to interact with must be visible and still in the paused frame. Motion blur on the object you are asking someone to touch is the commonest reason nobody touches it.
  • One to three breaks is the range. Each one is a small ask, and the third has to be worth more than the first or it reads as padding.
  • The last break should land close to the end, so the resolution and the call to action follow straight on from the viewer's final action.

Match the gesture to what happens on screen

The gesture has to be the verb of the footage. When the video shows a swipe and the ad asks for a tap, the causal link breaks: the viewer did one thing and the video did another. Four gestures cover almost every piece of footage.

  • Tap: discrete events. Fire, choose, open, launch. The cheapest ask there is, and the right default for a first break.
  • Double-tap: emphasis or a combo. Less discoverable than a single tap, so it needs clear guidance and works best as a second or third break, once the viewer has learned that the video responds.
  • Hold: anything that charges, presses or fills. A ring that fills while the finger stays down makes the waiting visible. Keep the hold short, around a second, because a long hold feels like the ad has stopped responding.
  • Drag along a path: continuous motion. Wiping, slicing, pouring, steering. The strongest version ties the drag to the footage itself, so the video advances as the finger moves along the route and stops when it stops.

A video-synced drag is the most convincing break there is

When the footage scrubs forward under the viewer's finger, the motion on screen is their motion. It is also the least forgiving to build: the route has to follow the object in the footage, and the corridor around it has to be wide enough for a thumb on a small phone. Test it on a device, at the canvas size you ship, before anything else.

Guidance: the hand, the ring and the tolerance

A paused video with no prompt looks broken. The prompt has to appear the instant the footage stops: an animated hand demonstrating the gesture, a pulsing target, a hold ring waiting to fill, a traced line showing the route. It should demonstrate the gesture rather than describe it, because a sentence is read by a small fraction of viewers and a moving hand is understood by nearly all of them.

Tolerance matters more here than in a built mechanic, because the target is fixed by the footage rather than designed for a thumb. Make tap areas larger than the drawn target, accept a drag that is roughly on the route rather than exactly on it, and keep the hold short. Every tolerance expressed in pixels needs to scale with the canvas, or the ad becomes stricter on larger devices than on the one it was tested on.

Decide deliberately what happens if the viewer does nothing. Waiting indefinitely keeps the format honest (the video continues because of the viewer or not at all) but it turns every non-interacting impression into a still frame. Either choice is defensible. Not having made one is how teams discover the behaviour in a live campaign.

Layer text and objects on the clock

Most impressions start muted, so anything the soundtrack carries has to be on screen. Captions, a product name, an arrow pointing at the thing about to happen: these belong as objects timed against the footage rather than as pixels baked into it. Kept as live objects they can be translated, tested as variants and repositioned for the other orientation. Baked into the video, they cannot be touched without a re-edit.

Give each overlay a time window with a short fade in and out, keep it clear of the part of the frame the action uses, and hide anything that competes with the prompt while the video is paused.

The footage lives inside the file

A playable makes no network requests, so the video cannot be streamed from a CDN. It travels inside the creative and counts against the same cap as everything else, and if it is embedded as base64 it counts for a third more than the file on disk. Do the arithmetic before editing starts: at 1 Mbps a 15-second clip is about 1.9 MB of video, roughly 2.5 MB once encoded into the page. That is half of a 5 MB budget before a single image or line of script.

  • Cut to the shortest edit that still reaches the payoff. Ten to fifteen seconds is usually enough; the break points do the work a longer edit was doing.
  • Encode H.264 in an MP4 container for the widest webview support, at a resolution matched to the canvas rather than to the master.
  • Lower the bitrate until artefacts become visible on a phone held at arm's length, then step back up one notch. Judge on the device, not on a monitor.
  • Supply a poster frame, so the space is not a black rectangle while the first frame decodes.

Sound, autoplay and the mute switch

Webviews generally autoplay video only when it starts muted, and networks reject creatives that play sound before the viewer has interacted. The first break is therefore also the natural place to bring sound in: the tap that resumes the video is a user gesture, and the audio can start with it.

On iOS there is one more rule that catches video creatives in particular. The hardware mute switch silences audio played through the Web Audio API but deliberately does not silence media elements, which is why a muted iPhone still plays video sound. A creative that plays its soundtrack through a plain media element therefore ignores the switch, and at least one major network rejects creatives for exactly that. Routing the audio through Web Audio is what makes the switch work.

Building one in Playable Ads Maker

The Video editor is built around this format. Upload the footage, scrub to the moment, insert a break and choose what it asks for: tap, double-tap, hold, or a drag along a path, with the drag optionally tied to the footage so the video scrubs under the finger. Break content sits on top as ordinary objects, overlays are placed with Timed Appearance, and the end screen closes the sequence with the call to action. The export handles the muted autoplay, the poster, the gesture-gated audio and the per-network store exit.

Two live examples show the shapes side by side: Glass Cleaner – The Streak Test uses a drag and then a tap, and Sneaker – The Fit Test runs a tap, a hold and a double-tap in sequence.

Create playable end cards in minutes—no code required.

Open Video Playable Maker