In this recitation, I wanted to use processing with my project in the last recitation.
Image from last recitation
There was a pink circle in my last project that is the only round object on the canvas, and it looked like it does not belong. In the beginning, I wanted to have the mouse touch the dot and the dot disappears. Later, I decided that make the circle changes color when the mouse touches it.
Based on my older codes, I added a float value=0, and changed the first number in “fill” to “value”. I added a “void mouseMoved” function, so Processing knows that it should follow the position of my mouse. In mouseMoved, I defined the position of the circle with ” float d = dist(280, 180, mouseX,mouseY)”, and used an if statement to change the outputs of the movement.
We also needed to create a moving circle that changes color smoothly and moves according to keys on the keyboard. To startoff, I had trouble figuring out how to make the circle expand and contrast periodically. After setting up the background color and canvas size, I added a keyPressed to put in a keyCode for the four directions. In the setting up the ellipse, the two position variables have “—“, or “++” to indicate the direction the circle would go on the x and y coordinates according to arrow keys. After getting help, I understood that I need to add a condition with a if statement to the code so that when the circle has expanded or contrasted to the size I wanted it to be, it would automatically change the direction of its movement. The last part is to have the circle change color smoothly. I set the colorMode to HSB and changed the first color of the stroke to a variable a. In this practice I used the HSB color mode, keyPressed with keyCode to indicate which key I am pressing, and if statement to constantly change the color.
