Generative Art & Code

This creative coding artwork, built with the P5.js JavaScript library, features an interactive eye that follows mouse movement and winks when clicked.

function draw() {
  background(0);
  // Eyeball
  ellipse(width / 2, height / 2, 300, eyeBallH)


  //Black eye
  push();
  rectMode(CENTER);
  fill(0);
  ellipse(xPos, yPos, 45, 45);

  // Moving black eye in a circle

  angle = atan2(touchY - height / 2, touchX - width / 2);
  r = dist(width / 2, height / 2, touchX, touchY);
  if (r < 100) {
    r = dist(width / 2, height / 2, touchX, touchY)
  }else{
    r=100;
  }
  xPos = width / 2 + cos(angle) * r;
  yPos = height / 2 + sin(angle) * r;

Wait until it load…

Version 2

This improved version features an eyelid that automatically closes at random intervals with a smooth easing effect.

  var randomValue = [];

  for (var i = 0; i < 100; i++) {
    randomValue.push(i);
  }
  var number = random(randomValue);

  var speed = 0.05;

  if (number == 5) {
    console.log("this.openEye", this.openEye);
    openEye = 0;
  } else {
    openEye = 300 * speed + openEye * (1.0 - speed);
  }

Shuhao Shang

Contact:

+1 4156589910

shuhaoshang@yahoo.com