Skip to main content
  1. Blog Post/

Measure your videos engagement with Google Analytics

4 min · 1023 words

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.

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

    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.

    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.