Lights in Processing

My initial inspiration for my interactive project I looked at a piece that used the minim library to create an abstract colour display. After further thinking about the imagery I came to the conclusion that the graphics it looked similar to an out of focus photo of some lights in the dark. The variation of circle sizes, different saturations of a colour and blurriness of some depth of light lead me to believe a kind of audio light show is trying to be achieved.

I want to have a play and experiment with lot of different abstract representations as possible before thinking about a final design for the graphics. This will allow me to try different kinds of abstract graphical representation and see what results can be achieved.It will also help me to develop my skills in processing. I have created some generative art previously with processing which could be a potential path to follow or an addition to what’s being produced here. First of all I’m going to make the images generate on mouse commands to make sure they look how I want, then I will make the audio responsive using the minim library.

To produce this kind of image I need …

  1. To generate some circles that are in focus some that are out of focus
  2. Generate a range of circle sizes
  3. Fade the circles out slowly in the background

I’m going to do this by….

  1. Using a blur filter over some of the circles that are generated
  2. Using a randomly generated values for the circle sizes
  3. Going to use a rectangle with a reduced opacity to overlay the images. This will slowly fade out parts of the image when it iterates/loops.


Here’s what I have got setup so far …

I think it works better visually as a still image rather than an animating image as when a still image its exported it looks far less complex and messy. This could be because the moving imagery doesn’t flow or react with a stimulus making the randomness disjointed. By adding controls or a reaction to sound, movement or light could improve this.

Flat Lights

There is an issue with a lag as more circles are added and the imagery gets more complex. This is because of the limitations of the computers ram. The loop is trying to iterate too many times per fame that cause a lag. This could be fixed by reducing the frame rate or use classes to reduce the size of data that needs to be cascaded through on each iteration. As you can see from the image below lots of the objects and opperations could be codded in a simpler and more consise form wich would mean the loop running faster.

void draw(){
for (int h=0; h<1; h=h+1) {
frameRate(random(3, 10));
float w = random(50,150);
float b = random(50,100);
float bC = random(100,255);
fill(0, 100);
filter(BLUR, 0);
ellipse(random(0,width),random(height/4,height/4*3),w, w);
ellipse(random(0,width),random(height/4,height/4*3),b, b);
filter(BLUR, random(1,6));

As for development of the proposed idea, The simple nature of this and how it could work with any genre of music. I can already see that it works well playing with audio from the example which gives me something to consider when it come to the complexity of the graphics as shows that simple does work on audio visualization.

Leave a Reply