The Unit Circle

The Unit Circle is a circle with a radius of 1. The unit circle identifies coordinates by using the angles of sine, cosine, and tangent. The image below is an example of the unit circle:


The sine of an angle in a video game tells us that the motion is changing for y axis. So this means that an object when in motion is changing by the y axis.

The cosine of an angle in a video game tells us that the motion is changing for the x axis.



The sine and cosine of an angle helps give the coordinates of an image because they give where the x and y coordinates are.


DEVELOP: buttonFly.pde

a typed out explanation (or guess) of why the movement code needs to be so complicated

In version 4 of my program I added the image movement code by pressing the key “b” – (the movement code is highlighted in yellow):

Screen Shot 2017-11-03 at 12.16.47 PM

Screen Shot 2017-11-03 at 12.17.59 PM

Screen Shot 2017-11-03 at 12.18.27 PM

The reason why the movement code is so complicated because the x and y movement are different. The cosine is how the x motion changed and the sine of y is how the y motion is changed. The spiral now accelerates and moves across the window where it does not come back on the screen.

In version 5 the spiral teleports to the other edge of the screen when it disappears of the screen.

Screen Shot 2017-11-03 at 12.28.30 PM.png

The code highlighted shows how the spiral is able to transport to different edges of the screen when it goes off the screen.

DESIGN: buttonFly.pde

Rotation for an image needs the following code that is highlighted in yellow:

Screen Shot 2017-11-03 at 12.07.26 PM

Since there is no keyReleased code the rotation on the spirals is going to continue until the game is not running anymore. In the next version (03) I added the keyReleased which stops the rotation if the key is no longer being pressed.

Screen Shot 2017-11-03 at 12.12.20 PM.png


DELIVER: myGame.pde

To finish off my game I had to create different speeds for my squares.

The middle square – which is controlled by the users click of the control button, moves faster than the right and left squares.

Screen Shot 2017-10-11 at 4.33.05 PM

The left square – chases the middle square at a slower speed than the middle and right square.

Screen Shot 2017-10-11 at 4.33.34 PM

The right square – chases the middle square at a faster speed than the left square but slower than the middle square.

Screen Shot 2017-10-11 at 4.34.06 PM

In order to not have my squares get stuck on top of each other I had to set a timer which starts off the squares at different times.

Screen Shot 2017-10-11 at 4.22.36 PM┬áThe slow square is the left square. Here is the code that I used to chase the middle square. The timer sets off the square to move, this time period gives the user some time to move the middle square and give it a “head start”.

For the right square I did the same thing but changed the starting time higher than the left square.

Screen Shot 2017-10-11 at 4.31.38 PM

The Final game looks something like this.

Screen Shot 2017-10-11 at 4.36.31 PM