BRANDED MINI-GAMES

Branded Mini Games are short mobile web games packed with powerful social features. They are fully customisable to any brand and run well on laptop, tablet, mobile or within an app.

Guide for Video Playable Ads Specs and Setting Options

Follow

Table of Contents

  1. How to insert basic Ad information
  2. How to insert CTA link, file path and Ad size
  3. How to call APIs for logging data
  4. How to set options

 

 

1. How to insert basic Ad information 

Any {Macro} information can be inserted into the userADInfo. The information inserted will be mapped to each {macro} area in the URL when end-users click the CTA link. 

 

userADInfo structure for basic information

var userADInfo = {
    ad_code    : "{ad_code}",
    scode      : "{scode}",
    timestamp  : "{timestamp}"
};

 

Original url

https://demo.html?ad_code={ad_code}&scode={scode}&timestamp={timestamp}

Mapped url

https://demo.html?ad_code=1234&scode=abcd&timestamp=abcd1234

 

1) TagCode type can insert your information into the userADInfo directly.

2) URL type can insert your information using URL paramters, and will be added to the userADInfo automatically.

For example, given the parameter below, the userADInfo will be adjusted to show the campaign number at the end.

NOTE, About the campaign_no=7777, it is newly added in the userADInfo structure and it will be added at the last of userADInfo(After) automatically.

 

http://demo.html?ad_code=1234&scode=abcd&timestamp=abcd1234&campaign_no=7777

 

(Before) 

var userADInfo = {
    ad_code    : "{ad_code}",
    scode      : "{scode}",
    timestamp  : "{timestamp}"
};

(After) 

var userADInfo = {
    ad_code    : "1234",
    scode      : "abcd",
    timestamp  : "abcd1234",
campaign_no: "7777" };

 

 

2. How to insert CTA link, file path and Ad size

var adInfo = {
    ...
    clicktag            : "https://play.google.com/store/apps/details?id=com.mobirix.gs2016",
    clicktag_Android    : "https://play.google.com/store/apps/details?id=com.mobirix.gs2016",
    clicktag_IOS        : "https://itunes.apple.com/us/app/guardian-soul-legion/id1159202815?mt=8",
    filepath            : "http://cloudfront.net/mbiz/guardiansoul/v1/",
width : 0,
height : 0,
rotate90 : false,
...
}
Variable Description
clicktag (required) On clicking the CTA on a PC or any other platform, the URL must be moved
clicktag_android (required) On clicking the CTA on an Android platform,  the URL must be moved
clicktag_IOS

(required) On clicking the CTA on an iOS platform, the URL must be moved

*If a separate URL is not needed for Android, iOS, or PC, then the same URL can just be inserted.

filepath

(required) The file path for the Video Playable Ad must be uploaded.

*NOTE, URL type does not need to insert the filepath.

ex) filepath : "",

width, height

Set the certain screen size of the Video Playable Ad.

*If the width and height is set to 0, the screen size will be set automatically.

ex) "width": 400, "height":300

image4.png

rotate90

Rotate the game screen to clockwise 90 degrees.

false: No rotate, true: Rotate 90 degrees

ex) "rotate90": false

image5.png

ex) "rotate90": true

image9.png

 

 

3. How to call APIs for logging data

var GAME = { 
    START: function (){
        console.log("GAME start!!");
    },
    FINISH: function (){
        console.log("GAME finish!!");
          
        ///////////////////////////////////////////////////
        // API Call
        //ex)CallAPI(url_parameter, GET or POST ,  function(res){});
        ///////////////////////////////////////////////////
        //CallAPI('https://..getData.php?param1=1&param2=abc', 'GET',  function(res){console.log(res);});
        ///////////////////////////////////////////////////
    },
        
    CONTINUE: function(){
        console.log("GAME continue!!");
    }
};
Method Description
START Call this method when the game is started.
FINISH Call this method when the game is ended.
CONTINUE Call this method when the CTA button is clicked.

*Information can be gathered using APIs such as: game started / game ended / CTA button clicked.

The CallAPI function can be used to collect game information.

ex) API + parameters

https://..getData.php?param1=1&param2=abc
CallAPI(url_parameter, GET or POST ,  function(res){});

 

 

4. How to set options

1) Setting Options - TagCode type

adInfo.mbizSetting = {
    "country": "",
    "mbizloading":"off",
    "XButtonTime": 5,
    "x-button-time": 5,
    "XButtonCountDown": "off",
    "x-button-location": "top-right",
    "TouchGuide" : "on"     
};   
Variable Description
XButtonTime Shows the remaining time to display the close button. (1~999)
x-button-time

Shows the remaining time to display the close button. (1~999)

*(XButtonTime and x-button-time should be the same value.)

ex)

XButtonTime = 7

x-button-time = 7

image4.png

XButtonCountDown

When set to ON shows the remaining time display, When set to OFF shows the close button. (on / off)

ex)

XButtonCountDown = "on"

image4.png

XButtonCountDown = "off"

image1.png

x-button-location

Sets the location of the close button on the screen. (top-left / top-right)

ex)

x-button-location = "top-left"

image6.png

x-button-location = "top-right"

image5.png

TouchGuide

Turns the touch and drag guide line ON or OFF. (on / off)

ex) TouchGuide = "on"

image2.png

  

 

2) Setting Options - URL type

4 parameters of URL type are offered for Video Playable Ads. Setting options are given by: xtime / xcountonoff / xlocation / tguideonoff / width / height / rotate90

 

http://play.video.ad/index_dev.html?
    xtime=10&
    xcountonoff=on&
    xlocation=top-left&
    tguideonoff=off&
width=400&
height=300&
rotate90=1

 

Variable Description
xtime

Shows the remaining time to display the close button. (1~999)

ex) xtime=7

image4.png

xcountonoff

When set to ON shows the remaining time display, When set to OFF shows the close button. (on / off)

ex)

xcountonoff=on

image4.png

xcountonoff=off

image1.png

xlocation

Sets the location of the close button on the screen. (top-left / top-right)

ex)

xlocation=top-left

image6.png

xlocation=top-right

image5.png

tguideonoff

Turns the touch and drag guide line ON or OFF. (on / off)

ex) tguideonoff=on

image2.png

width, height

Set the certain screen size of the Video Playable Ad.

*If the width and height is set to 0, the screen size will be set automatically.

ex) "width": 400, "height":300

image4.png

rotate90

Rotate the game screen to clockwise 90 degrees.

0: No rotate, 1: Rotate 90 degrees

ex) rotate90 = 0

image5.png

ex) rotate90 = 1

image9.png

 

Comments