function setup() {
createCanvas(480, 480);
frameRate(30);
textAlign(CENTER);
textSize(60);
}
function draw() {
background(0);
curves();
smile();
}
function curves() {
var cx = width / 2; //center of width
var cy = height / 2; //center of height
var t = 400; //iteration count
var mx = map(min(mouseX, width), 0, width, 2, 5); //x position of mouse map
var my = map(min(mouseY, height), 0, height, 2, 5); //y pos. of mouse mapped
strokeWeight(1);
for (i = 0; i < t; i ++) {
var col = map(i, 0, t, 0, 255);
//logarithmic spiral
var x = (t - i) * cos(radians(i * mx));
var y = (t - i) * sin(radians(i * my));
fill(col);
stroke(255 - col, 200);
//make a quadrilateral with vertices at 4 spirals in the corners
quad(x + width / 4, y + height / 4,
x + 3 * width / 4, y + height / 4,
x + 3 * width / 4, y + 3 * height / 4,
x + width / 4, y + 3 * height / 4);
}
}
function smile() {
var cx = width / 2; //center of width
var cy = height / 2; //center of height
var md = map(min(dist(mouseX, mouseY, cx, cy), 340), 0, 200, 15, -15);
stroke(0);
strokeWeight(3);
noFill();
//emoji like eyes, uses actual font, changes if mouse is in face
if (mouseX > width / 4 & mouseX < 3 * width / 4 &&
mouseY > height / 4 && mouseY < 3 * height / 4) {
text("> <", cx, cy - 5);
} else {
text("| |", cx, cy - 5);
}
//smile, changes size with distance of mouse to center beacuse of var "md"
arc(cx, cy + 30, 50 + (md / 3), 80 + md, 0, PI, CHORD);
}
Hee hee, this was fun. I used a parametric form of a logarithmic spiral as the base of this program. I then wanted to experiment with connecting points from different spirals together (in this case, I had 1 spiral in each corner). I figured a good way to introduce mouseX and mouseY would be to have them affect the period of revolution (with mouseX affecting the x-position and mouseY affecting the y-position). I thought the movement looked kinda like a snake, and since the center square was pretty barren, I decided to anthropomorphize the curve with a emoji-like smily face.
Initial logarithmic spiral (not really visible)