Assignment 2- Hearts

Concept:

The concept is to create an animated work of art featuring multiple hearts. Each heart responds to the mouse’s proximity in two ways: it beats faster as the mouse gets closer, and its color transitions. This adds an interactive and dynamic element to the artwork.

 

Highlight Code:

I’m particularly proud of the updateHeartbeat function. This function calculates the distance between the mouse and a heart and adjusts the heart’s speed based on that distance. It’s a key part of the interactivity and dynamic behavior of the artwork. Here’s the code snippet:

function updateHeartbeat(heart) {
  let d = dist(mouseX, mouseY, heart.x, heart.y - heart.heartSize);
  let threshold = 100;
  if (d < threshold) {
    heart.heartSpeed = map(d, 0, threshold, 2, 4.5);
  } else {
    heart.heartSpeed = 1;
  }
  if (heart.heartbeat) {
    heart.heartSize += heart.heartSpeed; 
  } else {
    heart.heartSize -= heart.heartSpeed; 
  }

  if (heart.heartSize > 350 || heart.heartSize < 100) {
    heart.heartbeat = !heart.heartbeat;
  }
}

This function dynamically adjusts the heart’s size and speed based on the mouse’s proximity, creating a lifelike beating effect.

Reflection:

In reflecting on my code, I’m proud of how it’s well-structured and effectively brings the interactive artwork to life. However, I recognize that there’s always room for improvement and experimentation. First, I’d like to explore smoother transitions by experimenting with various easing functions for size and color changes. This can add a more organic feel to the animation. I also think it would be intriguing to introduce more complex color schemes or patterns for the hearts instead of a simple color transition. Custom heart shapes could bring diversity to the artwork, and randomly assigning them could make it even more engaging. To ensure optimal performance, especially with a larger number of hearts, I’ll consider implementing techniques like offscreen rendering. Adding user controls for adjusting parameters interactively, such as heart count, animation speed, or color schemes, would provide a more personalized experience for users. Additionally, enabling users to export their creations as images or animations would enhance sharing possibilities.