Color Tracking in OpenFramework

Hey Guys,

Blog Post after a long time, did some random stuff related to electronics and design but was not able to post anything. These days started working on OpenCV , OpenFramework again. Since there are lots of DIY tutorials on Installing OpenCV and OpenFramework so not posting it. After trying Hello World in OpenFramework, Thought of merging OpenCV and OpenFramework. So here is the 1st outcome, Color Tracking in OpenFramework using OpenCV API for it.

I am working on Ubuntu 12.04, Code:Blocks & I am tracking Red Color.

Using Project Generator of OpenFramework, Created an Empty Project. And after that you will get main.cpp, testApp.cpp & testApp.h files in src folder.


Make Sure you have ofxOpenCv   and ofxCv  addon installed properly in OF folder since it will have some examples so you can check those examples too.

Now In testApp.h , following code will be written.

#ifndef _TEST_APP
#define _TEST_APP
#include “ofMain.h”
#include “ofxOpenCv.h”
#include “ofxCv.h”

class testApp : public ofBaseApp{
void setup(); //to setup a font fo this project
void update();
void draw(); //to draw the font on screen
void keyPressed(int);                         //On KEY Press Events will be defined here
void mouseMoved(int, int);            // On Mouse Move Events will be defined here
void mousePressed(int x, int y, int button); //On Mouse Press Events will be defined here
ofVideoGrabber movie;                          // movie object for capturing Video from Cam
ofxCvColorImage rgb;                           //rgb object for storing color image data
ofxCvGrayscaleImage filtered,red,green,blue;  //objects for storing grayscale image data
ofxCvContourFinder contours;                         //object to store contours of the filtered image
int w,h;



Now in testApp.cpp following code will be written :

#include “testApp.h”

int circleX, circleY,i, red, green, blue;
void testApp::setup(){
w = 640;
h = 480;
movie.initGrabber(w, h, true);
//reserve memory for cv images
rgb.allocate(w, h);
filtered.allocate(w, h);

void testApp::update(){


if (movie.isFrameNew()) {

//copy webcam pixels to rgb image
rgb.setFromPixels(movie.getPixels(), w, h);

//mirror horizontal
rgb.mirror(false, true);

//store the three channels as grayscale images

rgb.convertToGrayscalePlanarImages(red, green, blue);

green+=blue;   // adding green and blue channels then will subtract from red chanel to filter out only red
red -=green;
//filter image based on the hue value were looking for
for (int i=0; i<w*h; i++) {
filtered.getPixels()[i] = ofInRange(red.getPixels()[i],0,40) ? 0 : 255;

//run the contour finder on the filtered image to find blobs with a certain hue
contours.findContours(filtered, 50, w*h/2, 1, false);



void testApp::draw(){

//draw all cv images

ofSetColor(255, 255, 0);

//draw red circles for found blobs
for (int i=0; i<contours.nBlobs; i++) {
ofCircle(contours.blobs[i].centroid.x, contours.blobs[i].centroid.y, 5);

void testApp::keyPressed(int key){
if(key == 115)
i– ;
if(key == 119)
i++ ;

void testApp::mouseMoved(int x, int y){
cout << “mouseMoved: ” << x << “, ” << y << endl;
circleX = x;
circleY = y;

void testApp::mousePressed(int x, int y, int button){
//calculate local mouse x,y in image
int mx = x % w;
int my = y % h;


Now in Last main.cpp this code will be written :

#include “testApp.h”
#include “ofAppGlutWindow.h”

int main(){
//ofAppGlutWindow window; // create a window
// set width, height, mode (OF_WINDOW or OF_FULLSCREEN)
ofSetupOpenGL(1024, 768, OF_WINDOW);
ofRunApp(new testApp()); // start the app

Thats it, Now build and Run the code and you will get red color tracked and a yellow dot over it & start Play with the code

red color detect 2 red color track1

My minor project : Gesto-paint

Hey guys,

blogging after a long time. This time I am blogging about my minor project on my major interest HCI. I have titled it as Gesto-paint. As title itself suggests it is basically a controlling mouse using hand gestures. Paint is just as an application. This project is inspired from Jacob Andreas’s Red Glove project . Libraries and softwares, I am using are openCV, Octave and few more which will be updated later.