Week 3: Generative Artwork

For this week’s task, I wanted to make a representation of a mathematical rule using “bubbles”.  However, I quickly ran into lag issues. Originally, I wanted to create 100 objects, but the program started lagging at a much lower count. I ended up discarding the original idea and started experimenting with other features such as random motion and color.

The sketch lags at 5 objects.

The sketch is less laggy at 1 object.

The bubbles start at a random colors of 7 previously determined colors. They then transition and span through the rest of the colors with the help of lerpColor(). The motion of the bubbles is randomized through noise() and is mapped on the entire screen. The size of the bubbles is also randomized on a predetermined range.

Challenges/concerns:

My code is relatively simple but the program lags a lot. I’m not sure what causes this lag. My guess is repeatedly calling noise() is inefficient, but I’m not sure how to optimize it while retaining the randomness of motion and color for all objects.

Code:

Thing[] things;
int thingsCount;


void setup() {
  size(640, 480);
  
  thingsCount = 5;
  
  things = new Thing[thingsCount];
  for (int i=0; i<things.length; i++) {
    things[i] = new Thing(random(0,width), random(0,height));
  }
}

void draw() {
  background(0);
  
  for (int i = 0; i<things.length; i++){
    things[i].display(); 
  }
}

class Thing {
  float x, y;
  float diameter;
  float tx, ty;
  float colorStage;
  int color1, color2, currColor;
  color[] palette;
  int colorFrequency;

  Thing(float xPos, float yPos) {
    x = xPos;
    y = yPos;
    diameter = random(70, 150);
    tx=random(0, 10000);
    ty=random(0, 10000);
    colorStage = 0;
    palette = new color[]{color(246, 0, 0), color(255, 140, 0), color(255, 238, 0), color(77, 233, 76), color(55, 131, 255), color(72, 21, 170)};
    currColor = int(random(0, 6));
    colorFrequency = 10;
  }

  void motion() {
    x = map(noise(tx), 0, 1, 0, width);
    y = map(noise(ty), 0, 1, 0, height);
    tx += 0.04;
    ty += 0.04;
  }

  color updateColor() {
    colorStage = (colorStage+colorFrequency) % 100;
    if (colorStage == 0) {
      currColor++;
    }
    currColor = currColor % palette.length;
    color1 = palette[currColor];
    if (currColor + 1 >= palette.length) {
      color2 = palette[0];
    } else {
      color2 = palette[currColor+1];
    }

    return lerpColor(color1, color2, colorStage/100);
  }

  void display() {
    color fillColor = updateColor();
    fill(fillColor);
    motion();
    stroke(255);
    ellipse(x, y, diameter, diameter);
    filter(BLUR, 8);
  }
}