For the first part, I chose to continue working on my code which I wrote in recitation 6. I add some animation as well as mouse interaction into that code. Basically, I want the hexagons rotating, and the gradient color changes as the mouse moves. In order to implement the smooth gradient color effect, I used the function colorMode() to change the original RBG color mode to HSB color mode. With the HSB color mode, I can change the color simply by changing the value of H.
Here is my code:
And here is my final result:
As for the additional homework, I first made a circle that can change its size over time. Then I let the color change as well. Finally, I added keyboard interaction into this code. By pressing the navigation keys, we can change the moving direction of the circle. And when the circle reaches the border of the window, it will bounce back. Here is my code:
And here is the video of the result:
In this recitation, I learned a lot about Processing:
- colorMode(HSB); can make it much easier to draw gradient color
- The math expression 10/3 returns an integer. If I want the result to be a float, I have to use 10/3f
- Math expressions are able to accurately determine how the pattern changes over time