Leap Motion and JS Rubik’s Cube « My Site/Blog
Untitled Document

Leap Motion and JS Rubik’s Cube

I’ve had the chance to play with a Leap Motion over the past couple of days and started working on JavaScript and Websocket integration. I found a full HTML5/CSS3/JS Rubik’s cube simulator and decided it would be a nice way to familiarize myself with the orientation and gestures of the Leap.

Playing with the leap has been a lot of fun and there is definitely a lot of potential for embedded projects. The JS library and documentation was a little lacking and somewhat fragmented across several sites so it took me a while to get a handle on the API. I set up a stream to my new testing grounds where you can see what I’m currently working on. The cube currently uses the x/y position of one hand for orientation and gesture commands from the other to rotate the pieces. Check out the videos below for a quick demo:

It takes a while to get used to at first, however my code is far from perfect but adequately shows how responsive the leap can be. The cube orientation can be changed with an open hand while making a fist halts the tracking allowing you to easily interact with the cube faces with gestures. The mapping shown in the first video is merely a demo of preexisting moves and the final version will be changed to reflect more realistic interaction.

Untitled Document

1 comment

  1. Sahil Khan says:

    Amazing how it works

leave a response

Untitled Document