A touch.

Visualize touches on a screen with JavaScript

I am writing some software for some experiments that I am planning. In the experiments, I am going to have participants use several interfaces and compare their performance on different interface. I am using an iPod Touch as the device and capturing the screen using QuickTime on a Mac.

It is disorienting to review the video and see the interface change but not see the user’s fingers. To solve this problem, I wrote some JavaScript code that displays a little number at each touch point that quickly fades away. This makes video captures much easier to follow.

The TouchShow code is available on GitHub and is open source.

(Image by flickr user the Comic Shop was cropped and used under CC BY 2.0 license.)