Measure your videos engagement with Google Analytics

Surely, we asked ourselves if our promotional videos are really working, imagine for example that a landing page where we create a video of what makes our product.

Almost all examples of measurement of videos I found online, that are based on how many times have you clicked the play button, pause and stop. But that does not give a true picture of the level of engagement, which produces video about our users and therefore the conversion rate.

  • How many times is the video being loaded? (Ready to be played ).
  • How often is the video viewed completely.
  • How many times does the users click on Play, Stop, Pause buttons .
  • And most importantly, what percentage of video is being viewed by our users, through a drop funnel visualization.
  • Is there any conflictive  part of the video, in which most users will leave (maybe the video is too long, too boring, or simply does not reflect what our users are looking for.)

Many other KPI or indicators that may indicate the engagement of the video to our users. for example:

  • Changes in quality / resolutions. If the user switches to a higher resolution or quality clearly is indicating that the user is really interested in the video.
  • Mute and volume changes. If the user mutes the audio of the video, can tell us that music does not like, or is not interested what you hear in it. Conversely, if we turn up the volume suggests that interesting, or perhaps the video’s audio volume is too low.
  • Switching to full screen. It is another indicator that the user is really interested on it., if not, it won’t bother to see it full screen.
  • Errors on video loading. We could also monitor if the video does not load for some users and even using Google Analytics, segment them to see if a specific error of any country, browser, etc..
  • Buffering errors. Sometimes the videos are slow and cut during playback, this may impact negatively on the conversion of our landing.

For a small demo we used the video: Eric Speed Maniac, we should put ourselves in the situation that this is a promotional video on our landing page, showing for example how our services are.

We have used the tools that YouTube and Google Analytics provide, so through its API and Event Tracking, me can track more specifically the results obtained by our promotional videos on our users as follows: Looking at what percentage of the video is viewed by users and creating a pyramid/funnel chart to see the results graphically.

What we get is the following funnel chart:

In this graph we can see, the total percentage of video length viewed by users. Thus, we know if our videos are really interesting to our users, to thereby improve them and thereby improve the conversion rate.

For our example we must load the video using SFWObject adding to our video URL, the following parameters

enablejsapi=1&playerapiid=player1

Here you can view the entire script:

script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
google.load("swfobject", "2.1");
</script>
<script type="text/javascript">
function updateHTML(elmId, value) {
document.getElementById(elmId).innerHTML = value;
}
function onPlayerError(errorCode) {
alert("An error occured of type:" + errorCode);
}
function onPlayerStateChange(newState) {
updateHTML("playerState", newState);
}
function updatePlayerInfo() {
var percent = "cargado";
if(ytplayer && ytplayer.getDuration) {
if(Math.round((ytplayer.getCurrentTime()*100)/ytplayer.getDuration())>0)
percent = '0';
if(Math.round((ytplayer.getCurrentTime()*100)/ytplayer.getDuration())>10)
percent = '10';
if(Math.round((ytplayer.getCurrentTime()*100)/ytplayer.getDuration())>20)
percent = '20';
if(Math.round((ytplayer.getCurrentTime()*100)/ytplayer.getDuration())>30)
percent = '30';
if(Math.round((ytplayer.getCurrentTime()*100)/ytplayer.getDuration())>40)
percent = '40';
if(Math.round((ytplayer.getCurrentTime()*100)/ytplayer.getDuration())>50)
percent = '50';
if(Math.round((ytplayer.getCurrentTime()*100)/ytplayer.getDuration())>60)
percent = '60';
if(Math.round((ytplayer.getCurrentTime()*100)/ytplayer.getDuration())>70)
percent = '70';
if(Math.round((ytplayer.getCurrentTime()*100)/ytplayer.getDuration())>80)
percent = '80';
if(Math.round((ytplayer.getCurrentTime()*100)/ytplayer.getDuration())>90)
percent = '90';
if(Math.round((ytplayer.getCurrentTime()*100)/ytplayer.getDuration())==100)
percent = '100';
if(percent_tmp != percent)
{
_gaq.push(['_trackEvent', 'Videos', 'Status', percent]);
percent_tmp = percent;
}

}
}
function onYouTubePlayerReady(playerId) {
ytplayer = document.getElementById("ytPlayer");
percent_tmp = -1;
setInterval(updatePlayerInfo, 1000);
updatePlayerInfo();
ytplayer.addEventListener("onStateChange", "onPlayerStateChange");
ytplayer.addEventListener("onError", "onPlayerError");
}
function loadPlayer() {
var videoID = "rfouqNtKtoQ"
var params = { allowScriptAccess: "always" };
var atts = { id: "ytPlayer" };
swfobject.embedSWF("http://www.youtube.com/v/" + videoID +
"?version=3&enablejsapi=1&playerapiid=player1",
"videoDiv", "480", "295", "9", null, null, params, atts);
}
function _run() {
loadPlayer();
}
google.setOnLoadCallback(_run);
</script>

You can also view a working example on this link:

https://www.thyngster.com/dev/video_tmp.php

For your convenience we’ve included an Excel file with the chart and you just need to fill the Event column values that you get from GA API . Plus we’re including a direct link to GA API call at the Google Analytics API Explorer.

Url al reporte en el GA API Explorer 2* As you can see we just are using  “Status” string as Action, we could use something like  status_ID_VIDEO is we’re going to track more than one video. 

Video Engagement Funnel Excel.  DOWNLOAD

The same way that YouTube offers these possibilities, Vimeo has a micro-framework called froogaloop. And players like jwplayer and flowplayer have a build-in features to achieve this goal.

If you any question, or suggestion, just leave a comment on this post.

Comments

2 responses to “Measure your videos engagement with Google Analytics”

  1. Jim Arnold Avatar

    I put your code into a site using the StudioPress Lifestyle theme, using the theme setting to place the code in the header. Upon saving all the code disappeared, including my Google Analytics code. FUBAR.

    1. thyngster Avatar
      thyngster

      I dunno what could be the problem, anyway you should adapt this code to your site, is just a example, but adding this code shouldn’t have anything to do with your current GA tag …

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.