Friday, October 19th, 2007

JavaScript Mouse Move Logger

Category: JavaScript, Library

Marcel Oelke has resurrected some code that he wrote to record mouse movement using JavaScript and Ajax.

The “movelogger” records the mouse movement a users does on a web site. Just before the user leaves the current page, the recorded data get posted back to the server using Ajax.

The cool thing is that you can “replay” these movements afterwards. The movelogger records clicks on links and other elements. In replay mode this events are fired in the exact same order as they have been recorded.

That way it would be possible to record a websession (the click-flow) in a heavy Ajax based application. It would even be possible to record keyboard strokes and other type of events.

Check out a demo of the logger at work

Posted by Dion Almaer at 11:09 am
19 Comments

+++--
3.2 rating from 20 votes

19 Comments »

Comments feed TrackBack URI

Cool, but what would be some real world uses for that?

Comment by justin — October 19, 2007

I had the same idea a while ago: http://svay.com/experiences/mouse-recorder/ (blog post: http://www.svay.com/blog/index/2005/08/23/297-ameliorez-votre-site-grace-a-ajax )

Comment by Maurice — October 19, 2007

Imagine with google analytics (or similar) you could re-play your visitors.

Comment by D — October 19, 2007

You guys covered a few start-ups offering this service some time back, robotreplay.com, clicktale.com etc. I experimented with the idea (JS source) a while back, capturing and replaying the whole session – mouse movements, what was clicked, scrolling, what button was clicked etc. Kinda neat, but I didn’t really pull much useful info from it.

Comment by Scott Schiller — October 19, 2007

Is that means the dynamic keyboard (usually used by web-bank, let user enter password by mouse clicks) no more safe ?

Comment by Pomin — October 19, 2007

Random assignment of keyboard layout would easily fix that problem, albeit it might take a bit longer to hunt and click.

Comment by Adam Goldstein — October 19, 2007

Hmm — seemed a big buggy. (Firefox 2.0.0.8 with the usual extensions). Seems to not capture my mouse movements if I go over close to the same area I went to before.

Comment by mdmadph — October 19, 2007

Use – being able to see how users actually use your site vs how you think they use your site, and being better able to craft the user experience to fit how its actually being used perhaps?

… just a crazy whacky idea.

Comment by Kaniz — October 19, 2007

@Kaniz

That’s crazy talk- always better to just assume what the users are doing. What you’re proposing I would call ‘reality creep’, and we all know where that leads. REALITY!

Comment by Matt — October 19, 2007

Anyone notice their cursor moving slowly on the demo page?

That’s one obvious side effect of such a capturing idea…

Comment by Matthew — October 19, 2007

it doesn’t capture on Firefox2 when I move around for a bit over an image.

Comment by Chris Phillips — October 19, 2007

Besides for the replay to make sense the page must be rendered exactly as on the original client i.e. same resolution, blocked elements, font-sizes, user stylesheets and live changes ( I for one often change the style of pages I read when were are a bit cumbersome like news sites with multiple columns and pull out ) … good luck covering all this.

Comment by Mathieu 'p01' Henri — October 20, 2007

LOL @ Matt : Reality Creep? that’s funny. The whole idea seems kind of stalker like to me and a killer ‘waste’ of resources. Click tracking is one thing, but this is just voyeurism (and that is IF it worked reliably.) I find the usual traffic log breakdown more than enough to pinpoint hot spots in most cases. While I can image one or two scenarios where mouse over and focus logs could be useful, mouse logging seems way off base for anything but nefarious purposes ~ thank goodness for script blockers.

Comment by advanced — October 20, 2007

We had a marketing/seo guy desperately trying to understand why on earth ppl had not been pouring in to a job offer landing page (which was hidden under tons of pages, had not been advertised etc), so he told us, the only thing can help is logging the exact mouse movement of the user, so that “we can understand what he or she does on the page”… yeah, right. Maybe it is me, who can’t think big.

Comment by deadcabbit — October 21, 2007

I got it, Mouse Macros!
Most of the goodies are hidden behind the json.js file.
Probably a good thing, would be killer bot food.
None the less pointer playback could be handy for collabs
and / or shared environments ( i.e. tech support ).

Comment by advanced — October 21, 2007

I think ClickTale is using this in their software. Yon can watch the mouse and scrolling moves of your website visitors.

Comment by Markus — October 21, 2007

Unethical. I’m sure it’s well-intended, but you know what they say about the road to hell being paved with such intentions.

Comment by Tim Cooijmans — October 22, 2007

@ Tim: Unethical? It’s not like the browser is returning information on recently visited sites or their filesystem, it’s just watching the position of their cursor, what’s the big deal?

Comment by Joe — October 22, 2007

This is a very slick script!
I tried the demo on Firefox 2.0.0.8 and the only issue i experienced was around scrolling. When I moved my mouse around the screen, scrolled to the bottom of the page and continued the mouse movements, the replay did not include the scrolling events. If this script could capture the mouse scroll events, then I could see numerous uses for this.

Comment by mteti — October 22, 2007

Leave a comment

You must be logged in to post a comment.