Playable Ads
Last updated, October 2023

Before getting started: Currently only available in Argentina, Canada, Colombia, Chile, Japan, Korea, Taiwan, Vietnam, Thailand, Malaysia, Egypt, Turkey, United Arab Emirates, Saudi Arabia, Russia, Indonesia, Singapore, Cambodia, Peru, Philippines, Brazil, Mexico, Israel, Ukraine, Belarus, and Kazakhstan.


Playable Ads are interactive videos that allow you to showcase a preview of your app before someone downloads it.


The concept of a Playable Ads is quite simple, when someone watches your video, they are invited to interact with your ad in a full-screen playable experience. This will allow them to experience your app by tapping or swiping on your ad. Additionally, you can trigger your app to be downloaded at anytime by using a button or gesture.


Currently, Playable Ads are available as video traffic.


Benefits

More Engaging vs Other Formats

Pangle's data shows that Playable Ads effectively increase clickthrough rates (CTR) and conversion rates (CVR) compared to non-Playable Ads.


Optimize Cost per Result

Playable Ads can help reduce your cost per result. Pangle's data shows that the cost per result of Playable Ads is lower than non-Playable Ads.


Use cases for Playable Ads

Playable Ads are a perfect fit for anyone who wants to showcase their app's unique features and drive app installs.


Industry

Common Applicable Scenarios

Casual Games, Hyper Casual Games

- ​Show the core gameplay and stages to attract players to download after a short try.

Hardcore Games

​- Showcase simple interactions like:

-- Guiding the players to explore the story by clicking elements on the screen.

-- ​Tapping to receive a present and gacha game items.

-- Clicking to draw figure cards.

Manga, Novels, Music Players, Online Videos

- Present content that is popular within the app.

- ​End your video at a suspenseful or exciting moment that will drive your audience to download the app to learn more or see what happens next.


How to make Playable Ads

In addition to developing H5 playable content from scratch, we have created three tools that allow you to create your own playable content - without writing any code. Each tool has certain advantages and limitations. Continue reading to see which tool is right for you.


Interactive Video Tool

Note: The Interactive Video Tool is only available for allowlisted clients, for more information about how you can access this tool, please contact your sales representative.


About

This tool allows you to create interactive content by adding your creative materials (images and videos) to a series of templates, which you can customize. The Interactive Video Tool is similar to a video editor, as it allows you to assemble your playable content and map out your interactive touch points, triggers, and behaviors only using your mouse - no coding required.


Playable Ads-Interactive Video Tool-PNG

The Interactive Video Tool is a great solution for anyone who is looking to quickly create playable content without developer support. It is good at facilitating shallow interaction, like presenting an interactive story or showcasing gameplay that involves simple actions like clicking or dragging.


How to access

  1. ​Go to https://ads.tiktok.com/powerplayable 

  2. ​Log in to your TikTok For Business Account.


Template Tool

Note: The Template Tool is only available for allowlisted clients, for more information about how you can access this tool, please contact your sales representative.


About

The Template Tool allows you to create custom playable content by replacing the background image, icons, and audio files from pre-made templates. It is useful for creating playable content that only requires limited interaction, like clicking a button. It is a great option for those who have no experience creating playable content and want to produce it very quickly.


Playable Ads-Template Tool-PNG

How to access

  1. ​Go to https://ads.tiktok.com/playtemplate/templates 

  2. ​Log in to your TikTok For Business Account.


Adaptation Tool

Note: The Adaptation Tool is only available for allowlisted clients, for more information about how you can access this tool, please contact your sales representative.


About

The Adaptation Tool allows you to convert your existing playable content into Pangle Playable creative. The tool will only change the format of the file and preserve all of the interactive events you have already created. It is a great choice for anyone who has already developed interactive ads for other ad delivery platforms.


How to access

  1. ​Go to https://ads.tiktok.com/playable_tools

  2. ​Log in to your TikTok For Business Account.


Requirements

Note: Playable creative made with the Interactive Video Tool, Template Tool, and Adaption Tool will automatically meet these requirements.


When creating Playable Ads yourself or working with a developer to create them, please ensure that your files meet the following requirements.


Critical requirements

  • ​The Playable Ads materials must be in .zip format.

  • ​The Playable Ads materials should be smaller than 5 MB (after compression).

  • ​The main .html file in the first-level directory should be named index.html.

  • ​In order for the Playable Ads to work, please authorize the click-to-jump operation for Pangle. To do this, Pangle needs access to the front end of the js-sdk. For more information on how to do this, please read the section Playable Ads js-sdk Access of this article.

  • ​The first-level directory contains the config.json file, which is in .json format and contains the Playable Ads’s orientation fields, representing the landscape and portrait adaptation for Playable Ads materials. The values are 0 (either landscape or portrait), 1 (only portrait orientation supported), and 2 (only landscape orientation supported).


JSON

1      { 

2     "playable_orientation": 0

3      } 


  • ​The Playable Ads materials need to support several types of devices.

  • ​The Playable Ads materials should not be in mraid.js format.

  • ​Loading dynamic materials via external networks is not permitted.

  • ​The playable HTML5 materials must not contain any JS redirects.

  • Playable Ads materials must not make any HTTP request.


Optimization suggestions

  • ​It is best to split the Playable Ads material into smaller pieces and enable accelerated parallel downloading.


Playable Ads js-sdk access

When accessing the Playable Ads materials, Pangle needs to “call for the app store when the conversion button is clicked.” Therefore, your Playable Ads materials need to allow for access to the js-sdk.


This js-sdk allows a call for the app store through the Pangle js-sdk after the download button is clicked in the Playable Ads.


Note:

  • ​The accessing party does not need to call for the download or page jump operations by themselves. These operations are handled by the js-sdk.

  • ​After August 5, 2021, if the playable material does not use the new js-sdk address, there may be a risk that the material will not be allowed to upload. Please check and make sure that the new playable material uses the new version of js-sdk.

  • ​If you use the three tools (interactive video tool/template tool/adaption tool) provided by Pangle to make playable materials, there is no need to check, because the tools have automatically updated js-sdk to the latest version.


js-sdk address

https://sf16-muse-va.ibytedtos.com/obj/union-fe-nc-i18n/playable/sdk/playable-sdk.js


js-sdk access method

Place the following code at the bottom of the body and before the developer's own JS.


Calling method

window.openAppStore();

Playable Ads-calling method-JPG

Testing Playable Ads

To help you test your playable creative, Pangle has an SDK environment that can be used to emulate Playable Ads on different mobile phone models and operating systems.


For iOS Devices

Get the iOS Device Test Tool

To download the iOS Testing Tool for Playable Ads, please click here.


Steps

  1. ​Download the .zip package and run BUDemo.xcworkspace.

  2. ​Go to Ad Test App, click Tools, and select Playable Tool.

  3. ​Enter the playable URL and download the URL -

  • ​If the preview material is to be displayed using portrait orientation, disable the Horizontal Screen option.

  • ​If the ad preview needs to be displayed using landscape orientation, enable the Landscape Orientation option.

4. ​Click Test Playable to enter the Playable Ads preview.


Screenshots

Playable Ads-Testing for iOS Devices -PNG

For Android Devices

Get the Android Device Test Tool

To download the Android Device Testing Tool for Playable Ads, please click here.


Steps

  1. ​Download .apk and install.

  2. ​Enter app > Playable Test.

  3. ​Enter the Playable URL and Download URL.

    • ​If the preview material is to be displayed using portrait orientation, disable the Horizontal Screen option.

    • ​If the ad preview needs to be displayed using landscape orientation, enable the Landscape Orientation option.

  4. ​Click Test Playable to enter the Playable Ads preview.


Screenshots

Playable Ads-Testing for Android Devices -PNG

Creative Suggestions for Playable Ads

Element of Playable Ads

Creative suggestion

Playable creative

- Capture the essence of the game by allowing users to experience a real scenario from the game, using the best performing creative from your past campaigns.

- Explore materials relating to the core gameplay to create interactive elements, you can use special effects, numerical settings, and other methods to highlight the contrast.

- ​Explore different scenarios - 99% of people can't do this or only a genius can pass this level.

- Explore different levels of difficulty - easy, medium, hard.

- ​Ensure a link between the video and the Playable Ads. Recommended video duration is 10-25 seconds and a maximum of 30 seconds.

- Experiment with both vertical and horizontal creatives to gain more traffic.

- Pair the demo with exciting background music and eye-catching special effects.

Playable interactions

- ​Before the interaction

- ​Before the interaction, there must be a simple and clear guide (text, gestures, etc.) so that the user can understand and master the gameplay within 2 seconds.

- ​Play sound after the user has clicked on Playable Ads.

- ​If the user clicks and there is no follow-up action for 10 seconds, try to auto-play to the next scene.

- ​Before the interaction and if the ad needs to load:

- Shorten it and keep it within 1-2 seconds.

- We recommend having an animated guide so that the user will know what to expect before the Playable Ads starts.

- ​During the interaction

- ​Call_to_action can be present throughout the interaction to prompt a download.

- The button that will direct users to the app store should be present throughout the interaction so that users can click on it at any point during the interaction.

- During the interaction, other content areas, such as the game logo, game name, and game upgrade button area, are recommended to be set as clickable.

- ​After the interaction has ended

- ​We suggest displaying more information, including but not limited to the game icon, name, and title - which should all be clickable.

- The CTA button to download the game must be visible and obvious.


How to publish Playable Ads on TikTok Ads Manager

There are two aspects needed to publish Playable Ads:


  1. ​Upload Playable creative.

  2. ​Create Playable Ads.


To upload Playable creative

  1. ​Log in to TikTok Ads Manager.

  2. ​Go to Assets, click Creative, and select Playable list.

  3. ​Click Upload, then add your .zip file.


To create a Playable Ads

There are several requirements that need to be met at the Campaign, Ad Group, and Ad level to publish Playable Ads. To publish Playable Ads, follow the steps below:


  1. ​Log in to TikTok Ads Manager.

  2. ​Create a new campaign.

  3. ​Choose App Installs as your Advertising Objective.

  4. ​Under Placement, you must include Pangle as one of the Placements.

  5. ​For Targeting, go to Demographics, and click Location choose any market that is supported by Pangle.

  6. ​Under Ad Format check Single video.

  7. ​Then in the Playable module click +Add From Library or Add New to add your Playable Materials to the Ad Group.

  8. ​You may create another ad by pressing +Add and this will allow you to bind another video ad to your Playable Material.


Note: All ads in your ad group will be bound to a single Playable Material. If you wish to create ads that feature different Playable Material, you will need to create a new Ad Group.


Playable Ads-add Playable Materials-PNG

How to view performance data for Playable Ads

To view the performance data of your Playable Ads, go to Assets, click Creative, and then select the Playable Ads list. From this page, you can view core performance metrics from each Playable Ads, including the number of related ads, total cost, cost per mille (CPM), impressions, clicks, conversion, CTR, CVR, and cost per results.


Playable Ads-view performance data-PNG

FAQs

What is the difference between an Interactive Video Tool and a Template Tool? How do they differ in the design process?

These tools differ in the amount of freedom you have when producing an ad. The Interactive Video Tool allows you to independently construct scenarios and jump events from scratch while the Template Tool only allows you to replace the elements like images or audio confined to the existing templates. You are neither allowed to change the jump events in the templates provided by the Template Tool, nor adjust the procedure of those templates.


From the aspect of principles of ads design, Interactive Video Tool sets [an operation for a component/material in a scenario] or [completion of an auto-play of a component/material] as a trigger, which could trigger events such as [Jump scenario]/[Download app]. While Template Tool provides more diverse interactive functions including multiple clicks to trigger and line drawings. Each tool has its own advantages and disadvantages.


Would you please explain why there is no feedback after I click the [download] button when previewing the Playable Ads?

You are only allowed to check the Playable Ads during the preview process. Jump to the App Store is not supported. It is consistent with the expectation that no further interactions appear after the transmission area is clicked.


Why do I still need to click the video in the first scenario when previewing the Playable Ads even if I have set the video to auto-play? Would that affect the rate of trial?

If any interaction (video/audio/dynamic effect) is set in the first scenario, due to the limitation of browsers, you are required to click anywhere on the screen to play the Playable Ads when previewing through a browser. Playable Ads would automatically play as expected when being delivered online.

Content