On November the 15th we'll have our first openFrameworks Freakday. On this day we will come together with a group of openFrameworks fanatics! We'll discuss projects and try to help eachother where we can. After our first freakday we introduced interest-groups where you work with a group on a certain project/topic which you are interested in.

The meeting/workshop will start at 10.00-10.30 in the morning an will be held at:

Duintjer CS
Vijzelstraat 72, 4th floor, room 4.10
1017 HL, Amsterdam

Make sure you take your laptop with you and try to install openFrameworks

The meeting/workshop is free, though we ask you to donate something for the food and drinks we provide. Sign up below; we're looking forward to meet you!

We created a wiki for the freakDays!!

Last weekend we had our first openFrameworks FreakDay with a group of ~14 creative-developers. Some did already amazing things with oF others just came to learn to use it. After a wonderful introduction on oF by Theo everyone started with examples applications or their own projects. This was our first meeting so we had to figure out the format.. for the next meeting we're thinking to create interest-groups where you can participate on a certain subject and work as a group on a problem and try to help/figure out how to create things with oF. You can think of a interest-group "hardware<>of" or visualisation/3D/openGL. We'll think about this format and start a mailing list where everyone can participate on this discussion.

2009.09.10 - Invitation

Hi fellow openFrameworks freaks, enthusiasts and fanatics!

On October the 18th we'll have our first openFrameworks Freakday. On this day we will come together with a group of openFrameworks fanatics! We'll discuss projects and try to help eachother where we can.

The idea of this meeting is to share knowlegde and have fun with openFrameworks. As this is the first openFrameworks Freakday we hope to see you 18 October. Example topics we can talk about are:

• openCV / computer vision
• trigonometry
• openGL
• programming animation
• hardware (?)
• ... any other interesting topics...

The meeting/workshop will start at 10.00 in the morning an will be held at:

Duintjer CS
Vijzelstraat 72, 4th floor, room 4.10
1017 HL, Amsterdam

Make sure you take your laptop with you and try to install openFrameworks

The meeting/workshop is free, though we ask you to donate something for the food and drinks we provide. Sign up below; we're looking forward to meet you!

Youcube @ Lowlands 2009 Benthuizen from roxlu on Vimeo.

ofAgua Medusae v2 from dr woohoo on Vimeo.

These are the steps you need to do:

1. Create png images from each frame
2. Create a HD movie from these stills / image sequence.

1. Create png images from each frame

In your application you should add this code which writes each frame to an image file sequence.

// img_saver is of type ofImage
static char file_name[255];
sprintf(file_name, "output/output_%0.4i.png", saved_image_num);
img_saver.grabScreen(0, 0, ofGetWidth(), ofGetHeight());
printf("Saving file: %s\n", file_name);
img_saver.saveImage(file_name);
saved_image_num++;

This saves each frame to a file named output_001.png, output_002.png etc.. Make sure you create the output directory in your bin/data/ folder.. saved_image_num is of type int and a member of the testApp class. I also tried to use memo's threaded image saver, but this one skipped some frames. I got files like 001, 003, 004, 006 etc..

Also make sure your application has a window which is conform HD:

int main( ){
    ofAppGlutWindow window;
    ofSetupOpenGL(&window, 1280,720, OF_WINDOW);        
    ofRunApp( new testApp());
}

2. Create a HD movie from these stills / image sequence.

Now, download Avidemux and make sure you've got the Xvid codec installed. Once you've installed Avidemux, run it. Now follow these steps:

• File > Open and select the first file of the image sequence
• At the video selectbox, select MPEG-4 ASP (XVid4)
  

• Click on "Configure" under Video and use these settings:

• Click on the "Filters" button > Interlacing > Add the "yadiff" (click green plus sign to add it)
  

• Than you only need to save the video and it starts rendering. That's all! So File > Save> Save Video...

• As format I used "avi"

Vector math addon for openFrameworks.

Download the ofxVectorMath addon
which is part of the FAT package. (click this link to open the download page of openFrameworks)

In this article I'll explain how to simulate the movements of birds which is called flocking. The article is based on the wonderful paper of Graig Reynolds whom's name is always used in the same sentence with flocking behavior. Graig did a wonderful job on the research of movement of birds. This behavior can be used in you visualisations, simulations, etc.. A couple of days ago I found a fantastic implementation of flocking behavior in a logo. Have a look at BLPRNT.com (wait untill the logo has loaded).

Keypoints in flocking

Basically to implement flocking behavior you'll need to following things:

1. A good working vector class which openframeworks has.
2. Implementation of: Separation
3. Implementation of: Alignment
4. Implementation of: Cohesion

Flocking video, based on the code described in this article

Flocking with openFrameworks from roxlu on Vimeo.

1. A good working vector class.

Here I mean a vector class which does all the vector operations for you. A vector is something which has a length and a direction. You can find numerous tutorials on vector math but to implement flocking you don't need lots of fancy things. Most of the math is extremely simple, like addition, subtraction, multiplication and averaging. 'All'of the flocking implementations use a vector class, though it can be done without. In this article we do use vectors. Let me quickly explain how this vector class is used.

In our simulation we have a couple of "boids", which represent the birds. A bird has a position and velocity. Multiple forces which influence the velocity and therefore the position are applied on thes boids. Like in most physics implementations we calculate the resulting position based on the current forces, velocity and position. The new position is simply calculated by adding all the forces to the velocity and then adding the velocity to the current position.

velocity += force;
position += velocity;

Note that the above code is not 100% working as we need to limit the force and velocity.

2. Implementation of: Separation

We use separation to avoid that all boids group together at one position. They need to keep a certain distance from eachother. For this implementation we created two classes, Boid and Boids. Boid represents a single bird, and Boids a 'flock'.

The Boids class implements the flocking behaviour. It has a method "flock()" which handles the separation. Roughly the separation works like this (in pseudo code):

Loop through all boids (i)
    Loop through all other boids (j)
          Check if i != j (we don't check the current boid with itself)
          Calculate the distance of the current boid (i) with the other boids (j)
          If the other boid is too close move away 
   End loop
End loop

The implementation of cohesion for our flocking algorithm:
note: I left out the other part like cohesion and alignment for clearity.

void Boids::flock() {
    float too_close_dist = 90.0f;
    float in_sight_dist = 150.0f;
 
    for (int i = 0; i < boids.size(); ++i) {
        for(int j = 0; j < boids.size(); ++j) {
            if (j == i) continue;
            float dist = (boids[i]->getPosition() - boids[j]->getPosition()).length();
 
            // separate
            if (dist <= in_sight_dist ) {
                // This is where we move away. We "Flee" away from the other Boid.
                if (dist <= too_close_dist) {
                        boids[i]->flee(boids[j]->getPosition());
                }
            }
        }
 
    }
}

3. Implementation of: Alignment

As described by Craig Reynolds, alignment is the behavior of birds when they steer towards the average heading of local flockmates. This means we check which birds are in range and remember the velocity of each of these in-range birds. When we've found all birds in range we average this velocity and steer towards it.

Alignment in openFrameworks

void Boids::flock() {
    float too_close_dist = 90.0f;
    float in_sight_dist = 150.0f;
    int insight_count = 0;
    ofxVec3f average_vel, average_pos;
    for (int i = 0; i < boids.size(); ++i) {
        average_vel.set(0,0,0);
        average_pos.set(0,0,0);
        insight_count = 0;
 
        for(int j = 0; j < boids.size(); ++j) {
            if (j == i) continue;
            float dist = (boids[i]->getPosition() - boids[j]->getPosition()).length();
 
            if (dist <= in_sight_dist ) {
                average_vel += boids[j]->getVelocity();
                insight_count++;
            }
        }
        if (insight_count > 0) {
            average_vel /= insight_count;
            boids[i]->addForce(average_vel - boids[i]->getVelocity());
        }
    }
}

4. Implementation of: Cohesion

When we've got a group of birds they tend to fly into a direction as a whole. This is because of cohesion; each bird positions himself to a average direction. A bird looks at the birds which are in sight and adjusts his position to the average position of the birds in sight.

Technically we achieve this (like with separation) for each bird to check the distance to the other birds and when they are in a given range we remember their position. When we've looped through all position for lets say the first bird, we calculate the average position and we let the bird seek this point.

In pseudo code:

Loop through all boids (i)
    Loop through all other boids (j)
          Check if i != j (we don't check the current boid with itself)
          Calculate the distance of the current boid (i) with the other boids (j)
          If the other boid is in range
               Add the position to our average postion vector (ofxVec3f)
               Increase the "insight counter" that is used to average the position
          End if
   End loop
   Average the position
   Let boid "i" seek to the average position
End loop

Implementation of the cohesion for the flocking algorithm.

void Boids::flock() {
    float in_sight_dist = 150.0f;
    int insight_count = 0;
    ofxVec3f average_vel, average_pos;
    for (int i = 0; i < boids.size(); ++i) {
        average_vel.set(0,0,0);
        average_pos.set(0,0,0);
        insight_count = 0;
 
        for(int j = 0; j < boids.size(); ++j) {
            if (j == i) continue;
            float dist = (boids[i]->getPosition() - boids[j]->getPosition()).length();
 
            if (dist <= in_sight_dist ) {
                average_pos += boids[j]->getPosition();
                insight_count++;
            }
        }
        if (insight_count > 0) {
            average_pos /= insight_count;
            boids[i]->seek(average_pos);
        }
    }
}

Additional information about flocking

As you see we use a method "seek" which implements a seeking steering behavior. I've attaced the source code with some other parts that are used to create a simple flock.

Resources

Craig Reynolds Boids
Download the source code of the flocking algorithm

Here's the code It makes use of the openframeworks library so you will need to be familiar with how to setup an XCode project with the openframeworks library if you plan on using it.

The original idea was to use glass balls so that's why all the code says glassBalls instead of say glassNeurons. If you manage to get it running, press 'd' to see the live video input. As it collects faces, it fills up the image buffers with each "glassBalls". Once all the glassBalls are loaded with images of faces, then the visualization begins. Neurons will "fire" and brightness values of each neuron will go up and down based on Gaussian functions and these values are sent to the brightness shader.

It was a bit of a sculptural challenge placing all the glass pieces within view of the projector, avoiding any other glass pieces or chains in the line of sight of it, having it fit within our view of what we wanted, and also within the amount of time we had. We did the projection mapping by just creating the object with a bounding box. Once you moused over an image of a person's face, you could drag it around, use '-', '=', '_', or '+' to resize it. I used a text file to store ('w') and read ('r') the positions of the faces in case I had to reload the program. I think memo has some MSAInteractiveObject class now which would be 1000x nicer to use.

Just a note as well, I wrote this against of573. I also ended up extending ofxCvColorImage with a few functions so I've just included all of ofxCv* files in the project. There may very well be other functions that I've edited and forgotten about so please let me know if you have any problems with it. Have a look through and please let me know what you think!

The software is developed in OpenFrameworks, using alot of OpenCV code. The tracking of the canvas on the wall was done with tBeta.

The installation ran for 7 hours during the party, and there was taken more then 500 pictures, and the audience really liked it. People understood the concenpt (even drunk) right away, and told it to each other when passing by. Many came back later and took some more photos

Gegenlicht (back-light) - Audio Reactive realtime video from moka on Vimeo.

Swarm from Blendid on Vimeo.

TouchMe - China 2008 from Blendid on Vimeo.

External site

Multitouch Physics Game from Patch on Vimeo.

Carnival Interactive Aquarium from vanderlin on Vimeo.

More photos

Mounds from vanderlin on Vimeo.

ofxMSAFluid for openFrameworks from Memo Akten on Vimeo.