sketch

```
var radLarge = 37.797;
var radSmall = 20.643;
function setup() {
createCanvas(640, 480);
noStroke();
colorMode(HSB, 480);
}
function draw() {
// color changes as mouse moves in vertical directions
background(mouseY);
//controls the reverse of my mouse movement
var reverseX = width - mouseX
// background circles to create changing backdrop
fill('#71BCFF');
ellipse(320, 240, mouseX, mouseY);
ellipse(480, 240, mouseX, mouseY);
ellipse(150, 240, mouseX, mouseY);
// left larger circles
fill('#E83F63');
ellipse(mouseX, 33, radLarge, radLarge);
ellipse(mouseX, 108, radLarge, radLarge);
ellipse(mouseX, 184, radLarge, radLarge);
ellipse(mouseX, 260, radLarge, radLarge);
ellipse(mouseX, 335, radLarge, radLarge);
ellipse(mouseX, 410, radLarge, radLarge);
// left small circles
fill('#6171E5');
ellipse(mouseX, 449, radSmall, radSmall);
ellipse(mouseX, 373, radSmall, radSmall);
ellipse(mouseX, 298, radSmall, radSmall);
ellipse(mouseX, 222, radSmall, radSmall);
ellipse(mouseX, 146, radSmall, radSmall);
ellipse(mouseX, 70, radSmall, radSmall);
// right large circles
fill('#E83F63');
ellipse(reverseX, 449, radLarge, radLarge);
ellipse(reverseX, 373, radLarge, radLarge);
ellipse(reverseX, 298, radLarge, radLarge);
ellipse(reverseX, 222, radLarge, radLarge);
ellipse(reverseX, 146, radLarge, radLarge);
ellipse(reverseX, 70, radLarge, radLarge);
// right smaller circles
fill('#6171E5');
ellipse(reverseX, 33, radSmall, radSmall);
ellipse(reverseX, 108, radSmall, radSmall);
ellipse(reverseX, 184, radSmall, radSmall);
ellipse(reverseX, 260, radSmall, radSmall);
ellipse(reverseX, 335, radSmall, radSmall);
ellipse(reverseX, 410, radSmall, radSmall);
// far left larger
fill('#E83F63');
ellipse(mouseX - 100, 33, radLarge, radLarge);
ellipse(mouseX - 100, 108, radLarge, radLarge);
ellipse(mouseX - 100, 184, radLarge, radLarge);
ellipse(mouseX - 100, 260, radLarge, radLarge);
ellipse(mouseX - 100, 335, radLarge, radLarge);
ellipse(mouseX - 100, 410, radLarge, radLarge);
ellipse(mouseX - 300, 33, radLarge, radLarge);
ellipse(mouseX - 300, 108, radLarge, radLarge);
ellipse(mouseX - 300, 184, radLarge, radLarge);
ellipse(mouseX - 300, 260, radLarge, radLarge);
ellipse(mouseX - 300, 335, radLarge, radLarge);
ellipse(mouseX - 300, 410, radLarge, radLarge);
// far left smaller
fill('#6171E5');
ellipse(mouseX - 200, 449, radSmall, radSmall);
ellipse(mouseX - 200, 373, radSmall, radSmall);
ellipse(mouseX - 200, 298, radSmall, radSmall);
ellipse(mouseX - 200, 222, radSmall, radSmall);
ellipse(mouseX - 200, 146, radSmall, radSmall);
ellipse(mouseX - 200, 70, radSmall, radSmall);
ellipse(mouseX - 400, 449, radSmall, radSmall);
ellipse(mouseX - 400, 373, radSmall, radSmall);
ellipse(mouseX - 400, 298, radSmall, radSmall);
ellipse(mouseX - 400, 222, radSmall, radSmall);
ellipse(mouseX - 400, 146, radSmall, radSmall);
ellipse(mouseX - 400, 70, radSmall, radSmall);
// far right larger
fill('#E83F63');
ellipse(reverseX + 100, 449, radLarge, radLarge);
ellipse(reverseX + 100, 373, radLarge, radLarge);
ellipse(reverseX + 100, 298, radLarge, radLarge);
ellipse(reverseX + 100, 222, radLarge, radLarge);
ellipse(reverseX + 100, 146, radLarge, radLarge);
ellipse(reverseX + 100, 70, radLarge, radLarge);
ellipse(reverseX + 300, 449, radLarge, radLarge);
ellipse(reverseX + 300, 373, radLarge, radLarge);
ellipse(reverseX + 300, 298, radLarge, radLarge);
ellipse(reverseX + 300, 222, radLarge, radLarge);
ellipse(reverseX + 300, 146, radLarge, radLarge);
ellipse(reverseX + 300, 70, radLarge, radLarge);
// far right smaller
fill('#6171E5');
ellipse(reverseX + 200, 33, radSmall, radSmall);
ellipse(reverseX + 200, 108, radSmall, radSmall);
ellipse(reverseX + 200, 184, radSmall, radSmall);
ellipse(reverseX + 200, 260, radSmall, radSmall);
ellipse(reverseX + 200, 335, radSmall, radSmall);
ellipse(reverseX + 200, 410, radSmall, radSmall);
ellipse(reverseX + 400, 33, radSmall, radSmall);
ellipse(reverseX + 400, 108, radSmall, radSmall);
ellipse(reverseX + 400, 184, radSmall, radSmall);
ellipse(reverseX + 400, 260, radSmall, radSmall);
ellipse(reverseX + 400, 335, radSmall, radSmall);
ellipse(reverseX + 400, 410, radSmall, radSmall);
// more right large
fill('#E83F63');
ellipse(reverseX - 100, 449, radLarge, radLarge);
ellipse(reverseX - 100, 373, radLarge, radLarge);
ellipse(reverseX - 100, 298, radLarge, radLarge);
ellipse(reverseX - 100, 222, radLarge, radLarge);
ellipse(reverseX - 100, 146, radLarge, radLarge);
ellipse(reverseX - 100, 70, radLarge, radLarge);
ellipse(reverseX - 300, 449, radLarge, radLarge);
ellipse(reverseX - 300, 373, radLarge, radLarge);
ellipse(reverseX - 300, 298, radLarge, radLarge);
ellipse(reverseX - 300, 222, radLarge, radLarge);
ellipse(reverseX - 300, 146, radLarge, radLarge);
ellipse(reverseX - 300, 70, radLarge, radLarge);
// more right small
fill('#6171E5');
ellipse(reverseX - 200, 33, radSmall, radSmall);
ellipse(reverseX - 200, 108, radSmall, radSmall);
ellipse(reverseX - 200, 184, radSmall, radSmall);
ellipse(reverseX - 200, 260, radSmall, radSmall);
ellipse(reverseX - 200, 335, radSmall, radSmall);
ellipse(reverseX - 200, 410, radSmall, radSmall);
ellipse(reverseX - 400, 33, radSmall, radSmall);
ellipse(reverseX - 400, 108, radSmall, radSmall);
ellipse(reverseX - 400, 184, radSmall, radSmall);
ellipse(reverseX - 400, 260, radSmall, radSmall);
ellipse(reverseX - 400, 335, radSmall, radSmall);
ellipse(reverseX - 400, 410, radSmall, radSmall);
// more left larger
fill('#E83F63');
ellipse(mouseX + 100, 33, radLarge, radLarge);
ellipse(mouseX + 100, 108, radLarge, radLarge);
ellipse(mouseX + 100, 184, radLarge, radLarge);
ellipse(mouseX + 100, 260, radLarge, radLarge);
ellipse(mouseX + 100, 335, radLarge, radLarge);
ellipse(mouseX + 100, 410, radLarge, radLarge);
ellipse(mouseX + 300, 33, radLarge, radLarge);
ellipse(mouseX + 300, 108, radLarge, radLarge);
ellipse(mouseX + 300, 184, radLarge, radLarge);
ellipse(mouseX + 300, 260, radLarge, radLarge);
ellipse(mouseX + 300, 335, radLarge, radLarge);
ellipse(mouseX + 300, 410, radLarge, radLarge);
// more left smaller
fill('#6171E5');
ellipse(mouseX + 200, 449, radSmall, radSmall);
ellipse(mouseX + 200, 373, radSmall, radSmall);
ellipse(mouseX + 200, 298, radSmall, radSmall);
ellipse(mouseX + 200, 222, radSmall, radSmall);
ellipse(mouseX + 200, 146, radSmall, radSmall);
ellipse(mouseX + 200, 70, radSmall, radSmall);
ellipse(mouseX + 400, 449, radSmall, radSmall);
ellipse(mouseX + 400, 373, radSmall, radSmall);
ellipse(mouseX + 400, 298, radSmall, radSmall);
ellipse(mouseX + 400, 222, radSmall, radSmall);
ellipse(mouseX + 400, 146, radSmall, radSmall);
ellipse(mouseX + 400, 70, radSmall, radSmall);
}
```

For my dynamic drawing I wanted to play with the creation of patterns. As you move the mouse in the x plane you can create different textures by positioning the circles. Additionally, you can use both x and y mouse movements to change the background circles, which I though added a nice element to help create more combinations of the image. This assignment was a little difficult to figure out at first, and I definitely want to keep playing with my code on this image to see what else I could do.