Functions + Game
For this project, we were tasked with creating an art inspired game. While I tried to refine my existing platformer demo into a game, collision was difficult and I felt it was better to save that project for when I acquire more skill.
Instead, I settled on a recreation of Pong, but with the visual flair of another Arcade reboot; PacMan: Championship Edition.
The technicolor color-scheme was my first inspiration, and so I gave the paddles and ball an HSB color value that cycles through the available colors.
I also wanted to include some nods to classic Japanese Video-Game tropes, so I included a cat to give the project a bit of that 2007' era internet meme branding, all that’s missing is an actual Nyan Cat.
While you’re unable to see the correct fonts in the Codepen version of my project, the visual UI uses 2 fonts to contrast the basic shapes and game design, with an old-school baseball looking scoring system, as I felt they brought the “rustic yet refined” look of the game together. These a viewable in my actual p5.js document here:
https://editor.p5js.org/Jack__Danis/sketches/ab7OYQ3u8
To create this game, I put essentially split my game into a handful of functions that are all called at draw to handle the entire game. Paddles are drawn directly after the background and have their position change according to inputs on the WASD & Keyboard keys that correspond to each player. The ball is drawn as an ellipse and is simply told to go in a direction and to appropriately react if it overlaps either of the walls on the sides (bounces off) or if it hits one of the paddles (reflects).
I then made a condition that if the ball surpasses the top or bottom area of the screen, a point is given to the corresponding player who scored on their opponent, and if one of those player’s has a score that exceeds their rival by 10, they “win” the game, which reveals a little cat that taunts the losing player while the game continues to run in the background. The cat itself was assembled using a ton of functions that are all called to execute their specific rotations, push/pulls, size changes, and positioning changes, with one function for the eyes, the nose, the mouth, and the ears. Each of which has an assigned fill color in their respective functions.
Overall, I enjoyed this project, and I’ll most likely refine my work by having each paddle create a “splash” effect, by having rectangles of descending visibility exude from the center with the same rainbow stroke effect.