https://github.com/ITPNYU/ICM-2024-Code/wiki/Homework-Mimi-03#week-4
I was really worried about what pattern to make at the beginning. My ability to imagine the composition of graphics was not very good. So I started thinking about concrete graphics. So I made a small pinwheel with 4 semicircles and looped it. In order to enrich the color, I used gradient colors.
During the process, I encountered several problems. When I wanted to add a gradient color to the background, I found that the background() function could not directly apply the gradient color, so I could only use a series of horizontal rect() to simulate the gradient effect from top to bottom.
I set the pinwheel radius to 50, and the center point of the first pinwheel is (50, 50), so the distance between the centers of the two pinwheels is 100.
Then I wanted to add some interaction, because it was a pinwheel, I wanted it to rotate. So I used translate to rotate each pinwheel. When I wanted to use if (mouseMoved), it could not be used in draw().
After checking, I found out that mouseMoved() is an event function that p5.js automatically calls when it detects mouse movement. It can only be called automatically by p5.js after i define it. It is not directly checked like a boolean condition.