:||digital kitchen||:

here's a quick preview of the solved exercises :: (13.9Mb)

here's another preview of the more solved exercises :: (16.9Mb)

Posted by rux at 09:44 PM | Permalink | Comments (0)

We (me and Tim) finally got a final (for now) version of our music data visualization system - Push Music(); PopMusic();. This project was also shown at the ITP's Winter Show'07 where we got a good amount of feedback and ideas for future developments.
From the past versions the biggest changes were a slightly softer control system of the view mode (using only the 2 mouse axis for zoom and rotation); alpha blending implementation and better color modulation; neutral data (0 value) is not drawn; reduced the number of gears; implemented metronome marker as a blinking layer(on tempo and being drawn on the current time of the playhead).

here's a video demo of Push Music(); PopMusic(); latest version running on 'Forever19' LordX's track :: (41.3Mb)

some screenshots ::

more info, pic's and videos at Tim's blog

Posted by rux at 05:33 PM | Permalink | Comments (0)

some screenshots of the pm2 patch running using the data from LordX's Series track.
this is a beautiful music and i think we're managing to show its data structures in a readable and aesthetically pleasing way.
niice!
more pics and updates from the show soon!

Posted by rux at 05:34 AM | Permalink | Comments (2)

here's a quick preview of the solved exercises :: (9.6Mb)

Posted by rux at 02:40 AM | Permalink | Comments (0)

Tim Stutts and I just decided to work together on our final project for Computational Forms.
Push Music(); PopMusic(); is a music data visualization system based on C++ and OpenGl frameworks.
This application will receive data related to the construction/mechanics of the music track from another machine (running an audio application and sharing the same language protocol (MIDI, OSC, . ..) and will transform this data in a perceptible visual structure.
Our intent is not only a visualization of the music structure and different elements relationships but also its relationships with emotional and abstract representations. Thus, we do not only care for a 'readable' but also for an expressive and sinaesthetic representation of the musical data through time.

Posted by rux at 11:33 PM | Permalink | Comments (0)

for my Computational Form project I proposed to build a mesh and be able to distort it with the mouse location.I ended up building five variations of it with different reactions: from liquid effects to disco balls, particles and corrosions.
I've also played around with the previous homework 'birdsquasher' function and built a mesh of distortion points to modify its shape moved by the mouse. I added two connected tails drawn by its movement and again I had a lot of fun playing with colors and color modulations and got some neat shadings.

here's a quick video-demo of the distortion grids variations :: (29Mb)

here's a quick video-demo of the birdSquasher :: (51Mb)

Posted by rux at 01:57 AM | Permalink | Comments (0)

here's a quick video-demo of problem-01 and the two problem-02 variations :: (29Mb)

problem 01::

problem 02::

-var01-

-var02-

(code coming soon - i'm currently creating an updated and improved version)

Posted by rux at 12:48 AM | Permalink | Comments (0)

here's a quick video demo of the exercises completed :: (13.4Mb)

Posted by rux at 01:41 AM | Permalink | Comments (0)

here's a quick video-demo of all the solved problems so far :: (10.2Mb)

problem 01:
mouseX determines number of steps inbetween points

problem 02:
blending between circle an animated blob - mouseX determines step of blending

problem 03:
draw bezier shape - 1st and 2nd clicks determine 2 points position, 3rd and 4th clicks determine weight points location.

problem 05:

problem 07:
my ideas for midterm project are basically around the modelation of virtual/graphic spaces through real instrumentation.
I'm currently designing a physical system for the input of depth relative to x,y locations.
i want to create this space responsive to the interface and later on make it responsive.
visually this space could be represented as an array of horizontal lines and other of vertical lines crossing each other at a regular pace, the 'knots' - points of crossing - are then used to set up the depth/height in the z-axys of that portion of lines.

Posted by rux at 09:02 PM | Permalink | Comments (1)

Problem 1 ::

see video-screenshot ( waves1 ) :: (2.2Mb)

Problem 2 ::

see video-screenshot ( EKG ) - interactive version = mouseX and mouseY control the high and low frequencies used in the modulation :: (13Mb)

Problem 3 ::

see video-screenshot ( daisy ) - interactive version = mouseX controls number of petals drawn :: (6.8Mb)

Problem 4 ::

Problem 5::

see video-screenshot ( wobbly ) :: (3.3Mb)

Problem :: 06
.. work in progress...

Problem :: 07

while building a funstion do build spiral grafx and experimenting with modulation possibilities of that same spiral line with sine waves and got to this interactive version of my personal expression.
MouseX and MouseY coords are used to control the number of points and increment values in the modulation and drawing of the spiral.

see video-screenshot ( myfavoriteshape )- interactive version = mouseX controls number of points / mouseY controls modulation increments :: (21Mb)

Posted by rux at 02:15 AM | Permalink | Comments (0)

Problem 01 ::

Problem 02 ::
a>




b>






Problem 03::

Posted by rux at 12:38 AM | Permalink | Comments (0)

Problem 1. Write a comment for every line in the main.cpp file.

/*
 *  main.cpp  - commented
 *  CompFormApp
 *
 */

#include < OpenGL/gl.h > //include openGLlibrary in project

#include < GLUT/glut.h >  //include GL Utility Toolkit in project

#include < stdio.h >           //include standard input and output (mouse and keyboard) 

#include < stdlib.h >         //include (other?) C library for system calls in project

#include < math.h >          //include Math library in project

float	mouseX = 0; // define variables to store mouse coordinates - x,y 

float	mouseY = 0;

int		windowW = 800; // define variables for window - width and height

int		windowH = 600;

#define PI 3.14159265358979



void displayFunc ( void ) //display contents/re-draw function

{

	glClear( GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT ); //clear screen = 

                                                                                                 //color and depth buffers

	

	glColor3f( 1,0,0 ); //define color used

	glRectf( mouseX-5, mouseY-5, mouseX+5, mouseY+5 ); //create rectangle with coords                      

                                                                                                               //relative to mouse location

	

	// place your drawing code here

	

	

	glutPostRedisplay(); // redraw

	glutSwapBuffers();   // swap buffers (remember that the program is double-buffering =

	    // draws offscreen and then switches buffers - sends image to screen)

}



void reshapeFunc ( int w, int h )  //function called when the window is resized or moved

{

	windowW = w;

	windowH = h;

                                      //setting the camera 

	glViewport( 0, 0, w, h );   // whatever it's been drawing it is in this window size

	glMatrixMode( GL_PROJECTION );  //how the camera operates

	glLoadIdentity();                 // ??

	gluOrtho2D( 0,w,0,h );  // camera - mode/perpective 

	glMatrixMode( GL_MODELVIEW );      //drawing space

	glLoadIdentity();   // ??

}

void mouseDownFunc ( int button, int state, int x, int y ) //mouse down capture function

{

	mouseX = x;

	mouseY = windowH - y;

}



void mouseMoveFunc ( int x, int y ) //mouse movement data capture function

{

	mouseX = x;

	mouseY = windowH - y;

}



void mouseDragFunc ( int x, int y ) //mouse drag data capture function

{

	mouseX = x;

	mouseY = windowH - y;

}



void keyboardFunc ( unsigned char key, int x, int y ) //keyboard data capture function

{

}



void arrowKeyFunc ( int a_keys, int x, int y ) //arrow keys data capture function

{

}



void init ( GLvoid )

{

	glShadeModel( GL_SMOOTH );                       

                                   // type of color shading = flat or smooth

	glClearColor( 1.0, 1.0, 1.0, 1.0 ); 

                                 // define color used to clear screen

	glEnable ( GL_COLOR_MATERIAL ); 

                                 // enable

	glEnable( GL_BLEND );   

                                // enable blending

	glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA); 

                               //blend alpha source with  ??

}



int main ( int argc, char** argv )

{

	glutInit( &argc, argv ); //initialize glut library

	

	glutInitDisplayMode( GLUT_RGBA | GLUT_DOUBLE );    

// define display mode (RGBA or Color Index)

// - single or double buffered

	glutInitWindowSize( windowW, windowH );            

// define window size

	glutCreateWindow( "CompFormApp" );                 

// create window - string is used as name in the title 

	glutDisplayFunc( displayFunc );                    

// function called to redraw contents

	glutReshapeFunc( reshapeFunc );                    

// function called for resizing and moving windows

	glutMouseFunc( mouseDownFunc );                   

// function called when the mouse button is pressed

	glutMotionFunc( mouseDragFunc );                   

// function called when the mouse is dragged                  

	glutPassiveMotionFunc( mouseMoveFunc );            

// function called when the mouse moves

	glutKeyboardFunc( keyboardFunc );                  

// function called when a key is pressed

	glutSpecialFunc( arrowKeyFunc );                   

// function called when an arrow key is pressed

	init();                                            

// function called for intialization routines

	

	glutMainLoop( ); 

//main loop - where everything is called from - rendering

  

	return 0; 

// C requires main to return an int

}

Problem 2. A Portrait.
a. Make a function called drawPortrait that is called from displayFunc. Draw the shape of your head in profile. Use GL_TRIANGLE_FAN. The portrait should be as accurate as possible and involve at least 30 points. Carefully place the first point to ensure a proper fill.
b. Draw the shape of an eye from the front. Use GL_TRIANGLE_STRIP.
c. Draw your initials as stroked lines with a thicknes of 3 pixels. Use GL_LINE_STRIP.

void drawPortrait(void)

{

    glColor3f( 0,0.85,0.85 ); 

	

	glRectf( mouseX-5, mouseY-5, mouseX+5, mouseY+5 ); //drawing square -  2 sets of coordinates         

                                                                       // = e.g. upper left + opposite vertex ( !!not coordinates + size!!)

    glColor3f( 0.94, 0.8,0.7 ); // set color RGB (use glColor4f for RGBA) = skin face color

  //glPolygonMode(GL_FRONT, GL_LINE);

	glBegin( GL_TRIANGLE_FAN);

	glVertex2f( 400,250);

	glVertex2f( 490,0);

	glVertex2f( 490,90);

	glVertex2f( 510,100);

	glVertex2f( 600,100);

	glVertex2f( 640,145);

	glVertex2f( 640,175);

	glVertex2f( 645,200);

	glVertex2f( 640,210);

    glVertex2f( 610,220);	//boca 

	glVertex2f( 645,230);

	glVertex2f( 642,265);

	glVertex2f( 687,280);   //ponta do nariz

	glVertex2f( 595,395);

	glVertex2f( 595,410);   //sobrolho

	glVertex2f( 582,495);

	glVertex2f( 547,520);

	glVertex2f( 500,525);

	

	glVertex2f( 450,525);

	glVertex2f( 400,515);

	glVertex2f( 350, 500);

	glVertex2f( 300, 480);

	glVertex2f( 270, 445);

	glVertex2f( 250, 390);

	glVertex2f( 250, 310);

	

	glVertex2f( 290, 220);   //nuca

	glVertex2f( 338, 150); 

	glVertex2f( 358, 100);

	

	glVertex2f( 350, 0);

	glVertex2f( 490,0);

	glEnd();

	

	//OLHO

	  glColor3f( 1.0, 1.0,1.0 ); // set color RGB (use glColor4f for RGBA) = skin face color

	

	glBegin( GL_POLYGON);

	glVertex2f( 590,390);

	glVertex2f( 560,380);

	glVertex2f( 590,360);

	glVertex2f( 595,375);

	glVertex2f( 590,390);

	glEnd();



//OLHO FRONT

	glColor3f(0.20, 0.19, 0.18);

	glBegin( GL_TRIANGLE_STRIP);

	glVertex2f( 55, 115 );

	glVertex2f( 65, 110 );

	

	glVertex2f( 70, 130 );

	glVertex2f( 100, 135 );

	

	glVertex2f( 120, 150 );

	glVertex2f( 140, 145 );

	

	glVertex2f( 150, 155 );

	glVertex2f( 170, 145 );

	

	glVertex2f( 180, 150 );

	glVertex2f( 200, 135 );

	

	glVertex2f( 210, 140 );

	glVertex2f( 230, 120 );

	

	glVertex2f( 240, 120 );

	glVertex2f( 250, 110 );

	

	glVertex2f( 260, 110 );

	

	glVertex2f( 250, 100);

	glVertex2f( 240, 100);

	glVertex2f( 240, 90 );

	glVertex2f( 220, 85 );

	

	glVertex2f( 210, 70 );

	glVertex2f( 190, 75 );

	

	glVertex2f( 170, 65 );

	glVertex2f( 150, 75 );

	

	glVertex2f( 120, 70 );

	glVertex2f( 100, 85 );

	

	glVertex2f( 80, 90 );

	glVertex2f( 75, 105 );

	

	glVertex2f( 60, 110 );

	

	glVertex2f( 55, 115 );

	

	glEnd();

	

		// Rux

		//r

		

		glLineWidth(5.0);

		glLineStipple(1, 0x1c47);

		glEnable(GL_LINE_STIPPLE);

		

		glBegin( GL_LINE_STRIP);

		glVertex2f (relativeX, relativeY+15); 

		glVertex2f (relativeX+60, relativeY+15);

		glEnd();

		

		glBegin( GL_LINE_STRIP);

		glVertex2f (relativeX+15, relativeY+15); 

		glVertex2f (relativeX, relativeY+30);

		glVertex2f (relativeX, relativeY+45);

		glVertex2f (relativeX+15, relativeY+60);

		glEnd();

		

		//u

		glBegin( GL_LINE_STRIP);

		glVertex2f (relativeX, relativeY+75); 

		glVertex2f (relativeX+60, relativeY+75);

		glEnd();

		

		glBegin( GL_LINE_STRIP);

		glVertex2f (relativeX+45, relativeY+75); 

		glVertex2f (relativeX+60, relativeY+90);

		glVertex2f (relativeX+60, relativeY+120);

		glVertex2f (relativeX, relativeY+120);

		glEnd();

		

		//x

		glBegin( GL_LINE_STRIP);

		glVertex2f (relativeX+60, relativeY+135); 

		glVertex2f (relativeX, relativeY+180);

		glEnd();

		

		glBegin( GL_LINE_STRIP);

		glVertex2f (relativeX, relativeY+135); 

		glVertex2f (relativeX+60, relativeY+180);

		glEnd();

		

		

}

Problem 3. A Landscape.
a. Make a function called drawLanscape that is called from displayFunc. Draw two gradients, one for the sky and one for the ground. The sky and ground together should fill the window. Use GL_QUADS.
b. Draws a small mountain range. The mountain range should grow vertically with the Y position of the mouse. Use GL_TRIANGLES.
c. Draw a cloud. The cloud's transparency should depend on the mouse X position. Use GL_TRIANGLE_FAN.
d. Draw a winding river. The river's width should expand as the mouse moves left and right. Use GL_TRIANGLE_STRIP.

void drawLandscape(void)

{

    glColor3f( 0,0.85,0.85 ); // set color RGB (use glColor4f for RGBA)

	

	glRectf( mouseX-5, mouseY-5, mouseX+5, mouseY+5 ); //drawing square -  2 sets of coordinates 

                                                            // = e.g. upper left + opposite vertex ( !!not coordinates + size!!)

	

	// glPolygonMode(GL_BACK, GL_LINE);

	

    glColor3f( 0.94, 0.8,0.7 ); // set color RGB (use glColor4f for RGBA) = skin face color

	//LAND

	glBegin(GL_QUADS);

	glColor3f( 0.6, 1.0, 0.38 );

	glVertex3f(0, 0, 0);

	glVertex3f(800, 0, 0);

	glColor3f( 0.12, 0.28, 0.07 );

	glVertex3f(800, 400, 0);

	glVertex3f(0, 400, 0);

	glEnd();

	

	//SKY

	glColor3f( 0.76,0.85,0.85 );

	

	glBegin(GL_QUADS);

	glColor3f( 0.76, 0.93, 1.0 );

	glVertex3f(0, 300, 0);

	glVertex3f(800, 300, 0);

	glColor3f( 0.12, 0.36, 0.9 );

	glVertex3f(800, 600, 0);

	glVertex3f(0, 600, 0);

	glEnd();

	//MOUNTAINS

	

	glBegin(GL_TRIANGLES);

	glColor3f( 1, 1, 1 );

	glVertex2f( 170, mouseY-20 );

	glColor3f( 0.28, 0.52, 0.17 );

	glVertex2f( 100, 270);

	glVertex2f( 240, 270);

	glEnd();

	

	glBegin(GL_TRIANGLES);

	glColor3f( 1, 1, 1 );

	glVertex2f( 270, mouseY+10 );

	glColor3f( 0.28, 0.52, 0.17 );

	glVertex2f( 200, 270);

	glVertex2f( 340, 270);

	glEnd();

	

	glBegin(GL_TRIANGLES);

	glColor3f( 1, 1, 1 );

	glVertex2f( 240, mouseY-70 );

	glColor3f( 0.28, 0.52, 0.17 );

	glVertex2f( 190, 270);

	glVertex2f( 300, 270);

	glEnd();

	glBegin(GL_TRIANGLES);

	glColor3f( 1, 1, 1 );

	glVertex2f( 200, mouseY-100 );

	glColor3f( 0.28, 0.52, 0.17 );

	glVertex2f( 150, 270);

	glVertex2f( 260, 270);

	glEnd();

	

	glBegin(GL_TRIANGLES);

	glColor3f( 1, 1, 1 );

	glVertex2f( 310, mouseY-120 );

	glColor3f( 0.28, 0.52, 0.17 );

	glVertex2f( 200, 270);

	glVertex2f( 400, 270);

	glEnd();

	

	//CLOUD

	glBegin(GL_TRIANGLE_FAN);

	glColor4f( 1, 1, 1, mouseX/1000 );

	glVertex2f(relativecX+100,relativecY+30);

	glColor4f( 0.78, 0.78, 0.88, mouseX/1000 );

	glVertex2f(relativecX+20,relativecY+10);

	glVertex2f(relativecX+10,relativecY+20);

	glVertex2f(relativecX+10,relativecY+30);

	glVertex2f(relativecX+20,relativecY+40);

	glVertex2f(relativecX+30,relativecY+40);

	glVertex2f(relativecX+40,relativecY+50);

	glVertex2f(relativecX+50,relativecY+50);

	glVertex2f(relativecX+60,relativecY+60);

	glVertex2f(relativecX+80,relativecY+60);

	glVertex2f(relativecX+90,relativecY+50);

	glVertex2f(relativecX+100,relativecY+50);

	glVertex2f(relativecX+110,relativecY+60);

	glVertex2f(relativecX+120,relativecY+60);

	glVertex2f(relativecX+130,relativecY+50);

	glVertex2f(relativecX+140,relativecY+50);

	glVertex2f(relativecX+150,relativecY+40);

	glVertex2f(relativecX+150,relativecY+30);

	glVertex2f(relativecX+130,relativecY+10);

	glVertex2f(relativecX+20,relativecY+10);

	glEnd();

	

	

	

	//RIVEEER

	

	glBegin(GL_TRIANGLE_STRIP);

	glColor3f(0,0,0.3);

	glVertex2f(725-(mouseX/100),300);

	glVertex2f(750+(mouseX/100),300);

	glVertex2f(725+(mouseX/100),275);

	glVertex2f(700-(mouseX/100),275);

	glVertex2f(700+(mouseX/100),250);

	glColor3f(0,0,0.5);

	glVertex2f(675-(mouseX/100),275);

	glVertex2f(700+(mouseX/100),225);

	glVertex2f(625-(mouseX/100),225);

	glVertex2f(650+(mouseX/100),175);

	glColor3f(0.1,0.2,0.5);

	glVertex2f(600-(mouseX/100),225);

	glVertex2f(650+(mouseX/100),150);

	glVertex2f(575-(mouseX/100),200);

	glVertex2f(625+(mouseX/100),100);

	glVertex2f(575-(mouseX/100),175);

	glVertex2f(600+(mouseX/100),75);

	glVertex2f(550-(mouseX/100),150);

	glColor3f(0.3,0.4,0.8);

	glVertex2f(575+(mouseX/100),75);

	glVertex2f(525-(mouseX/100),150);

	glVertex2f(525+(mouseX/100),25);

	glColor3f(0.4,0.6,0.9);

	glVertex2f(475-(mouseX/100),125);

	glVertex2f(525+(mouseX/100),0);

	glVertex2f(350-(mouseX/100), 0);

	

	glEnd();

	

}

Problem 4. A Grid.
a. Make a function called drawGrid that draws a grid across the entire window with lines that are spaced 10 pixels apart both horizontally and vertically. Make the color of the grid a very light gray. Use GL_LINES.
b. Draw a dark gray 3 pixel point at ever grid intersection. Use GL_POINTS.

void drawGrid(void)

 {

    

	//glColor3f( 0.5,0.5,0.5 );

	

		for(int i=0; i< windowW+1; i+=10)

		{

			glBegin(GL_LINES);

			glColor3f( 0.8,0.8,0.8 );

			glVertex2f(i,0);

			glVertex2f(i,windowH);

			

			for(int j=0; j< windowH+1; j+=10)

		{

			glVertex2f(0,j);

			glVertex2f(windowW,j);

		

		}

		glEnd();

		}

	

		for(int i =0; i
		{

			for (int j=0; j
			{

				glPointSize(3.0);

				glBegin(GL_POINTS);

				

				glColor3f(0.3,0.3,0.3);

				glVertex2f(i,j);

				glEnd();	

			}

		}

}

Posted by rux at 02:52 PM | Permalink | Comments (0)