Generative Journal

CREATIVE BRIEF

Generative Art

“Using p5.js, students will program a generative design that employs functions, loops, and conditionals. Designs must also incorporate an element of randomness or chance in their code. Students will work to embed this design within a separate website that also incorporates designed and user-interactive elements.”

INSPIRATION

In Rainbows

I was interested in creating a program with some degree of interactivity. As I have often done in this class, I looked to music for inspiration. The cover to Radiohead's In Rainbows, created by Stanley Donwood, piqued my interest, and made me think about how words can overlay with visuals.

Thus, when creating my generative art piece, I sought to dynamically create a sort of colorful picture with text overlayed. I even used the same font, Transport, to call back more directly to this piece.

P5.JS PROGRAM

Generative Keypresses

To begin, the page suggests that it is an empty space for one's thoughts. No indication of interactivity is given, so the piece is unveiled only to the curious visitor who tries to start typing. Typing a consonant will create red, green, or blue circles; typing a vowel will create cyan, magenta, or yellow circles; typing anything else creates a black or white rectangle or triangle.

As for the themes of the piece - the contemplative text suggests a journaling environment, which is why I named the piece ‘Generative Journal,’ but really, anything can be typed.

In the video to the right, I am typing the lyrics to “Nude” from In Rainbows, which contains the phrase “Paint yourself white / and fill up with noise.” These lyrics, which I found only after completing this project, felt relevant to what I had created: Despite starting with a blank canvas, one eventually fills with noise, which can obscure and confuse our thoughts and words.