Banner
Getting Clicky with Flash Game Tracking

Recently I read the Lost Garden article Flash Love Letter (2009) (part 2). In the article they cover the potential of Flash, how Flash devs currently make money, and ways of adding value to your game so players feel like they have gotten value for their dollar.EAVB_SLWGRGOIVR

I develop games not just on my own, but for a couple of government clients as well and one thing that the Government always has to be wary of is how tax dollars are being spent. If they use tax payer money on a game, they need to prove that the game is being played and that any educational material that is meant to be displayed is reaching the intended audience.

Clicky Web AnalyticsThis tutorial covers one area of the article in particular, metrics and tracking actions in Flash. In the article they discuss using Google Analytics to track how much fun your players are having, but I prefer Clicky Web Analytics for a number of reasons. First because I find their dashboard is prettier and much more flexible, and second because I don't like to wait around to see if things are working, and Clicky has a fantastic feature called Spy that lets you see what players are doing in real time. Creepy? Maybe. Useful? Definitely.

Why You Need These Stats

Getting information on how people play your game can be very important at any phase of development. The first time you let someone play your game you should have some idea of what they are doing. Did they turn off the music in the first 5 seconds? Did they play the game on normal for 30 seconds and then switch to easy mode? Has anyone ever played the game on hard mode? This sort of information can help you tune your game to maximize the "fun factor", and in turn maximize your potential profits.

This tutorial is best used on a game that is hosted on your own server. Generally I would recommend you do this implementation before you send your games out to any portals, since it relies on the Clicky tracking code on the page where it is hosted.

Step 1: Getting Clicky

The first step is to make sure you have a Clicky Web Analytics account. One thing to note is that Clicky currently only offers support for custom logged events with their premium accounts, so if you are just testing this out you might want to start with their Blogger account, which is only about $5 a month.

If you don't want to sign up for Clicky some of the following concepts will apply to other stats tracking sites, so feel free to read on.

Step 2: The Basics of Clicky Metrics

Clicky works like most web analytics tools in many ways. You add a block of code to the bottom of your page that passes information about your site's visitors back to their servers. From there they could have a million monkeys constantly entering the information into a database for all I know, what matters to me is that once they get that data they turn it into pretty reports for me to read.

Once you have your account, you will be adding a new site to track. If you already have a Clicky account, then you can piggyback on your existing site. Once you have the site added you will need to add the tracking code to your page, you can do this by accessing the Site preferences on your site and then selecting Tracking code.

Once your Flash file has been published you will need to add this tracking code to the page in order to log events. The way we will be doing this is by using flash.external.ExternalInterface to send a call to the Click.log JavaScript. Trust me, it's actually way easier than it sounds.

Step 3: Making a Game

The hardest thing you will have to do is create a game. I'm hoping that you already have one built, but if you don't I am going to apply my code to an incredibly simple game just to demonstrate how this works.

The game I have built for this example is Ultimate Avoider a fairly terrible game that isn't very ultimate at all. Still, "Ultiamte Avoider" sounded much better than "Piece of Crap I Slapped Together in an Hour-Or-So". The basic idea is you are the blue dot and you have to avoid the red dots. After a while each red dot will turn into a factory that creates other red dots. If you touch the factories they will explode and take out all nearby enemies. Play it for a couple of seconds just to get a feel for it.

Ultimate Avoider

So it isn't going to win any awards, but it is perfectly sized to fit this article column so that makes it the perfect game for our purposes.

Step 4: Deciding What to Track

One thing to consider when tracking your game stats is that more stats don't always mean better stats. When I first put this code in I was tracking every time a player killed a factory and it was just too much. It slowed the game down and made it basically unplayable. I recommend logging the player's decisions and key measurements of difficulty. Remember that every time you log something there could be a couple milliseconds of lag, so I try to log at the ends of levels during action games.

Step 5: Adding the Tracking Code to Your Game

To communicate with the page we'll be using ExternalInterface. This tutorial covers the method in ActionScript 3, but ExternalInterface is available in AS2 as well.

The first thing I did was created the folder path com/egoant/clicky and created ClickyTrack.as in it. This is the class we will be adding to our game to start tracking:

This class does several things, when you first instantiate the class (line 13) you will pass the name of your game, this allows you to track multiple games on the same server. You will also notice that any values we pass to Clicky are escaped. This is just to make sure that we don't pass any values that will break the JavaScript.

Most of the work is done on lines 20 and 21, where the call to Clicky is contructed. The reason I don't call the clicky.log function directly is that when Flash uses ExternalInterface to call a Javascript function it actually pauses the movie until the Javascript function completes. This can cause some pretty terrible lag in your game. To help minimize this I used a little cheat, and call the setTimeout function. This lets clicky.log run in a new thread and passes control back to Flash as quickly as possible.

On lines 29 and 30 I put in a little search and replace because I found that the log was easier to read if I left the spaces unconverted. (So "Player%20Cleared%20Level%203" becomes "Player Cleared Level 3")

To add this class to your project you will need to import it. You can see that on line 4 of the snippet below.

Once that code is imported you will want to create a ClickyTrack object in your game's main class. I have made this private since I usually want everything in my games to report back to the main class if it needs to be tracked. You can see this on line 9.

Next you will need to make sure that you instantiate the ClickyTrack object. I'd do this as one of the first things after the game renders, that way you can get an idea of how long it took players to choose their first menu item. I did this on line 13 of the sample.

Finally, anywhere you want to log an event put in a call to clicky.LogEvent(). You can put in any name you want there. An example of that call is on line 14.

That's all there is to it! Every time you call LogEvent the text that you pass will be logged as a new page and action by the class above.

Step 6: Keeping an Eye on Players

I built this little widget using the Clicky API. If you spent any time playing the game above some of your actions should already be logged. The API has a delay when compared to Clicky's Spy feature, so I usually use the Spy feature rather than the API, but this demonstrates the type of data that can be extracted.

There are lots of creative ways you can use this to make your game more fun, you could gather stats about the types of items the player collected or monsters they fought and report it back after each level. If you aloow the player to switch weapons you could easily discover which weapons are being favoured.

Once you have the code in place log in to your Clicky account and go to the Spy section. Opening Spy will show you what players are online right now, as well as what they are doing, the screen looks like this:
Clicky Spy

You can drill down and see what actions were taken by each player and in what order:
Player actions in Spy

You can even name specific IP addresses to help you keep track of the players, this will help you find recurring players and track their stats over time, as well as allow you to see if the changes you make to your game are having an impact on specific players.

blog comments powered by Disqus  

Development Tutorial Updates