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