for this week we are instructed to create a serie of 100 shapes, each of which will have a different position and color. in addition, we should also add a simple interaction of the shapes.
this project contains two parts: creat a function to draw the shape and creat the arrays that contains the informations of its position and color.
for the first part:
i drew a circle with two black arcs and two white triangles, which formed a deadpool logo. the position of the elipse changes according to the array posx and posy. while the color, which i think would be more complicated to change using an array, i changed it while i draw the elipse, adding 1 to the hue value each time i draw a circle.
for the position i creted two arrays that are the x and y position of the shape. and i used nested for loops to assign the positions to the shapes.
for the interactive part i used dist() to measure the distance from the mouse to each center of the circle. if it is larger than the radius then fill white to the circle.
for further improvements there’s certainly more room for more active illustration of the shapes, such as bouncing in the canvas and change direction each time it hits the wall, while each circle have a random initial velocity. and also the interaction part would be more active along with the animation, like reshuffle the whole 100 shapes when clicking or change the circles’ color according to mouse movements…… but the general idea is the same.
the final project:
p.s.: me when professor asked me to do live coding but commented out my codes