Sean Walther's Blog

AJAX Effects, including Heatmapping

I saw an article on Digg today, 20 Excellent AJAX Effects You Should Know.

They go through the usual stuff, auto completing forms, inline editing, fancy uploading, email, file directory, etc.

The most interseting, to me at least, is the “ClickHeat Clicks Heatmap“.

ClickHeat image screenshot of reported heatmap information.

The other effects are all standard, they are very useful, but as is noted in the article — heatmaps are an underused aspect in web development.

Way back when, I used to work on Heatmaps (although I didn’t have a name for it).  I had created a webpage that was just a grid of 5×5 transparent pixels.  The point of that, was that each pixel reported the mouse position on mouseover.  Back then (this was in 1998 now), I had tried to find a way to get the browser to be able to track down where the user “looks” with the mouse, while on your website.

Can’t we all understand just how powerful this is?

We can finally, clearly, see what a user is looking at with their mouse.  I know I do this — move my mouse around as I’m interested in something in an article.  I don’t know why I do it, but I do.

Here’s just some quick ideas:

1. Identify if the users can “see” parts of your navigation, or if they are ignoring it
2. Which articles are they looking at?
3. Optimize the functionality to report on a single user, and record the time of the mouse position — giving a view of exactly where a user moves their mouse (they may provide this functionality)
4. Adding mouse movement tracking (the software seems to only report clicking locations)

Tags: AJAX, effects, heatmap, Javascript, reporting

No comments yet.

Leave a comment

Name (required) Mail (will not be published) (required) Website

CAPTCHA Code *

Notify me of follow-up comments by email.

Notify me of new posts by email.