Translations

Know another language? Translate this tutorial!

Stats

1,588 visitors
27.1K page views
769 translation visitors
3.6K translation page views

Adding In-App Purchases to your Windows 8 Game

Favourite 58 favourites
Tutorial written by thehenOriginally published on 28th, June 2013 - 1 revision

If you find this tutorial helpful, consider making a Bitcoin donation: 1KWU4MxiGR9wxoMHFN4wrtyhAyugYCzYac

Your continued support will help in maintaining existing and building new plugins, as well as writing tutorials such as this one. Thank you :)

Introduction

In-app purchases can be a great way to monetise your Construct 2 games on Windows 8. For our game Mortar Melon we’ve given our first world away for free, but then charged for a new desert world.

Here you can see the pop-up screen with a description of the IAP, the price, and the option to buy:


You could also use an IAP to hide advertisements, buy new weapons or clothes for your characters, purchase power-ups, add ingame currency or even buy more time playing the game. The possibilities are endless!

Adding IAP to an example .capx

You can download the sample mini-game that we’ll be using for our tutorial here: Sample .capx.

This is a simple flinging game where you have to reach your friend and give them a kiss ❤. From the main menu you can change your character’s hat and this will be the basis for our in-app purchases - buying hats!


After opening up the .capx, the first thing we’ll need to do is export the game to run on Windows 8. If you’re not familiar with this ensure you familiarise yourself with this tutorial: How to make a Windows 8 app. Follow this tutorial and you should be able to launch the game on our target platform!

After launching the game you’ll notice that you can freely change the character’s hat, switching between a purple cap or no headgear at all. This won’t do... we can’t give hats away for free! The next few steps will talk through how we can make the hat an in-app purchase.


First, open up the .capx and in the objects panel, right click and insert new object. Find the Windows 8 Object and select Insert. Now we can start adding Windows 8 specific functionality to the game.

Navigate to the the event sheet called Menu, found under the Event Sheets folder in the Project Panel. Expand the Hats group and you can see the logic that changes the hat in the main menu of the game.


Add in the following logic to add in-app purchases on Windows 8. This simply sets the purple hat button to be active when purchased and prompts to purchase when inactive and pressed.

Notice the product ID “PurpleCap”. This is very important and needs to be consistent at every step of the process.


You can download the .capx with these additions here: Sample .capx with IAP.

Testing purchases

Now if you export again and run the game, you’ll see the following message.


This means that you can test purchases without having to submit your app. When it comes to your final app submission, make sure Test mode is turned off, otherwise you’ll fail certification.


When running the game and you select the purple hat on the menu screen, you’ll be presented with the following prompt:


This allows you to simulate various situations that could happen when a user tries to make a purchase. These error codes correspond to the following:

S_OK - Operation successful
E_INVALIDARG - One or more arguments are not valid
E_FAIL - Unspecified failure
E_OUTOFMEMORY - Failed to allocate necessary memory

S_OK will trigger the Construct 2 condition On Successful Purchase and all the others will trigger On Failed Purchase. Ensure that you accommodate for when a purchase fails as well as when it is completed. Players will get confused if the game just fails to purchase silently without notifying them of an issue!

So now if you select S_OK and click Continue, you’ll see the hat is selected and you can continue playing the game with your newly acquired gear.

To simulate a user that has already completed the IAP prior to launching, we need to make some changes to the WindowsStoreProxy.xml file in the Solution Explorer of the exported project.


Change this text:

    	<!-- Include to test product purchases -->
    	<!--
    	<Product ProductId="my_product_id">
    		<IsActive>false</IsActive>
    	</Product>
    	-->

To the following:

    	<Product ProductId="PurpleCap">
    		<IsActive>true</IsActive>
    	</Product>

Here we’ve added a product with a Product ID "PurpleCap” which matches what was entered in Construct 2 previously. We’ve also set the property IsActive to true, simulating a scenario where the user has already purchased the product.

Now when you run the build, you’ll notice you are no longer prompted when selecting the purple hat. This is how you’d expect it to behave when after having purchased a product.

Retrieving IAP Information

In order to retrieve information about your IAP including name and price, you need to change the following:

    	  <!-- Include to test product listings -->
    	  <!--
    	  <Product ProductId="my_product_id">
            <MarketData xml:lang="en-us">
              <Name>My Product</Name>
              <Price>1.99</Price>
              <CurrencySymbol>$</CurrencySymbol>
            </MarketData>
          </Product>
    	  -->

To this:

    	  <Product ProductId="PurpleCap">
            <MarketData xml:lang="en-us">
              <Name>Purple Cap</Name>
              <Price>1.99</Price>
              <CurrencySymbol>$</CurrencySymbol>
            </MarketData>
          </Product>

Here the Product ID matches what we’ve previously entered in Construct 2. We’ve also added a language code, a name, a price and a currency symbol. This information will be used by Construct 2 to output the formatted price and name of the product.

When your app is submitted, the language and currency is determined by the user’s device. The information that you enter in WindowsStoreProxy.xml is just dummy content for testing that will be replaced automatically once in the store.

If you go back to the Construct 2 project and add the following logic, we’ll log the name and price of the IAP to the Visual Studio console.


In your own project you can use the Windows 8 Object expressions ProductName and ProductFormattedPrice to display the name and price of an IAP from within your game using the text object.

Warning: when using a custom font, ensure that it contains the currency symbols for the markets you’re targeting, otherwise no currency symbol will display at all! You can test by changing the CurrencySymbol property in WindowsStoreProxy.xml.

Export and deploy the project, and when switching back to Visual Studio you should see the name and price of the IAP has been logged to the console.

Warning: Exporting to the same folder will overwrite any changes that you’ve made to the project, including WindowsStoreProxy.xml. Ensure that when you re-export you do so to a separate directory and copy only the files you need (usually c2runtime.js and any new images/media) to your working directory.


Adding IAP to your submission

So now we’ve added the ability to purchase a purple hat, and learnt how we can extend this to show the name and price of an IAP product. Next we’ll look at the IAP details you need to complete in the Windows Dev Center when submitting your app.

For more information on submitting your app, please read this article: Submitting your app

Highlighted below is where you’ll define the essential IAP details.


In the following section, add the Product ID that matches what you’ve put in the Construct 2 project and in WindowsStoreProxy.xml. It is very important that this matches exactly. Also enter the Price tier for how much you want to charge for the IAP and change the Product lifetime if you’d like the purchase to expire.


Click Save and go back to the previous section. In the following highlighted section you’ll add the description of the IAP which will tell the end-user what the product is.


Add your description in the field below. This will be presented to the user when prompted to complete the IAP.


Here you can see an example of where the description is shown for our game Mortar Melon after the user clicks the buy button.


Conclusion

So we’ve talked through how to add in-app purchases to your Construct 2 game, exporting to Windows 8 for testing and what details you need to complete in Windows Dev Center for certification.

Hopefully this introduction will give you the information to go forth and successfully monetise your games!

Share and Copy this Tutorial

You are free to copy, distribute, transmit and adapt this work with correct attribution. Click for more info.

Comments

3
Lordshiva1948 41.4k rep

At moment this bit is not for me but, it's nice to know people like you are always there to help. Thanks

Friday, June 28, 2013 at 1:40:32 PM
2
AbelaNET 14.8k rep

Thanks something to keep in hand since I am sure I will need it.

Friday, June 28, 2013 at 2:19:43 PM
2
Blacksmith 8,282 rep

This is very a useful follow-up to your "Windows Phone Games with C2" tutorial.

You've created a really well rounded series of tutorials for making Win Phone 8 apps, combined with a very useful Win Phone plugin.

Thanks thehen!

Saturday, June 29, 2013 at 3:11:30 PM
1
sosensible 9,706 rep

where did you get the screen shot showing the properties cant find it

Saturday, June 29, 2013 at 3:29:09 PM
1
thehen 11.9k rep

@sosensible I'm not sure what you mean?

Sunday, June 30, 2013 at 8:52:48 PM
1
sosensible 9,706 rep

on image #7

Friday, July 05, 2013 at 3:07:18 PM
1
thehen 11.9k rep

@sosensible select the Windows Phone object in the project panel.

Tuesday, July 09, 2013 at 3:24:00 PM
3
balaporte 3,009 rep

Very good step-by-step instructions. Thanks for sharing as you learn. I hope you make some money!

Tuesday, July 09, 2013 at 4:02:44 PM
2
NaSTy 9,447 rep

Thanks for this very useful tutorial!!

Tuesday, July 09, 2013 at 5:39:21 PM
2
gbeaver 2,653 rep

Sweet! Thank you! So important these days!!

Tuesday, July 09, 2013 at 7:44:56 PM
2
Wenaptic 6,851 rep

Excellent! Thanks for posting this tutorial! The monetization of our projects is a subject that comes with uncertainty.
Now I'm much more motivated!

Tuesday, July 09, 2013 at 8:03:15 PM
2
sosensible 9,706 rep

thanks definitely a favorite tutorial

Wednesday, July 10, 2013 at 6:40:52 PM
1
kenhes 4,011 rep

Thanks for the tut thehen! I'm a little confused by what's going on in this image:
www.scirra.com/images/articles/image02_3.png

Is this a necessary step or only if you want to display the details in your game?

Wednesday, July 17, 2013 at 1:37:37 AM
1
kenhes 4,011 rep

Also, how would you use this to disable ads? Would this need to be coded in VS or Construct 2?

Wednesday, July 17, 2013 at 1:41:47 AM
1
thehen 11.9k rep

@kenhes that step is simply how you can output the details like product price and name. Say if you wanted to show the price ingame, instead of logging it like in the example, you'd set the textobject to display it.

I'm not sure what you mean about disabling ads?

Thursday, July 18, 2013 at 1:56:22 PM

Leave a comment

Everyone is welcome to leave their thoughts! Register a new account or login.