Publishing an HTML5 Mobile App, Part 4: Live Operations

Visit the original version of this article on Code Planet.

Once you’ve got your app or game released, you’re probably going to want to keep it updated.

Content Management System

SGoL uses a Google Spreadsheet backed CMS called Grille for handling content updates. This CMS outputs all data as a large structured JSON document. SGoL ships with an exported version of this JSON document. When SGoL launches while the device is online, it’ll download the latest version of the CMS data and cache it. When SGoL launches and it is not online it’ll use the cached version. Overall it’s a very simple system for allowing offline play and usually up-to-date content.


Here’s a screenshot of the campaign spreadsheet. Unfortunately there’s no convenient way to express variably sized and dynamic content using a spreadsheet which is why you see JSON fields in the screenshot.

Keeping a game up-to-date is very important, specifically seeing how users interact with your content, where they have problems, and alleviating those problems. But, how do you know how users interact with your content? Read on…


SGoL uses Mixpanel for tracking analytics. One might be tempted to use the familiar Google Analytics, however that is really geared more towards users of websites, whereas Mixpanel is more about tracking “events”. Even if you’re building a Single Page Application for a desktop browser, using Mixpanel may be a better tool, depending on what you want to track.

That said, Mixpanel isn’t good for tracking historical data. If you wanted to know how many users interacted with your content last September vs this September, Mixpanel would fall short. The data it stores is ephemeral.


Events Overview

Here’s an overview of the most popular events triggered in SGoL over the past month. Notice the two peaks, probably correlated to when I was doing a lot of development.


Funnel Analytics

This is where things really get useful. When you track events you name them and can set attributes. In the screenshot below I’ve tracked when each level is started. As you can see there is a massive falloff in traffic between levels 2 and 3. While we can’t tell for sure what the problem is, it may mean that level 2 is too difficult or too boring. That said one can tweak content and keep an eye on the funnel until it improves.


Individual Sessions

If you “register” a user in Mixpanel you can keep track of the different activities they perform over time, allowing you to get inside the head of your users.


SGoL ships a Mixpanel bootloader with the application. If the device is offline, the main script will not be downloaded from the Mixpanel CDN. If the device is online, it will download the script and send events. SGoL could have used a system which queues events and ships them when offline, but this wasn’t a major requirement.

Interstitial Advertisements

SGoL uses AdMob for delivering advertisements to users. This wasn’t done with the intention of making money, but instead to gain knowledge of adding advertisements to a mobile app.


And, as you can see, no money is being made.

AdMob is interesting, it can only be used for mobile apps. Google has another ad platform too, AdSense, which can only be used for websites. With SGoL being web based, loading AdSense is feasible, but it would violate ToS and could get shut down. Really neither of these platforms is perfect for a web based mobile app. In fact, AdMob integration requires the use of native code and must be installed via a Cordova command:

$ cordova plugin add cordova-plugin-admobpro

Once installed a globally accessible object is provided, window.AdMob. This object has a few methods which you can read about in the Cordova AdMob Pro page. There are two important methods, one for preparing an ad (SGoL runs this at the beginning of an ad level), then the code to actually display it (executed when an ad level is completed).

Thomas Hunter II Avatar

Thomas is the author of Advanced Microservices and is a prolific public speaker with a passion for reducing complex problems into simple language and diagrams. His career includes working at Fortune 50's in the Midwest, co-founding a successful startup, and everything in between.