Programming in p5.js

Preview of Mario Pong, built in p5.js

 


We have moved on from video production to programming in p5.js, and I’m super excited about diving into this subject. After a couple of assignments on just sketching some objects in p5, we have moved on to working with interactive features. We built a basic game of pong in class and the goal now is to modify the game to have it’s own custom theme. I chose Mario Bros as my backdrop, turned the paddles into some bricks and substituted the pong ball for a turtle shell.

To make the paddles (bricks) bounce the ball, parameters are set on either side of the paddle. While this makes sense, I cant seem to figure out how to set parameters around the other objects in the field of play (the ? boxes, brick, and pipe in the lower right). I want the turtle shell to bounce off these objects, but no luck setting parameters around these objects as of yet…

I also want to include the classic Mario Bros. soundtrack, so I’ve been doing a string of sound tutorials from Daniel Shiffman to cue some music as well as sound effects when the shell hits the paddles (going to use the CHA-CHING noise when Mario hits the ? box with his head). So far I have the soundtrack working with a play/pause button, but still working on the cued sound effects.

My biggest hangup with programming is the compounding math that is involved in functions. It’s not difficult math, it’s just that numbers scramble my brain and slow me WAY down when critical thinking is at play. However, I’m already noticing that the more I tinker in p5, the more intuitive it becomes and the quicker I can pick up on concepts.

Leave a comment

Your email address will not be published. Required fields are marked *