Tracking Events in Silverlight with Google Analytics
Submitted by smartyP on Sat, 10/31/2009 - 20:58One of the things I wanted in ImageWind.Net before releasing it in beta was some basic analytics baked in. I wanted to try and use Google Analytics and I wanted to do more than just track page views - something which tells us little in a Silverlight application.
Google Analytics has support for event tracking, what that means is that instead of just tracking how many hits your site gets, you can track when users take certain actions or when events occur in your application. I did a quick search of the web and was happy to find Silverlight Analytics on CodePlex - a library which makes event tracking in Silverlight with Google Analytics easy. The Silverlight Analytics library does more than just event tracking - but that's what I am focusing on here.
(read more after the break)..
Setup Google Analytics for your site
Head over to Google Analytics and sign up for a free analytics account for your website. Once you complete the signup process you should get a bit of code to embed in your site, it should look something like this:
<!-- GOOGLE ANALYTICS SECTION --> <script type="text/javascript"> var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E")); </script> <script type="text/javascript"> try { var pageTracker = _gat._getTracker("UA-XXXXXXXX-X"); pageTracker._trackPageview(); } catch (err) { } </script>
You'll need to take that code block and put it into your html or aspx page that is hosting your Silverlight app - you should put it inside the <head> section of your page.
Integrate the Silverlight Analytics library into your project
Go to the page for Silverlight Analytics on CodePlex, download the 'Silverlight Analytics Binaries.zip', and extract it wherever you are keeping your assembly references for your solution.
At this point we just need to use the Silverlight Analytics library like any other library - add a reference to the SilverlightAnalytics.dll and make use of its exposed methods. In my implementation I abstracted the use of the analytics tracker through an IAnalyticsModel interface and wrote a simple wrapper to the library - here is how the library is being used:
public void TrackEvent(AnalyticsCategoryEnum category, AnalyticsActionEnum actions, string label, int value)
{ var tracker = new EventTracker<AnalyticsCategoryEnum, AnalyticsActionEnum>(category); tracker.TrackEvent(actions, label, value);}
You can see that using this library is super simple - it's just a single line to track any kind of event you might want. The EventTracker object is the primary object provided by the Silverlight Analytics library, and it takes in a few setup parameters when it is constructed and a few more parameters with the tracking details. The wrapper I'm using allows my app to make an event tracking call with 4 basic parameters, which I'll detail below.
The event tracking in Google Analytics is broken down by categories and actions. Actions are the underlying event you are tracking, and Categories are the groups in which you would want to track the actions. For ImageWind.Net I wanted to track a few things including how many thumbnails were shown, how many image details were pulled up, how many images were retweeted, etc. - below is the code for how both my Category and Action enumerations were defined:
public enum AnalyticsCategoryEnum
{ApplicationEvents,
TwitterUserEvents,
Thumbnail,
FullImage
}
public enum AnalyticsActionEnum
{ // application eventsBootstrapperFinished,
WarningAccepted,
WarningRejected,
// twitter user eventsRetweetedImage,
LinkedToUserProfile,
LinkedToTweet,
LinkedToImageSource,
// thumbnail / image viewsView,
View250,
}
The other two parameters required by my wrapper are a text label and an arbitrary integer value. The text label field will be visible when you drill down to the entry level, and the integer value is something that will be totalled by Google Analytics when your viewing you're analytics data online.
Tracking a Silverlight event with Google Analytics and the Silverlight Analytics library
One of the main things I wanted to track with Image Wind was how many thubmnails had been displayed over various timeframes. Since hundreds of thumbnails are shown every few minutes, it would be a really bad idea to fire an analytics call for every single thumbnail - so instead I decided to track everytime a user had seen 250 thumbnails - this way my analytics call would only be fired every minute or two. The text field here isn't very useful, but with the integer field I can enter 250 and use the built in summing of this value in Google Analytics to quickly total up the number of total thumbnails displayed. Here is the example of how I'm using my Silverlight Analytics wrapper:
AnalyticsModel.TrackEvent(AnalyticsCategoryEnum.Thumbnail, AnalyticsActionEnum.View250,
"thumbnails displayed", 250);
Seeing your results
Hopefully you can see how easy it is to setup Google Analytics event tracking with the Silverlight Analytics library. Having event level analytics is a must-have when it comes to Silverlight apps, because basic page view analytics just won't cut it when the user isn't moving between pages as part of using your site.
(event summary sample from main Google Analytics dashboard)
Unfortunately the biggest time spent in adding event tracking to your Silverlight app will come during the 24hr delay to see your events show up on Google Analytics. I had read that you needed to allow 24hrs to see your events show up, and that is 100% true - I saw no events logged until after 24hrs had gone by. The 24hr delay is kind of stressful in worrying if your tracking actually worked, etc. but luckily since the whole process is so easy it shouldn't be too hard to get it right the first time.
