Archive for October, 2016

p5js – 2

We have moved on to combining for loops and arrays in p5js. This is a quick way to multiply a ton of objects and get them animated. I’m kind of understanding the basic idea, but still cannot seem to build out a sketch without referencing a tutorial or help website. Every animation or function has a glitch and executing what I think are simple functions is taking forever right now. Hopefully I get more fluent with practice. My main issue is that I have conflicting for loops, one will not allow the other to run, and I  have no clue how to fix this. I’m also still trying to clarify how to write conditional statements correctly the first time around.

What you see above is a limited version of what I was trying to accomplish, still kind of fun to look at though. The ellipses are bouncing back and forth as they touch the edges of the canvas, changing color depending on which side they bounce off of. I have a couple growing and shrinking rings that mask the snow globe effect to create a little more visual interest. The rings are supposed to be fading in and out, but I can’t get the “if” statement to work as of yet.

I’m hoping to get this syntax down quickly, because I’m thinking of incorporating a looping p5js animation into my final Sonic Arts sound installation. It would be really nice to have a projected dynamic animation accompanying my sound project, so I’m diving into sound interactivity tutorials with Dan Shiffman. Am I going way in over my head? Probably. Right now I’m looking at amplitude analysis so I can make my animations visually react to a soundtrack.

Mario Pong

Click in the window to play. A and Z keys move the left bar up and down.

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.


For my midterm project in Sonic Arts, we were asked to create an audio piece designed for headphone listening, transporting the listener to a different place. Instead of explaining what I was “going for,” I think it’s best to just listen to the track and keep the title in mind. Enjoy!

P.S. – This is best listened to with headphones.

Speculative Fiction – Mind’s Eye

Here’s the final product. Enjoy!

Final Round – Speculative Fiction

After getting some much needed feedback from my class, the video seems to be on the right track but still needs a few adjustments. It’s not until you show a video to people that you realize how LONG scenes can take to resolve, so I am definitely trimming the fat where needed.

A lot of the audio pairing came out well, I have the Operating System making obnoxious error sounds when it starts detecting harmful actions that the user might be taking. Our guest instructor suggested I ramp up the intensity of the conflict between the user and the OS and also establish a deeper familiarity between the two. The closing scene where the OS takes control of the user’s legs needs the same treatment of intensification. I am running short on time for edits, so hopefully most of these enhancements can be made through audio. I wanted to share an AI chatbot video I saw a couple years ago that illustrates how quickly AI can escalate a casual conversation into a full blown metaphysical debate at rapid fire speed. Their logic enables them to draw conclusions immediately, so it’s not far fetched for my video to portray the same level of escalation. I also am incorporating a musical piece I developed in my Sonic Arts class to help build tension in the final scene.

I have some major lighting continuity issues in the last couple of scenes, so I’m using this link for color correction in Adobe Premiere to hammer out some color corrections and balance out the lighting and color differences. Note to self: Don’t shoot the same scene at different times of day, the shadows make a HUGE DIFFERENCE. (งಠ⏠ಠ)ง

I have to admit I’m not entirely happy with the film… I feel like I went overboard with a scripted storyline and find it somewhat predictable (I have watched it about 1000 times now to be fair). I would like to try and take more abstract approaches to future projects and leave more open for interpretation and reflection. My paintings tend to meld the abstract and literal, maybe thats an angle I can take next time.