Touch, shake, tilt: touchmove, deviceorientation, devicemotion apis

Monday 07 May 2012 at 17:58

For a few weeks I've been experimenting with some new (to me) HTML5 apis for multitouch events, device orientation and device motion. I'm planning to work these into my turtle graphics implementations, but needed to understand what information these sensors provide.

A couple weeks ago I got around to looking at Tim Bray's post about sensor kenetics on Android devices. Fun and just the nudge I needed to start visualizing the inputs from these sensors.

I've only tested these on iOS, so no promises for those of you with droids. Have a look first at this expriment with javascript multitouch which includes real-time charts of deviceorientation and devicemotion apis. The charts are modeled directly on Tim's.

It was a good enough start. Fiddling around with the charts real-time helped a lot. But I'm much happier with tonight's milestone. Here is an interactive visualization of deviceorientation and devicemotion apis. The deviceorientation controls the position of three circles on the screen. The devicemotion adjusts the radius of the circles.