Week 2: Loops

For the second week’s task, I wanted to use lines and circles to make some kind of pattern of motion. After adding lines, I quickly realized that adding circles would crowd the screen and be too overwhelming, so I decided to stick with lines only and develop them a bit further. My final sketch is displayed in the video below:

Challenges:

I faced two main challenges.

The first one relates to the motion of the lines. After adding the set of lines on the left, I was stuck on the set of the lines on the right. The amount of variables involved confused me, and I was unable to figure out how to set the motion of this set to be opposite to the other one. After tweaking the variables and trying to introduce new ones, I solved the issue by drawing a rough sketch of the lines on my phone and marking different parts of it, defining the variable which controls it.

The second challenge I faced related to the coloring of the sketch. I wanted to make the color of the lines’ stroke to change over time. I tried using random() and noise() to introduce random colors smoothly. However, it was difficult to make the color change smooth after experimenting with many numbers. I think the difficulty resulted from the fact that three parameters control the resulting RGB color. I tried looking up how to use Hex colors, but that was difficult to implement as well. So I just decided to go with a lighter shade of gray

Decision-making:

I wanted the lines to rotate and after some time reverse and rotate the other way. I used frameCount at first, but I realized it was difficult to utilize since I wanted a variable that decreases after a certain amount of time. At the end, I decided to make my own variable that increases and decreases.

Code:

int counter;
float speed;
boolean increaseCounter;

void setup() {
  size(640, 480);
  
  counter = 0;
  speed = 0.007;
  increaseCounter = true;
}

void draw() {
  background(0);
  
  stroke(200);
  if ((counter+1) * speed >= radians(90)) {
      increaseCounter = false;
    } else if (counter <= 0) {
      increaseCounter = true;
    }
    if (increaseCounter) {
      counter++;
    } else {
      counter--;
    }
  
  for (int i = 20; i <= width; i += 40) {
    float frequency = (counter * speed);
    pushMatrix();
    translate(i, i);
    strokeWeight(1.5);
    rotate(frequency);
    line(-i, 0, width-i, 0);
    popMatrix();
  }
  
  for (int i = width; i >= 0; i -= 40) {
    float frequency = (counter * speed);
    pushMatrix();
    translate(i, width-i);
    strokeWeight(1.5);
    rotate(-frequency);
    line(-i, 0, width-i, 0);
    popMatrix();
  }
}