Using d3.js to visualise online conversion journeys

d3.js scatter chart

How to use d3.js to help visualise online consumer paths to conversion.

An interactive version can be seen here. Use Chrome or Firefox.

This helps answer such advertising questions as “Do returning customers use more brand keywords than new customers?” and “how long are people’s online paths to conversion?”

The data Displaying “paths to conversion” can normally be a tricky task. Typically you’d have several thousand converter journeys all displaying different habits. Some will be very short journeys where there are just a few Google searches prior to conversion and other journeys will be longer journeys over many days where lots of display banner ads have been seen, but not clicked.

New vs Returning d3.js

My data set I have here shows me the entire journey for each conversion. By “journey”, I mean every advertisement the converter was exposed to. These could be PPC clicks (someone typing in the brand name, like “Nike trainers”, then clicking the sponsored link that’s served), or display impressions (someone seeing a visual banner ad but not clicking it). Each of these “events” had a timestamp so I can see how long after the ad click/impression a conversion appeared. Rather than use a giant table made in Excel I realised I could use a scatter chart made using d3.js to visualise every event for every conversion. The patterns that emerge may tell me about the behaviour of the converters. My final data set is loaded into the visual using d3.csv.

I started by first visualising the paths for converters using two series, one for brand search terms (blue) the other for generic search terms (green). The data above has four columns:

Keyword_nm – this shows the keyword that the converter typed in along their conversion journey. In the d3 visual this is [...]

The path taken to become a Man Utd player

Sankey Diagram d3 js

This example uses d3.js and makes a sankey diagram to show what transfer path is taken by Man Utd signings

The below image shows the sankey diagram. Click here to play with it. You can clearly see that Man Utd don’t like signing players that have been around the block. Besides Edwin Van Der Sar (4 clubs) most signings come straight to Man Utd from youth teams or just one other club. Nor do they have a tendancy to visit the same club more than once when signing players.

Can you guess which player each path relates to?

Sankey Diagram d3 js