Monetization - Releasing HTML5 Games for Windows 8 (2013)

Releasing HTML5 Games for Windows 8 (2013)

Chapter 7. Monetization

The Windows Store monetization is on par with all other major App Store publishing models, which will be very appealing to developers looking to get the most out of their time investment. To better understand some of the ways you can monetize your game on Windows 8, I have decided to highlight 3 of the key ways outside of the standard flat rate for your game:

§ Trial Mode: On Windows 8, you can add trial mode into your game, which not only allows players to try out the game but also keeps them from having to install a separate app with the un-purchased features. Windows 8 allows you to lock out specific parts of your app based on if it is in trial mode or has been fully paid for, so you can maintain one app with a single codebase.

§ Ad Support: Finally, an approach that has been falling out of favor over the years is to monetize your game with ads. Since HTML5 games on Windows 8 can run any JavaScript ad SDK, you will find it very easy to quickly set up ads in your own game. We will talk about how to use the Microsoft Advertising SDK for Windows 8 later in the chapter.

§ In-App Purchase (IAP): This has become one of the most popular ways to monetize your apps on iOS and Android. The good news is that Window 8 apps support IAP as well. Generally, you can offer your game for free and let players buy new levels or open up the entire game and use in-game currency then allow players to buy that currency with real money.

As you can see, you have lots of options to help monetize your hard work. Since Windows 8 is a new platform with a new market, you will have a lot of room to experiment with what works best. To help you monetize your own game, I will talk about each option with some sample code to get it up and running quickly.

Setting a Fixed Price

This is perhaps the most straightforward approach to selling your app. Simply set a price in the store and you are good to go. While setting a fixed price has its advantages in other markets, the Windows Store offers even more creative options around monetizing your game. We’ll talk about trial mode, ads, and in-app purchases next, but if you simply want to get your game out there and not deal with adding additional logic to your game, then this is going to be your best option.

For the sake of completeness, here is a quick overview on how to set a price for your game in the developer dashboard (Figure 7-1). Once you have a game set up and are filling out its information, you will want to go into the “Selling details.”

You can quickly see the sale price of your game in the developer dashboard.

Figure 7-1. You can quickly see the sale price of your game in the developer dashboard.

From here you will be presented with a place to set your price, whether or not there is a trial, and the markets you want to sell your game in.

Once you have selected a price you are comfortable with in Figure 7-2, you should be ready to sell your game in the market. You will also see the price of your game in each market in its native currency.


One thing to keep in mind is that some markets may require you to fill out separate tax information and may even have different limitations on the rating of your game. To avoid failing app certification due to specific country requirements, you may want to start with only a few markets at first. I tend to focus on larger markets, such as the U.S., Canada, the United Kingdom, France, and Germany. From there, I slowly include other locations once the game begins to do well in other markets and I know I have worked out any of the bugs that tend to pop up during a first release.

When setting up your price you can select if there is a trial and what countries to sell your game in.

Figure 7-2. When setting up your price you can select if there is a trial and what countries to sell your game in.

As I alluded to earlier, the Windows Store offers a few more options for monetizing your game. Let’s talk about one of the more unique features of the Windows Store, which is trial mode.

Trial Mode

If you are familiar with other app stores you may have noticed a huge selection of “lite” and “full” versions of games. This is a byproduct of no clear way to let users try out a game before they buy it. The Windows Store alleviates this issue by offering a simple yet robust trial mode for you to allow people to test out your game before they decide to buy it. One of the best parts of this feature is that you can still maintain the same codebase by simply locking out parts of your game if it is running in trial mode. Let’s take a look at how to set this up in your own game.

The first thing you are going to need is a reference to the current app, which contains licensing information among other things. A quick way to do this is by creating a global function that looks like this:

initLicense = function() {

// use for live app

currentApp = Windows.ApplicationModel.Store.CurrentApp;

// use for testing

//currentApp = Windows.ApplicationModel.Store.CurrentAppSimulator;

return currentApp.licenseInformation;


As you can see, there are two options in this function. The first is what you want to use in the live app you publish to the Windows Store. The second option is used for testing and allows you to get a dummy file defining your game’s license information from the CurrentAppSimulator. You can initialize this by simply calling the function and setting it to a variable like this:

licenseInfo = initLicense();

From here we can check a property called isTrial on the licenseInfo variable and create some conditional logic in our game to limit functionality until the player buys the full game.

Here is a good example of how you would want to use something like this. In one of my games I have ten levels. In trial mode, however, I only want two of them to be playable. I keep a variable called totalLevels, which allows me to loop through and display which levels are unlocked. Since totalLevels is set to 10, because that is the total number of levels I have in the game, the player will never see an error if they beat level 10. What is also good about this setup is that I can also change the totalLevels at any point to limit what levels the player sees. So, in the case of the trial mode of my game, I change the totalLevels variable and display a message that they need to buy the full version of the game (Figure 7-3).

In Super Jetroid I encourage the player to buy the full game to unlock all of the levels in trial mode.

Figure 7-3. In Super Jetroid I encourage the player to buy the full game to unlock all of the levels in trial mode.

Here is what the level limit code looks like:

if (typeof licenseInfo != "undefined") {

if (licenseInfo.isTrial) {

this.totalLevels = 2;

this.showPurchaseText = true;



In addition to limiting the number of levels the player sees, I also display a message telling them to purchase the full game. Again, this is very easy to set up. I simply refer back to my license details to see if we are in trial mode. If so, I display the buy message.

One thing that you may want to also include is a link back to the app in the store. So, when people click on the buy now message, they are taken right to the buy page in the Windows Store. Here is a helpful method for handling this:

sendToStore = function () {

var uri = new Windows.Foundation.Uri(currentApp.linkUri.rawUri);



What is great about this code is that the link to the store will automatically resolve itself when the app is published. This is just part of the application’s data that is built in during the publishing process.


It’s important to note that this link will not work when you are locally testing. As of now, there is no way to test this during development since it relies on the app actually being published in the store.

As you can see, with only a few lines of code you can simply lock out parts of your game until it’s purchased. Likewise, it’s just as easy to set up trial mode in the developer dashboard. Simply go to the “Selling details” section of your game and, next to where you set your game’s price, you will see a drop down to enable trial mode (Figure 7-4).

The option to set up a trial mode is right next to where you set the price in the developer dashboard.

Figure 7-4. The option to set up a trial mode is right next to where you set the price in the developer dashboard.

As you can see in Figure 7-5, you have several time-based options if you want your app to lock the user out after a specific period of time, including an option for the trial to never expire.

Pick the trial duration that makes the most sense for your game.

Figure 7-5. Pick the trial duration that makes the most sense for your game.

If you do not want to have a time trial you can simply choose trial never expires. With the previous code in place your game will automatically start working within the constraints you defined for the trial mode.

Incorporating Ads into Your Game

Putting ads into your game is very easy as well. You can use any HTML/JS-based ad SDK or use Microsoft’s pubCenter. This means that if you already have ads integrated into your game you can leave them in and continue to make money, assuming the SDK’s license allows for that. If you don’t have ads in your game, I’ll quickly cover how to set up pubCenter. The first thing you are going to need to do is register for an account here. Once you have registered, go into your account and navigate to enable ads for Windows 8.

Once you have your account set up, you will need to register your app and create an ad for a Windows 8 app (Figure 7-6). You can also pick out your ad size and configure other information for your app.

Here I am setting up the size of my ad and other properties for it to run inside of a Windows Store app.

Figure 7-6. Here I am setting up the size of my ad and other properties for it to run inside of a Windows Store app.

Now that you have everything set up, you will get an Application ID and Ad Unit ID (Figure 7-7).

Make sure to keep track of your Application ID and Ad Unit ID.

Figure 7-7. Make sure to keep track of your Application ID and Ad Unit ID.

Make sure you save the Application ID since you will need it later on when we put the ad code into our game. Once all of that is done, you can download the ad SDK and install it into Visual Studio, which you can get here. You can simply install the SDK into Visual Studio by clicking on the downloaded file (Figure 7-8).

The Microsoft Advertising SDK installer.

Figure 7-8. The Microsoft Advertising SDK installer.

Once the SDK is done installing, you will need to include the ad library in your project. Click on the resources folder in the project explorer and right click on it. You can then select “Include new resource.” It should look something like Figure 7-9.

Make sure you add the Microsoft Advertising SDK as a reference in your game’s project.

Figure 7-9. Make sure you add the Microsoft Advertising SDK as a reference in your game’s project.

That has the link to the SDK download and how to install it into VS and add it to your project.

Now you should have everything linked up and ready to show ads. Add the following HTML to your default.html file:

<div style="position: absolute; top: 50px; left: 0px; width: 100%; z-index: 1;">

<div id="ad" style="margin-left: auto; margin-right: auto; width: 500px; height: 130px;" data-win-control="MicrosoftNSJS.Advertising.AdControl" data-win-options="{applicationId: '52df6cc7-1ea5-477d-b607-bf7922f81259', adUnitId: '10047026'}">



This will float the ad above everything else on the pages, assuming you don’t have anything higher than a z-index of 1. You can change the inline styles to suit your needs.


This code is only for locally testing. You will need to replace the applicationID with your ID supplied by pubCenter before you publish your game or you won’t be able to display your ads. Also, you can’t test your ads locally, so use the test ads to make sure they are placed correctly then use your production applicationID so you don’t forget to swap it out before publishing.

If you ever need a reference to the actual ad, you can use some JavaScript to get its div ID from the document like this: = document.getElementById("ad");

Once you have a reference of the ad in your code you can use simple CSS to hide and show it by setting to “none” or “block.” This is useful when you want to hide ads on certain parts of the game or if you tie it into the trial mode and hide it if the player has bought a full version of the game like so:

// Remove Ad if the app was paid for

if (!licenseInfo.isTrial) {

var elm = document.getElementById("ad");



One of the best ways to capitalize on the trial mode of your game is enabling or disabling ads based on if the player purchases the full version. You can even use both techniques of limiting features and showing ads to entice the player to buy the game. Be creative with how you use advertising in your game. If you make it too annoying people will not like your game; if you don’t get users to click on the ads you will not make any money. This is why I suggest coupling ads with trials and helping augment the users who simply play the trial without ever upgrading.

In-App Purchase

In-app purchases (IAP) are another great way to help monetize your game. Crafting a viable and meaningful IAP system into your game takes a lot of thought and planning on your end. The technical side of things is relatively easy, and I provide links to reference material in the resources section of the book. I do want to briefly talk about some strategies for adding IAP into your game.

The first thing you should understand about IAP is that it allows you to make your game free and still find ways to make money by selling additional features. This is an incredibly powerful monetization strategy since it allows your game to show up in the free game listing, which doesn’t happen if your game is for sale with a trial mode. That means it is even more likely for people to download and play it. From there it is your job to incentivize them into paying more for missing features.

The reality is that IAP needs to be added to a game from the initial design process so, if you are porting over a game from the Web, chances are you may not have an existing IAP system in place. While you can easily add a basic way to buy more of an in-game currency, I suggest considering the following options for easily adding value to a game that was not originally designed for IAP:

§ Additional Levels – Selling additional content or add-on packs is a great way to take advantage of IAP and not make players feel cheated as they play the initial round of levels you supply with the game.

§ Additional Characters – Over time you may decide to add new playable characters to your game. These could be to coincide with an event, such as a holiday, or just to add some additional replay value to your existing levels.

§ Unlock Features of the Game – You can easily use IAP as a full replacement for trial mode. Simply lock out features of the game, such as multi-player, and allow the player to buy the feature if they want it.

§ Remove Ads – Why not use IAP to remove the ads from your game. We discussed the technique earlier in the chapter with trial mode, but taking advantage of IAP would probably be a better solution.

As you can see, there are lots of ways to add on IAP to an existing game. Just be careful to not overdo IAP or that will really turn players off of spending money on your game.

Tips and Tricks for Monetization

I wish I had a surefire way of making money with your games. Every app store is different, and while Windows 8 is still relatively new, don’t expect to just put your game in the market and instantly get rich. Here are a few things you should do to help get your game some more exposure and move it up in the ranks.

Promote Your Game

Just like on other platforms, it is critical that you promote your game. There are many ways to go about doing this, from blog posts to getting gaming sites to do reviews. Eventually, if your game gets enough attention, you may be featured on the Windows Store under the Games section (Figure 7-10).

The front page of the Windows Store has a dedicated Games section with features, top paid, top free, and new releases.

Figure 7-10. The front page of the Windows Store has a dedicated Games section with features, top paid, top free, and new releases.

Being featured will help drive sales of your game up dramatically. Windows also categorizes games as free and paid. Trials fall into the latter, so remember that your game will be competing with the paid category, which usually contains higher profile games, such as Xbox Live titles, which could make it hard to gain ranking. If you only have ads in your game that you disable once a trial has been paid for, you will have a harder time climbing to the top of the charts, so be careful.

Finally, the best thing you can do to help promote your game is to simply have compelling screenshots, icons, and a description. Be clear about what your game does and why people would want to play it. Your app icon and screenshots are the first thing people see, so make them count. And, expect people to only make it through the first two or three screenshots, so put the most compelling ones first.

Incentivize Players to Upgrade from a Trial

If your game has a trial mode, remind people about upgrading. I wouldn’t be too pushy about it, but a common technique is to inform people they have earned something like unlocking an achievement or calling out the fact that they can remove the ads in between levels while loading. You can do small messages or full-screen ones, but make sure they open a link back to your game in the Windows Store.

Get People to Rate Your Game

A lot of games and apps ask the player to rate them. You can easily do this by taking advantage of the link back to the game in the Windows Store. Simply pop up a message asking the player to kindly rate the game. Don’t be too pushy about this and make sure you always offer a way to opt out, such as a button that says “Don’t ask me again.” This is especially critical if you have a paid app. No one wants to pay for an app then be pestered to do something else outside of enjoy the game.

Make Compelling IAP Options

While we only briefly touched on the possibilities of how to implement IAP, I highly suggest spending your time designing rewarding IAP for players to buy. While in-game currency is always a safe bet, I would watch out for items that add superficial value to the gameplay. Things like costumes, skins, and other visual customizations tend to only go so far. Likewise, be responsible about what you try to make players buy. If you skew the entire game to force them to use IAP, the player may not be too happy and stop playing/paying, or worse, start giving you a bad review.

Get Reviews

Have friends and family review your game. The more ratings and reviews you have the more likely someone on the fence will be to download or buy your game. When you launch you only have a small window while your game is featured in the new releases category, so try to make the most of it by getting five-star ratings in early to help bump up your overall rating.