Adify your windows store application

Published April 3, 2013 10:17 pm


I have added Microsoft advertising into one of our windows store app couple of months back, and have been following the pubcenter reporting to see how ads work. Lets talk a little bit on adifying your windows store application and few observations on what they fetch to app developer.

It is quite a simple process and well documented in msdn. Nevertheless, few observations – we make here – might be relevant for you and HTH. Details here will be for a javascript based windows store application.

  1. Download the Microsoft advertising sdk here
  2. In your visual studio project -> add reference  -> add the javascript library advertising.
  3. Follow this walk through to add the ad html snippet into your app.

Html snippet looks something like this.

<div id="myAd" style="position: absolute; top: 53px; left: 0px; width: 250px; height: 250px; z-index: 1;" 
   data-win-options="{applicationId: 'd25517cb-12d4-4699-8bdc-52040c712cab', adUnitId: '10043105'}" 
   data-win-control="MicrosoftNSJS.Advertising.AdControl">
</div>

To test the app with ad, test application id and test ad units needs to be used. The guid mentioned above is test application id. Test ad unit id will depend on the size of the ad unit. refer here.

Few things to keep in mind when testing the application with ad unit(s)

    1. width and height mentioned in the css do not match the size of the ad unit. ad won’t be served in this case.
    2. some times ads does not load because there are not ad available for the application. good to register for the error handler as mentioned here and put a break point in the method, to get the event with error message.
    3. Test your application with test ad units only, not real ad units. For real ad units, you have register your live account with Microsoft advertising and create ad units for your windows 8 application.
    4. I typically follow the practice of switching to test ad units for development. Microsoft advertising otherwise might think the app owner itself fetching ads for its application and/or clicking its own ads.
    5. To start with, you may want to just place the ad in the default.html as bottom/side or top bar. Eventually, you may want to customize, place right size ad units at right place in your app pages.
    6. Ad must catch the sight of the user at the end of the day and use appropriate empty slot on the page.
    7. Using too many ad units on a page, may spoil the app branding. Typically using one ad unit in a page might be good idea.
    8. Ad unit size and type will need to gel well with the page content so that page look-and-feel professional with ad. For example – sometime placing an ad unit 250x250px within the page, looks more suitable for a page than placing 729x90px bottom image bar
    9. Need to consider & test multiple page views – snapped, portrait, filled and landscape – for the ad unit(s) in the page. css styling with @media query can be used for the layout.
    10. We have used ad-area-host outer div to host the ad unit div. That gives flexibility to position the ad unit since the ad unit always have to size as specified during creation. snippet below allows to center the bottom ad bar.
 
<div class="ad-bottom-area-host">
    <div class="ad-area"
        data-win-control="MicrosoftNSJS.Advertising.AdControl" 
        data-win-options="{applicationId: d25517cb-12d4-4699-8bdc-52040c712cab', adUnitId: '10042998', onErrorOccurred: errorLogger }">
    </div>
</div>

/* below code is from the corresponding css file */
.ad-bottom-area-host
{
    -ms-grid-row: 3;
    -ms-grid-column-span: 2;
    height: 90px;
    display: -ms-flexbox;
    -ms-flex-direction: column;
    -ms-flex-align: center;
}

.ad-bottom-area-host .ad-area
{
    width: 728px;
    height: 90px;
}

ad-bottom-area-host is placed inside another grid and spans two column cells. it uses flexlayout to center the ad-area at the bottom of the page. ad-area is sized as per the requirements of the ad unit.

What ads fetch to the app developer:

  1. Everyone would think that ads fetch monetary returns to app developer. but typically it takes time if the app gets high usage.
  2. we have seen eCPM grow over time.
  3. The best thing that advertising fetches is the hourly reporting of impressions. given the impressions and fill rate – it gives rough indication of the usage of the app broken down to hour. given the app usage reporting in windows store analytics was broken, and continues to be broken – this data is useful.
  4. if you are new to advertising or app development, gives you the first hand feel of advertising & its jargon which you will not get by reading blogs or articles.

Are there other advertising networks that can be used for windows 8 store app? I did look briefly into it. but can talk about it in a separate post.

References

  1. Microsoft advertising sdk for window 8 – documentation

 

Comments

  1. Ken

    Do you know if pubcenter isn’t feeding ads to your app, can another provider be “called” to fill the gap?

  2. Sushil Baid Post author

    If you register for the error handler – you know the error code. If error code is NoAdAvailable, ad is not served.

    regards fetching ads from another provider, this will require to create a ad control that can layer ad controls from multiple vendors and control ad fetching yourself. I would think that autorefresh property is enabled by default in adcenter adcontrol. I have not done this but I remember seeing a blog entry for windows phone (not windows 8) which talked about this and referred to code at codeplex.