What is a playable ad?

The short answer

A playable ad is a mobile ad you play instead of watch. It’s a small HTML5 game that runs inside the ad network’s in-app browser, usually in an interstitial or rewarded placement in another app. The player gets one core mechanic of the advertised game (a swap, a swipe, a drag), a short challenge, and an end card with a button to the App Store or Google Play.

It isn’t the game itself. It’s a rebuilt slice of it, small enough to load inside an ad and short enough to finish: most of the builds in our showcase reach their end card in 20 to 40 seconds.

What happens in a playable

Every genre looks different, but the structure our genre playbooks ask for is the same:

1. A hook on the first frame. Something is already happening, and a hand shows the first input within a second or two.
2. A first reward within two or three inputs. A cascade, a coin line, a merged item: proof the game is fun before the player decides it isn’t.
3. A short escalation. A second level, a booster, a boss, a timer.
4. A win or a near miss. In Flood Rescue an idle player watches the King get swept away; in Knight Pin Rescue level three ends on a fail that almost worked.
5. An end card on every outcome, win or lose, with the store button.

How a playable is built

The game is usually drawn on a canvas, in 2D or with WebGL for 3D. The builds in our showcase use plain canvas, three.js for 3D and Matter.js for physics. What makes it an ad rather than a web game is the packaging:

• One file, nothing loaded from outside. Images, sounds, 3D models and libraries are embedded in the HTML, so the ad works the moment it’s shown and makes no requests to other servers.
• A size limit per network. 2 to 5 MB in our exports; images are compressed until the file fits.
• The network’s API. Some networks use MRAID, the IAB’s standard interface for ads inside apps: it tells the ad when it’s ready and visible, and opens the store. Others have their own calls (more on MRAID).

These are the files our export produces, read from its code. Networks change their rules, so check the network’s current spec before a big launch.

What a build has to pass

Before a build is handed over, our QA agent plays it in a headless phone browser and checks it against these rules:

• Under the size limit for the network you export to.
• The store opens from a tap only. Networks reject redirects fired by a timer.
• No external requests: no CDNs, web fonts or remote URLs.
• It starts when it’s seen. On MRAID networks the game waits until the ad is ready and visible.
• Portrait and landscape. The layout follows a resize or rotation.
• Sound starts on the first tap, never on load.

Our free playable ad validator runs the static half of these checks on any HTML or ZIP file, once for each network.

Examples by genre

Each one runs in your browser. The genre pages explain what makes that genre work and give a prompt to start from.

• Match-3: Flood Rescue. Every match drains the flood before the King is swept away.
• Puzzle: Flow Free – Playable. Connect the matching colours and fill every square of the board.
• Runner: Rail Dash. Three lanes, moving trains and an inspector on your heels.
• Crowd runner: Squad Gates. Grow a soldier squad through math gates, then take down a mutant.
• Merge: Purrfect Café. Merge cups, cookies and cakes and serve them to the cats.
• Idle and tycoon: Pokota Juice Farm. Harvest carrots, press juice, sell to penguins, hire a bear.
• Tower defense: Desert Kingdom Defense. Archer, cannon and mage towers against scarabs, camel riders and a sand golem.
• Shooter: Dead Rounds. Hold the diner for five rounds of zombies, one headshot at a time.
• Hidden object: Wizard's Spellbook. Six relics on three pages of an open spellbook, against a 40-second clock.
• Pin-pull: Knight Pin Rescue. Pull the pins in the right order; the gold and lava really fall.
• Parking jam: Parking Jam. Three lots, a bus, a traffic cop and a timed rush hour.
• Social casino: Spin & Raid. Spin the slot, land three pigs, dig up a rival's treasure.
• Sports: Penalty Shootout 3D. Five kicks under the floodlights, the last one in the top corner.
• Action RPG: Desert Warrior. Three skills, two hero allies and a sand lord rising from the dunes.
• Survivor: Night Swarm. Hold the lantern light against hundreds of bats and ghouls, then a boss.
• Arena battler: Arena Duel. A giant knight crosses the bridge. Play the right counter.
• Slingshot: Slingshot Heroes – Tower Smash. Pull back, launch the hero and bring the bandits' tower down.

Three ways to make one

Code it

An HTML5 developer builds the game with canvas or a web game library, then packages a variant for every network. You get full control, and pay for it in developer time on every new concept and every variant.

Hire a studio

Playable ad studios and creative agencies design, build and iterate for you, often alongside the rest of your ad creative.

Generate it

With Playbaker you paste your store link or describe the game. A producer agent writes the plan, art and dev agents build it, and a QA agent plays it before you see it. You change it by asking in the chat, and export it for each network from one menu. Building and playing is free; exporting needs a paid plan.

How to make a playable ad goes through each route step by step, and playable ad best practices covers what makes one work.

Questions