Device Motion in Html/Javascript

A simple demo

A while ago, I built a simple demonstration on how to stream accelerometer data from a mobile device over websockets to a server just using html and javascript. It consists of a nodejs web server and a processing.org visualization. As soon as a mobile browser connects to the server a new red cube is shown on the screen (placed between randomly generated cubes). The transparent area around the cube changes depending on how strong one shakes the phone.

Visualization based on mobile phone data from Kai Kunze.

You can get the code from my github page

It’s based on these tutorials and sample code:

a simple chat server node.js tutorial

3d css cube

3d cube world