Week 4 – Dancing Wave

Concept:

For this project, I was inspired by the Memo Akten Simple Harmonic Motion project. What stood out to me in this project was the sound and how particles would change if they approached a different line or object. For this project, I decided to experiment with a Dancing wave that would function similarly.

Highlight of code:

I had so many challenges in this code and debugging and figuring out the logic behind the functionality took me some time. There are many parts that I am proud of in this code. I am particularly the flow I created of the animated video.

rotate(PI / 3);

  for (let i = 0; i < angles.length; i++) {
    beginShape();
    for (let i = 0; i < angles.length; i++) {
      let y = map(sin(angles[i]), -1, 1, -150, 150);
      let x = map(i, 0, angles.length, -350, 350);

      let particleSize = r * 0.9; // Default particle size

      // Check if the particle touches the line (y is close to 0)
      if (abs(y) < 5) {
        //draw the shape gradually on canvas

        fill(touchedLineColor); // Change color when touching
        particleSize = r * 2.5; // Increase the size of the particle
      } else {
        fill(getWaveColor(y)); // Get color based on y value
      }

      stroke(getWaveColor(y));
      strokeWeight(1);
      line(cos(x), 0, x, y); // Draw line from middle to particle
      noStroke();
      circle(x, y, particleSize); // Draw the particle
      noFill();
      vertex(x, y);

      endShape();
    }
 angleV[i] = constrain(angleV[i], -0.01, 0.5);
    angles[i] -= angleV[i];
    angleV[i] += angleA[i];
  }
}

The video starts by drawing a simple line that has a sort of random noise. This line is the point of transformation of the color of particles when they touch it. Then, I drew the wave, which gradually increases its acceleration over time. I initially wanted the wave to appear on the canvas slowly before the animation started. I tried so many ways to do that, for instance, making a static wave, then adding the animated one on it, and creating nested loops; however, none of the ways worked, so I decided to improve on it in future work.
Additionally, I am proud of being able to check if the particles are close to the invisible line so that they change color and size. Even though, though it has a simple logic, figuring it out took some time.

Embedded Sketch:

Future Work:
For future work, I want to play more with the wave’s acceleration so that it would accelerate and decelerate when I want it. I also want to experiment with different waves to see the different esthetics I can create, and finally, adding the wave gradually into the canvas would be a strong attribute to the design of this animation.

Reference: