Reset the back of your Tile through push

Have you ever created the back of your tile with a Push notification? You just add some xml in the Notification Message that you send to the Notification Channel.

<wp:BackBackgroundImage>http://someurlinthewild.com/BackTileBackground.png</wp:BackBackgroundImage>
<wp:BackTitle>Back</wp:BackTitle>
<wp:BackContent>Content</wp:BackContent>

Yeah that’s easy. Ever tried to get rid of it using a Push notification? Yeah, trying to push without content. Thought that should work as well, didn’t. Leaving the full Xml elements from the Push Notification? Didn’t work either. You explicitly have to add an attribute Action and give it the value Clear, like this:

<wp:BackBackgroundImage Action="Clear"></wp:BackBackgroundImage>
<wp:BackTitle Action="Clear"></wp:BackTitle>
<wp:BackContent Action="Clear"></wp:BackContent>

This works for the Title and Count properties for the front of your tile as well. This can all be found in the documentation for Push Notifications as well, but today it took me some time to figure this out.

Unified Ad for Windows Phone - Part 4 - GenericAdProviderForXaml

Alright, we have signed up to a lot of Ad Providers in Part 1, setup the Unified Ad control in Part 2 and even implemented the Remote Ad Provider configuration in Part 3. What’s next?

The Generic Ad Provider for Xaml

Think of the Generic Ad Provider as a very simple AdProvider. It can show Xaml and that’s basically it. You could use this Ad Provider for example to market your own applications within your own applications. So a piece of Xaml with a little bit of text and an HyperlinkButton that links to a Uri. And after a minute the Ad Provider will rotate to the next Ad Provider. The Xaml can be much more complex, we will come up to that in a moment. But first see a small example Ad in Xaml.

<Grid xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      Width="480"
      Height="80"
      Background="{StaticResource PhoneBackgroundBrush}">
    <Border BorderBrush="{StaticResource PhoneAccentBrush}"
            BorderThickness="1">
        <Grid>
            <TextBlock Text="WP Unified Ad"
                       Foreground="{StaticResource PhoneAccentBrush}" Margin="0"
                       VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="35"/>
            <HyperlinkButton NavigateUri="http://wpunifiedad.codeplex.com"
                             HorizontalAlignment="Stretch"
                             VerticalAlignment="Stretch">
            </HyperlinkButton>
        </Grid>
    </Border>
</Grid>

Where do we put the Xaml?

Ideal it would be on a remote server. But if you don’t have the remote server or you want to have a fallback ad in case the remote server isn’t available you can use the OfflineContent property of the GenericAdProvider.

If you do have the remote server you can set the XamlUri property to the remote Url. In case you want to some more intelligent stuff, like a special ad for each country, or making sure you do something special for the current application, you can make use of the format parameters. The first {0} argument will be replaced by the ApplicationID and the second {1} argument will be replace by the CountryCode. So let’s say I have a server app that returns ads for me, my XamlUri could be configured like this:

http://someurlontheinternet.com/ProvideAd?Country={1}&AppId={0}

If you don’t need one or both arguments you could omit them off course.

Using Phone Styles

If you want to make sure that the advertisements have the same color palette as the Phone settings you can even make use of the usual Phone Resources. Like this example where the Background is set to the PhoneBackgroundBrush and the Border and Text to the PhoneAccentBrush.

<Grid Width="480"
        Height="80"
        Background="{StaticResource PhoneBackgroundBrush}">
    <Border BorderBrush="{StaticResource PhoneAccentBrush}"
            BorderThickness="1">
        <Grid>
            <TextBlock Text="WP Unified Ad"
                        Foreground="{StaticResource PhoneAccentBrush}"
                        Margin="0"
                        VerticalAlignment="Center"
                        HorizontalAlignment="Center"
                        FontSize="35" />
        </Grid>
    </Border>
</Grid>

How to add links

The easiest way to add a link is to put a HyperlinkButton on top of the full Xaml. You don’t have to give it a visual appearance as long as you make it stretch to the full Ad space. Put the Uri you want to link to in the NavigateUri. What? Yes put the Uri in the NavigateUri. But won’t that only work for navigation inside the application, from page to page? Yes but this is improved navigation.

  • http://anythingontheweb.com” and “https://anythingontheweb.com” will start the WebBrowserTask
  • “marketplace://search/some content” will start the MarketplaceSearchTask with “some content” as query.
  • “marketplace://review” will start the MarketplaceReviewTask for the current application.
  • “marketplace://detail” will start the MarketplaceDetailTask for the current application.
  • “marketplace://detail/5f171b43-6ea8-e011-a53c-78e7d1fa76f8” will start the MarketplaceDetailTask for the application with the mentioned ID.

This will enable you to create simple ads that show a webpage. But if you want more, like for example market your other apps you can do this as well.

Complex Ads

I’m not the best designer, but I know a little about Xaml. So I was interested to see if I could get a more complex Ad working. The below Ad for example has a Storyboard attached that changes the opacity of two elements. Sounds easy, it is easy. Just think about what more nice things you can do instead.

<Grid xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      Width="480"
      Height="80"
      Background="{StaticResource PhoneBackgroundBrush}">
	<Grid.Resources>
		<Storyboard x:Name="Storyboard" AutoReverse="True" RepeatBehavior="Forever">
			<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="One">
				<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
				<EasingDoubleKeyFrame KeyTime="0:0:2" Value="1"/>
				<EasingDoubleKeyFrame KeyTime="0:0:3" Value="0"/>
				<EasingDoubleKeyFrame KeyTime="0:0:5" Value="0"/>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Two">
				<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
				<EasingDoubleKeyFrame KeyTime="0:0:2" Value="0"/>
				<EasingDoubleKeyFrame KeyTime="0:0:3" Value="1"/>
				<EasingDoubleKeyFrame KeyTime="0:0:5" Value="1"/>
			</DoubleAnimationUsingKeyFrames>
		</Storyboard>
	</Grid.Resources>
    <Border BorderBrush="{StaticResource PhoneAccentBrush}"
            BorderThickness="1">
        <Grid>
            <Grid x:Name="One">
        		<TextBlock Text="WP Unified Ad"
        			Foreground="{StaticResource PhoneAccentBrush}" Margin="0"
        			VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="35"/>
        	</Grid>
            <Grid x:Name="Two" Opacity="0">
            	<TextBlock Text="by Mark Monster"
            		Foreground="{StaticResource PhoneAccentBrush}" Margin="0"
            		VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="35"/>
            </Grid>
            <HyperlinkButton NavigateUri="http://wpunifiedad.codeplex.com"
                             HorizontalAlignment="Stretch"
                             VerticalAlignment="Stretch"/>
        </Grid>
    </Border>
</Grid>

Unified Ad for Windows Phone - Part 3 - Remote Ad Provider configuration

Did you read the previous parts?

Part 1 – Introduction

Part 2 – Basic Usage

Done? Let’s continue with Part 3, configure the Ad Providers from a remote location.

Step 1, Add the RemoteAdProviderStrategy

Okay, let’s forget about the default AdProviderStrategy. The default just rotates between the different AdProviders, we want more. First we set the AdProviderStrategy property of the AdControl. Just like this.

<Ads:AdControl.AdProviderStrategy>
    <Strategy:RemoteAdProviderStrategy xmlns:Strategy="clr-namespace:MC.Phone.Ads.Strategy;assembly=MC.Phone.Ads" />
</Ads:AdControl.AdProviderStrategy>

Step 2, Create a configuration file

It could very well be that you already have a functional configuration file. When you for example made use of Windows Phone 7 Ad Rotator you already have a configuration file that’s fully compatible with the Unfied Ad. But if you want the full power of the Unified Ad you have to use a different configuration file structure. Xml files explain best by showing an example file.

<?xml version="1.0" encoding="utf-8" ?>
<AdSettings>
  <CountryDescriptors>
    <AdCountryDescriptor Country="US, GB">
      <Probability Value="70" AdProvider="None" />
      <Probability Value="10" AdProvider="AdMob" />
      <Probability Value="10" AdProvider="MobFox" />
      <Probability Value="10" AdProvider="AdDuplex" />
    </AdCountryDescriptor>
    <AdCountryDescriptor Country="DE">
      <Probability Value="15" AdProvider="PubCenter" />
      <Probability Value="15" AdProvider="AdMob" />
      <Probability Value="20" AdProvider="AdDuplex" />
      <Probability Value="50" AdProvider="None" />
    </AdCountryDescriptor>
    <AdCountryDescriptor>
      <Probability Value="20" AdProvider="PubCenter" />
      <Probability Value="20" AdProvider="AdMob" />
      <Probability Value="20" AdProvider="AdDuplex" />
      <Probability Value="20" AdProvider="Smaato" />
      <Probability Value="20" AdProvider="MobFox" />
    </AdCountryDescriptor>
  </CountryDescriptors>
</AdSettings>

Let examine the last AdCountryDescriptor element lines 16-22. Because this AdCountryDescriptor element doesn’t have a Country property this will be the default configuration to fall back to when there isn’t any other that matches the country of the user.

Inside the AdCountryDescriptor elements there are Probabilty elements, they consist of two values: a probability and an AdProvider name. You can best compare the Probabilty with the chance in percentage that the specific Ad Provider is chosen during AdRotation. If you don’t want an AdProvider to be shown during rotation you either put the probability to 0, but better just remove the element. The AdProvider property is the name of the AdProvider that has to be filled in. Currently that would be one of these AdProviders: AdMob, MobFox, AdDuplex, PubCenter, Smaato, InnerActive, None and GenericAdProviderForXaml.

If you want no ads to be displayed for a certain percentage of the time you should use the None AdProvider. In a future post we will discuss the GenericAdProviderForXaml, for now just see it as a remote location where you put some Xaml that will be displayed as an Ad.

So we now have a default configuration, what about specific country configurations? Yes important of course, by specifying the Country attribute of the AdCountryDescriptor element you can specify to which countries a specific configuration belongs. Which could be one country, or multiple countries. Each country is only allowed once in the configuration but you can specify multiple countries for one configuration by separating the country-codes by a “,”. For the country-codes make sure you use the two-letter codes from the ISO_3166-1, so for the UK this is GB.

Step 3, Where to put this configuration file?

Put it somewhere on a webserver where it’s accessible through http or https. Though if you don’t want to configure it remotely but ship this Xml file as part of your application that’s fine as well. But be aware that the only way to change your shipped configuration file is by shipping a new version of your application. But to have local configuration file makes sense even if you have a remote configuration file. When for example your remote config file cannot be accessed (could be any reason) the RemoteAdProviderStrategy will fallback to the local configuration file. So let’s configure the strategy accordingly.

<Ads:AdControl.AdProviderStrategy>
    <Strategy:RemoteAdProviderStrategy xmlns:Strategy="clr-namespace:MC.Phone.Ads.Strategy;assembly=MC.Phone.Ads"
                                        LocalProviderSettingsUri="Ads/AdSettings.xml"
                                        RemoteProviderSettingsUri="http://someurlinthewild.com/ads.xml" />
</Ads:AdControl.AdProviderStrategy>

The RemoteProviderSettingsUri needs to be filled with the remote location url. So put the file somewhere on an internet website, your own is probably the best so that you can easily change it when you want to. The local provider settings can be used as alternative to the remote location in case you don’t want to remotely configure your ads but it could also be used as fallback when the remote url is not available for some reason. For the LocalProviderSettingsUri you need to be aware that it’s an ResourceUri, not an internet Uri. This means that if your xml file has a BuildAction “Content” you can put a simple relative Uri in there, like in the above example. If you would add the Xml file with BuildAction “Resource” you would have to use an Uri like this “/MC.Phone.Ads.Example;component/Ads/AdSettings.xml”.

Hope this explains the Remote Ad Provider configuration a little bit. Please post any questions.

Unified Ad for Windows Phone - Part 2 - Basic Usage

Time for Part 2 of the Unified Ad for Windows Phone series. Also read part 1 for the introduction of the Unified Ad for Windows Phone. We covered the reason why we want the Unified ad for Windows Phone control and also registered for a couple of Ad Providers. Let’s start with implementing the Unified ad control in our application.

Install the NuGet Package for Unified Ad for Windows Phone

Start managing your NuGet Packages for your Windows Phone project. Search for “wpunifiedad” and click install.

Manage NuGet Packages, search for wpunifiedad

Go to one of your pages, for example “MainPage.xaml” and add the following Xaml in for example the ContentPanel Grid.

<Ads:AdControl x:Name="AdBasic"
                FallbackAdProviderName="AdDuplex"
                IsTest="True"
                xmlns:Ads="clr-namespace:MC.Phone.Ads;assembly=MC.Phone.Ads"
                xmlns:PubCenter="clr-namespace:MC.Phone.Ads.PubCenter;assembly=MC.Phone.Ads.PubCenter"
                xmlns:Smaato="clr-namespace:MC.Phone.Ads.Smaato;assembly=MC.Phone.Ads.Smaato"
                xmlns:MobFox="clr-namespace:MC.Phone.Ads.MobFox;assembly=MC.Phone.Ads.MobFox"
                xmlns:AdMob="clr-namespace:MC.Phone.Ads.AdMob;assembly=MC.Phone.Ads.AdMob"
                xmlns:Provider="clr-namespace:MC.Phone.Ads.Provider;assembly=MC.Phone.Ads"
                xmlns:AdDuplex="clr-namespace:MC.Phone.Ads.AdDuplex;assembly=MC.Phone.Ads.AdDuplex">
    <Ads:AdControl.AdProviders>
        <Provider:GenericAdProviderForXaml XamlUri="http://remoteurlontheinternet.com/Ad.xaml?appid={0}" />
        <Provider:NoneAdProvider />
        <AdDuplex:AdDuplexAdProvider App="" />
        <AdMob:AdMobAdProvider AdUnit="" />
        <MobFox:MobFoxAdProvider Publisher="test" />
        <Smaato:SmaatoAdProvider AdSpace="0"
                                    Publisher="0" />
        <PubCenter:PubCenterAdProvider Application=""
                                        AdUnit="" />
        <!--InnerActive is not really suitable for the Ad Rotation because it doesn't have any events to react on.-->
        <!--<InnerActive:InnerActiveAdProvider App="" />-->
    </Ads:AdControl.AdProviders>
</Ads:AdControl>

Lines 12 to 22 are the AdProviders that are available for the Unified ad control. Just remove the elements for the AdProviders that you’re not using or planning to use. For now also remove the GenericAdProviderForXaml element. This ad provider will be discussed separately in a next part. Also take a look at line 3, it is now configured to be run in Test mode. Now let’s start configuring the different ad providers.

AdDuplex configuration

After you added a new application to AdDuplex you will see the App ID. Copy this value to the App property of the AdDuplexAdProvider.

image

AdMob configuration

When you completed the configuration of a new site/app in AdMob you will see a so called Publisher ID. Copy this value to the AdUnit property of the AdMobAdProvider.

image

MobFox configuration

For MobFox you should copy the Publisher ID from the app to the Publisher property of the MobFoxAdProvider.

image

Smaato configuration

For Smaato you should fill in both the AdSpace and the Publisher number in the SmaatoAdProvider. Copy the AdSpaceId from the application list for your application to the AdSpace property for the SmaatoAdProvider. Copy the PubisherId below at that screen to the Publisher property for the SmaatoAdProvider.

image

PubCenter configuration

The PubCenter configuration consist of two parts. An Application, where you need to copy the Application ID to the Application property of the PubCenterAdProvider. And an Ad Unit where you need to copy the ID of the Ad Unit to the AdUnit property of the PubCenterAdProvider.

image

InnerActive configuration

InnerActive can be configured, but I cannot recommend using it in combination of the Unified Ad control. Inner Active doesn’t have any events that can be listened to like: NoAd, NewAd or AdEngaged. And because of this it’s impposible to let it rotate with the other Ad Providers. When you want to configure it though, you can. Copy the App Name and put it in the App property of the InnerActiveAdProvider.

image

Test or not?

You can put your AdControl in production mode by setting the IsTest property to False or completely removing the property from the Xaml.

The next part will be about the Remote Ad Provider configuration.

Unified Ad for Windows Phone - Part 1 - Introduction

About a month ago I started a new investigation about which Ad Provider I should use. Things I wanted.

- Best eCPM

- Best Fill Rate

- Easy to use

Some of the things that are causing problems is the Ad Availability per Country. Depending on where your app is used more or less localized ads are used. So we know that the Microsoft PubCenter has a high eCPM for the US, it is low for The Netherlands. There are more of those problems with other Ad Providers. I heard there was a solution for this problem. Use the Ad Rotator for Windows Phone 7 which can be found on Codeplex. I did give it a try but at that moment AdMob was not supported (mostly because there were some AdMob specific problems) and also MobFox and Smaato weren’t supported. Those were the specific Ad Providers I was interested in.

My initial though would be, let’s try to modify the source a little bit, to get support for MobFox and Smaato in. But after looking into the source I was warned, almost all the code was in the Code Behind for the AdControl. While I am not against the usage of the Code Behind, I’m pro extensibility. The code I saw was far from maintainable and extensibility is done by adding more code. So when more AdProviders will be added code will be less and less maintainable.

Unification

When I look at the differences between the AdControls, they more or less do the same, but in a different way. All of them have a TestMode, but enabling the testmode is different for each AdControl. Same for the events they have. I want to have a unified ad control that does handle these ‘Complexities’ for me and the rest of the world. There isn’t such a control yet, so why not use the good parts of wp7adrotator (the remote configuration, multiple adproviders) and create something that suits my needs better. So I did.

The Windows Phone Unified Ad control is universal in the following ways.

Properties:

- Country – Will be passed to all the AdProviders that support Country or Location as input

- IsTest – Will be pass to all the AdProviders that support a way of TestMode. Some have a simple boolean field, others require to set the PublisherId to be set to a specific value.

Events:

- NewAd – When a new ad is available this event will be fired, even though the different AdProviders have different events to notify the user, like: NewAdAvailable, AdLoaded, ControlAdRefreshed.

- NoAd – When no ad is availabe this event will be fired, even though the different AdProviders have different events to notify the user, like: AdFailed, ControlErrorOccurred, AdError.

- AdEngaged – When an ad is engaged or clicked this event will be fired, even though the different AdProviders have different events to notify the user, like: AdClick, ControlAdEngaged, ControlIsAdEngagedChanged, AdLeavingApplication. 

Best Fill Rate

To get the best fill rate the Windows Phone Unified Ad control supports ad provider rotation. As soon as an Ad Provider is not providing an ad the next Provider will be asked to provide an ad. This will enable you to get a higher fill rate compared to using just one ad provider. You can even roll in your own custom ad based on Xaml.

Best eCPM

Every single Ad Provider changes it’s eCPM from time to time. But they even have different eCPMs per country. Same as they might have, or might not have ads for a particular country at all. To get the best of both worlds Windows Phone Unified Ad control supports AdProviders per Country. Similar to the wp7adrotator, but instead the Country is used and not so much the full culture. If you already have configuration files for wp7adrotator you can use those as well, they are supported in the Windows Phone Unified Ad control as well.

Supported AdProviders

All Ad Providers that currently have an Ad Control for Windows Phone 7 are supported. Register with the ones you like best. Inner-Active support is experimental because they have no way to find out there’s an ad displayed or not, yet.

Microsoft PubCenter

AdMob

Smaato

MobFox

AdDuplex

Inner-Active

There are two special Ad Provider implementations.

- None – This ad provider is used to not show an ad at all. Can be very handy during testing phase, when testing the application and not the advertisements. But could also be used to show no ads for a certain percentage of the app usage.

- GenericAdProviderForXaml – This ad provider is used to show some custom Xaml that’s loaded from a remote url. Can be very handy to market your own applications within your own applications.

What’s next?

Next part will be about the basic usage of the Windows Phone Unified Ad Control. If you can’t wait? You can find the source and an example project with the Windows Phone Unified Ad control on codeplex. If you want to start right away you can add the NuGet Package called WPUnifiedAd. Also the homepage contains a basic guide that will help as well.

Part 3 will be about using the Remote Ad Provider Configuration. Future parts will come on how to make use of the GenericAdProviderForXaml