Overview

This guide will show you how to create and publish playable ads for MRAID 2.0-compliant ad networks 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 this menu option:

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 using the onPointerUp or onClick handler.

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 MRAID Playable Ad

2DKit will handle building the output in a way that is consistent with MRAID 2.0 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 mraid-ad.

The MRAID tags will be sent along with the zip.

If you don’t require click tag support remove this line from your tags–

var CLICK_TAG = "https://playables.2dkit.com/clicked";

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 mraid-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.

Device Testing

There are several options for testing MRAID ads on devices depending on your requirements.  For recommendations please email support@2dkit.com.

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