Vem Cantar (“Come Sing”) is a website that incorporates karaoke dynamics to promote interactions between people and their voices in an online environment, making it possible to sing together even if geographically far apart. It it also a tool to draw using the voice, transforming melody the user sings into customized drawings.

Users can watch recordings by other people, and add to them their own layer of voice and drawings. This way, they can visualize not only their own melody individually, but also the relation between different voices and melodies, and the drawings they form together.

As a conclusion, Vem Cantar shapes a network of visual and sound interactions between people, starting with the fun act of singing together.

Esdi, 2013 (Undergraduate Thesis Project)


Noni Geiger

Read full thesis (in Portuguese)

User stories and wireframes

The first step was to define what I wanted the product to do. This may sound simple, but it was actually a time-consuming process of telling stories, defining features and reducing the scope to fit in the time available.

Storyline 1: Priscila (red) enters the website. She finds a song she loves and she starts singing along to it. As she sings, the software makes drawings according the her pitch and volume in a color she choose. She e-mails the recording to Pedro (blue), her best friend, who also likes the song. Pedro opens the message and watches the video. He clickes "sing together" and adds his own layer of voice and drawings, as if he was singing with Priscila.

Storyline 2: Fernanda (purple) enters the website, chooses a song and publishes it openly to the public. Bia (green), one week later, is browsing other people's recordings. She finds Fernanda's recording and sings together. They don't know each other in person, but they sing together to a song they both love.

Drawing Sound

The next challenge was to define how the sound could be translated into image. Obviously, there would be a thousand ways to do it. The way I decided to do this within the scope of the project is: the user could choose a shape and a color. Then, this shape would grow according to how long the user sustained the note. I made some tests mapping two different songs: Because (The Beatles) and Seasons of Love (from the musical Rent, used in the video).

Images: overlapping 3 voices in Because; translating soprano and tenor in Seasons of Love; overlapping 5 voices in Seasons of Love (female soloist, male soloist, soprano, alto and tenor)

Final Layouts

You can see the final layouts here: