Make triangles that appear when clicking the mouse and let them rotate and move. To make the movement look natural, apply vector with position, velocity, and acceleration through adding acceleration to velocity and adding velocity to position in the update() function. Use “this.acc.mult(x);” to control how fast/slow the triangles move.
Add a change() function to make the triangles bounce back once they touch the four edges of the canvas and also change their colors. To make them bounce back naturally, multiply the velocity by -1.
Create another class that draws the bubbles that also appear when pressing the mouse similar to that of the triangles.
Add a change() function to the bubbles, too. It makes the bubbles bounce back once they touch the edges of the canvas(in the same way as the triangles, multiplying the velocity by -1) and also changes the color as well as the opacity and size(through changing the scale) of the bubbles.
Limit the number of triangles and bubbles to reduce burden and improve visual effect by adjusting sizes and making the canvas full-screen. (The inconsistency in the video is caused by screen-recording)