Playing with autum: Kinect’s interaction

Bruno Barrán

Unfortunately your browser is not able to show this content.Lluvia de bolas

You can download arbol_test.pde (Sourcecode) and compile it with Processing.

Due to Zaragoza’s Pilar festival , Nueve Ojos and Joan Baixas called us to create an interactive experience for kids. The idea really exited us from the begining, even we knew that we were facing to the most exigent public .

We thought three mini games based in kinect’s recognition of silhouette and main body articulations. All the narrative was about the autum , so we decide to inscribe the three interactions in the main symbols of this season. A tree, the leafs and the rain.

We become trees

For the first part we decide to transform human silhouettes in trees. How do you feel when roots are growing from your body? How the trees could move if they had arms and legs? We were anxious to answer this questions.
For the programming tasks we decide to appeal to and old friend that we partner for the Macba and Caixaforum’s adventure. Processing, a java based lenguage, that allowed us a full and easy integration with Kinect.

The first challenge was there. We want to transform us in tress, but wasn’t enough drawing them and stick them over the silhouettes, we wanted that every user become in a unique tree. The solution was to generate them in code, using an algorithms that simulate organic shapes. This was the result:

click to generate a tree again

To integrate them with the silhouette, we linked three diferent trees for the two arms and the spine. Later on we put some leaves, that allowed a transition for the next game.

El árbol humanoide

El árbol humanoide

Wind and leaves

The second part of the interactivity plays with the wind and leaves sensations. A bunch of leaves are appearing from the kids’s hands and the leaves are running away of the screen blown by a caotic wind, wich is caracteristic from the season. The code uses forces and rotations to get the effects we were searching.

class Hoja{
PVector gravity, aceleration, vel, pos;
float theta, theta_vel;
int c;
color[] col={color(60,0,0),color(204,179,51),color(190,70,0)};
Hoja(PVector _pos, PVector _f, int _c){
  pos = new PVector (_pos.x,_pos.y); // random within box
  vel = new PVector (random(-5),random(5)); 
  aceleration = new PVector(0,0);
  gravity = new PVector (0,random(0,0.4)); 
  theta = 0.0;

void run(){

void update(){
  theta_vel = (vel.x * vel.mag()) / 50.0f;
  theta += theta_vel;

void dib(){

boolean out(){
  if (pos.y>height){
  return true;
    return false;
void applyForce(PVector _f){
Jugando con hojas

Playing with leaves

The bouncing rain

The rain was the excuse we needed to put a physics motor aplication. From the beginning we decide to get an integrated silhouette with the other scene’s elements.We wanted to play with the body and it’s expressivity, so we decide that the rain drops bounce like id the kids were inside the app.

This third part was even more complex technically speaking .En every frame Kinect is tracking the silhouettes, we put the point cloud into the object of “our physical world” and then we calculate the drops collisions. For simulating this we usedPBox2D library, basing us in Creative Applications’s example.

Lluvia de bolas

Raining balls

Delicias’s land

So finally the presentation day came. The Delicias’s park in Zaragoza became in a micro world with a lot of autum games and we did our game inside the library of the park. During all the week that the installation was working it had a great reception from childrens and parents. We enjoyed a lot checking how the kids were playing with the idea of being a tree or playing with a rain that looked as a big pool of balls.
For us was a enormous satisfaction because the kids they explore every single part of the interactivity. We hope to work for them again soon!

We let us here a test recorded in our studio

Leave a Reply