Day 20

Today I was so close to not making something but then I looked into logarithmic scales in FFTs and it was very easy to adapt yesterday’s code. I played a little bit more with the camera in OPENGL. Who knows what tomorrow will bring.

import ddf.minim.*;
import ddf.minim.analysis.*;
import javax.media.opengl.*;
import processing.opengl.*;

Minim minim;
AudioInput input;
FFT fft;

float[][] spectra;
int pointer;

int r;

void setup()
{
  size(720,480,OPENGL);
  hint(ENABLE_OPENGL_4X_SMOOTH);

  smooth();
  minim = new Minim(this);
  input = minim.getLineIn(Minim.STEREO);
  fft = new FFT(input.bufferSize(), input.sampleRate() ); 

  fft.logAverages(22, 2);

  spectra = new float[50][fft.avgSize()];

  colorMode(HSB,1000);
}

void draw()
{
  camera(width/2.0, height/10.0 + cos (r++/TWO_PI)*100, (height/2.0) / tan(PI*60.0 / 360.0) , width/2.0, height/2.0, 0,    0, 1, 0);

  fft.forward(input.mix);

  for (int i = 0 ; i < fft.avgSize() ; i++)
    spectra[ pointer ][i] = fft.getAvg(i);

  background(0);

  noFill();

  translate(0,height - 100);

  for ( int q = 1 ; q <= 50 ; q++)
  {
    stroke(200,1000 - (q*20), 1000 - (q*20) );  

    beginShape();
    for (int i = 0 ; i < fft.avgSize() ; i++)
      curveVertex(i * (float)width/fft.avgSize() , spectra[ (pointer+q) % 50 ][i] * height );
    endShape();
    translate(0,0, -200);
  }

  pointer = (pointer + 1) % 50;
}

void keyPressed()
{
  if (key == ' ')
    saveFrame();
}

Day 19

I was hoping to have some success with ArrayLists today but I didn’t. I finally have the waterfall code down but it goes backwards from past to present instead of present to past. It looks kinda neat this way, though. I also added colour! For me,  working in HSB seems to be more closely related to my headspace than RGB, so if I need colour I am going to stick to that for now.

This sketch uses linear averages of FFT which are really easy to compute and set up but the result is less than pleasing. I think tomorrow I will play with the log function and see if I can get something a little closer to what I think it should look like.

import ddf.minim.*;
import ddf.minim.analysis.*;
import javax.media.opengl.*;
import processing.opengl.*;

Minim minim;
AudioInput input;
FFT fft;

float[][] spectra;
int pointer;

void setup()
{
  size(720,480,OPENGL);
  hint(ENABLE_OPENGL_4X_SMOOTH);

  smooth();
  minim = new Minim(this);
  input = minim.getLineIn(Minim.STEREO);
  fft = new FFT(input.bufferSize(), input.sampleRate() ); 

  fft.linAverages(10);

  spectra = new float[50][fft.avgSize()];

  colorMode(HSB,1000);
}

void draw()
{
  camera(width/2.0, height/10.0, (height/2.0) / tan(PI*60.0 / 360.0), width/2.0, height/2.0, 0, 0, 1, 0);

  fft.forward(input.mix);

  for (int i = 0 ; i < fft.avgSize() ; i++)
    spectra[ pointer ][i] = fft.getAvg(i);

  background(0);

  noFill();

  translate(0,height - 100);

  for ( int q = 1 ; q <= 50 ; q++)
  {
    stroke(200,1000 - (q*20), 1000 - (q*20) );  

    beginShape();
    for (int i = 0 ; i < fft.avgSize() ; i++)
      curveVertex(i * (float)width/10 , spectra[ (pointer+q) % 50 ][i] * height );
    endShape();
    translate(0,0, -200);
  }

  pointer = (pointer + 1) % 50;
}

void keyPressed()
{
  if (key == ' ')
    saveFrame();
}

Day 18

Today I messed around with some simple spectral displays and trying other parts of the Processing API. I have added curveVertex to my bag of tricks. This patch has two curvy lissajous spectral displays rotating in contrary motion and a set of bars representing linear spectral averages.

This was the first time I put some more interaction into a sketch. I have a key that changes the mode of the layering. I have been working on things and discovering stuff that I like about a sketch but often it goes away when I make the final thing that I like most. So, I made a little mistake in the process and kept it as an option by pressing the d key.

I still have to look into waterfall plots and buffering. Maybe tomorrow.

import ddf.minim.*;
import ddf.minim.analysis.*;

Minim minim;
AudioInput input;
FFT fft;
boolean darkness = false;
int r;

void setup()
{
  size(720,480,P2D);
  smooth();
  minim = new Minim(this);
  input = minim.getLineIn(Minim.STEREO);
  fft = new FFT(input.bufferSize(), input.sampleRate() );
  fft.linAverages(10);
  background(0);
}

void draw()
{
  fft.forward(input.mix);

  noStroke();
  fill(0,19);
  rect(0,0,width,height);

  stroke(input.mix.level() * 255);
  strokeWeight(.1);

  pushMatrix();
  translate(width/4,height/4);
  rotate(PI - (float)r/100);
  beginShape();
  for (int i = 0 ; i < fft.avgSize(); i++)
  {
      fill( fft.getBand(i) * 255 , 40);
      curveVertex(sin ( (float)i/fft.avgSize() * 2 *TWO_PI) *fft.getBand(i)  * width/2 , cos( (float)i/fft.avgSize() * 2 * TWO_PI) * fft.getBand(i)  * height/2  );
  }
  endShape(CLOSE);
  popMatrix();

  pushMatrix();
  translate(width/4*3,height/4*3);
  rotate(PI + (float)r++/100);
  beginShape();
  for (int i = 0 ; i < fft.avgSize(); i++)
  {
      fill( fft.getBand(i) * 255 , 40);
      curveVertex(sin ( (float)i/fft.avgSize() * 2 *TWO_PI) *fft.getBand(i)  * width/2 , cos( (float)i/fft.avgSize() * 2 * TWO_PI) * fft.getBand(i)  * height/2  );
  }
  endShape(CLOSE);
  popMatrix();

  int spacing = width / fft.avgSize();

  if (!darkness)
    stroke(180);

  for (int i = 0 ; i < fft.avgSize(); i++)
  {
     strokeWeight(fft.getBand(i) * 50);
     line( spacing * i + spacing/2, 0, spacing * i + spacing/2, height);
  }
}

void stop()
{
  input.close();
  minim.stop();
  super.stop();
}

void keyPressed()
{
 if (key == ' ')
  saveFrame(); 

 if (key == 'd' | key == 'D' )
  darkness = !darkness;
}

Day 17

Today is a simple patch that does a spectral lissajous plot. Enjoy!

import javax.media.opengl.*;
import processing.opengl.*;
import ddf.minim.*;
import ddf.minim.analysis.*;

Minim minim;
AudioInput input;
FFT fft;

void setup()
{
  size(720,480,OPENGL);
  hint(ENABLE_OPENGL_4X_SMOOTH);  

  minim = new Minim(this);
  input = minim.getLineIn(Minim.STEREO);
  fft = new FFT(input.bufferSize(), input.sampleRate() );
  fft.linAverages(10);
  background(0);

  strokeWeight(0.1);
}

void draw()
{
  fft.forward(input.mix);

  noStroke();
  fill(0,19);
  rect(0,0,width,height);

  stroke(255);
  translate(width/2,height/2);
  beginShape();
  for (int i = 0 ; i < fft.avgSize(); i++)
  {
      vertex(sin (fft.getBand(i) * i/fft.avgSize()) * width/2 , cos(fft.getBand(i) * i/fft.avgSize()) * height/2 );

  }
  endShape();
  println(fft.avgSize() );
}

void stop()
{

  input.close();
  minim.stop();
  super.stop();
}

void keyPressed()
{
 if (key == ' ')
  saveFrame();
}

Day 15

Whew! Here is a quick patch based upon a circle that draws brightness based on the level according to FFT analysis. I can see this moving and rotating in the future but for today I have something done.

I think I am going to start looking at saving frames and doing waterfall like displays so you can see into the past. That should be fun.

import javax.media.opengl.*;
import processing.opengl.*;
import ddf.minim.*;
import ddf.minim.analysis.*;

Minim minim;
FFT fft;
AudioInput input;

float[] points;

int numberofpoints;

void setup()
{
  size(720,480,OPENGL);
  hint(ENABLE_OPENGL_4X_SMOOTH);  

  minim = new Minim(this);
  input = minim.getLineIn(Minim.STEREO, 512);
  fft = new FFT(input.bufferSize(), input.sampleRate() );

  numberofpoints = fft.specSize();

  points = new float[numberofpoints];
  for ( int i = 0 ; i < numberofpoints/2; i++)
  {
    points[i] = sin( (float)i/numberofpoints*2 * TWO_PI) * height/2 + width/2;
    points[i+numberofpoints/2] = cos( (float)i/numberofpoints*2 * TWO_PI) * height/2 + height/2;
  }

  noStroke();
  fill(0);
  rect(0,0,width,height);
}

void draw()
{

  fill(0,5);
  noStroke();
  rect(0,0,width,height);
  fill(255);

  float audiolevel = input.mix.level();
  fft.forward(input.mix);

  strokeWeight(5);

  for ( int i = 0 ; i < numberofpoints/2; i++)
  {
    stroke( fft.getBand(i) * 100);
    point( points[i] , points[i+numberofpoints/2] );
  }
}

void mousePressed()
{
   noStroke();
   fill(255);
   rect(0,0,width,height);
}

void keyPressed()
{
  if (key == ' ')
    saveFrame();
}

void stop()
{
  input.close();
  minim.stop();
  super.stop();
}

Day 14

Today was a good day. I have settled on 720×480 resolution for now so I can do things in native DVD resolution and hopefully make some nice looking video at the end of this experiment. I came up with an idea of circle that responds to audio. I made it respond to volume for brightness and I rendered the circle with a crude particle system. I also added some Alva Noto like flashing for fun.

import javax.media.opengl.*;
import processing.opengl.*;
import ddf.minim.*;
import ddf.minim.analysis.*;

Minim minim;
FFT fft;
AudioInput input;

PGraphics graph;
PImage img;
int r;
float[] points;
int x;

int numberofpoints = 50000;

void setup()
{
  size(720,480,OPENGL);
  hint(ENABLE_OPENGL_4X_SMOOTH);  

  points = new float[numberofpoints];
  for ( int i = 0 ; i < numberofpoints/2; i++)
  {
    points[i] = sin( (float)i/numberofpoints*2 * TWO_PI) * height/2 + width/2;
    points[i+numberofpoints/2] = cos( (float)i/numberofpoints*2 * TWO_PI) * height/2 + height/2;
  }

  minim = new Minim(this);
  input = minim.getLineIn(Minim.STEREO, 512);

  noStroke();
  fill(0);
  rect(0,0,width,height);
}

void draw()
{

  fill(0,5);
  noStroke();
  rect(0,0,width,height);
  fill(255);

  for (int i = 0; i < points.length ; i++)
     points[i] += random(-2,2);

  float audiolevel = input.mix.level();

  stroke(audiolevel*500);

  strokeWeight(1);

  for ( int i = 0 ; i < numberofpoints/2; i++)
    point( points[i] , points[i+numberofpoints/2] );

}

void mousePressed()
{
   noStroke();
   fill(255);
   rect(0,0,width,height);
}

void keyPressed()
{
  if (key == ' ')
    saveFrame();
}

void stop()
{
  input.close();
  minim.stop();
  super.stop();
}

Day 13

Today I am working with a visual idea that I want to turn into music. I have a blurry scene where the action moves up and a sine wave moves down. It is a start.

I am using a stack blur from quasimondo. It is super fast and it looks ok. Not quite as pleasurable as a gaussian but way faster. I also got bit on a pointer reference thing when converting a PGraphics to a PImage. Be careful! PGraphics is a subclass of PImage and you can assign one to the other thanks to inheritance but to copy the actual image from one to the other you have to use the get() method  and then things will behave like you expect. Thanks to the javadocs for Processing.

I have linked code at the bottom.

http://www.adamtindale.com/code/processing/creativepact2010/DAY13/

Day 12

I was again playing with GLGraphics and had a happy accident. I added some more shaders to a sketch and got these swirling worlds. I think this is something I am going to keep. I did something I thought I understood and came up with these great visuals for some reason. This illustrates to me that I need a little more theory before I dig deeper with shaders. Some other time.

My big problem is that I haven’t added audio so I am diverting a bit from my original idea at the beginning of the month.  Tomorrow I will refocus.

Day 11

Today was a bit of a bust. I tried writing some GLSL shaders using GLGraphics and didn’t have much luck. I have been wanting to dig into the library for awhile but haven’t had time, so today was the day. I was able to get some simple frag shaders going but blurs weren’t working. I upgraded to the new version only to find new functionality came with a new API. The patch I made works but crashes after 10 seconds or so. When I have more time I will look further into the issue or post it on the forums but for now I just have a day to make something.

Day 10

I went out tonight to three art openings around town and I was totally jazzed from seeing art. So I have come home and tried to do something before I go to sleep. This is my first sketch that is a continuation of the day before.

I was looking at things and thinking about in-between. I have made a simple patch that takes yesterday’s patch but adds a cloud of random points and I can do linear interpolation between the two. It is crude right now but there are some very interesting intermediate states between objects that arrive. I have also properly implemented the Dan Shiffman sugar from his space junk sketch so I get some more variation from frame to frame.

Again, OPENGL so code will follow the image, now animated.

import ddf.minim.*;
import ddf.minim.analysis.*;
import processing.opengl.*;
import javax.media.opengl.*;

Minim minim;
AudioInput input;

int Segments = 21;
float[][] mylines = new float[Segments*Segments][3];
float[][] myrandomlines = new float[Segments*Segments][3];
float theta;
float phi;
float scalething = 200;
int r = 1;
int p;

color c1 = color(240,0,0);
color c2 = color (20,150,150);

void setup()
{
  size(640,480, OPENGL);

  minim = new Minim(this);
  input = minim.getLineIn(Minim.STEREO, 512);

  	for(int i=0; i < Segments;++i)
	{
		theta = (float)i/Segments * 2 * PI;
		for(int j=0; j < Segments;++j)
		{
			phi = (float)j/Segments * PI;

			mylines[i*Segments+j][0] = sin(theta)*cos(phi)*scalething;
			mylines[i*Segments+j][1] = sin(theta)*sin(phi)*scalething;
			mylines[i*Segments+j][2] = cos(theta)*scalething;

                        myrandomlines[i*Segments+j][0] = random(0,scalething) - scalething/2;
                        myrandomlines[i*Segments+j][1] = random(0,scalething) - scalething/2;
                        myrandomlines[i*Segments+j][2] = random(0,scalething) - scalething/2;
		}
	}
}

void draw()
{
  background(200);
  translate(width/2, height/2);

  float audiolevel = input.mix.level();
  strokeWeight(audiolevel*100);
  c1 = color(audiolevel*2100,80,audiolevel*1400);

  rotateY((float)p/200);
  rotateZ((float)p/123);

  for(int i = 1 ; i < Segments * Segments; i++)
  {
      rotate(random(200));
      beginShape(LINES);
         stroke(c1);
         vertex(mylines[i][0] * (1.0 - 1.0/r) + myrandomlines[i][0] * (1.0/r),
            mylines[i][1] * (1.0 - 1.0/r) + myrandomlines[i][1] * (1.0/r),
            mylines[i][2] * (1.0 - 1.0/r) + myrandomlines[i][2] * (1.0/r));
         stroke(c2);
         vertex(mylines[i-1][0] * (1.0 - 1.0/r) + myrandomlines[i-1][0] * (1.0/r),
           mylines[i-1][1] * (1.0 - 1.0/r) + myrandomlines[i-1][1] * (1.0/r),
           mylines[i-1][2]* (1.0 - 1.0/r) + myrandomlines[i-1][2] * (1.0/r) );
      endShape();
  }
}

void keyPressed()
{
   if (key == ' ')
   {
      saveFrame();
   }
}

void mouseClicked(){
 r++; 

}

void stop()
{
  input.close();
  minim.stop();
  super.stop();
}