Awhile back, we wanted to create demo videos for clients, showcasing some of our iPad Web Application work. One of the challenges was how to show the interactions — the touches and gestures — when working with the application. There is no mouse, like on desktops. A screenshot, or a video of the application, will simply show things happening as if by magic. And taking a video or photo of a user interacting with the device is just clumsy and laborious: You need a camera, the user’s hand covers the content, you have to get a manicure, all that.
With the programming expertise of Xiyuan Shen and our good friend Ian Gilman, I set out to do something about this. I knew from having seen the awesome yet thoroughly creepy Phantom Limb (demo) that it was possible to inject a mouse-marker using a bookmarklet. This would allow us to run our code on almost any webpage, without the author having to include our script on their page. It could be injected on an as-needed basis by the presenter.
