HAPPY PLACE creates a virtual space that allows the user to jump out of their seat and move to the music that plays. Having interpreted the outline as four studies that take place simultaneously within one sketch – each individual study responds to an action that works collaboratively to finally produce a drawing or expression that illustrates the user’s movement. Focusing on the emotion of ‘happiness’, the project aims to create a fun and carefree atmosphere through the use of music, movement and colour. As the user engages with the sketch, they are able to switch on and off the music, adjust the volume, change the background colour and draw on the canvas with their body.

One of the hardest parts of this project was just being able to start. As a beginner in p5.js, having to incorporate poseNet to the project was both intimidating, and at times frustrating – especially when it caused unidentifiable errors. However, the process of writing a line of code, testing it out and debugging was helpful in understanding the language and how it works, and was beyond satisfying when the action and response actually worked. Though my code may be fairly simplistic, I wanted to primarily focus on understanding how the code works rather than trying out complicated techniques; and was happy to see that even still, I was able to produce studies that contributed towards my concept.

Links:  Collaborative Sketch Present Link   &   Collaborative Sketch Edit Link

Click One: Change Background Colour

As the beginning step that sets the atmosphere of the collaborative sketch, the first click option asks users to choose their favourite colour as the background. To do so, the user lifts their left wrist to the top-left corner of the sketch, which creates a series of randomized colours that the user can choose from as their new background. Following the theme of movement, the action of lifting the wrist or ‘clicking’ the randomize button emulates the disco dance move ‘The Point’ wherein the user demonstrates a similar motion to start and stop the background colour changes.

Links: Click One Video   &   Click One Present Link   &   Click One Edit Link


Click Two: Turn On & Off Music

Click Two allows the user to turn on the song ‘Good Day’[1] when their left elbow is in the bottom-half of the canvas, and turns it off when it’s in the top-half. The challenge, given the elbow’s natural position, is that the music plays by default, but seeing as the music would stop playing once the elbow moved, it seemed like the best option. Going forward, I would want to test out other methods to keep the music playing without needing the user to be in a specific position at all times, thus functioning like a proper switch.

Links:  Click Two Video   &   Click Two Present Link   &   Click Two Edit Link


Scroll One: Adjust Music Volume

Following Click Two, this first scroll option serves as the next step in being able to control the volume of the music that is being played. Following the right and left shoulder positions, the volume decreases to a value of 0.2, and increases to a value of 1. This scroll action acts as an equivalent to a volume slider that you would find on a computer, and works in promoting movement by the user by allowing them to play with the sounds that are created.

Links:  Scroll One Video   &   Scroll One Present Link   &   Scroll One Edit Link



Scroll Two: Draw on Canvas

Sound can be one of the strongest links to memory and emotion. In choosing a song that produces a fun and lighthearted atmosphere, the user is able to move freely and dance to the music. Tracking the nose position, this scroll function results in a line that is drawn in randomized colours to follow the movement of your body. Thus, as the user moves around the canvas, the result of their motion creates a unique piece of art. This works in conjunction with the first scroll option wherein playing around with the volume results in changes in the artwork too.

Links:  Scroll Two Video   &   Scroll Two Present Link   &   Scroll Two Edit Link


[1] Good Day by Greg Street ft. Nappy Roots: https://www.youtube.com/watch?v=hjPLkPsLxc4&ab_channel=GregStreetVEVO