Tag Archives: circular motion

Black & White Exercise #1: Circular Motion

For the first lab I wanted to keep things simple using the circular motion code. My idea for my game was to have a bunch of rotating circles across the middle of the screen constantly rotating. Then by pressing on the screen you would change the color of the background from black to white. It took me a while to get this part down and at this point it isn’t really a game, but just sort of an interactive graphic. If I were to go back to it I would probably add a third element of the circles changing color and depending on the color, you would have to change the background to that color. I could see this working really well with more colors although thinking about it, the circular motion part of the game is really not necessary at all and purely just an aesthetic thing rather than a functionality thing. The first Image is the base of the program where the circles move in the middle of the screen and the second image is when you press the screen and the background turns white while the circles stay moving. ab The next step for this exercise if I wanted to keep moving forward would be to make a Simon Says Game out of this. Where the circles change colors and around the border of the screen there would be different colored shapes you would have to match up with the moving circles  

Black & White Exercise #1: Pentagon

I had trouble deciding what I wanted to create after being given this prompt, because there were so many options. I decided to create “Pentagon,” a game in which a player used objects to move other objects. Screen Shot 2014-11-03 at 8.35.55 AM My game starts with five circles (in my class, I named them Ron, Hermione, Hagrid, Sirius, and Lupin) stacked on top of one another. If the player touches any of the circles, the screen pulses black and white. Touching Ron causes Hermione to move, while touching Hermione causes Hagrid to move, while touching Hagrid causes Sirius to move, and so on. The goal of Pentagon is to create the titular shape by touching circles until they line up to form the point of a pentagon, like so: Screen Shot 2014-11-03 at 8.45.06 AM This goal is simple, so I decided to make the screen pulse black and white when any circle is being touched to make the pentagon harder to form (and hence why the pentagon in the picture isn’t perfect.) Pentagon isn’t finished yet; I still want to add a win state. Right now, I’m trying to figure out how to trigger a win state when the circles line up with specific pentagonal points on the screen, but I’m having trouble making the tablet differentiate between a circle passing a point briefly (which shouldn’t trigger the win state) and a circle actually being stopped on a point. -Annie

Black & White Exercise #1: Symmetry

  sketch1 Symmetry is a grayscale game that incorporates four circles. Using sinusoidal movement they gradually move up and down the screen. As they move, the circles strobe, increasing and decreasing their radius. The goal is to tap the screen when the circles are aligned. If the player is quick and accurate then the colors invert. It is a very simple game but does include some elements of skill while providing an interesting visual effect.

Inverted colors following winstate.


Almost symmetrical

Design elements; When designing the game I looked at playing with inversion and then with this idea in mind added a game to that singular mechanic. The strobe effect is not solely for visual effect. It obfuscates the actual position of the circles and creates greater difficulty for the player. Initially the strobe effect was too fast and I was forced to decrease the framerate to only 30 fps. In future the game could include diagonal alignment so as to increase player choice.

Black & White Exercise #1: Chasing 88/Reverse

Screenshot_2014-10-26-17-55-01 Chasing88 (or Reverse) is a black and white game based on the idea of clockwise/counterclockwise motion. The interface is consists of four moving circles. All of them are doing clockwise circular motion at different speeds; therefore if left alone, they would eventually run into each other, which will cause a reset of the game. In order to reach the goal (draw an “88” on the screen), the player can tap the circle to change the moving direction to counterclockwise. While the moving direction changes, the speed of the circle will also change, so the right timing is the key of successful game play.  

game begins as:


Completing the track


“88” is created:

      Screenshot_2014-10-26-17-55-56     When the track is completed, the circles will not stop moving, so the goal become to maintain the “88” for as long as possible. In term of design, the background command is placed in the “setup” function instead of the “draw” function, so circles are drawn on top of each other, and thus forming the grey tracks that look three dimensional.  Because of the same reason, these tracks also have different shades when the moving direction changes. A list of things to be added:
  • A timer on screen to count how long a player can maintain the goal
  • New levels adding difficulty(for example, instead of forming the whole track, set some area as forbidden zone, if a circle moves in, the game would reset )
  • title page/sound/ other shapes