Mouse Tracking, Heat Maps & Record Visitors For Free!

click tale 300x68 Mouse Tracking, Heat Maps & Record Visitors For Free!You might have heard of Click Tale. It’s a great product which offers some unique tools not offered by any major analytics vendor in such a complete package:  Visitor Recordings, Mouse Move Heatmaps, Attention Heatmaps and more. They also have a free lite version which is a tad limited, but will give you a wonderful taste of the tool (scroll to the bottom of the page to find it).

Do not take this as an ad for ClickTales, because its not – we just wanted to point out an overlooked tool if your have the budget for it. For those that don’t have a major budget and might be using Google Analytics or Piwik, there is now an option. It will require some work on your part (but not much), but it will allow you to get some of the features found in ClickTales. Its an open source script called Simple Mouse Tracking (SMT) from Luis Leiva which allows you to record mouse activity on Web pages and replay mouse activity in real time. Below is a screen shot of the data you can record for each visitor (but you can aggregate it, if you choose):

mouse movements and clicks heat map recorded 300x151 Mouse Tracking, Heat Maps & Record Visitors For Free!

You can download Simple Mouse Tracking (SMT) here or check the demo here.The requirements to get SMT for yourself are really basic, like it should be for all open source projects. All your Web server needs is a MySQL 5 database and PHP 5 installed with the cURL and JSON libraries. These settings are very common on most Web servers. The install process is also very easy much like WordPress, just follow the steps in the readme file. Once you are up, you will need to add the following to the head of each document you want to track:

<script type="text/javascript" src="/smt2/core/js/smt-aux.min.js"></script>
  <script type="text/javascript" src="/smt2/core/js/smt-record.min.js"></script>
  <script type="text/javascript">
  try {
    smt2.record({
      recTime: 300,
      disabled: Math.round(Math.random()),
      warn:true,
      warnText: "We are going to record your mouse movements for a remote usability study."
    });
  } catch(err) {}
  </script>

Modify the code as necessary. For example you can change the warn text to something like:

warnText: "We'd like to track your mouse activity\nin order to improve this website's usability.\nDo you agree?",

Or you can change the randomness of the visitors recorded, the amount of time visitors are recorded etc.

As you can see this is a very powerful tool, but this does not replace a fully integrated system like ClickTales. Nevertheless, for the more adventurous this could be a great add-on to free solutions you are currently using. Also being it is open source and actively developed, who knows if maybe in the future some plugins will be created to make it easier to integrate with Piwik, WordPress, Joomla, Drupal and other CMS systems.

 Mouse Tracking, Heat Maps & Record Visitors For Free!

About The Author: Adrian has over 10 years experience in Web Marketing and Analytics. He currently works at Future Electronics in the Web Development Department. In his spare time you can find him tinkering with various open source web projects or reading books on analytics or marketing.

More Posts - Website - Twitter - Google Plus

Print This Post Print This Post
  • Aug 23rd, 2010 at 05:53 | #1

    thanks for sharing this :o )

  • Dont Bother
    Dec 8th, 2010 at 11:29 | #2

    Good Job, so glad you are helping abuse Internet users.

    • Mark8t Staff
      Dec 8th, 2010 at 19:58 | #3

      How is improving your site with analytics an abuse?

Comments are closed.