Anam Khan's profile

Screaming Blobs | Creative Code

The Screaming Blobs | Creative Code
Task: Create an interactive project that exists in either a physical environment or on the web. A series of “print” posters that have been created programmatically based on input. Or a physical poster that is manipulated or creates sounds. Any combination of these scenarios is likely acceptable as well.

After being inspired by David Li's work, I decided I wanted to concept an idea of creating 2d characters that a person could control their screaming. The screams would be conveying different types of screaming: happy, sad, laughing out loud, etc. For each scream in use, little blurbs of text will showing up informing on why that emotion/scream is a good thing when it comes to stress relief or overall health. 
Development
Inspiration
I was inspired by these 3D interactive games done by David Li for AdultSwim:
• Blob Opera

• Mouth Choir
• Elastic Man
Project Concept
I would create 4 simplified blob characters that would each have a distinct scream with a blurb of text that would explain why that emotion is completely normal and healthy for you. The interactive element plays in with the way the screams are activated: you control the blobs by moving your wrists horizontally further apart and closer together—this will create the visual of the blobs stretching based on the length between your arms and controlling the sound. The closer together your wrist, the more condensed the blob is and there's less of the scream sound. The farther apart your wrists are, the louder the screams are and the more stretched the blobs become. Blurbs of texts would appear with health facts specific to that sound.

Initial Sketches
Sources/Process
I knew that for my interactive element I wanted the viewer to be the one to control the blob characters and their screams, so I used p5.js Web Editor as my programming and used the posenet model to start off the project:

https://ml5js.org/
https://editor.p5js.org/ml5/sketches/PoseNet_webcam

I created my characters as shapes in editor.p5.js and tested out initial sounds/stretches by using mouseY controls and then moved them into the posenet model. 
Visual Stills
Installation
For the public showing, we programmed it so that it worked with a scroll device that attendees could use to choose their character and activate the screams. They were guided to scroll to their choice of blob, stand against the wall, and close and open their arms to text out the screams.
Here is the finished project adjusted for a web user — follow the instructions to activate the blobs and have them scream.
Interactive Blobs

Installation Video​​​​​​​
Screaming Blobs | Creative Code
Published:

Screaming Blobs | Creative Code

Published: