Mobile-friendly Studio HTML5 formats

To make it easier to create mobile-friendly creatives, Studio has retired mobile in-app as a separate format. Instead, Studio's HTML5 banner, expanding, and interstitial formats now work in any environment. Existing mobile in-app creatives won't change.

Going forward, when you build one of the three mobile in-app creative formats, instead of selecting the mobile in-app format, select the matching Studio universal format when you upload your creative to Studio:

Mobile in-app creative type	Studio format
Banner	Banner
Interstitial	Interstitial
Expanding	Expanding

Create once, run anywhere

The reason for the format change is to simplify creative authoring, trafficking, and delivery. Previously, completely different creatives needed to be built and trafficked to each environment. Now you can save time by building one creative and customizing it for each environment.

Changes for new creatives

As you make new creatives, you'll notice a few changes that reflect their compatibility with mobile placements.

In preview, mobile preview controls will be available for each of the universal formats (banner, interstitial, expanding).

In Campaign Manager 360, creative compatibility will include both compatibilities for each format:

Studio format	Campaign Manager 360 compatibility
Banner	Display
Expanding	Display
Interstitial	Display interstitial

Compatibility changes in Campaign Manager 360

In addition, Campaign Manager 360 is releasing compatibilities throughout November and December 2015. Compatibilities for creatives, placements, and ads no longer distinguish in-page from in-app. Rich media compatibilities will be updated to Display and Display interstitial.

These new compatibilities will be gradually applied across accounts. When they're applied, the new compatibilities represent Campaign Manager 360 creatives, placements, and ads that are compatible with any environment: desktop, mobile web, and within an app.

New compatibility	Old compatibility	Rendering ability
Display	In-page, In-app	In a mobile app or on a webpage
Display interstitial	In-page interstitial In-app interstitial	Displayed full-screen in a mobile app or on a webpage

Detect creative environment at serving time

Now that one creative can be served to any environment, you can customize your creative experience for mobile and for desktop. For example, you may have a button that says "Click to expand". This call-to-action is fine for desktop display, but for mobile in-app display, you may want to use "Tap to expand" instead.

Avoid showing two close buttons in mobile apps

If you build your creative as either Expanding or Interstitial formats, note that mobile app ad SDKs automatically add their own close button over the creative. If you already have a close button in your creative, the creative will have two close buttons. To hide the MRAID close button, use the Enabler method setUseCustomClose. (See the sample code below.)

Environment detection sample code

var initAd = function() {
  if (studio.common.Environment.hasType(studio.common.Environment.Type.IN_APP)) {
    // Show in-app "Tap to expand" call to action.
    document.getElementById("cta_text").textContent = "Tap to expand";
    // Hide the MRAID close button and use the creative's close button instead.
    Enabler.setUseCustomClose(true);
  } else {
    // Show desktop "Click to expand" call to action.
    document.getElementById("cta_text").textContent = "Click to expand";
  }
};

Was this helpful?

How can we improve it?