How to create real randomized objects

I want to make an ‘iOS dynamic wallpaper generator’ in processing.
I made a class that can draw a dynamic gradient color spot. But I don’t know how to draw multiple spots with different(random) color, shape, and position. Now I manually draw 2 objects but they are identical.

Please give me some suggestions. Thank you in advance :smiley:

Code attached here:

PVector offset1, offset2;
float scale = 0.001;                                             //smoothness
color c1, c2;
float hue2, saturation2, brightness2;
float shapeSize = random(100, 250);

void setup() {
  size(640, 640);
  blendMode(MULTIPLY);                                           //Test
  frameRate(30);
  colorMode(HSB);
  noStroke();
  offset1 = new PVector(random(10000), random(10000));
  offset2 = new PVector(random(10000), random(10000));
  mousePressed();
}

void mousePressed() {                                            //Reset color
  c1 = color(random(255), random(150, 180), random(240, 255));   //Rim color, brighter
  hue2 = hue(c1) + random(40, 55);
  if (hue2 >255) {
    hue2 = hue(c1) - random(40, 55);
  }
  saturation2 = saturation(c1) - random(40, 60);
  brightness2 = brightness(c1) + random(80, 100);                //As the blend mode is multiply
  c2 = color(hue2, saturation2, brightness2);                    //Center color
}

void draw() {
  background(245);
  Obj objA = new Obj(200, 200);
  objA.drawObj();
  Obj objB = new Obj(400, 400);
  objB.drawObj();
}

class Obj {
  float x, y;

  Obj(float _x, float _y) {
    x = _x;
    y = _y;
  }

  void drawObj() {
    translate(x, y);                                              //Change coordinates
    float speed = 0.001;                                          //wiggling speed
    int roundness = 400;                                          //
    for (float radious = shapeSize-1; radious > (shapeSize-100); radious -= (shapeSize-radious)/10)
                                                                  //Layers, draw from the biggest
                                                                  //Give it gradients in a short range from the rim 
    {
      fill(map(radious, 0, shapeSize, hue(c2), hue(c1)),          //Color
        map(radious, 0, shapeSize, saturation(c2), saturation(c1)), 
        map(radious, 0, shapeSize, brightness(c2), brightness(c1)), 
        20);                                                      //Alpha
      beginShape();
      for (float angle = 0; angle < 360; angle += 1)              //vertex steps
      {
        float radian = radians(angle);                            //Got angle
        float x = radious * cos(radian);                          //Got x&y from trig func*radious, still fixed numbers
        float y = radious * sin(radian);
        float nx = x + map(noise(x * scale + offset1.x, y * scale + offset1.y, frameCount * speed), 0, 1, -roundness, roundness);
                                                                  //nx = noiseX
        float ny = y + map(noise(x * scale + offset2.x, y * scale + offset2.y, frameCount * speed), 0, 1, -roundness, roundness);
        vertex(nx, ny);                                           //Confirm one point
      }
      endShape(CLOSE);
    }
    translate(-x, -y);                                            //Change back coordinates
  }
}
1 Like

For the random Color, you could add a variable of class color in the Obj class and randomize it when the obj is initialized.

For the shape, i‘d suggest you to add a new variable in the Obj like :

float NoiseSeed;

And initialize it as

noiseSeed = random(0,1000);

Then reset the noiseSeed to NoiseSeed when you create the shape in drawObj();
Although you might want to create a PShape, so you can avoid redrawing the shape each time.

As for the position, you can change it again using noise() with an x, y and a t variable (t stands for time).

Btw, you can also use noise() to change the Color over time like with the position, to have it change over time.

1 Like