{"id":3014,"date":"2011-08-17T11:20:00","date_gmt":"2011-08-17T18:20:00","guid":{"rendered":"https:\/\/pkmital.com\/home\/?post_type=pkm_teaching&p=3014"},"modified":"2023-08-22T18:00:32","modified_gmt":"2023-08-23T01:00:32","slug":"center-for-experimental-media-art-interim-semester","status":"publish","type":"pkm_teaching","link":"https:\/\/pkmital.com\/home\/teaching\/center-for-experimental-media-art-interim-semester\/","title":{"rendered":"Srishti College | Center for Experimental Media Art: Interim Semester"},"content":{"rendered":"\n

This is the homepage for the project entitled \u201cStories are flowing trees\u201d<\/em> at Srishti School of Design\u2019s Center for Experimental Media Arts.<\/p>\n\n\n\n

Check back here for daily updates.<\/p>\n\n\n\n

Day 1<\/h3>\n\n\n\n
\n
\n

Introduction<\/strong><\/p>\n<\/div>\n\n\n\n

\n

openFrameworks introduction:
\u2013 http:\/\/www.openframeworks.cc\/<\/a>
\u2013 open-source creative coding toolkit for writing software
\u2013 provides many high-level classes and abstractions which are cross-platform for a collection of libraries including: OpenCV, Vector\/Matrix Math, Graphics using OpenGL, Mesh, OBJ, VBO, Shaders, Audio\/Video input\/output\/saving, Kinect, File\/Directory access\/manipulation, TCP\/IP\/UDP\/OSC, Threading, Physics engine, Synthesizers, iPhone\/Android integration (GPS\/Compass\/UI\/OpenGL\/Maps\/Audio\/Video), \u2026<\/em><\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

basic program:<\/strong><\/p>\n<\/div>\n\n\n\n

\n

testApp.h<\/strong><\/p>\n\n\n

\n#pragma once\n \n#include "ofMain.h"\n \nclass testApp : public ofBaseApp{\n \n    public:\n         \n        \/\/ declaration of functions\n        void setup();\n        void update();\n        void draw();\n};\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n\/\/ here we "define" the methods we "declared" in the "testApp.h" file\n \n\/\/ i get called once\nvoid testApp::setup(){\n     \n    \/\/ do some initialization\n     \n    \/\/ set the size of the window\n    ofSetWindowShape(250, 250);\n     \n    \/\/ the rate at which the program runs (FPS)\n    ofSetFrameRate(30);\n     \n}\n \n\/\/ i get called in a loop that runs until the program ends\nvoid testApp::update(){\n     \n}\n \n\/\/ i also get called in a loop that runs until the program ends\nvoid testApp::draw(){\n     \n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
\n
\n
mouse input:<\/strong><\/p>\n<\/div>\n\n\n\n
\n
test.App.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n \nclass testApp : public ofBaseApp{\n \n    public:\n         \n        \/\/ declaration of functions\n        void setup();\n        void update();\n        void draw();\n};\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n\/\/ here we "define" the methods we "declared" in the "testApp.h" file\n \n\/\/ i get called once\nvoid testApp::setup(){\n     \n    \/\/ do some initialization\n     \n    \/\/ set the size of the window\n    ofSetWindowShape(250, 250);\n     \n    \/\/ the rate at which the program runs (FPS)\n    ofSetFrameRate(30);\n     \n    \/\/ don't clear the background on each update\/draw loop\n    \/\/ ofSetBackgroundAuto(false);\n}\n \n\/\/ i get called in a loop that runs until the program ends\nvoid testApp::update(){\n     \n}\n \n\/\/ i also get called in a loop that runs until the program ends\nvoid testApp::draw(){\n     \n    \/\/ set the size of the circle\n    float radius = 3.0f;\n     \n    \/\/ draw a circle at the mouse position\n    ofCircle(mouseX, mouseY, radius);\n     \n    \/\/ note: \n    \/\/ the two variables, mouseX and mouseY are declared \n    \/\/ in the base (parent) class\n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
\n
\n
drawing a line:<\/strong><\/p>\n<\/div>\n\n\n\n
\n
testApp.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n \nclass testApp : public ofBaseApp{\n \n    public:\n         \n        \/\/ declaration of functions\n        void setup();\n        void update();\n        void draw();\n     \n        int counter;\n};\n\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n\/\/ here we "define" the methods we "declared" in the "testApp.h" file\n \n\/\/ i get called once\nvoid testApp::setup(){\n     \n    \/\/ do some initialization\n     \n    \/\/ set the size of the window\n    ofSetWindowShape(250, 250);\n     \n    \/\/ the rate at which the program runs (FPS)\n    ofSetFrameRate(30);\n     \n    \/\/ we are going to increment this variable each "frame"\n    counter = 0;\n     \n}\n \n\/\/ i get called in a loop that runs until the program ends\nvoid testApp::update(){\n \n    \/\/ update some variables\n    counter = counter + 1;\n}\n \n\/\/ i also get called in a loop that runs until the program ends\nvoid testApp::draw(){\n    ofBackground(0);\n     \n    float amplitude = 100.0f;\n     \n    ofSetColor(100, 100, 100);\n    ofLine(0, 125, 250, 125);\n     \n    ofSetColor(200, 200, 200);\n    for (int i = 1; i &lt; 250; i++) {\n         \n        float x1 = (float)i \/ 250.0;\n        float y1 = amplitude * sin( x1 * 2.0*PI );\n        float x2 = (float)(i - 1) \/ 250.0;\n        float y2 = amplitude * sin( x2 * 2.0*PI );\n         \n        ofLine(x1 * 250.0f, -y1 + 125, x2 * 250.0f, -y2 + 125);\n    }\n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
\n
\n
audio input:<\/strong><\/p>\n<\/div>\n\n\n\n
\n
testApp.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n \nclass testApp : public ofBaseApp{\n \n    public:\n         \n        \/\/ redeclaration of functions (declared in base class)\n        void setup();\n        void update();\n        void draw();\n     \n        \/\/ redeclaration of two special functions which handle audio i\/o (declared in base class)\n        void audioRequested(float *buf, int size, int ch);\n        void audioReceived(float *buf, int size, int ch);\n     \n        \/\/ we will keep a pointer to our audio\n        float *audioInput;\n        int sampleRate, bufferSize;\n};\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n\/\/ here we "define" the methods we "declared" in the "testApp.h" file\n \n\/\/ i get called once\nvoid testApp::setup(){\n     \n    \/\/ do some initialization\n     \n    \/\/ set the size of the window\n    ofSetWindowShape(250, 250);\n     \n    \/\/ the rate at which the program runs (FPS)\n    ofSetFrameRate(30);\n     \n    \/\/ setup the sound\n    sampleRate = 44100;\n    bufferSize = 250;\n    ofSoundStreamSetup(2,               \/\/ output channels\n                       1,               \/\/ input channels\n                       sampleRate,      \/\/ how many samples (readings) per second\n                       bufferSize,      \/\/ size of each copy of audio\n                       4);              \/\/ latency of audio\n     \n     \n    \/\/ a variable to store our audio\n    audioInput = new float[bufferSize];\n}\n \n\/\/ i get called in a loop that runs until the program ends\nvoid testApp::update(){\n \n}\n \n\/\/ i also get called in a loop that runs until the program ends\nvoid testApp::draw(){\n    ofBackground(0);\n     \n    float amplitude = 100.0f;\n     \n    ofSetColor(100, 100, 100);\n    ofLine(0, 125, 250, 125);\n     \n    ofSetColor(200, 200, 200);\n    for (int i = 1; i &lt; 250; i++) {\n         \n        float x1 = (float)i \/ 250.0;\n        float y1 = amplitude * audioInput[i];   \/\/amplitude * sin( x1 * 2.0*PI );\n        float x2 = (float)(i - 1) \/ 250.0;\n        float y2 = amplitude * audioInput[i-1]; \/\/amplitude * sin( x2 * 2.0*PI );\n         \n        ofLine(x1 * 250.0f, -y1 + 125, x2 * 250.0f, -y2 + 125);\n    }\n}\n \nvoid testApp::audioRequested(float *buf, int size, int ch)\n{\n     \n}\n \nvoid testApp::audioReceived(float *buf, int size, int ch)\n{\n    \/\/ copy the data into our variable, audioInput\n    memcpy(audioInput, buf, sizeof(float) * size);\n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
\n
\n
camera input:<\/strong><\/p>\n<\/div>\n\n\n\n
\n
testApp.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n \nclass testApp : public ofBaseApp{\n \n    public:\n         \n        \/\/ redeclaration of functions (declared in base class)\n        void setup();\n        void update();\n        void draw();\n     \n        void keyPressed(int key);\n     \n        ofVideoGrabber camera;\n};\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n\/\/ here we "define" the methods we "declared" in the "testApp.h" file\n \n\/\/ i get called once\nvoid testApp::setup(){\n     \n    \/\/ do some initialization\n     \n    \/\/ set the size of the window\n    ofSetWindowShape(320, 240);\n     \n    \/\/ the rate at which the program runs (FPS)\n    ofSetFrameRate(30);\n     \n    \/\/ setup the camera\n    camera.initGrabber(320, 240);\n}\n \n\/\/ i get called in a loop that runs until the program ends\nvoid testApp::update(){\n    camera.update();\n}\n \n\/\/ i also get called in a loop that runs until the program ends\nvoid testApp::draw(){\n    ofBackground(0);\n     \n    \/\/ draw the camera\n    camera.draw(0,0);\n}\n \nvoid testApp::keyPressed(int key)\n{\n    switch (key) {\n        case 's':\n            camera.videoSettings();\n            break;\n        default:\n            break;\n    }\n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
Day 2<\/h3>\n\n\n\n
\n
\n
Introduction<\/strong><\/p>\n<\/div>\n\n\n\n
\n
Over the next two days, you will play with audio and video in more depth. This will include processing the input of audio and\/or video to make things happen in audio and\/or video. I\u2019ll go over examples of using a camera or video as input, and processing the changes between frames to understand \u201cmotion\u201d or \u201cflicker\u201d. Similarly, in audio, we\u2019ll play with the transients in sounds to try to understand how \u201ctextures\u201d of sound change. This gives us a perceptual measure to use in defining interactions based on audio or vision.<\/p>\n<\/div>\n<\/div>\n\n\n\n
\n
\n
video player:<\/strong><\/p>\n<\/div>\n\n\n\n
\n
testApp.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n \nclass testApp : public ofBaseApp{\n \n    public:\n         \n        \/\/ redeclaration of functions (declared in base class)\n        void setup();\n        void update();\n        void draw();\n     \n        ofVideoPlayer videoPlayer;\n};\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n\/\/ here we "define" the methods we "declared" in the "testApp.h" file\n \n\/\/ i get called once\nvoid testApp::setup(){\n     \n    \/\/ set the size of the window\n    ofSetWindowShape(320, 240);\n     \n    \/\/ the rate at which the program runs (FPS)\n    ofSetFrameRate(30);\n     \n    \/\/ load a movie located in the project's "bin\/data" directory\n    videoPlayer.loadMovie("sunra_pink.mov");\n    videoPlayer.play();\n}\n \n\/\/ i get called in a loop that runs until the program ends\nvoid testApp::update(){\n     \n    \/\/ update the current frame\n    videoPlayer.update();\n}\n \n\/\/ i also get called in a loop that runs until the program ends\nvoid testApp::draw(){\n    ofBackground(0);\n     \n     \n    \/\/ this is a special command to change the way shapes, images, and videos are drawn.\n    \/\/ normally, when you draw a shape at position 0,0 with a width of 100, and a height of 100,\n    \/\/ the object occupies a space from point (0,0) to point (100,100).\n    \/\/ however, when you use OF_RECTMODE_CENTER, to draw the object in the same place, you would\n    \/\/ draw the shape at position 50,50, i.e. using the center of the object rather than the \n    \/\/ top-left corner\n    ofSetRectMode(OF_RECTMODE_CENTER);\n      \n    \/\/ this moves all future drawing commands to the position (160,120)\n    ofTranslate(160, 120, 0);\n      \n    \/\/ here we are rotating our world using the mouse\n    float degreesToRotate =  (float)mouseX \/ (float)ofGetScreenWidth() * 360.0;\n    \/\/ we rotate by the degrees calculated above using ofRotate.\n    \/\/ the (0, 1, 0) say to rotate along the y-axis.  we could put 1's in the x or z as well.\n    ofRotate(degreesToRotate, 0, 1, 0);\n     \n \n    \/\/ draw the movie a position 0,0\n    videoPlayer.draw(0,0);\n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
\n
\n
audio onset detection:<\/strong><\/p>\n<\/div>\n\n\n\n
\n
testApp.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n \nclass testApp : public ofBaseApp{\n \n    public:\n         \n        \/\/ redeclaration of functions (declared in base class)\n        void setup();\n        void update();\n        void draw();\n     \n        \/\/ redeclaration of two special functions which handle audio i\/o (declared in base class)\n        void audioRequested(float *buf, int size, int ch);\n        void audioReceived(float *buf, int size, int ch);\n     \n        \/\/ we will keep a pointer to our audio\n        float *audioInput;\n        int sampleRate, bufferSize;\n     \n        float rms;\n     \n        vector&lt;float> rms_values;\n};\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n\/\/ here we "define" the methods we "declared" in the "testApp.h" file\n \n\/\/ i get called once\nvoid testApp::setup(){\n     \n    \/\/ do some initialization\n     \n    \/\/ set the size of the window\n    ofSetWindowShape(250, 250);\n     \n    \/\/ the rate at which the program runs (FPS)\n    ofSetFrameRate(30);\n     \n    \/\/ setup the sound\n    sampleRate = 44100;\n    bufferSize = 250;\n    ofSoundStreamSetup(2,               \/\/ output channels\n                       1,               \/\/ input channels\n                       sampleRate,      \/\/ how many samples (readings) per second\n                       bufferSize,      \/\/ size of each copy of audio\n                       4);              \/\/ latency of audio\n     \n     \n    \/\/ a variable to store our audio\n    audioInput = new float[bufferSize];\n \n    rms_values.push_back(0);\n}\n \n\/\/ i get called in a loop that runs until the program ends\nvoid testApp::update(){\n \n    \/\/ we can "smooth" the rms value by using feedback.\n    \/\/ this is a simple example of using the previous value \n    \/\/ with a weight (0.9) and the current value (0.1)\n    \/\/ rms_values.push_back(0.9 * rms_values.back() + 0.1 * rms);\n     \n    \/\/ add the current rms value\n    rms_values.push_back(rms);\n     \n    \/\/ we only keep a maximum of 25 values of the rms readings\n    if (rms_values.size() > 25) {\n        \/\/ if we have added more than 25, then we delete the first one\n        rms_values.erase(rms_values.begin(), rms_values.begin() + 1);\n    }\n     \n     \n}\n \n\/\/ i also get called in a loop that runs until the program ends\nvoid testApp::draw(){\n    ofBackground(0);\n     \n    \/\/ draw a line across the middle of the screen\n    ofSetColor(100, 100, 100);\n    ofLine(0, 125, 250, 125);\n     \n    \/\/ we draw the audio input as before\n    ofSetColor(200, 200, 200);\n    float amplitude = 100.0f;\n    for (int i = 1; i &lt; 250; i++) {\n         \n        \/\/ get two pairs of points\n        float x1 = (float)i \/ 250.0;\n        float y1 = amplitude * audioInput[i];   \/\/amplitude * sin( x1 * 2.0*PI );\n        float x2 = (float)(i - 1) \/ 250.0;\n        float y2 = amplitude * audioInput[i-1]; \/\/amplitude * sin( x2 * 2.0*PI );\n         \n        \/\/ draw a tiny segment of the overall line\n        ofLine(x1 * 250.0f, -y1 + 125, \n               x2 * 250.0f, -y2 + 125);\n         \n        \/\/ loop until i is no longer &lt; 250\n    }\n     \n    \/\/ draw a circle in the middle of the screen with the size\n    \/\/ set by the rms value\n    ofSetRectMode(OF_RECTMODE_CENTER);\n    ofCircle(125, 125, rms * 250);\n    ofSetRectMode(OF_RECTMODE_CORNER);\n \n    for (int i = 1; i &lt; rms_values.size(); i++) {\n        ofLine((i  ) * 250.0\/25.0, -rms_values[i  ]*1000.0 + 250.0, \n               (i-1) * 250.0\/25.0, -rms_values[i-1]*1000.0 + 250.0);\n    }\n     \n    \/\/ calculate the average of the rms values\n    float average_rms = 0.0f;\n    for (int i = 0; i &lt; rms_values.size(); i++) {\n        average_rms = average_rms + rms_values[i];\n    }\n    average_rms = average_rms \/ rms_values.size();\n     \n    \/\/ calculate the variance of the rms values\n    float var_rms = 0.0f;\n    for (int i = 0; i &lt; rms_values.size(); i++) {\n        var_rms = var_rms + abs(rms_values[i] - average_rms);\n    }\n    var_rms = var_rms \/ rms_values.size();\n     \n    \/\/ now we see if the current value is outside the mean + variance\n    \/\/ basic statistics tells us a normally distributed function\n    \/\/ has a mean and a variance where 97% of the data is explained by\n    \/\/ 3 standard deviations.  we use this principle here in detecting \n    \/\/ the the current rms reading is outside this probability\n    if (rms_values.back() > (average_rms + 2.0*var_rms)) {\n        \/\/ draw a rectangle to denote the detection of an onset\n        ofRect(0, 0, 250, 250);\n    }\n     \n}\n \nvoid testApp::audioRequested(float *buf, int size, int ch)\n{\n     \n}\n \nvoid testApp::audioReceived(float *buf, int size, int ch)\n{\n    \/\/ copy the data into our variable, audioInput\n    memcpy(audioInput, buf, sizeof(float) * size);\n     \n    \/\/ add all the audio input values\n    float total = 0;\n    for (int i = 0; i &lt; size; i++) {\n        \/\/ we add the "square" of each value so that negative numbers\n        \/\/ become positive.  this is like thinking of the "magnitude"\n        total = total + (buf[i] * buf[i]);\n    }\n    \/\/ the "mean" part of the RMS, we divide by the number of audio input samples\n    \/\/ we added in the for loop above\n    total = total \/ (float)size;\n     \n    \/\/ the "root" part of RMS, we take the square root to get our RMS reading for the \n    \/\/ current chunk of audio input values\n    rms = sqrt(total);\n     \n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
\n
\n
motion detection:<\/strong><\/p>\n<\/div>\n\n\n\n
\n
For this project, you will need to copy the opencvExample located in openframeworks\/apps\/addonsExamples\/opencvExample instead of using emptyExample!<\/p>\n\n\n\n
testApp.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n \n#include "ofxOpenCv.h"\n \nclass testApp : public ofBaseApp{\n \n    public:\n        void setup();\n        void update();\n        void draw();    \n          \n        float                   sum;\n        ofVideoGrabber          vidGrabber;\n \n        ofxCvColorImage         colorImg;\n \n        ofxCvGrayscaleImage     grayImage;\n        ofxCvGrayscaleImage     grayPreviousImage;\n        ofxCvGrayscaleImage     grayDiff;\n \n        ofVideoPlayer           vidPlayer;\n};\n\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n\/\/--------------------------------------------------------------\nvoid testApp::setup(){\n \n    \/\/ change the window to hold enough space for 6 movies (3x2)\n    ofSetWindowShape(320*3,240*2);\n     \n    ofSetFrameRate(30);\n     \n    \/\/ initialize our camera with a resolution of 320z240\n    vidGrabber.initGrabber(320,240);\n     \n    \/\/ load a movie in and set it to loop, and then start it (play())\n    vidPlayer.loadMovie("sunra_pink.mov");\n    vidPlayer.setLoopState(OF_LOOP_NORMAL);\n    vidPlayer.play();\n     \n    sum = 0;\n     \n    \/\/ these are (wrappers for) opencv image containers \n    \/\/ we'll use for image processing\n    \/\/ we are going to find the difference between successive frames\n    colorImg.allocate(320,240);\n    grayImage.allocate(320,240);\n    grayPreviousImage.allocate(320,240);\n    grayDiff.allocate(320,240);\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::update(){\n    \/\/ background to black\n    ofBackground(0);\n     \n    \/\/ update the camera\n    vidGrabber.update();\n    \/\/ set the color image (opencv container) to the camera image\n    colorImg.setFromPixels(vidGrabber.getPixels(), 320,240);\n    \/\/ convert to grayscale\n    grayImage = colorImg;\n    \/\/ calculate the difference image\n    grayDiff = grayImage;\n    \/\/ compute the absolute difference with the previous frame's grayscale image\n    grayDiff.absDiff(grayPreviousImage);\n     \n    \/\/ store the current grayscale image for the next iteration of update()\n    grayPreviousImage = colorImg;\n     \n    \/\/ let's threshold the difference image,\n    \/\/ all values less than 10 are 0, all values above 10 become 255\n    grayDiff.threshold(10);\n     \n    \/\/ here we will find the sum of all the pixels in the difference image\n    \/\/ this will be used for a simple measure of "motion" \n    sum = 0.9 * sum + 0.1 * cvSum(grayDiff.getCvImage()).val[0] \/ 320.0 \/ 240.0 \/ 10.0;\n     \n    \/\/ let's change the speed of our movie based on the motion value we calculated\n    vidPlayer.setSpeed(sum);\n    vidPlayer.update();\n     \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::draw(){\n    \/\/ draw the input camera image\n    vidGrabber.draw(0,0);\n    \/\/ draw the opencv image\n    colorImg.draw(0,240);\n    \/\/ draw the grayscale conversion\n    grayImage.draw(320,0);\n    \/\/ draw the previous grayscale image\n    grayPreviousImage.draw(320,240);\n    \/\/ draw the difference image (thresholded)\n    grayDiff.draw(640,0);\n    \/\/ draw the video player\n    vidPlayer.draw(640,240);\n     \n    \/\/ draw the sum of the motion pixels divided by the number of motion pixels \n    \/\/ (average of difference values)\n    char buf[256];\n    sprintf(buf, "%f", sum);\n    ofDrawBitmapString(buf, 20, 20);\n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
\n
\n
audio synthesis example<\/strong><\/p>\n<\/div>\n\n\n\n
\n
This example requires maximilian which you can get from here:\u00a0Maximilian on GitHub<\/a>. You will need to get \u201cmaximilian.h\u201d and \u201cmaximilian.cpp\u201d and copy them to your project directory\u2019s \u201csrc\u201d folder. You will also need to \u201cdrag\u201d these files into your visual studio or xcode project (inside the IDE).<\/p>\n\n\n\n
testApp.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n \n#include "maximilian.h"                                     \/\/ new\n#include "ofxOpenCv.h"\n \nclass testApp : public ofBaseApp{\n \n    public:\n        void setup();\n        void update();\n        void draw();    \n     \n        void audioRequested(float *buf, int size, int ch); \/\/ new\n        void audioReceived(float *buf, int size, int ch);  \/\/ new\n          \n        float                   sum;\n        ofVideoGrabber          vidGrabber;\n \n        ofxCvColorImage         colorImg;\n \n        ofxCvGrayscaleImage     grayImage;\n        ofxCvGrayscaleImage     grayPreviousImage;\n        ofxCvGrayscaleImage     grayDiff;\n     \n     \n        ofxCvContourFinder      contourFinder;\n     \n        maxiOsc                 myOsc;                      \/\/ new\n        maxiDelayline           myDelay;\n};\n\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n\/\/--------------------------------------------------------------\nvoid testApp::setup(){\n \n    \/\/ change the window to hold enough space for 6 movies (3x2)\n    ofSetWindowShape(320*3,240*2);\n     \n    ofSetFrameRate(30);\n     \n    \/\/ initialize our camera with a resolution of 320z240\n    vidGrabber.initGrabber(320,240);\n     \n    sum = 0;\n     \n    \/\/ these are (wrappers for) opencv image containers \n    \/\/ we'll use for image processing\n    \/\/ we are going to find the difference between successive frames\n    colorImg.allocate(320,240);\n    grayImage.allocate(320,240);\n    grayPreviousImage.allocate(320,240);\n    grayDiff.allocate(320,240);\n     \n    \/\/ setup the sound\n    int sampleRate = 44100;\n    int bufferSize = 320;\n    ofSoundStreamSetup(1,               \/\/ output channels\n                       1,               \/\/ input channels\n                       sampleRate,      \/\/ how many samples (readings) per second\n                       bufferSize,      \/\/ size of each copy of audio\n                       4);              \/\/ latency of audio\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::update(){\n    \/\/ background to black\n    ofBackground(0);\n     \n    \/\/ update the camera\n    vidGrabber.update();\n    \/\/ set the color image (opencv container) to the camera image\n    colorImg.setFromPixels(vidGrabber.getPixels(), 320,240);\n    \/\/ convert to grayscale\n    grayImage = colorImg;\n    \/\/ calculate the difference image\n    grayDiff = grayImage;\n    \/\/ compute the absolute difference with the previous frame's grayscale image\n    grayDiff.absDiff(grayPreviousImage);\n     \n    \/\/ store the current grayscale image for the next iteration of update()\n    grayPreviousImage = colorImg;\n     \n    \/\/ let's threshold the difference image,\n    \/\/ all values less than 10 are 0, all values above 10 become 255\n    grayDiff.threshold(10);\n     \n    \/\/ here we will find the sum and then average of all the pixels in the difference image\n    \/\/ this will be used for a simple measure of "motion" \n    sum = 0.9 * sum + 0.1 * cvSum(grayDiff.getCvImage()).val[0] \/ 320.0 \/ 240.0 \/ 10.0;\n     \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::draw(){\n    \/\/ draw the input camera image\n    vidGrabber.draw(0,0);\n    \/\/ draw the opencv image\n    colorImg.draw(0,240);\n    \/\/ draw the grayscale conversion\n    grayImage.draw(320,0);\n    \/\/ draw the previous grayscale image\n    grayPreviousImage.draw(320,240);\n    \/\/ draw the difference image (thresholded)\n    grayDiff.draw(640,0);\n     \n    \/\/ draw the sum of the motion pixels divided by the number of motion pixels \n    \/\/ (average of difference values)\n    char buf[256];\n    sprintf(buf, "%f", sum);\n    ofDrawBitmapString(buf, 20, 20);\n}\n \n \nvoid testApp::audioRequested(float *buf, int size, int ch)\n{\n    for (int i = 0; i &lt; size; i++) {\n        buf[i] = myDelay.dl( myOsc.sinewave(sum * 400.0), 8000, 0.5);\n    }\n}\n \n \nvoid testApp::audioReceived(float *buf, int size, int ch)\n{\n     \n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
Day 3<\/h3>\n\n\n\n
\n
\n
Stick Figure<\/strong><\/p>\n<\/div>\n\n\n\n
\n
testApp.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n \nclass testApp : public ofBaseApp{\n \n    public:\n        void setup();\n        void update();\n        void draw();\n};\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n\/\/--------------------------------------------------------------\nvoid testApp::setup(){\n    ofSetWindowShape(400, 400);\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::update(){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::draw(){\n \n    ofBackground(200, 100, 100);\n    ofSetRectMode(OF_RECTMODE_CENTER); \/\/ OF_RECTMODE_CORNER\n     \n    ofPushMatrix();\n     \n    ofScale(mouseX \/ (float)ofGetWindowWidth() * 4.0, \n            mouseY \/ (float)ofGetWindowHeight() * 4.0, \n            1);\n     \n    \/\/ head\n    ofRect(200, 50, 50, 50);\n    \/\/ body\n    ofRect(200, 150, 20, 80);\n     \n     \n    ofSetRectMode(OF_RECTMODE_CORNER); \n    float degress = ofMap(mouseY, 0, ofGetWindowHeight(), \n                          45, 135, true);\n     \n    \/\/ left leg\n    ofPushMatrix();\n        ofTranslate(175, 225, 0);\n        ofRotate(degress, 0, 0, 1);\n        ofRect(0, 0, 15, 80);\n    ofPopMatrix();\n     \n    \/\/ right leg\n    ofPushMatrix();\n        ofTranslate(220, 230, 0);\n        ofRotate(-degress, 0, 0, 1);\n        ofRect(0, 0, 15, 80);\n    ofPopMatrix();\n     \n    \/\/ left arm\n    ofPushMatrix();\n        ofTranslate(175, 100, 0);\n        ofRotate(degress, 0, 0, 1);\n        ofRect(0, 0, 15, 80);\n    ofPopMatrix();\n    \/*\n    \/\/ right arm\n    ofPushMatrix();\n        ofTranslate(250, 100, 0);\n        ofRotate(45, 0, 0, 1);\n        ofRect(0, 0, 15, 80);\n    ofPopMatrix();\n    *\/\n     \n    ofPopMatrix();\n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
\n
\n
Face Detection<\/strong><\/p>\n<\/div>\n\n\n\n
\n
testApp.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n#include "ofxCvHaarFinder.h"\n \nclass testApp : public ofBaseApp{\n    public:\n        void setup();\n        void update();\n        void draw();\n \n        ofVideoPlayer video1;\n        ofImage img;\n        ofImage img_scaled;\n        ofxCvHaarFinder finder;\n     \n};\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n\/\/--------------------------------------------------------------\nvoid testApp::setup(){\n     \n    ofSetWindowShape(320, 240);\n     \n    video1.loadMovie("beatit.mov");\n    img.allocate(video1.getWidth(), video1.getHeight(), OF_IMAGE_COLOR);\n    img_scaled.allocate(320, 240, OF_IMAGE_COLOR);\n    video1.play();\n     \n    finder.setup("haarcascade_frontalface_default.xml");\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::update(){\n    video1.update();\n     \n    img.setFromPixels(video1.getPixels(), video1.getWidth(), video1.getHeight(), OF_IMAGE_COLOR);\n    img_scaled = img;\n    img_scaled.resize(320, 240);\n    finder.findHaarObjects(img_scaled);\n     \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::draw(){\n    img_scaled.draw(0, 0);\n    ofNoFill();\n    for(int i = 0; i &lt; finder.blobs.size(); i++) {\n        ofRectangle cur = finder.blobs[i].boundingRect;\n        ofRect(cur.x, cur.y, cur.width, cur.height);\n    }\n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
\n
\n
text cloud<\/strong><\/p>\n<\/div>\n\n\n\n
\n
This example requires you find a true type font (.ttf file) and a text file and place it in the \u201cdata\u201d folder inside the \u201cbin\u201d folder of your project. Replace the names of these to match your own files in the code.<\/p>\n\n\n\n
testApp.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n \nclass testApp : public ofBaseApp{\n \n    public:\n        void setup();\n        void update();\n        void draw();\n \n    ofTrueTypeFont myFont_frabk_16;\n     \n};\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n\/\/--------------------------------------------------------------\nvoid testApp::setup(){\n     \n    \/\/ set the size of the window\n    ofSetWindowShape(400, 400);\n     \n    \/\/ load in a true type font for drawing text\n    myFont_frabk_16.loadFont("frabk.ttf", 16);\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::update(){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::draw(){\n     \n    \/\/ let's blend our words using alpha transparency\n    ofEnableAlphaBlending();\n     \n    \/\/ we'll set it to a low alpha since there are so many words\n    ofSetColor(0, 0, 0, 40);\n     \n    \/\/ keep all drawing commands within this one transformation matrix\n    ofPushMatrix();\n     \n        \/\/ translate our drawing near to the center of the screen\n        ofTranslate(180, 190, 0);\n \n        \/\/ create an "ifstream" object which lets us read from files\n        ifstream myReadFile;\n     \n        \/\/ this will store the data coming from the text file directly\n        char output[100];\n         \n        \/\/ this is a more convenient string container that openFrameworks often uses\n        string myString;\n     \n        \/\/ we'll open the text file located in the data path\n        \/\/ we use this function, "ofToDataPath(...)" in order to \n        \/\/ prepend "milton.txt" with the location of the data folder\n        myReadFile.open(ofToDataPath("milton.txt").c_str());\n     \n        \/\/ if we were able to open "milton.txt"\n        if (myReadFile.is_open()) \n        {\n            \/\/ while there is still text to read, while we have not reached the EOF (end of file)\n            while (!myReadFile.eof()) \n            {\n                \/\/ input until it reaches a whitespace (a space)\n                myReadFile >> output;\n                \/\/ convert to string\n                myString = output;\n                 \n                \/\/ keep a transformation just for the current word\n                ofPushMatrix();\n                    \/\/ translate the word to a random x,y,z\n                    ofTranslate(ofRandom(200) - 100, ofRandom(200) - 100, ofRandom(200) - 100);\n                    \/\/ draw at the (transformed) origin\n                    myFont_frabk_16.drawString(myString, 0, 0);\n                 \n                \/\/ done with this word's transformation\n                ofPopMatrix();\n                 \n            }\n        }\n     \n    \/\/ done with our current transformation matrix\n    ofPopMatrix();\n     \n    \/\/ done with blending\n    ofDisableAlphaBlending();\n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
\n
\n
People\/Blob Tracking<\/strong><\/p>\n<\/div>\n\n\n\n
\n
This is a very powerful technique I\u2019ve developed for finding blobs\/people in a camera image. It first builds a model of the \u201cbackground\u201d image. It is then able to extract \u201cforeground\u201d entities, or things that are not in the background image. You\u2019ll need to include these additional files into your project\u2019s src directory, as well as drag them into your visual studio or xcode project (in the same way as you did with maximilian): 012-people-tracking-simplified.zip<\/a><\/p>\n\n\n\n
EDIT: here is an updated version with fixes for windows users:\u00a0012-people-tracking-simplified_windows_fix.zip<\/a><\/strong><\/p>\n\n\n\n
testApp.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n \nconst int W = 320;\nconst int H = 240;\nconst int WINDOW_WIDTH = W*3 + 40*2;\nconst int WINDOW_HEIGHT = H*1.5;\n \n#include "ofVideoGrabber.h"\n#include "pkmBlobTracker.h"\n \nclass testApp : public ofBaseApp, public ofCvBlobListener {\n    public:\n        void setup();\n        void update();\n        void draw();\n         \n        void keyPressed(int key);\n        void mouseMoved(int x, int y );\n        void mouseDragged(int x, int y, int button);\n        void mousePressed(int x, int y, int button);\n        void mouseReleased(int x, int y, int button);\n        void windowResized(int w, int h);\n \n \n    void blobOn( int x, int y, int id, int order );\n    void blobMoved( int x, int y, int id, int order );\n    void blobOff( int x, int y, int id, int order );\n     \n    ofVideoGrabber          vidGrabber;\n    pkmBlobTracker          orientationTracker;\n     \n};\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n \n\/\/--------------------------------------------------------------\nvoid testApp::setup(){\n     \n    vidGrabber.setVerbose(true);\n    vidGrabber.initGrabber(W,H);\n     \n    ofSetWindowShape(WINDOW_WIDTH, WINDOW_HEIGHT);\n    ofSetFrameRate(60);\n    ofSetBackgroundAuto(true);\n    ofBackground(0,0,0);\n     \n    orientationTracker.setListener(this);\n     \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::update(){\n     \n    ofBackground(0,0,0);\n     \n    vidGrabber.update();\n    if (vidGrabber.isFrameNew()) {\n        orientationTracker.update(vidGrabber.getPixels(), W, H);\n \n    }\n         \n}\n     \n\/\/--------------------------------------------------------------\nvoid testApp::draw(){\n    orientationTracker.draw(0, 0);\n}\n \n \n\/\/--------------------------------------------------------------\nvoid testApp::keyPressed  (int key){\n    switch (key){\n        case 's':\n            vidGrabber.videoSettings();\n            break;\n        case 'f':\n            ofToggleFullscreen();\n            break;\n        default:\n            orientationTracker.keyPressed(key);\n            break;\n    }\n     \n}\n \nvoid testApp::blobOn( int x, int y, int id, int order )\n{\n \n}\nvoid testApp::blobMoved( int x, int y, int id, int order )\n{\n     \n}\nvoid testApp::blobOff( int x, int y, int id, int order )\n{\n     \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mouseMoved(int x, int y ){\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mouseDragged(int x, int y, int button){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mousePressed(int x, int y, int button){\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mouseReleased(int x, int y, int button){\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::windowResized(int w, int h){\n     \n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
\n
\n
People Making Noise<\/strong><\/p>\n<\/div>\n\n\n\n
\n
We expand our people tracking example to assign sounds to each person and sonify their movements based on the speed that they move.<\/p>\n\n\n\n
testApp.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n \nconst int W = 320;\nconst int H = 240;\n \nconst int WINDOW_WIDTH = W*3 + 40*2;\nconst int WINDOW_HEIGHT = H*1.5;\n \n#include "ofVideoGrabber.h"\n#include "pkmBlobTracker.h"\n \nclass testApp : public ofBaseApp, public ofCvBlobListener {\n    public:\n        void setup();\n        void update();\n        void draw();\n         \n        void keyPressed(int key);\n        void mouseMoved(int x, int y );\n        void mouseDragged(int x, int y, int button);\n        void mousePressed(int x, int y, int button);\n        void mouseReleased(int x, int y, int button);\n        void windowResized(int w, int h);\n \n \n    void blobOn( int x, int y, int id, int order );\n    void blobMoved( int x, int y, int id, int order );\n    void blobOff( int x, int y, int id, int order );\n     \n    ofVideoGrabber          vidGrabber;\n    pkmBlobTracker          orientationTracker;\n     \n    vector&lt;float>         velocities;\n    vector&lt;int>               px;\n    vector&lt;int>               py;\n    ofSoundPlayer           sound[10];\n    int                     numSounds;\n    int                     currentSound;\n     \n    map&lt;int, int>         soundMapping;\n    map&lt;int, int>         velocityMapping;\n     \n};\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n \n\/\/--------------------------------------------------------------\nvoid testApp::setup(){\n     \n    vidGrabber.initGrabber(W,H);\n     \n    ofSetWindowShape(WINDOW_WIDTH, WINDOW_HEIGHT);\n    ofSetFrameRate(60);\n    ofSetBackgroundAuto(true);\n    ofBackground(0,0,0);\n     \n    orientationTracker.setListener(this);\n     \n    currentSound = 0;\n    numSounds = 3;\n    sound[0].loadSound("beat.wav", true);\n    sound[0].setMultiPlay(true);\n    sound[0].setLoop(true);\n    sound[1].loadSound("blast.wav", true);\n    sound[1].setMultiPlay(true);\n    sound[1].setLoop(true);\n    sound[2].loadSound("eli1.wav", true);\n    sound[2].setMultiPlay(true);\n    sound[2].setLoop(true);\n     \n     \n}\n\/\/--------------------------------------------------------------\nvoid testApp::update(){\n     \n    ofBackground(0,0,0);\n     \n    vidGrabber.update();\n    if (vidGrabber.isFrameNew()) {\n        orientationTracker.update(vidGrabber.getPixels(), W, H);\n \n    }\n         \n}\n     \n\/\/--------------------------------------------------------------\nvoid testApp::draw(){\n    orientationTracker.draw(0, 0);\n}\n \n \n\/\/--------------------------------------------------------------\nvoid testApp::keyPressed  (int key){\n    switch (key){\n        case 's':\n            vidGrabber.videoSettings();\n            break;\n        case 'f':\n            ofToggleFullscreen();\n            break;\n        default:\n            orientationTracker.keyPressed(key);\n            break;\n    }\n     \n}\n \nvoid testApp::blobOn( int x, int y, int id, int order )\n{\n    printf("blob on\\n");\n     \n    \/\/ start a sound player with speed 0\n    sound[currentSound].play();\n    sound[currentSound].setSpeed(0.0);\n     \n    \/\/ keep our mappings\n    soundMapping[id] = currentSound;\n    velocityMapping[id] = velocities.size();\n     \n    velocities.push_back(0);\n    px.push_back(x);\n    py.push_back(y);\n     \n    currentSound = (currentSound + 1) % numSounds;\n}\nvoid testApp::blobMoved( int x, int y, int id, int order )\n{\n    printf("blob moved\\n"); \n    int previous_x = px[velocityMapping[id]];\n    int previous_y = py[velocityMapping[id]];\n     \n    float speed = sqrt( (x - previous_x)*(x - previous_x) + \n                       (y - previous_y)*(y - previous_y) ) \/ 4.0f;\n     \n    px[velocityMapping[id]] = x;\n    py[velocityMapping[id]] = y;\n     \n    velocities[velocityMapping[id]] = 0.9 * velocities[velocityMapping[id]] + 0.1 * speed;\n     \n    printf("%f\\n", velocities[velocityMapping[id]]);\n     \n    sound[soundMapping[id]].setSpeed(velocities[velocityMapping[id]]);\n}\nvoid testApp::blobOff( int x, int y, int id, int order )\n{\n    printf("blob off\\n");\n    sound[soundMapping[id]].setSpeed(0);\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mouseMoved(int x, int y ){\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mouseDragged(int x, int y, int button){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mousePressed(int x, int y, int button){\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mouseReleased(int x, int y, int button){\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::windowResized(int w, int h){\n     \n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
Day 4<\/h3>\n\n\n\n
\n
\n
Introduction<\/strong><\/p>\n<\/div>\n\n\n\n
\n
Today we will develop our ideas in sonification of movements a bit further. We will also work with projection mapping using some custom software I\u2019ve built for openframeworks. Get the files here:\u00a0https:\/\/github.com\/pkmital\/pkmProjectionMapper<\/a><\/p>\n<\/div>\n<\/div>\n\n\n\n
\n
\n
Projection Mapping<\/strong><\/p>\n<\/div>\n\n\n\n
\n
testApp.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n#include "pkmProjectionMapper.h"\n \nclass testApp : public ofBaseApp{\n \n    public:\n        void setup();\n        void update();\n        void draw();\n \n        void keyPressed  (int key);\n        void keyReleased(int key);\n        void mouseMoved(int x, int y );\n        void mouseDragged(int x, int y, int button);\n        void mousePressed(int x, int y, int button);\n        void mouseReleased(int x, int y, int button);\n        void windowResized(int w, int h);\n        void dragEvent(ofDragInfo dragInfo);\n        void gotMessage(ofMessage msg);\n         \n    ofVideoPlayer video1, video2;\n     \n    pkmProjectionMapper myMapper1, myMapper2;\n    bool bDrawBoxes;\n};\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n\/\/--------------------------------------------------------------\nvoid testApp::setup(){\n     \n    \/\/ we'll always use a 320x240 window, but we can reshape it\n    ofSetWindowShape(320, 240);\n     \n    \/\/ load a movie\n    video1.loadMovie("pingu.mov");\n    video1.setVolume(0);\n    video1.play();\n     \n    \/\/ load a second movie\n    video2.loadMovie("beatit.mov");\n    video2.setVolume(0);\n    video2.play();\n     \n    \/\/ this is how we setup our projection mapper\n    \/\/ we give it our windows dimensions, and a starting x, y (0,0)\n    myMapper1.initialize(320, 240,  0,  0);\n    \/\/ similarly, for our second projection mapper, we give it another \n    myMapper2.initialize(320, 240, 40, 40);\n     \n    bDrawBoxes = true;\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::update(){\n     \n    \/\/ we have to update everything\n    video1.update();\n    video2.update();\n    myMapper1.update();\n    myMapper2.update();\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::draw(){\n     \n    \/\/ give us a black background\n    ofBackground(0);\n     \n    \/\/ we can do blending for our textures if we wish\n    ofEnableAlphaBlending();\n    ofEnableBlendMode(OF_BLENDMODE_SCREEN);\n     \n    ofSetColor(255, 255, 255, 255);\n     \n    \/\/ this is how we start our mapping\n    myMapper1.startMapping();\n     \n        \/\/ any drawing we would like to be remapped goes inside here\n        ofCircle(160, 120, 120);\n\/\/      video1.draw(0, 0, 320, 240);\n     \n    \/\/ now we are done with the projection mapping\n    myMapper1.stopMapping();\n     \n     \n    \/\/ again for another projection surface, we create another mapper\n    myMapper2.startMapping();\n     \n        \/\/ and any drawing commands inside here are remapped\n        video2.draw(0, 0, 320, 240);\n     \n    \/\/ done remapping\n    myMapper2.stopMapping();\n     \n    \/\/ we can draw the bounding boxes around the projection mapper\n    if (bDrawBoxes) {\n        myMapper1.drawBoundingBox();\n        myMapper2.drawBoundingBox();\n    }\n     \n    \/\/ done blending\n    ofDisableAlphaBlending();\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::keyPressed(int key){\n     \n    \/\/ we have interaction for 2 key strokes\n     \n    \/\/ if the keyboard is pressed with b\n    if (key == 'b') {\n        \/\/ we start\/stop drawing bounding boxes\n        bDrawBoxes = !bDrawBoxes;\n    }\n     \n    \/\/ we can also make our window fullscreen by pressing 'f'\n    else if(key == 'f') {\n        ofToggleFullscreen();\n         \n    }\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::keyReleased(int key){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mouseMoved(int x, int y ){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mouseDragged(int x, int y, int button){\n    myMapper1.mouseDragged(x, y);\n    myMapper2.mouseDragged(x, y);\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mousePressed(int x, int y, int button){\n    myMapper1.mousePressed(x, y);\n    myMapper2.mousePressed(x, y);\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mouseReleased(int x, int y, int button){\n    myMapper1.mouseReleased(x, y);\n    myMapper2.mouseReleased(x, y);\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::windowResized(int w, int h){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::gotMessage(ofMessage msg){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::dragEvent(ofDragInfo dragInfo){ \n \n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
\n
\n
Sphere Projection Mapping<\/strong><\/p>\n<\/div>\n\n\n\n
\n
testApp.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n#include "pkmProjectionMapper.h"\n \nclass testApp : public ofBaseApp{\n \n    public:\n        void setup();\n        void update();\n        void draw();\n \n        void keyPressed  (int key);\n        void keyReleased(int key);\n        void mouseMoved(int x, int y );\n        void mouseDragged(int x, int y, int button);\n        void mousePressed(int x, int y, int button);\n        void mouseReleased(int x, int y, int button);\n        void windowResized(int w, int h);\n        void dragEvent(ofDragInfo dragInfo);\n        void gotMessage(ofMessage msg);\n         \n    ofVideoPlayer video1, video2;\n     \n    GLUquadricObj *quadric;\n     \n    pkmProjectionMapper myMapper1, myMapper2;\n    bool bDrawBoxes;\n};\n\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n\/\/--------------------------------------------------------------\nvoid testApp::setup(){\n     \n    \/\/ we'll always use a 320x240 window, but we can reshape it\n    ofSetWindowShape(320, 240);\n     \n    \/\/ load a movie\n    video1.loadMovie("pingu.mov");\n    video1.setVolume(0);\n    video1.play();\n     \n    \/\/ load a second movie\n    video2.loadMovie("beatit.mov");\n    video2.setVolume(0);\n    video2.play();\n     \n    \/\/ this is how we setup our projection mapper\n    \/\/ we give it our windows dimensions, and a starting x, y (0,0)\n    myMapper1.initialize(320, 240,  0,  0);\n    \/\/ similarly, for our second projection mapper, we give it another \n    myMapper2.initialize(320, 240, 40, 40);\n     \n    \/\/ set our frame rate\n    ofSetFrameRate(30);\n     \n    \/\/ this changes our drawing rate to match our screen's refresh rate\n    ofSetVerticalSync(true);\n     \n    \/\/ needed for textures to work with gluSphere\n    ofDisableArbTex(); \n         \n    \/\/prepare quadric for sphere\n    quadric = gluNewQuadric();\n    gluQuadricTexture(quadric, GL_TRUE);\n    gluQuadricNormals(quadric, GLU_SMOOTH);\n     \n    bDrawBoxes = true;\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::update(){\n     \n    \/\/ we have to update everything\n    video1.update();\n    video2.update();\n    myMapper1.update();\n    myMapper2.update();\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::draw(){\n     \n    \/\/ we are going to use 3D for our sphere\n    glEnable(GL_DEPTH_TEST);\n     \n    \/\/ give us a black background\n    ofBackground(0);\n    ofSetColor(255, 255, 255);\n     \n    \/\/ this is how we start our mapping\n    myMapper1.startMapping();\n     \n        ofTranslate(160, 120, 0);\n        \/\/rotate sphere over time\n        ofRotateY(ofGetFrameNum());\n        ofRotateX(-90); \/\/north pole facing up\n         \n        \/\/bind and draw texture to texture a sphere\n        ofImage image1;\n        image1.allocate(320, 240, OF_IMAGE_COLOR);\n        image1.setFromPixels(video1.getPixels(), 320, 240, OF_IMAGE_COLOR);\n        image1.resize(256, 256);\n        image1.getTextureReference().bind();\n \n        \/\/ draw a sphere\n        gluSphere(quadric, 200, 100, 100);\n     \n\/\/      video1.draw(0, 0, 320, 240);\n     \n    \/\/ now we are done with the projection mapping\n    myMapper1.stopMapping();\n     \n    \/\/ again for another projection surface, we create another mapper\n    myMapper2.startMapping();\n     \n        \/\/ and any drawing commands inside here are remapped\n        video2.draw(0, 0, 320, 240);\n     \n    \/\/ done remapping\n    myMapper2.stopMapping();\n     \n    \/\/ we are done with 3D drawing now\n    glDisable(GL_DEPTH_TEST);\n     \n    \/\/ we can draw the bounding boxes around the projection mapper\n    if (bDrawBoxes) {\n        myMapper1.drawBoundingBox();\n        myMapper2.drawBoundingBox();\n    }\n     \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::keyPressed(int key){\n     \n    \/\/ we have interaction for 2 key strokes\n     \n    \/\/ if the keyboard is pressed with b\n    if (key == 'b') {\n        \/\/ we start\/stop drawing bounding boxes\n        bDrawBoxes = !bDrawBoxes;\n    }\n     \n    \/\/ we can also make our window fullscreen by pressing 'f'\n    else if(key == 'f') {\n        ofToggleFullscreen();\n         \n    }\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::keyReleased(int key){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mouseMoved(int x, int y ){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mouseDragged(int x, int y, int button){\n    myMapper1.mouseDragged(x, y);\n    myMapper2.mouseDragged(x, y);\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mousePressed(int x, int y, int button){\n    myMapper1.mousePressed(x, y);\n    myMapper2.mousePressed(x, y);\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mouseReleased(int x, int y, int button){\n    myMapper1.mouseReleased(x, y);\n    myMapper2.mouseReleased(x, y);\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::windowResized(int w, int h){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::gotMessage(ofMessage msg){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::dragEvent(ofDragInfo dragInfo){ \n \n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
Day 5 <\/h3>\n\n\n\n
\n
\n
Introduction<\/strong><\/p>\n<\/div>\n\n\n\n
\n
Today we will have an open-lab where you can work on putting some of the things I\u2019ve shown you into practice. We will also look at one example of using emergent flocking behavior using a library developed by Marco Gillies at Goldsmiths. Get the additional files required here: [boid.zip]<\/a><\/p>\n\n\n\n
EDIT: Here is an updated boid for the latest openFrameworks (v07):\u00a0[boid-fixed.zip]<\/a><\/strong><\/p>\n\n\n\n
<\/p>\n<\/div>\n<\/div>\n\n\n\n
\n
\n
Boids<\/strong><\/p>\n<\/div>\n\n\n\n
\n
testApp.h<\/strong><\/p>\n\n\n
\n#ifndef _TEST_APP\n#define _TEST_APP\n \n \n#include "ofMain.h"\n#include &lt;vector>\n#include "boid.h"\n \nclass testApp : public ofBaseApp{\n     \npublic:\n        ~testApp();\n     \n        void setup();\n        void update();\n        void draw();\n         \n        void keyPressed(int key);\n        void keyReleased(int key);\n        void mouseMoved(int x, int y );\n        void mouseDragged(int x, int y, int button);\n        void mousePressed(int x, int y, int button);\n        void mouseReleased(int x, int y, int button);\n        void windowResized(int w, int h);\n         \n        bool                bFullscreen;\n        vector&lt;Boid *>        boids;\n};\n \n#endif \n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \ntestApp::~testApp()\n{\n    for (int i = 0; i &lt; boids.size(); i++)\n    {\n        delete boids[i];\n    }\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::setup(){   \n     \n    ofSetWindowPosition(20, 20);\n    ofSetWindowShape(640, 480);\n    ofSetFrameRate(60);\n     \n    ofBackground(0,50,50);  \n     \n    \/\/ set up the boids\n    for (int i = 0; i &lt; 50; i++)\n        boids.push_back(new Boid());\n     \n}\n \n \n\/\/--------------------------------------------------------------\nvoid testApp::update(){\n     \n    ofVec3f min_pos(0, 0);\n    ofVec3f max_pos(ofGetWidth(), ofGetHeight());\n    for (int i = 0; i &lt; boids.size(); i++)\n    {\n        boids[i]->update(boids, min_pos, max_pos);   \n    }\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::draw(){\n    ofSetupScreen();\n     \n    for (int i = 0; i &lt; boids.size(); i++)\n    {\n        boids[i]->draw();\n    }\n \n}\n \n \n\/\/--------------------------------------------------------------\nvoid testApp::keyPressed(int key){ \n \n    if(key == 'f'){\n     \n        ofToggleFullscreen();\n    }\n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::keyReleased(int key){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mouseMoved(int x, int y ){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mouseDragged(int x, int y, int button){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mousePressed(int x, int y, int button){\n     \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::mouseReleased(int x, int y, int button){\n \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::windowResized(int w, int h){\n \n}\n<\/pre><\/div><\/div>\n<\/div>\n\n\n\n
\n
\n
Colored Motion<\/strong><\/p>\n<\/div>\n\n\n\n
\n
testApp.h<\/strong><\/p>\n\n\n
\n#pragma once\n \n#include "ofMain.h"\n \n#include "ofxOpenCv.h"\n \nclass testApp : public ofBaseApp{\n \n    public:\n        void setup();\n        void update();\n        void draw();    \n          \n        float                   sum;\n        ofVideoGrabber          vidGrabber;\n     \n        ofxCvColorImage         colorImg;\n        ofxCvColorImage         colorDiffImg;\n \n        ofxCvGrayscaleImage     grayImage, ch1, ch2, ch3, ch4;\n        ofxCvGrayscaleImage     grayPreviousImage;\n        ofxCvFloatImage         floatImg,floatImg2, ch1f, ch2f, ch3f;\n        ofxCvGrayscaleImage     grayDiff;\n \n        ofVideoPlayer           vidPlayer;\n     \n        vector&lt;ofxCvGrayscaleImage> previousImages;\n};\n<\/pre><\/div>\n\n\n
testApp.cpp<\/strong><\/p>\n\n\n
\n#include "testApp.h"\n \n\/\/--------------------------------------------------------------\nvoid testApp::setup(){\n \n    \/\/ change the window to hold enough space for 6 movies (3x2)\n    ofSetWindowShape(320,240);\n     \n    ofSetFrameRate(30);\n     \n    \/\/ initialize our camera with a resolution of 320z240\n    vidGrabber.initGrabber(320,240);\n     \n    \/\/ load a movie in and set it to loop, and then start it (play())\n    vidPlayer.loadMovie("sunra_pink.mov");\n    vidPlayer.setLoopState(OF_LOOP_NORMAL);\n    vidPlayer.play();\n     \n    sum = 0;\n     \n    \/\/ these are (wrappers for) opencv image containers \n    \/\/ we'll use for image processing\n    \/\/ we are going to find the difference between successive frames\n    colorImg.allocate(320,240);\n    colorDiffImg.allocate(320, 240);\n    grayImage.allocate(320,240);\n    grayPreviousImage.allocate(320,240);\n    grayDiff.allocate(320,240);\n    floatImg.allocate(320, 240);\n    floatImg2.allocate(320, 240);\n    ch1.allocate(320, 240);\n    ch2.allocate(320, 240);\n    ch3.allocate(320, 240);\n    ch1f.allocate(320, 240);\n    ch2f.allocate(320, 240);\n    ch3f.allocate(320, 240);\n    ch4.allocate(320, 240);\n    previousImages.push_back(grayPreviousImage);\n    previousImages.push_back(grayPreviousImage);\n    previousImages.push_back(grayPreviousImage);\n     \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::update(){\n    \/\/ background to black\n    ofBackground(0);\n     \n    \/\/ update the camera\n    vidGrabber.update();\n     \n    if (vidGrabber.isFrameNew()) {\n        \/\/ set the color image (opencv container) to the camera image\n        colorImg.setFromPixels(vidGrabber.getPixels(), 320,240);\n        \/\/ convert to grayscale\n        grayImage = colorImg;\n        \/\/ calculate the difference image\n        grayDiff = grayImage;\n        \/\/ compute the absolute difference with the previous frame's grayscale image\n        grayDiff.absDiff(previousImages[0]);\n         \n        \/\/ store the current grayscale image for the next iteration of update()\n        previousImages.push_back(grayImage);\n        if (previousImages.size() > 5) {\n            previousImages.erase(previousImages.begin());\n        }\n         \n        floatImg = grayDiff;\n        floatImg.blur();\n         \n        double minv, maxv;\n        CvPoint minl, maxl;\n        cvMinMaxLoc(floatImg.getCvImage(), &amp;minv, &amp;maxv, &amp;minl, &amp;maxl);\n        cv::Mat m = floatImg.getCvImage();\n        m = m \/ maxv * 3.0;\n         \n        cvSplit(colorImg.getCvImage(), ch1.getCvImage(), ch2.getCvImage(), ch3.getCvImage(), 0);\n        ch1.flagImageChanged();\n        ch2.flagImageChanged();\n        ch3.flagImageChanged();\n        ch1f = ch1;\n        ch2f = ch2;\n        ch3f = ch3;\n         \n        cvMul(ch1f.getCvImage(), floatImg.getCvImage(), ch1f.getCvImage());\n        cvMul(ch2f.getCvImage(), floatImg.getCvImage(), ch2f.getCvImage());\n        cvMul(ch3f.getCvImage(), floatImg.getCvImage(), ch3f.getCvImage());\n        ch1 = ch1f;\n        ch2 = ch2f;\n        ch3 = ch3f;\n         \n        cvMerge(ch1.getCvImage(), ch2.getCvImage(), ch3.getCvImage(), 0, colorDiffImg.getCvImage());\n        colorDiffImg.flagImageChanged();\n         \n        \/\/ let's threshold the difference image,\n        \/\/ all values less than 10 are 0, all values above 10 become 255\n        \/\/grayDiff.threshold(10);\n         \n        \/\/ here we will find the sum and then average of all the pixels in the difference image\n        \/\/ this will be used for a simple measure of "motion" \n        sum = 0.9 * sum + 0.1 * cvSum(grayDiff.getCvImage()).val[0] \/ 320.0 \/ 240.0 \/ 10.0;\n         \n        \/\/ let's change the speed of our movie based on the motion value we calculated\n        vidPlayer.setSpeed(sum);\n        vidPlayer.update();\n         \n        floatImg = grayImage;\n         \n        cvSobel(floatImg.getCvImage(), floatImg2.getCvImage(), 1, 1, 5);\n        floatImg2.flagImageChanged();\n    }\n     \n     \n}\n \n\/\/--------------------------------------------------------------\nvoid testApp::draw(){\n        \/\/ draw the difference image (thresholded)\n    colorDiffImg.draw(0,0,ofGetWindowWidth(),ofGetWindowHeight());\n     \n \n     \n    \/\/ draw the sum of the motion pixels divided by the number of motion pixels \n    \/\/ (average of difference values)\n    char buf[256];\n    sprintf(buf, "%f", sum);\n    ofDrawBitmapString(buf, 20, 20);\n}\n<\/pre><\/div><\/div>\n<\/div>\n","protected":false},"featured_media":3036,"template":"","categories":[15],"teaching-type":[396],"class_list":["post-3014","pkm_teaching","type-pkm_teaching","status-publish","has-post-thumbnail","hentry","category-teaching","teaching-type-creative-coding"],"acf":[],"_links":{"self":[{"href":"https:\/\/pkmital.com\/home\/wp-json\/wp\/v2\/pkm_teaching\/3014","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pkmital.com\/home\/wp-json\/wp\/v2\/pkm_teaching"}],"about":[{"href":"https:\/\/pkmital.com\/home\/wp-json\/wp\/v2\/types\/pkm_teaching"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/pkmital.com\/home\/wp-json\/wp\/v2\/media\/3036"}],"wp:attachment":[{"href":"https:\/\/pkmital.com\/home\/wp-json\/wp\/v2\/media?parent=3014"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/pkmital.com\/home\/wp-json\/wp\/v2\/categories?post=3014"},{"taxonomy":"teaching-type","embeddable":true,"href":"https:\/\/pkmital.com\/home\/wp-json\/wp\/v2\/teaching-type?post=3014"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}