In-class exercise:
In this class, I made a sequence of circles. By pressing the left and right key, those circles will rotate at a different speed so that we will see a beautiful pattern on the screen. After the slowest circle completes one revolution, all the circles will overlap again, which is amazing to me.
Besides the basic functions we covered in lectures like for loop and keyPressed(), I also used:
translate(x, y) rotate(angle) |
Since the default rotation center is at (0,0), so I need to use translate( width/2, height/2) so that the circles will rotate around the center of the canvas. Initially, I created a triangle. I let it move horizontally while rotate around its own center at the same time. But I found that once a new rotation center is defined, it can not be changed. I think that’s the main reason why my initial code is problematic.
Code: https://github.com/yy2552/Anica-Yao/blob/master/rotatecircle/rotatecircle.pde
Final creation video:
Screen Recording 2019-11-05 at 1.06.11 PM
Final creation screenshot:
Given the time constraint in class, now I think It needs further improvements. For example, the codes in my for loop are too long. According to what we’ve covered in today’s class, for this kind of repetitive code, I may create a function and move them into it. Or I can create another for loop inside the loop.
Additional homework:
Basically, the circle follows my keyboard’s arrow. When it touches the edge of the canvas it will stop.
What I found difficult in this homework is that (1) It expands and contracts at changing speed. The radius x and speed d are correlated. (2) The color changes gradually and slowly.
During the process, I learned how to use colorMode() to change RGB to HBD, and how to make the circle expand and contract using if statement. In this case, I only need to limit the range of x value. As for the change of color, simply putting random(x,y,z) only changes the color rigidly. But when I made one parameter change according to the x value it finally works as expected.
Code:
Final creation video:
Screen Recording 2019-11-05 at 7.52.13 PM