How to Create TikTok Playable Ads Tutorial

/in , , /by

Create TikTok Playable Ads Tutorial

Follow these steps to create and publish playable ads for TikTok Ads.

Overview

This guide will show you how to create and publish playable ads for TikTok Ads with 2DKit in just a couple minutes using your videos and images with easy-to-use 2DKit templates.

2DKit supports one-click publishing for TikTok Ads playable ad creatives.

The total file size of this playable ad, a Shoot ‘Em Up game will be 239 KB (without gzip).

Since 2DKit delivers such small file sizes it is easy to stay under TikTok‘s 3 MB limit.

The published build contains a zip file with an index.html in the folder root.

Additionally all of the TikTok’s requirements and API integration are automatically handled when 2DKit projects are published as TikTok Playable Ads.

Video Tutorial

Play Now: TikTok Playable Ads 2DKit Tutorial

Sample Project

http://developer.2dkit.com/samples/playable-ad-shmup.zip

Handling the Call to Action

Handling the call to action with an Action in 2DKit Creator.

Drag the NotifyAdClicked action from the ez package folder.

This will call window.openAppStore();  if available.

A good place to put this call to action is in an end card game over screen.

Handling the call to action with code.

Add the following code to your game to handle the call to action.

System.notifyAdClicked();

This will call window.openAppStore(); if available.

Publishing the Ad

To publish select the following menu option in 2DKit Creator:

Build->Playable Ads->Publish TikTok Playable Ad

2DKit will handle building the output in a way that is consistent with TikTok Ads’ requirements.

In addition 2DKit will also automatically optimize all files in a way that typically results in a 70-90% reduction in file size.

In the received zip file, unzip and locate the html file to verify that the index.html file is present.

Final Deliverable

The tiktok_ad.zip file is the only file that should be delivered for TikTok Ads. 

Playable Ad Settings

After you create your playable ad in 2DKit Creator select

Project->Project Settings

Then select the Playable Ads tab.

Testing in the TikTok Tool

Go to Tiktok Ads Manager -> Assets -> Creative

Then select the Playable Ads tab

Click Upload button

Then you will see an interactive preview and you can get a URL and a QR code.

Relevant Classes

http://developer.2dkit.com/api/ez/NotifyAdClicked.html

http://developer.2dkit.com/api/kit/System.html#notifyAdClicked

More info

2DKit Playable Ads Guide

How to Create CrossInstall Playable Ads Tutorial

/in , , , /by

CrossInstall

Playable Ads Tutorial :

How to Create Playable Ads for CrossInstall

Follow these steps to create and publish CrossInstall ( MoPub / Twitter ) playable ads.

Overview

This guide will show you how to create and publish a playable ad for CrossInstall with 2DKit in just a couple minutes.

The total file size of this playable ad, a Shoot ‘Em Up game will be 239 KB (without gzip).

Sample Project

http://developer.2dkit.com/samples/playable-ad-shmup.zip

Relevant Classes

http://developer.2dkit.com/api/ez/NotifyAdClicked.html

http://developer.2dkit.com/api/kit/System.html#notifyAdClicked

Handling the Call to Action

Handling the call to action with an Action in 2DKit Creator.

Drag the NotifyAdClicked action from the ez package folder.

When published for CrossInstall, this will call ( window.parent.postMessage(‘click_go’, ‘*’ ).

A good place to put this call to action is in an end card game over screen.

Handling the call to action with code.

Add the following code to your game to handle the call to action.

System.notifyAdClicked();

When published for CrossInstall, this will call ( window.parent.postMessage(‘click_go’, ‘*’ ).

Publishing the Ad

To publish select the following menu option in 2DKit Creator:

Build->Publish CrossInstall Ad

2DKit will handle building the output in a way that is consistent with CrossInstall’s requirements.

In addition 2DKit will also automatically optimize all files in a way that typically results in a 70-90% reduction in file size.

You will receive a zip containing the html file that should be used in the campaign.

You will also receive a working link that can be used to streamline testing and iteration as described below.

Testing with Creative Preview App

Creative Preview is an Android and iOS mobile app for previewing mobile creatives on a phone or tablet.

After installing the Creative Preview app, following these steps to manually add a creative from the 2DKit URL you receive after publishing.

  1. Tap Add add creative button, then tap Display.
  2. Enter a name for the preview.
  3. Enter the creative’s URL you received after publishing via 2DKit (e.g. https://youridgoeshere.apps.2dkit.com/crossinstall-ad) .
  4. Select the ad type,”Interstitial”. 
  5. Enter the width and height of the creative.
  6. Tap the Load Interstitial button (if displayed).
  7. You should now see the creative displayed on your device.

Note that in order to test the CTA (call to action) click, the creative must be deployed to CrossInstall.

How to Create AppLovin Playable Ads Tutorial

/in , , , , , , , , /by

How to Create AppLovin Playable Ads in 2DKit

Follow these steps to create and publish your playable ads for AppLovin ad network.

Overview

This guide will show you how to create and publish playable ads for AppLovin ad network with 2DKit in just a couple minutes.

The total file size of this playable ad, a Shoot ‘Em Up game will be 239 KB (without gzip).

Sample Project

http://developer.2dkit.com/samples/playable-ad-shmup.zip

Playable Ad Settings

After you create your playable ad in 2DKit Creator select

Project->Project Settings

Then select the Playable Ads tab.

Enter the Google Play and Apple AppStore URLs for your promoted app.

Note: some testers require an AppStore URL that begins with itunes.apple.com instead of apps.apple.com.

Handling the Call to Action

Handling the call to action with an Action in 2DKit Creator.

Drag the NotifyAdClicked action from the ez package folder.

This will call mraid.open() or mraid.openStoreUrl() if available.

A good place to put this call to action is in an end card game over screen.

Handling the call to action with code.

Add the following code to your game to handle the call to action.

System.notifyAdClicked();

This will call mraid.open() or mraid.openStoreUrl() if available.

Publishing the Ad

To publish select the following menu option in 2DKit Creator:

Build->Playable Ads->Publish AppLovin Playable Ad

2DKit will handle building the output in a way that is consistent with AppLovin’s requirements.

In addition 2DKit will also automatically optimize all files in a way that typically results in a 70-90% reduction in file size.

In the received zip file, unzip and locate the folder named applovin-ad.

Then locate the index.html file the the applovin-ad folder, which is a single html file with no external assets,

Testing Applovin

To test go here and upload the index.html file.

Click Here: AppLovin Playable Preview Tool

Make sure the above URL ends with &qr=1 in order to get the QR code for the next step.

Device Testing Applovin

Then open the QR code received in the step above in the Applovin iOS and Android apps here–

iOS and Android.

Testing MRAID

To test go here and select the MRAID 2.0 and Interstitial option.

http://webtester.mraid.org/

Review that all of the specs in the Prepare tab match the settings for the device you are planning to launch on

  1. Change the Default ad size (w x h) to 320 x 480 so you can get the full screen experience
  2. Change Default ad position (top, left) to 0, 0
  3. From Placement drop-down menu, select “Interstitial”
  4. Optional: Uncheck all the options for “Native features to emulate”
  5. Select Next button
  6. Paste MRAID tags (received from 2DKit) in the Flight tab and click Render
  7. Play through and click the CTA to verify it shows a confirmation about the CTA being clicked.
  8. Review the test window and the console windows to verify that everything looks good and there are no errors.

MraidProperties

Relevant Classes

http://developer.2dkit.com/api/ez/NotifyAdClicked.html

http://developer.2dkit.com/api/kit/System.html#notifyAdClicked

More info

https://www.iab.com/wp-content/uploads/2015/08/IAB_MRAID_v2_FINAL.pdf

How to Create AdColony Playable Ads Tutorial

/in , , , /by

How to Create AdColony Playable Ads with 2DKit

Follow these steps to create and publish AdColony playable ads for AdColony ad network.

Overview

This guide will show you how to create and publish playable ads for AdColony ad network with 2DKit in just a couple minutes.

The total file size of this playable ad, a Shoot ‘Em Up game will be 239 KB (without gzip).

Sample Project

http://developer.2dkit.com/samples/playable-ad-shmup.zip

Relevant Classes

http://developer.2dkit.com/api/ez/NotifyAdClicked.html

http://developer.2dkit.com/api/kit/System.html#notifyAdClicked

Playable Ad Settings

After you create your playable ad in 2DKit Creator select

Project->Project Settings

Then select the Playable Ads tab.

Enter the Google Play and Apple AppStore URLs for your promoted app.

Note: some testers require an AppStore URL that begins with itunes.apple.com instead of apps.apple.com.

Handling the Call to Action

Handling the call to action with an Action in 2DKit Creator.

Drag the NotifyAdClicked action from the ez package folder.

This will call mraid.open() or mraid.openStoreUrl() if available.

A good place to put this call to action is in an end card game over screen.

Handling the call to action with code.

Add the following code to your game to handle the call to action.

System.notifyAdClicked();

This will call mraid.open() or mraid.openStoreUrl() if available.

Publishing the Ad

To publish select the following menu option in 2DKit Creator:

Build->Playable Ads->Publish AdColony Playable Ad

2DKit will handle building the output in a way that is consistent with AdColony’s requirements.

In addition 2DKit will also automatically optimize all files in a way that typically results in a 70-90% reduction in file size.

In the received zip file, unzip and locate the folder named adcolony-ad.

All the required files can be found in this folder.

Testing

To test go here and select the MRAID 2.0 and Interstitial option.

http://webtester.mraid.org/

Review that all of the specs in the Prepare tab match the settings for the device you are planning to launch on

  1. Change the Default ad size (w x h) to 320 x 480 so you can get the full screen experience
  2. Change Default ad position (top, left) to 0, 0
  3. From Placement drop-down menu, select “Interstitial”
  4. Optional: Uncheck all the options for “Native features to emulate”
  5. Select Next button
  6. Paste MRAID tags (received from 2DKit) in the Flight tab and click Render
  7. Play through and click the CTA to verify it shows a confirmation about the CTA being clicked.
  8. Review the test window and the console windows to verify that everything looks good and there are no errors.

MraidProperties

More info

https://www.iab.com/wp-content/uploads/2015/08/IAB_MRAID_v2_FINAL.pdf

How to Create Chartboost Playable Ads Tutorial

/in , , , /by

Chartboost

Playable Ads Tutorial :

How to Create Playable Ads for Chartboost

Follow these steps to create and publish playable ads for Chartboost.

Overview

This guide will show you how to create and publish playable ads for Chartboost ad network with 2DKit in just a couple minutes.

The total file size of this playable ad, a Shoot ‘Em Up game will be 239 KB (without gzip).

Sample Project

http://developer.2dkit.com/samples/playable-ad-shmup.zip

Relevant Classes

http://developer.2dkit.com/api/ez/NotifyAdClicked.html

http://developer.2dkit.com/api/kit/System.html#notifyAdClicked

Playable Ad Settings

After you create your playable ad in 2DKit Creator select

Project->Project Settings

Then select the Playable Ads tab.

Enter the Google Play and Apple AppStore URLs for your promoted app.

Note: some testers require an AppStore URL that begins with itunes.apple.com instead of apps.apple.com.

Handling the Call to Action

Handling the call to action with an Action in 2DKit Creator.

Drag the NotifyAdClicked action from the ez package folder.

This will call mraid.open() or mraid.openStoreUrl() if available.

A good place to put this call to action is in an end card game over screen.

Handling the call to action with code.

Add the following code to your game to handle the call to action.

System.notifyAdClicked();

This will call mraid.open() or mraid.openStoreUrl() if available.

Publishing the Ad

To publish select the following menu option in 2DKit Creator:

Build->Playable Ads->Publish Chartboost Playable Ad

2DKit will handle building the output in a way that is consistent with Chartboost’s requirements.

In addition 2DKit will also automatically optimize all files in a way that typically results in a 70-90% reduction in file size.

In the received zip file, unzip and locate the folder named chartboost-ad.

The MRAID tags will be sent along with the zip.

Single html file with all assets embedded

For networks that require a single html file with no external assets, use the index.html file the the mraid-ad folder.

Self-hosting

If self-hosting is preferred from the received zip file, unzip and locate the folder named chartboost-ad and upload it to your server.

Testing

To test go here and select the MRAID 2.0 and Interstitial option.

http://webtester.mraid.org/

Review that all of the specs in the Prepare tab match the settings for the device you are planning to launch on

  1. Change the Default ad size (w x h) to 320 x 480 so you can get the full screen experience
  2. Change Default ad position (top, left) to 0, 0
  3. From Placement drop-down menu, select “Interstitial”
  4. Optional: Uncheck all the options for “Native features to emulate”
  5. Select Next button
  6. Paste MRAID tags (received from 2DKit) in the Flight tab and click Render
  7. Play through and click the CTA to verify it shows a confirmation about the CTA being clicked.
  8. Review the test window and the console windows to verify that everything looks good and there are no errors.

MraidProperties

More info

https://www.iab.com/wp-content/uploads/2015/08/IAB_MRAID_v2_FINAL.pdf

How to Create Facebook Playable Ads Tutorial

/0 Comments/in , , , , , , /by

How to Create Facebook Playable Ads Tutorial

Learn how to create and publish Facebook Playable Ad campaigns using 2DKit.

2DKit Facebook Playable Ads load instantly without sacrificing premium features or quality.

They can be created in minutes using our professional-grade HTML5 game engine and visual tools.

Already have an account?  Go here for the 2DKit Facebook Playable Ads Tutorial Guide

Facebook Playable Ads Creation Video

This 2 minute Facebook Playable Ads video shows how to create and publish a premium quality Slingshot Birds playable ad (~300 KB).

Learn How to Create Facebook Playable Ads with the 2DKit Guide

Go here to learn in detail what you need to know to work with Facebook Playable Ads in 2DKit.

Facebook Playable Ads Guide

Rapidly Create Facebook Playable Ads with Visual Tools

Faster initial creative development allows more time to be spent focused on creative optimization.

  • Create your playables in minutes with intuitive visual editor
  • Drag and drop interface for media professionals
  • Simplified wizards for designers
  • Customizable game templates
  • Visual scripting features drag and drop logical building blocks and UI widgets
  • Coding not required but power users and engineers have access to complete game engine SDK

Instant Loading

Proven industry leader when it comes to smallest file sizes for playable ads and instant games without sacrificing quality.

Don’t lose users while the playable is loading.