You will want to Enable JavaScript while exploring this website.

Because most of the projects I create are interactive, JavaScript is essential for experiencing my work.

Shake a Sound


Shake a Sound is an interactive exhibit prototype designed for the Brooklyn Academy of Music's Teknopolis. The goal of this project was to create an installation that lets the visitors feel as if they are performing. Using web sockets, I created a web app that establishes a mobile connection between visitors, allowing them to play music together. When visitors open Shake a Sound, they are prompted to choose an instrument. After choosing an instrument, visitors can play notes and chords by shaking their phone. Everyone using the web app is able to hear everyone else playing through the speaker of their phone, therefore creating a digital musical ensemble. As visitors walk around Teknopolis, everyone has an insturment in their hand, contributing their own sounds and rhythms to the music around them.

Skills Demonstrated:

Live Web Development, Mobile Development, Mobile Design, Interaction Design

Technology Used:

HTML, CSS, JavaScript, Node.js, Socket.io, Sketch

Process


The Brooklyn Academy of Music specifically asked for a solution to keep children of varying ages entertained during Teknopolis. I gave myself three focus areas to keep in mind while designing Shake a Sound; first, the visitors should feel like they are performing, second, children should be engaged from the moment that they walk through the door, and third, a sense of community should be built among all visitors, rather than having visitors divided by separate exhibits. Because I was taking a course in live web applications, I realized that I could use web sockets to create an exhibit that connects visitors and builds a sense of community. After observing children playing games on their mobile devices, I thought about shaking the phone as a way of turning the phone into an instrument. I created mockups and user case scenarios, such as a young boy at the age of 10 that is bored at Teknopolis. Instead of playing Candy Crush, he is having a great time playing Shake a Sound.

As soon as I had my concept down and initial research questions answered, I began designing what the user interface should look like and started developing a web socket connection. The user interface of this project was inspired by the changing background color that I had created to test the web socket connection. In the beginning stages of development, I tested the web socket connection by programing the app to change the background color of each screen at random when the phone shakes. Later, I decided to include the visual cue that the changing background gave users by tying each sound to a specific color. I designed the user interface to not take away from the changing background when the phone shakes, but to add to it.

Designed and developed by Steven Simon 2018