Home / Posts tagged "Kinect"

Adidas all for this case study – part 1

Recently I have been working on a project for Adidas called “All for this”, for more details of the project you can check out our case study here.

But now I’m going to share something more but doesn’t go ahead. At the beginning of the project we are really ambitious, we are thinking of doing the motion capture ourself using microsoft kinect. It’s such an interesting idea and a good challenge so I spend 2 days to build this simple prototype.

The first step is to get the data from kinect, I was using processing to do this. The data is consist of several frames, and for each frame it holds the position of all the points in 3D. After getting all the information i put it in a big json string then pass it to javascript. At this point the point clouds look like this :

pointCloud1

and you can check the actual action here.

And once you get these information it’s all up to you how to use it. In this case i use them as emit points for the particles, just randomly select some points to emit the particle every frame. you can check the result here.

Unfortunately due to limit budget and time at the end we go with a motion capture company instead of do it on our own, but it’s still an interesting experience for me. It feels like a mini installation to do the capture, you need to setup the environment and adjust you code such as reduce the noise … etc, these are very precious to me.  So this is the part one of the case study, the second part will be on the canvas, as you see these prototypes are build using webgl, but for the project we are not allow to use it, so we come up with another idea, stay tuned for the part 2!

Bubble Man

Just a little toy, i capture the motion using kinect and export them to javascript. Then recreate the motion using particles based on the data obtained from kinect. Rotate it to hear different musics.

Another thing I tried to do is the sound, i want the sound to change when user view it from different angles and transition must be smooth. To be honest it’s just to change the volume of each sound ( in this case i put 3 sounds ) with the position of the camera, the code look like this :

if(angle > (210 - range) && angle < 210 ) { 	 	
theta = (angle - ( 210 - range)) / range * PI2; 	 	this.gains[0].gain.value = Math.cos(theta); 	 	this.gains[1].gain.value = Math.cos(PI2 - theta); 	 	this.gains[2].gain.value = 0;  } else if(angle > (330 - range) && angle < 330 ) { 	 	theta = (angle - ( 330 - range)) / range * PI2; 	 	this.gains[0].gain.value = 0; 	 	this.gains[1].gain.value = Math.cos(theta); 	 	this.gains[2].gain.value = Math.cos(PI2 - theta);  } else if(angle > (90 - range) && angle < 90 ) {
	theta = (angle - ( 90 - range)) / range * PI2;
	this.gains[0].gain.value = Math.cos(PI2 - theta);
	this.gains[1].gain.value = 0;
	this.gains[2].gain.value = Math.cos(theta);
}

Really no big deal but it’s fun to play.

For the using of web audio, here is a very good article :
http://www.html5rocks.com/en/tutorials/webaudio/games/