Link to my sketch:
Link to my code on Github:
The book

For my computational media final, I created a visual representation of five pages from I Remember by Joe Brainard. I had this idea for quite some time. I studied English in undergrad and dabbled in video production. My last year of college, I wrote a great deal of poetry. In one of my classes, I read this fantastic book. I really enjoy how the author breaks the traditions of a traditional memoir. The repetitive structure works quite well. My favorite parts of the book occur when Brainard drifts from personal anecdotes to macrocosmic concepts. To identify the pages in my book, I reread the material twice. There are so many fantastic lines, a part of me felt tempted to switch passages out for others. In the end, however, I paid careful attention to maintain their order. The strings of memories convey complex engaging emotions. For example, in the pages I chose, Brainard examines birthday parties in several lines. In the other lines, the author moves from these simplistic memories to very deep notions. For example, I love the line “I remember trying to figure things out – (life) – trying to get it all down to something basic – and ending up with nothing. Except a dizzy head.”

I originally intended to connect the lines to a Bing Image Search API. After meeting with Dan Shiffman, I realized this project would be too complex and would not add a great amount of meaning for me. I liked having control over the video clips I found. I incorporated video from the free website Pexel. Not all of the lines fit the material, but I tried my best to recapture these memories. I filmed a couple of lines myself, such as the blackhead and mixing potatoes with beet juice. In total, I have 32 videos. I desired to construct a very long performative experience and blend everything we learned over the course of the semester.

My first version

In my first version, I created one video that overlaps with another. I became very interested in tinting videos in p5.js. The goal of my project is to demonstrate how small memories accumulate to form a person’s identity. I believe humans have difficulty connecting with one another, but on the other hand we all share a universal experience as we grow up and figure out who we are. In draw I created if statements, each representing a different state. The initial state is set to zero. Each state leads to a function that contains the video, volume of the video, tint, and text. Each video loops, which draws on every frame. When developing my sketch, I noticed lag and the error “Element play method raised an error asynchronously” in my console. The video did not play when this occurred, which heavily impeded the user experience.

Blurry version

When I spoke to Allison about removing this error, she mentioned how I should call the video rather than drawing on every frame with .loop(). When I changed this, however, I could not move past three videos. Playing each video slowed my computer down significantly. I’m not sure why drawing on every frame allowed for faster processing. I solved my issues by changing the frameRate to 0.9 and altering my class.

Four blocks
Altering the sizes
Experimenting with tint

I created four equal squares, each a unique color. The user navigates the sketch by pressing the right key with the function keyPressed. I chose to have the user only move forward. Current videos are played with the tint (255,255) and the ones that are underneath are tinted at (255, 70). I only change the alpha. I created a function webcam, which contains a capture that is tinted at (255, 50). The capture served to shape a more immersive environment and represent the formation of the user’s identity. I found my videos to blend well into each other. Previous memories may be identified, but they do not overpower the current videos that are played.

Editing the video
Before I compartmentalized my video
Setting different audio

I would edit each video clip in iMovie. I shortened the clips, exported them at the lowest resolution, and added audio files to them if they did not contain one. Finding the video and audio clips proved to be one of the most time consuming aspects of my project. Each time I loaded a video in the function preload, I hid the video. If I did not complete this step, the video would appear underneath my sketch. I set the volume in my functions to 0.3 or 0.0 depending on their placement. I sought to have the square that is most recently changed to be the loudest. While tinted videos are played in the background, their audio is not played. I constructed an experience in which memories appear to fade away. By creating a different function for each video, I easily changed their volumes and remained organized. The text in my project was very important. I used the font “American Typewriter” because I believed that the style fit well for my project. Most of my text is size 20, but I did resize longer passages. Although I remained organized due to my concise labels, my code ended up being very long and difficult to scroll through.

Experimenting with my for loop in the beginning state

Since I constructed a list of my lines, I decided to add the document to my sketch as a .txt file. The variable that represents this file is allLines. I created a function that contains a for loop along with random colors and placements for the words. Additionally, I created the class strand. The x and y positions of the vectors are random. When the object is drawn at the current x y position, the loop of the array goes through the entire history that is stored as data. By using beginShape and endShape, all of the vertexes of the shape consist of the history of the object. I learned how to draw object trails with Dan Shiffman’s video (9.7). In the attribute show, I picked bright colors. Each time the right key is pressed once the first video is activated, a strand is created. I aimed to construct an abstract version of a memory. Similar to how the object contains a history, the memories in my video are nostalgic and slowly accumulate. They constructed a cerebral tone. In the end of my sketch, the squares are removed and show a black background. The person is formed, but then disappears abruptly. I hope I succeeded in developing a moving abstract performance. At ITP I aspire to focus more on blending code with experimental video and providing unique insights into reading in a meditative manner.