function setup() {
createCanvas(windowWidth, windowHeight);
background(60);
}
function draw() {
fill(50);
rect(0,0,windowWidth,windowHeight);
// for(var j = 0; j < windowHeight ; j=j+20){
for(var i = 0; i < windowWidth; i=i+10){
from = color(200, 200, 32);
to = color(72, 61, 200);
for(var i=0; i < windowWidth; i++){
var lerp = map(i, 0, windowWidth, 0, 1);
stroke(lerpColor(from, to, lerp));
line(0+mouseX,i+mouseY,i+cos(radians((i*5)%360))+50, windowHeight/2+sin(radians((i*5)%360))*5);
}
}
}
function windowResized() {
resizeCanvas(windowWidth, windowHeight);
}
This sketch explores using strings to create a gradient curtain on a sine wave. I liked creating this simple interaction where it felt like I was pulling back a sheer curtain of individual lines.