TikTok Playable Ads: Vertical Design, Pangle & 2026 Guide

TikTok's For You Feed is a hard place to hold attention. Users scroll past anything that looks like an ad within the first second. A playable or interactive end card that is fast, vertical and looks like it belongs in the feed can stop the scroll, which static and video creatives often fail to do. Current specs: TikTok playable ad specs.

What a TikTok Playable Has to Be

• Format: a ZIP with index.html in the first-level directory and a config.json beside it carrying playable_orientation (0 responsive, 1 portrait, 2 landscape); all assets embedded.
• Size cap: under 5 MB after compression (aim for under 1 MB: TikTok's delivery environment is highly latency-sensitive).
• Orientation: portrait (9:16) first, since that is the For You Feed's native format.
• No audio: TikTok plays ads sound-off by default; any sound-based interaction mechanic will be ignored.
• No MRAID: include TikTok's playable JS SDK and call window.openAppStore() for the install link. No mraid.js, no JS redirects, no HTTP requests.

TikTok vs Pangle Placements

TikTok and Pangle are separate inventory sources even though both are bought in TikTok Ads Manager, where playables run in Smart+ App Promotion campaigns and TikTok generates the end card. TikTok inventory is the TikTok app For You Feed and search placements: high visibility, high CPM. Pangle, now called the TikTok Ad Network, is its partner-app network, serving across thousands of third-party apps in North America, APAC, and Europe: broader reach, typically lower CPM.

Both placements take the same ZIP, the same SDK and the same 5 MB cap, but you may see different performance characteristics. Some game genres perform better on TikTok's feed (high-production visuals, trend-adjacent concepts); others scale more efficiently on Pangle's publisher inventory (utility games, casual puzzle). Playable Ads Maker's TikTok and Pangle exports are the same package, so one creative covers both: test both placements before committing budget.

Designing One Creative for Two Contexts

Because the same package serves both TikTok and Pangle, the creative has to work for two quite different viewers. On TikTok it interrupts a feed of short videos, so it competes with entertainment and has to earn attention in the first moment. On Pangle it usually appears inside another app, often a game, where the viewer has paused what they were doing and the ad has their attention for a little longer.

• Open strongly enough for the feed. A hook that works on TikTok rarely hurts on Pangle; the reverse is not true.
• Let the interaction pay off for the longer viewer. A short loop that rewards a second or third tap gives Pangle viewers something to do once they have chosen to play.
• Keep the CTA visible throughout, so a viewer in either context can leave for the store the moment they decide to.

Then read results by placement rather than combined. A creative that looks average overall can be strong in one and weak in the other, and the split tells you which variant to build next.

Design for Sound-Off, Vertical, Fast

Three constraints shape a TikTok playable. Assume no audio, so no mechanic can depend on it. Build in portrait, because the For You Feed is 9:16. And make it feel fast: users leave a slow ad in under 2 seconds.

Heavy type works. Kinetic Text entrances, where each character scales or fades in on a short stagger, look at home on TikTok and pull the eye to the headline before the CTA appears. Use Particle FX (confetti burst, sparkle, or ripple) as feedback for any tap interaction; that immediate visual response signals 'this is interactive' to users who might otherwise miss it.

Making a Playable Feel Native to the Feed

Viewers on TikTok judge an ad by whether it looks like it belongs there. The playables that hold attention borrow the feed's visual language rather than looking like a banner dropped into a video app.

• Full-bleed, edge to edge. Fill the 9:16 frame. Letterboxed art with empty bands top and bottom reads as an ad resized from somewhere else.
• Big type, short lines. Captions on TikTok are large and blunt; a headline of a few words in a heavy face fits in, a paragraph does not.
• Motion from the first frame. A still opening looks like a loading screen in a feed where everything moves. Start with something already in motion, then hand control to the viewer.
• One gesture, shown rather than explained. Animate a hand or a pulse on the target instead of writing instructions. The first three seconds guide covers hook design in detail.
• Keep the important parts away from the edges. Leave margin at the top and bottom so the headline and CTA are not crowded by anything the app draws around the ad.

None of this replaces a good mechanic, but it decides whether the viewer stays long enough to find it.

Packaging Mistakes That Stop a TikTok Upload

TikTok's package is a little more structured than most, and each of its parts has its own way to go wrong:

• index.html inside a subfolder. Zipping a folder rather than its contents puts the entry point one level down, and it must sit in the first level of the archive.
• A config.json that disagrees with the design. Declaring portrait for a creative laid out in landscape, or the reverse, makes the ad display in a shape it was not built for.
• The SDK left out. Without TikTok's playable JS SDK in the creative, window.openAppStore() does not exist when your code looks for it.
• Judging the store exit outside TikTok. In a desktop or phone browser window.openAppStore() does not exist, so a CTA that does nothing there is expected. Test the rest of the experience there, and the exit inside TikTok's own preview.
• Leftovers from another network. An mraid.js tag or a redirect carried over from a different build should be removed before upload.

Exporting TikTok and Pangle Creatives

1. Build your creative in portrait orientation (9:16 canvas).
2. In the export modal, select TikTok as your first network.
3. If you want a file named for Pangle as well, select Pangle too. It is the same package.
4. Unzip each package and open index.html on a real Android and iOS device in portrait mode.
5. Tap through to the CTA; the store only opens inside TikTok's container, where window.openAppStore() exists.
6. Upload the ZIP in TikTok Ads Manager, and choose TikTok placements, Pangle placements or both in the campaign.

Refreshing Creative on TikTok

Feed audiences see a lot of ads quickly, so a creative that worked last month can tire sooner than the same creative running mostly inside games. Plan for refresh from the start rather than waiting for results to fall.

• Keep the mechanic, change the surface. A new background, character or headline on a proven interaction is often enough to win back attention.
• Rotate hooks, not whole concepts. Test a different opening moment while the core loop stays the same, so you learn which part was doing the work.
• Watch the trend over time. A steady decline in engagement on an unchanged creative is the signal to replace it, more than any single bad day.

The creative fatigue guide covers how to read that decline and how often to refresh.