Script Part V

I’m gonna try the last “inspirational” material from the script. From a first glance, it looked rather complicated also considering that I already struggled with noise. The code does indeed look scary and complicated.

{u | 0≤u≤2π} // u is between 0 and 2π.
x=cos(u)
y=sin(u)

u value can then calculate x and y values.

if we set u=π, we get

x=cos(π)
y=sin(π)

and thus x=0, y=-1

void setup() {
  size(800, 800);
  background(0);
}

void draw() {
  float step=0.01; // defines how many u values
  float size=200; // height of the image 
  for (float u=0; u<2*PI; u=u+step) {
    float x= cos(u);
    float y=sin(u);
    stroke(255);
    point(width/2+x*size, height/2+y*size); // puts image in the center
  }
}
void setup() {
  size(800, 800, P3D); // 3D space
  background(0);
}

void draw() {
  float step=0.05;
  float size=200;

  for (float v=0; v<2*PI; v=v+step) {
    for (float u=0; u<2*PI; u=u+step) {
      // u and v have values from 0 to 2π
      float x=cos(4*u)/4+sin(v)*cos(u);
      float y=sin(4*u)/4+sin(v)*sin(u);
      float z=cos(v);
      stroke(255);
      point(width/2+x*size, height/2+y*size, z*size);
    }
  }
}
void setup() {
  size(800, 800, P3D); // 3D space
  background(0);

  float step=0.05; // defines how many u values 
  float size=250; // height of the image

  noFill();
  stroke(255);

  beginShape();
  for (float v=0; v<2*PI; v=v+step) {
    for (float u=0; u<2*PI; u=u+step) {
      // u and v have values from 0 to 2π
      float x= cos(4*u)/4+sin(v)*cos(u);
      float y=sin(4*u)/4+sin(v)*sin(u);
      float z=cos(v);
      vertex(width/2+x*size, height/2+y*size, z*size); 
      // connect dots
      // point replaced by vertex
    }
  }
  endShape();
}
void setup() {
  size(800, 800, P3D); // 3D space
  background(0);

  float step=0.05; // defines how many u values 
  float size=250; // height of the image

  noFill();
  stroke(255);

  beginShape();
  for (float v=0; v<2*PI; v=v+step) {
    for (float u=0; u<2*PI; u=u+step) {
      // u and v have values from 0 to 2π
      float x=cos(10*u)/4+sin(v)*cos(u);
      float y=sin(10*u)/4+sin(v)*sin(u);
      float z=cos(v);
      vertex(width/2+x*size, height/2+y*size, z*size); 
      // connect dots
      // point replaced by vertex
    }
  }
  endShape();
}

I just took screenshots of everything because it looked nice.

void setup() {
  size(800, 800, P3D); // 3D space
  background(0);

  float step=0.01; // defines how many u values 
  float size=250; // height of the image

  noFill();
  stroke(255);

  beginShape();
  for (float v=0; v<2*PI; v=v+step*5) {
    for (float u=0; u<2*PI; u=u+step*5) {
      // u and v have values from 0 to 2π
      float x=cos(10*u)/4+sin(v)*cos(u);
      float y=sin(10*u)/4+sin(v)*sin(u);
      float z=cos(v);
      vertex(width/2+x*size, height/2+y*size, z*size); 
      // connect dots
      // point replaced by vertex
    }
  }
  endShape();
}
void setup() {
  size(800, 800, P3D); // 3D space
  background (0);
  
  float step=0.05; // defines how many u values
  float size=250; // height of the image

  noFill();
  stroke(255);
  
  beginShape();
  for (float v=0; v<4*PI; v=v+step) {

    for (float u=0; u<4*PI; u=u+step) {
      float x=sin(4*v)*cos(4*u);
      float y=sin(v)*sin(4*u);

      float z=cos(v);

      vertex(width/2+x*size, height/2+y*size, z*size);
    }
  }
  endShape();
}
void setup() {
  size(800, 800, P3D); // 3D space
  background (0);

  float step=0.09; // defines how many u values
  float size=250; // height of the image

  noFill();
  stroke(255);

  beginShape();
  for (float v=0; v<2*PI; v=v+step) {

    for (float u=0; u<2*PI; u=u+step) {
      float x=sin(2*v)*cos(4*u);
      float y=sin(v)*sin(2*u);

      float z=cos(v);

      vertex(width/2+x*size, height/2+y*size, z*size);
    }
  }
  endShape();
}
void setup() {
  size(800, 800, P3D); // 3D space
  background (0);

  float step=0.03; // defines how many u values
  float size=200; // height of the image

  noFill();
  stroke(255);

  beginShape();
  for (float v=0; v<2*PI; v=v+step) {

    for (float u=0; u<2*PI; u=u+step) {
      float x=sin(3*v)*cos(4*u);
      float y=sin(3*v)*sin(3*u);

      float z=cos(v);

      vertex(width/2+x*size, height/2+y*size, z*size);
    }
  }
  endShape();
}
void setup() {
  size(800, 800, P3D); // 3D space
  background (0);

  float step=0.03; // defines how many u values
  float xSize=250; 
  float ySize=200;
  float zSize=500;

  noFill();
  stroke(255);

  beginShape();
  for (float v=0; v<2*PI; v=v+step) {

    for (float u=0; u<2*PI; u=u+step) {
      float x=sin(3*v)*cos(4*u);
      float y=sin(3*v)*sin(3*u);

      float z=cos(v);

      vertex(width/2+x*xSize, height/2+y*ySize, z*zSize);
    }
  }
  endShape();
}

Poster

PFont f; // Variable for the font
float step=0.08; // defines how many u values
float size=0; // height of the image
float a = 0;

void setup() {
  size(800, 800, P3D); // 3D space
  background (0);
  f = createFont("IBMPlexSans-Bold", 60, true); // Create font
}

void draw() {
  beginShape();
  for (float v=0; v<4*PI; v=v+step) {

    for (float u=0; u<4*PI; u=u+step) {
      float x=sin(2*v)*cos(4*u);
      float y=sin(v)*sin(2*u);

      float z=cos(v);
      noFill();
      strokeWeight(0.1);
      stroke(255);
      vertex(width/2+x*size, height/2+y*size, z*size);
    }
  }
  endShape();

  size++;

  fill(0);
  noStroke();
  rect(0, 350, 800, 50);
  
  textFont(f, 40);
  fill(255);                         
  text("CORONA END PARTY", 195, 390);
  
  textFont(f, 30);
  fill(0);                         
  text("STARTING NOW", 270, 340);
  
  textFont(f, 30);
  fill(0);                         
  text("17 JULY 2020", 290, 430);
}

Recap

I still find the code a little bit complicated but as everything it improves with practice so I tried out different values literally everywhere to see what it does. I did not put the code for all variations but I think you get the idea.

I kinda like the poster with the animation and how it is revealing the typography when it gets bigger. This can certainly be improved by scaling down again or variations within the shape but for now I’m satisfied with the outcome.