Playable Ads Documentation

Video Playable Maker: Exclusive Features

End Cards Maker: Templates & Single-Scene Workflow

Playable Ads Maker: Multi-Scene, Transitions & Events

The only editor with a blank starting canvas and full scene management: add, duplicate, reorder, and delete scenes; set a transition per scene (crossfade, wipe, zoom blur, pixelate); and wire up the Events tab on images, buttons, text, shapes and every interactive object. See Section 18 for the full reference.

Adding Objects

1. Click Add New Object in the left panel
2. Select an object type from the modal
3. Object appears centered on canvas
4. Customize in the right Properties panel

Available Object Types

Common Properties (All Objects)

Editing Objects

• Select: Click on canvas or scene panel; Escape to clear
• Move: Drag, or Arrow keys (Shift for fine nudge)
• Resize: Drag purple corner handles
• Inspect: Position, Properties, Animation tabs in right panel
• Delete: Delete / Backspace, or scene panel icon
• Duplicate: Ctrl+C → Ctrl+V, or scene panel duplicate icon
• Reorder layers: Move up/down in scene panel or drag z-index

Only the characters you use are embedded

A playable is a single self-contained HTML file under a hard size cap, and a raw font file is routinely 200–500 KB, a quarter of the whole budget before you add a single image. So the export subsets every font: it collects the exact characters your ad draws and embeds only those glyphs, as WOFF2.

The font manager shows the real figure for each font, measured the same way the export measures it, so the number you read and the bytes the file gains cannot disagree. It moves as you write, because adding new characters adds glyphs. Your original upload is kept intact in the project; subsetting happens at export.

Check the font has the characters you need

This is the one thing worth checking every time. Display fonts often contain letters, digits and a little punctuation, and nothing else. A button reading “SEE MY REWARD →” is the usual way people hit it: the letters come from your font and the arrow does not exist in it, so the device substitutes the arrow from another font entirely.

Nothing breaks and nothing warns you in a normal preview, but the substitute differs by platform, so the arrow is one shape on iOS, another on Android, and another again inside an ad network’s WebView. The font manager and the build check both list any character your ad uses that the font cannot draw, with its Unicode code point. Either replace those characters, or use a font that has them.

Weights come from the file, not from a menu

The Font Weight dropdown lists only the weights the uploaded file actually contains. Most display fonts ship exactly one. Asking a browser for a weight a font does not have does not fail. It fakes it, smearing the outline into an artificial bold that renders differently on every device and usually just looks wrong. If you need a real bold, upload the bold file as its own font. Variable fonts are read properly: their whole weight range is offered.

Licensing

Embedding a font in an advertisement is a specific right. A desktop licence usually does not include it, and neither does simply owning the file. Open-licence families (SIL OFL, Apache) are safe; anything else needs a webfont or app-embedding licence. Only upload fonts you are licensed to embed.

Good to know

• An uploaded font that no object uses is not embedded and costs nothing.
• Every custom family falls back to Arial, so text still renders if a font fails to load.
• Renaming a font in the manager does not update objects already set to the old name.
• Removing a font in use makes that text fall back to Arial. The text itself is not deleted.
• Fonts are stored with the project, so collaborators and cloud drafts carry them too.

Presets (29)

Selecting a preset populates all emitter, shape, color, and physics fields. You can fine-tune any property after selecting a preset.

Particle Shapes (4)

Color Modes (4)

Emitter Properties

Physics Properties

Source Modes

Playback Properties

Start and End Frame inputs are clamped to the total available frames. Setting start frame above end frame automatically adjusts the other value.

Fit Mode

Tile Image

Upload a single seamless/tileable image. It is repeated automatically to fill the object's box in both directions, so there is no need to pre-tile or duplicate the artwork.

Layout

Scroll Properties

Shape Types

Shape Properties

All standard transform properties apply: Position, Width, Height, Rotation, Scale X/Y, Pivot X/Y, Opacity, Blend Mode, Z-index. FX filters (Drop Shadow, Glow, Outline, Blur) and animation presets also work on Shape objects.

Four ways to make one

A picture mask reads one of two things

This setting is easy to get wrong.

Invert and Feather

Choosing what gets masked

• Objects below it: everything painted underneath (the default). Move the mask up or down the layer order to change what it catches.
• Every object in the scene: everything at once.
• Only the ones I choose: tick them by name.

Drawing a custom outline

• Move a point: drag it.
• Add a point: click anywhere on the outline. It appears where you clicked, between the two points either side.
• Remove a point: Alt-click it. Three is the minimum, because two points enclose no area.
• Move the whole thing: drag inside the frame, or use the corner handles to resize.
• Smooth: rounds the corners into curves instead of straight edges.

Drag a point outside the frame and the frame resizes to fit it when you let go. The shape stays exactly where you put it, so resizing and rotating keep acting on all of it. The points are stored as proportions of the frame, so one outline serves both portrait and landscape and scales with the canvas.

A scratch card

1. Put the prize on the canvas, and a cover (a shape or an image) on top of it.
2. Add a Mask, set its source to Scratch, and size it over the cover.
3. Under Applies To, choose Only the ones I choose and tick the cover, so only the cover is scratched away.
4. On the mask's Events tab, add Scratched Away and reveal the CTA, play a burst, or go to the End Card.

Finish the job when cleared wipes the last flecks once the threshold is reached. A Scratch / Paint Mask action on any object can auto-scratch the mask in a sweep, clear it at once, or reset it. Nothing is painted while you edit; press Play to try it.

Reveal from a variable

Reveal From Variable opens the mask by a Number variable's value: from left, right, top, bottom or as an iris from the centre. 0 is fully cut away, and Fully Open At sets the value that shows everything (1 for a path drag's progress, 100 for a percentage). Pair it with a Follow the Path drag and the picture opens as the finger moves, or ease the variable with a Set Variable action for an automatic wipe.

Animating a mask

A mask takes the same Animate presets as any other object, and moving it is what turns it into a reveal. Slide a bar across a headline for a wipe; scale a circle up from nothing for an iris; drift a soft-edged shape over artwork for a spotlight. Hiding the mask (with the visibility toggle or a Show/Hide event) stops it cutting, and the objects underneath come back whole.

Four actions, on any trigger

Four objects

Character

• Character: Blob mascot, Young knight, Horned ogre, Agent
• Skin: 8 ready-made colourways, or pick any colour
• Faces right / Faces left, and Height in its box to leave room for a shadow or a speech bubble
• Animation: Idle, Win (cheer), Lose (slump), React (tap); Loop or Once, then idle; and a speed

It stands in its idle pose while you edit; press Play to watch the clip. To change the clip during the ad, add a Character Clip action on any trigger, for example cheering on Game End or reacting when the viewer taps it. A Character takes taps, drops and paths like an image.

Dialogue

• Speech: a Name on a tag, the Line, a Typing speed in letters per second, and the tail on the left or right
• Choices: up to three buttons under the line; leave one empty for none
• Colours: bubble, text, name tag, name text, choice and choice text

On its Events tab, Line Finished fires when the typing ends, and Choice 1, 2 and 3 Picked fire for each button, so a choice can lead to its own scene, set a variable, or record a click-through parameter. The name, line and choices appear in the language manager for translation.

Atmosphere

An Atmosphere is decorative only and never takes a tap. Size it to the whole canvas for a full-screen mood, or to one panel. Show or hide it with an event, for example turning on the danger pulse when a timer reaches its last seconds.

Story intro on a game

A Game Template has its own Story intro before play option in its Properties panel: a character name, a line, a character picture and how long it shows (up to 1.5 seconds; a tap skips it). The intro shows over the game in Play and in the ad, and the line is translated in the language manager.

Events

• Timer End: fires when it reaches zero. Wire it to Go to Scene for a time-out, or to reveal the CTA.
• At Second: fires as the clock passes the second you name, for example a warning at 5 seconds.

For one clock over the whole ad rather than one scene, use the ad time limit instead.

Scroll Direction

Scrolling Text Properties

Text is clipped to the object's bounding box, so position and size control the visible window of the ticker. All standard transform properties also apply: Rotation, Scale X/Y, Opacity, Blend Mode, Z-index.

Sources: where the value comes from

Every source except Scene position and Indeterminate maps through a Min and Max you set, so a bar can read “lives 2 of 3” just as easily as a percentage. Values outside that range are clamped, never overflowed.

Styles

Bar, Ring and Arc also take a Segments count, which turns any of them into a discrete meter: five bars for five lives, eight arcs for a cooldown dial. Turn on Snap to whole segments and the fill moves a segment at a time instead of part-filling the one at the head.

Appearance

The fill is always clipped to the exact shape of its track, so it takes the container's silhouette at any corner radius, any segment count, and with every overlay. It can never render outside the shape it is filling.

Label

An optional readout with its own font, colour, outline and shadow. Position it in the centre, above, below, either side, inside at the head of the fill, or following the head as it moves.

The custom template accepts {percent}, {value}, {total}, {min}, {step}, {steps}, {elapsed}, {remaining} and {seconds}. Click a token to insert it and the panel shows a live preview of the result. It also warns you if you type a token that does not exist, or one this bar's Source can never give a moving value to.

Motion

A Time source animates by definition, so tween and entry animation apply only to the value-driven sources.

Events

A Progress object can also fire events. Two triggers are available on its own Events tab:

• Progress Complete: fires once, when the bar reaches its Complete-at percentage. Wire it to reveal a CTA, switch scene, or play a sound.
• Progress Milestone: fires the first time the bar reaches one of its markers. The dropdown lists the markers you have drawn on the bar, so there is no second number to keep in sync.

To drive a bar from elsewhere, use the Set Progress action on any other object, or bind the bar to a variable and let a Set Variable action move it. Both live in the Events tab; see Section 19 for the variable store itself.

The four controls

A Slider is a Progress bar you can grab

Sliders share every Progress style: bar, ring, arc, segments, gradients, colour thresholds, labels, the leading knob. Its appearance is edited with the Progress controls rather than a second, subtly different set, which also means every style Progress gains in future, a Slider gains too.

Choice Chips

Binding rules

The variable picker only offers variables the control can actually drive: Number for a Slider, Stepper or Chips, Boolean for a Toggle. Other types are left out because the binding would never work. If nothing is bound, the panel says so: the control still moves, but nothing in the ad can read it.

How to build one

1. Make a table. In the Repeater's panel, click + New. Name the columns after the things that change (name, price, image) and add a row per card.
2. Design one card. Draw it anywhere on the canvas: a background shape, some text, an image. Select the pieces and group them.
3. Point the Repeater at both. Choose the table and the group. The group itself stops drawing; only the repeated copies appear.
4. Put the columns into the card. Type {name}, {price} into any text, image or link field in the card. {index} gives the row number.

Layout

Card size, gap and a maximum row count are all set on the Repeater. Max rows 0 shows every row.

Making the cards choosable

Turn on Cards are choosable, pick a variable and the column whose value should be recorded. Tapping a card writes that row's value, and the whole card is one target, so a tap in the gap between the price and the title still counts.

For a chosen-state look, set Chosen surface and Chosen border, and pick a Mark on the chosen card: a dot, ring, tick, bar or ribbon. Give it a Link Parameter name and the chosen row's value also rides the click-through URL.

Color & Opacity

Pick any color with the color picker. Strength is controlled by the same Opacity slider every object has, under Visual Effects, and defaults to a 50% black scrim.

Timed Appearance

Set Appearance to Time frame to show the overlay only between a start and end time in the video, instead of for the whole scene.

Entry & Exit Fade

Game Template (Playable Ads Maker only)

Embed a playable mini-game inside your ad, with no game logic to write: choose one of 111 genres, configure it in the Properties panel, and the game is exported inside the ad, running identically on every ad network. The quickest start is a prebuilt game template from the start window, which every plan can re-skin and export; placing a Game Template or Interactive Module into a project of your own, or adding scenes and events to a prebuilt template, is part of Build From Scratch on the Agency plan.

Game Templates are exclusive to the Playable Ads Maker (Image editor). They are not available in the Video Playable Maker or End Cards Maker.

CTA Button & CTA Button with Text

A dedicated ad-redirect button that routes to your iOS/Android store URLs without per-object link configuration. CTA Buttons look identical to regular Buttons but are wired to the same redirect mechanism as the End Card: MRAID-aware, with automatic iOS/Android device detection.

Corner install pill

In a CTA Button's Properties, the Style box turns it into a small, round, pulsing install button in one corner: Corner install pill · top left, top right, bottom left or bottom right. It stays on screen during play, so a viewer who is already convinced can install without finishing the game. Tick Hide on End Cards so it steps aside on any end card screen. Put it in a corner the game's HUD leaves free. Back to a normal CTA Button undoes it.

Interactive Modules are the non-game half of the same plugin system that runs Game Templates. Instead of a round you win or lose, they run a short guided interaction (answering a few questions, building a product, turning something over in your hands) and end by handing the person a result. They live under Add New Object → Interactive Modules, alongside the game genres.

They follow the same rules as a Game Template: Playable Ads Maker (Image editor) only, one per scene, exported inside the ad itself, and configured entirely from the Properties panel. Nothing about them reaches the network at runtime (see Reporting without network calls below).

Three modules in depth

Those three have the most settings, so they get the space here. The library has 19 modules in all, and the rest work the same way (one object, configured from the Properties panel, handing its result to the end card): Swipe Picker, Price Simulator, Bundle Builder, Catch & Win, Tap to Pay, Before / After, Unboxing, Prize Reel, Card Pull, Route Planner, Beat Tap, Hold to Fill, Sort It, Trace & Cut, Book a Slot and Ride the Line. Each prebuilt brand template is built on one of them, so opening a template is the quickest way to see one working.

Carrying the result into the end card

A module finishes knowing what the person chose, and there are two ways to put that on the end card. Use whichever fits; they can be mixed on the same card.

The editor fills tokens with the module's default selections while you work, so the card is composed against realistic copy instead of raw braces, and that is exactly what the ad shows before anyone touches a control. A token nothing recognises is left visible rather than blanked, so a typo is obvious instead of silently deleting the line.

The choice is carried across to the end card automatically, and works identically in the editor preview and the exported ad.

Reporting without network calls

Ad networks reject creatives that call out to anything at runtime. A playable ships as one offline bundle and is reviewed on that basis. So a module has no analytics endpoint to post to, and there is deliberately no setting to add one.

What a module can do is attach the choice to the click-through URL. The selection is appended as a parameter, so the destination opens on what the person picked and your existing attribution tooling reports it. It is the same mechanism described in Deep Link. Values are restricted to letters, digits, _ . -, so free text can never ride along on a URL.

Sizing and orientation

A module is placed and resized like any other object, in both orientations, and redraws live while you drag its handles. The 3D Product module also declares an aspect ratio: its box can be locked to that ratio so the model is never distorted by a resize. Every module lays out from its own box, so a portrait and a landscape composition can differ completely without duplicating the module.

Property Tabs (11)

Model

What is in your model

A .glb is opaque. Open one in a browser and there is nothing to see but the product. But the finishes, parts and animation in this module all bind to things inside it by name, so those names have to come from somewhere. They are read out of the file the moment you choose it, before any upload.

Every one of those fields is then a dropdown filled from your model, not a box to type a name into. There is nothing to spell or look up in a 3D tool, and you cannot bind to a surface that is not there. Swap the model for a different one and the lists refresh with it. If a choice you had already made no longer exists in the new file, it is kept and marked not in this model rather than quietly cleared.

A model with no problems imports without a dialog. You are only stopped when there is a problem: the model is over budget, or it cannot be used at all. Either way the Model tab always shows a line summarising what was found.

If your model has no named materials or parts, there is nothing to bind to and the Model tab says so. Naming them is done in whatever tool the model was made in. In Blender, the material and object names are exactly what appear here.

Rotation & Zoom (Spin)

The model always stays the right way up, however far and however fast it is dragged. It never tumbles or ends up inverted. Horizontal drag turns it all the way round; vertical drag looks down on it or up at it, within a limit you set.

Lighting presets (3)

Tone Mapping is separately switchable between None and ACES. ACES keeps bright highlights from blowing out on glossy materials.

Environment

Option groups (Finishes)

Set Groups to how many parts of the product are configurable (up to four). Each group owns one named material on the mesh and gets its own row of swatches, so a chair's frame and its upholstery move independently and the same file serves every combination. Nothing is swapped or reloaded; the mesh keeps its own glass, metal and trim untouched.

Materials are cloned per group before anything is recoloured. Game-ready models routinely share one material between parts, and without that step recolouring a frame would repaint the cushion with it.

Option rows (Parts)

A Finishes row changes what a surface is coloured; a Parts row changes what is fitted. Set Part Rows to how many pieces of the product the viewer can swap (up to four), and each row gets its own line of named buttons under the model. Choosing one shows that piece and hides the others in the same row. Wheels: Sport or Touring. Roof: solid, glass or open.

A choice set to Nothing hides the row's pieces instead of fitting one, which is how an optional extra is expressed. A two-choice row of Nothing and Spoiler is an on/off switch, with nothing extra to set up.

Parts behave like finishes everywhere else: they carry a price delta, they are written into a {finish}-style Text object, and they ride the click-through URL. Nothing is loaded or swapped at runtime. Every variant is already in the file, so switching is instant.

The camera is framed around the model with every variant fitted, so switching to a taller or wider one can never crop it, and the framing never jumps while the viewer is configuring. Pieces no row mentions are never touched.

Pricing

A base price plus a delta per option. The total recalculates on every choice and lands in a Text object carrying {price}, so the viewer watches the figure move as they build, which is most of what makes a configurator persuasive.

Finishing & hand-over

The chosen finish is also published as the scene result, so end-card objects using Show For Result can change with it (see Section 15).

Model budget

A 3D ad carries more weight than a flat one before the model is even added, and a model costs more inside the ad than its size on disk suggests. Networks cap how large a playable may be (Meta most tightly, at 2 MB), so the share left for the model is small, and a model that looks reasonable in a 3D tool is often well over it.

The file-size figure is worked back from the tightest network cap. A model is base64-encoded into the HTML, which costs a third more than its size on disk, so 0.96 MB on disk is about 1.28 MB in the ad, and that plus the rest of your creative is what has to fit inside Meta's 2 MB. Staying inside this budget is therefore the same thing as passing every network.

The file is measured the instant you pick it, with no upload and no wait. If it is over, you are shown which lines are over, what the model really costs inside the finished ad, and which networks would reject the export. Being over budget warns and never blocks: an over-budget model that renders still beats an import that refuses.

There is one exception. A model saved with compressed geometry or textures (Draco, meshopt or KTX2) needs a decoder to be shipped alongside it, and that decoder would cost more than the model it saves. Those files are declined at import with the reason, rather than being accepted and then rendering nothing. Re-export from your 3D tool with compression turned off (in Blender: glTF Binary with Draco disabled) and it will import.

Sizing & aspect lock

The module is placed and resized like any other object, separately in portrait and landscape, and re-frames the model live while you drag its handles. It also declares a preferred aspect ratio, and its box can be locked to that ratio so a resize can never squash the model. Framing is measured from the model itself, so it stays correctly framed at any angle and in any box shape.

Managing Scenes

Add, duplicate, reorder, and delete scenes from the left panel. Each scene has its own objects, background, and entry transition. Use a Go to Scene action on any event to link scenes together for branching flows, multi-step interactions, or a dedicated end screen.

Scene Entry Transitions (4 types)

Set per scene: transition type, duration (100–2000ms), and direction (Wipe/Slide only). The exported HTML matches the editor preview exactly.

Interactive Events

Any image, button, text, shape, character and most interactive objects can run one or more actions when triggered. Open the Events tab (⚡) in the Properties panel to add a trigger and chain actions.

Each trigger can run multiple actions in sequence, and actions can target any object in the scene, not just the one that was tapped.

Declaring a variable

Each variable has a name, a type, and a starting value. Names are restricted to letters, digits and underscores, because the name is the token you type to read it back.

The manager refuses a name that collides with another variable, or with a name an Interactive Module in the project already publishes ({result}, {finish}, {price}), so two things can never claim the same token.

Writing to a variable

Add a Set Variable action to any trigger, on any object: a tap, a hold, an animation finishing, a game milestone, a break being answered. The operations offered depend on the variable's type.

Any action (not only Set Variable) can carry a condition: “only run this if score ≥ 10”. That is what lets one tap do different things depending on what happened earlier.

Reading a variable

Every read is live: a change is reflected in the same scene, mid-play, not only on the next scene entry. This holds in the editor preview and in the shipped ad alike.

What else lands in the same store

Declared variables are not the only things you can read with {name}. The Insert Variable picker lists everything available anywhere in the project:

• Events counters: any name used by an Increment Counter action
• Interactive Module results: a quiz's {result}, a configurator's or 3D Product's {finish} and {price}, and any numbered option-group tokens

These share one store with declared variables, which is why a quiz outcome and a hand-authored counter can be compared, printed and used to gate visibility in exactly the same ways.

When values reset

Every value lives for one play-through. Starting values are restored when the ad starts, and in the editor whenever you toggle Play, so each run begins from the authored state and a choice made in one run never leaks into the next. Nothing is stored on the device and nothing is sent anywhere; the store exists only in memory, inside the ad.

Compute

Add a Compute action to any trigger, pick the variable to write, and type a formula. The panel shows the result against your starting values as you type, and tells you if you have typed a variable that does not exist.

What you can write

if(test, a, b) gives a when the test is true. Dividing by zero gives 0 rather than breaking the ad, and a variable that does not exist reads as 0, but the panel warns you about that one rather than letting it ship.

Look Up: tiers without a pile of conditions

A Look Up action turns a number into something else using a small table of ranges: spend under £1,000 is “Starter”, £1,000–£4,999 is “Plus”, above that is “Max”. The same thing can be written as a chain of conditional actions, and that is exactly where tier boundaries go wrong: a gap between 999 and 1,000 is invisible in a list of actions and obvious in a table.

Both bounds are inclusive, a blank bound is open-ended, and the first matching row wins, so overlapping ranges resolve top-down rather than erroring.

Writing numbers the way people read them

Any {token} anywhere (a Text object, a Button, a CTA, Scrolling Text, a Progress label) can carry a format after a vertical bar:

No currency symbol is added for you. Write it in your own copy, as £{total|money}. That way it is unambiguous, and it translates through Localization like any other character rather than being guessed from a locale.

Putting it together

A chooser recalculates on the tap that changed it. Choice Chips and a Repeater's cards both write their choice to a variable, and anything reading that variable (a {token} in a text, a Show If gate, a Look Up and Compute chained after the tap in the prebuilt templates) runs against the value it just wrote. One tap, one price. The shipped telecom-plan-v2 template is a worked example: three plans, three data tiers and two contract lengths, which is eighteen possible prices, from a single text object.

Break Types

Resume Interactions (Break)

Break Hold Path Settings

• Shapes: Ellipse, Rectangle, Infinity (lemniscate), or Custom (add/move/delete points)
• Per-orientation: pathPortrait and pathLandscape are independent
• Preview sprite: Hand or custom image that follows the path
• Duration: Time for the hand to traverse the full path (ms)
• Easing: linear, ease-in, ease-out, ease-in-out, bounce, elastic.out
• Completion threshold: 70–100% of path user must trace (default 85%)
• Path tolerance: 20–100px (how close the finger must stay to the path)
• Show path in export: Toggle guide path visibility in exported playable
• Path visualization: Ghost dashed line + green progress trail + pulsing start marker in export

Break Hold Path: Video Sync to Path

An optional feature that scrubs the background video in sync with the user's finger as they trace the path, so dragging appears to control the video. Disabled by default; enable it with the Video sync to path toggle inside the Break Hold Path settings.

• Point 0 (fixed): Always the break's pause time (not editable, shown as read-only)
• Points 1 and beyond: Each gets an editable time field (seconds). As the finger moves through that segment, the video scrubs from the previous point's time to this point's time
• Min / max clamping: Each point's time is clamped between the break pause time (lower bound) and the video duration (upper bound)
• Partial configuration: You don't need to set every point. Any gap between two defined checkpoints is filled automatically with linear interpolation. For example, if point 0 = 5s and point 4 = 9s with points 1–3 unset, they resolve to 6s / 7s / 8s. Points after the last defined checkpoint hold the video at that last time
• Threshold-aware: The video reaches the last defined time exactly when the user hits the completion threshold (e.g. at 85% path traced with an 85% threshold), so playback resumes with no sudden jump

Works in both editor preview and exported playable. Smoothness depends on the video's keyframe interval: shorter keyframe intervals (lower GOP size when encoding) produce more responsive scrubbing.

Break Content

• Background: Color, image (portrait + landscape), or none
• Objects: Text, Image, Button (same property set as the main scene)
• Button actions: Resume (unpause video), Jump to time (seek to seconds), Link (open URL)
• Audio: Optional per-break audio clip

Break Hold Path breaks do not support button objects, since path completion is the only resume mechanism.

Other Overlay Types

• End Screen: Triggered at video end (a few ms before); acts as final CTA overlay; same content system as Break
• Permanent Overlay: Visible during a configurable time range while video plays; buttons can jump to time or resume

Object Events (Image & Button)

Main-scene image and button objects (not break content) get their own Events tab (⚡) in the Properties panel, same trigger UX as the Image editor but scoped to video-specific actions.

Works live while scrubbing or playing the editor preview, and identically in the exported HTML.

Timely Appearance (Any Object)

Every object type except Background and Audio has an Appearance setting in its Properties panel (General tab): Full video (the default, always visible) or Time frame (only visible between a Start and End time, in milliseconds, clamped to the video's duration). The time window is combined with the object's own show/hide toggle. Hiding it manually always wins. Visibility updates live as you scrub or play, in both the editor and the exported HTML.

Signing In

• Passwordless: Enter your email and receive a 6-digit code, with no password to create or remember
• Codes expire after a short window; resend is rate-limited per email and per IP
• You're prompted to log in the first time you click Export if you aren't already signed in. Your export settings are kept and the export continues automatically right after you sign in
• Signed-in state is shared across the homepage, editors, and the account page

Account Page

Visit My account from the navbar menu to see:

• Saved projects: the projects you saved to the cloud, each with a Load button and, if you created one, its share link
• Recent builds: a history of your exports with editor type, networks, file count, size, build time, status, and date. Builds store no files, so there is nothing to reopen from here
• Stats: total builds, success rate, total bytes exported, and average export duration
• Breakdowns: exports by editor type (Video / Image / End Card), by ad network, and by object types used

Saving and Reopening a Project

Notifications

When you are signed in, a bell in the site navigation and in the editor header collects product news and anything you missed by email: an email you have not opened appears there a day after it was sent, with the same button. Opening an item marks it read, and you can dismiss any you do not need; when there is nothing new it says You are all caught up.

How it works

Two steps, in two places:

1. Record the choice. On any object's Events tab, add a Set Link Parameter action and type name = value (for example color = midnight-blue). Three modes: Set replaces (one colour), Add builds a list (a basket of products), Toggle selects and deselects.
2. Map it to the URL. Open Export → Deep Link. Everything the project records is listed there; press map (or Map all) to attach each one to a URL parameter. A live example click shows the exact URL the CTA will open.

Recording a value on its own sends nothing. The mapping is what makes it travel. Anything unmapped is called out in the export panel.

Website destinations

Switch the destination toggle to Website and the mapped choices are appended as ordinary query parameters:

https://yourbrand.com/configurator?color=midnight-blue&trim=m-sport

Values are sanitised (spaces become dashes, punctuation is dropped) so they always survive the URL. You can also place a value inside the path rather than the query using a {{name}} placeholder: https://shop.com/p/{{sku}} becomes https://shop.com/p/12345, and a value used that way is not repeated in the query string.

Two destinations: pick one

Export → Destination offers App store and Web. The split is not “app vs website”. It is who owns the click, which is what decides whether anything can travel on it.

They are mutually exclusive, and switching clears the other side, so the export always has exactly one destination and never has to guess.

App store: why nothing can travel

An App Store or Google Play URL cannot carry a parameter. iOS has no install referrer at all (attribution runs through SKAdNetwork), and Google Play records the referrer from whichever click URL actually reached the store, which in a network campaign is the ad network's tracking URL rather than yours. Dressing up a store link looks like it works and delivers nothing, so the export does not offer it.

The choices are still recorded, and still handed to whatever tracking the host SDK exposes. If you need the destination itself to open on the choice, use the Web destination.

Web: one URL, one ad

The Web destination takes a single URL and it is entirely up to you what that is. If it is a product page or a landing page, parameters are appended straight to it. Or your MMP tracking link, which is the click: it redirects to the right store per platform, and the MMP hands your value to the app on first open. That is the one mechanism that opens an app on the player's choice.

You do not have to say which kind it is. The provider is detected from the URL (onelink.me, app.adjust.com, app.link, sng.link, smart.link) and shown back to you as a picker you can correct, which is what a custom tracking domain needs.

This destination exports one single-file ad, not per-network builds, and the ad-network list disappears while it is selected. There is no network SDK in the loop, so there is nothing to build for one. A file per network would only imply integrations that are not happening. It is for placements where the creative owns the click: your own site, a direct or IO placement where you supply the tag, a DSP where you own the click URL, and the share link. On an ad-network install campaign the click URL is set at campaign level, so yours would be replaced or left competing with it for last-click attribution. Use App store there.

Value shapes, when the URL is a tracking link:

The export writes the right parameter in the right shape for the detected provider. Where a URI or path is expected you supply the pattern once (myapp://product/{{product}}) and the live choice is filled into it. A store URL pasted in as a tracking link is detected and called out, because that is the one mistake that silently drops every parameter.

There are no separate iOS or Google Play fields here, and none are needed. A tracking link handles store routing itself: the correct store per platform when the app is not installed, plus the desktop and web fallbacks configured in your MMP dashboard.

More than one choice

Map as many as you like. One is nominated as the value the app opens on (App opens on, defaulting to the first); on AppsFlyer the rest are carried in deep_link_sub1–10, which is what a newly installed app actually receives. Arbitrary custom parameters come back empty on a deferred install. They are also sent under their own names for players who already have the app and for web fallbacks. The export panel prints the exact slot mapping to hand your app developer.

Which ad networks carry the parameters

This applies to the App store destination, where you pick networks. (The Web destination has no networks to pick. It is one file for a placement you own.) Whether anything can travel comes down to one thing: does the network's exit call take a URL? Four do, and eight decide the destination themselves. On those, no URL is passed at all, so a custom button link or a mapped parameter cannot travel. That is their published contract, not a limitation of the export.

Every network in the export list is badged with which it is: URL for the ones that open the link the creative supplies, SDK for the ones that decide themselves. Hover either badge for the exact exit call.

The Deep Link panel lists this live for the networks you have actually ticked, so you can see before exporting which of your selections will carry the values and which will not. Unity and AppLovin additionally expect the CTA to reach an app store; a website destination works there technically but can fail their creative review, and the export says so.

How It Works

Opening the Locale Manager

Click the globe icon (🌐) in the top-right header bar, to the left of the gear button. A blue dot on the icon indicates languages have already been added to this project.

• You can also open it by clicking the "0/N translated" pill that appears next to the Text Content or Button Text label in the Properties panel whenever languages are configured

Adding Languages

1. Open the Locale Manager via the globe icon in the header
2. Click + Add language in the languages row. A dropdown of 17 common languages appears (French, German, Spanish, Italian, Portuguese, Japanese, Korean, Chinese, Arabic, Russian, Dutch, Turkish, Polish, Swedish, Indonesian, Thai, Vietnamese)
3. English (EN) is always the default and cannot be removed
4. To remove a language, click the × next to its pill. This also removes all saved translations for that language from every object

Entering Translations

Translate with AI

The language manager has a Translate with AI button in every editor. It fills in only the lines still missing a language, uses AI credits from a paid plan, and costs nothing for lines our templates already ship translated or that you translated before. Check the result in the table, and translate last, once the copy is final. See 30.6.

CSV Import / Export

Send translations to a localization team and import them back, with no access to the editor required.

Exporting with Localization

When languages are configured and Web Preview is enabled, a Localization section appears in the Export modal with two modes:

Testing a Specific Language

• In the Review / Preview URL, append ?lang=fr (or any two-letter ISO code) to force that language
• Example: https://yourdomain.com/preview/abc123?lang=de → German
• The ?lang= parameter takes priority over the phone's language
• Removing the parameter (or using an unrecognised code) falls back to the phone's language, then to the default English text

Best Practices

• Target 1.5–2 MB total export size for best load performance
• Use WebP images, which are significantly smaller than PNG at similar quality
• Compress video and audio before uploading large files
• Test both portrait and landscape orientations before exporting
• Preview animations with Play button before exporting
• Use the network's own preview/validator tool to confirm acceptance before submitting
• Save your project to the cloud before exporting if you want to reopen it on another device (every editor already autosaves to this device)