Poki
Published in

Poki

A Simple Model for Event Tracking with Google Tag Manager

The Stanley Parable
  1. Simple tech: Anyone should be able to understand what’s going on quickly. Our codebase should have a minimal amount of edge-cases and experimental business requirements.
  2. Separation of concerns for developers and analysts: Developers should be able to focus on product development, while analysts should be empowered to gather whatever insights are needed. These responsibilities shouldn’t negatively impact each other.
  3. Tracking/analytics system agnostic: If we wanted to plug in any other package for tracking, data visualisation, or whatever, it should be super easy and doable by our analysts (or PMs, designers, etc.).
  4. Rapid iteration: All of the above serves the purpose of moving and learning quickly.

Our starting point: straight Google Analytics

  1. It’s a tile
  2. The user clicked the tile
  3. The tile contains a game (as opposed to say, a category)
  4. The game’s unique identifier is 1337
{ category: "tile", action: "clicked", label: "game", value: 1337 }
{ category: "tile_game", action: "clicked", label: "x1y5", value: 1337 } 
// Or maybe
{ category: "tile_clicked", action: "game", label: "x1y5", value: 1337 }
// Or...
{ category: "tile_x1y5", action: "clicked", label: "game", value: 1337 }
// :(

A new format: simplicity!

{
noun: "tile",
verb: "click",
data: {
id: 1337,
type: "game",
position: { x: 0, y: 5 }
}
}
{
domain: "poki.com",
applicationVersion: "v13.3.7",
page: {
path: "/awesome-games"
},
previousPage: {
path: "/"
}
}

So, how do we actually get this data into our tracking tool?

Talking to GTM

function pushContext(context) { 
window.dataLayer.push({ context });
}
function pushEvent(eventNoun, eventVerb, eventData) {
window.dataLayer.push({
event: `${eventNoun}-${eventVerb}`,
eventNoun,
eventVerb,
eventData,
});
}

Bring forth the analysts: Setting up GTM

{    
event: "tile-clicked"
eventNoun: "tile",
eventVerb: "click",
eventData: {
id: 1337,
type: "game"
}
}
I recommend using naming conventions to keep the system nice and organised.
We’ve now ‘hard-coded’ the tracking ID, but you can use a variable for that too!

A quick recap

Yay!

Calculated variables

Example of a calculated variable, saving us complexity in the codebase and empowering analysts

Why is this simple again?

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Kasper Mol

I publish games, write code, and do other generally awesome web and gaming stuff @ Poki