top of page

Projects

Projects

I created a poll to go after this test with the following questions:
1) Do you know what vocal harmony is? (Yes/No)
2) On a scale of 1 to 5, how much do you now understand harmony? One being not at all, and five being totally got it!
3) Are you confident in finding harmonies on your own after watching this video? (Yes/No)
4) How do you feel about harmony? (I could care less/ It’s really cool!/ I’m used to it)

User Tests

Test 1

I was inspired by Kandinsky and Lupi to create my own representation of data, in this case musical notes. Before I dove into artistic representations of music, I needed to know how much someone can understand about harmonies from a direct visual piece. The purpose of this test is for the viewers to understand what harmony is and how they can follow one.

Tests 2 & 3

For the second and third tests, the audience has to harmonize to the tune of Twinkle, Twinkle, Little Star, using only its first line: “Twinkle, twinkle, little star, how I wonder what you are”. Both tests try to keep someone singing in the harmonic line even when the melodic line is being played. Test #2 asks the audience to focus on a shape while test #3 tells the audience to keep singing in harmony using hand gestures.

When I was making the audio file needed for the two tests, I realized that harmonizing to a song is much more complicated than harmonizing to one note. I sang “Twinkle, twinkle, little star, how I wonder what you are” in the keys of C and E hoping to create a tight harmony (one of the basic types of harmony). When I put the two tracks together, I noticed that tight harmonies only occurred in some points of the song.

This is C & E played separately, then together on the piano.

There are many factors that may have hindered constant harmony. For instance, I may simply not be singing the right note during certain parts of the song. Nevertheless, I decided to stick to one note harmonies, specifically third interval/tight harmonies, for the rest of the project.

Test 2

Test 3

Visual Harmony Hotel

I placed all seven of the Harmony Tools I’ve created inside a prototype game called Visual Harmony Hotel. The point of this game is to clear all 12 floors by harmonizing to the pitch given on each floor.

Harmony Tools

The goal of the Harmony Tools is to engage players through a gaming apparatus. These tools recognize a pitch, just like a pitch tuner would, but they look for the specific pitches that will create third interval harmonies with the note assigned to each tool. Output: twelve Harmony Tools for each note in an octave (starting from middle C).

Harmony Tools preliminary sketches.

Moon Sailing

Watering Plants

Moon Sailing

With this game, I wanted players to earn points whenever they hit the right pitch (in this case E). The problem with this approach is that players have no visual indication of how close they are getting to the right pitch. Other Harmony Tools that fall into this category include Airplane Fans and Climber.

Climber

Airplane Fans

Game Iterations

Most pitch tuners have a point of target in the center and two extremes to right and left or to the top and bottom of the targeted pitch.

Jump Bird Success.

Jump Bird Fail

The Snail and Jumping Bird tools work similar to pitch tuners that have extremes at the top (pitch too high) and bottom (pitch too low) of the targeted pitch. The right pitch for the snail is reached when a player is able to hold the note to stop the platform at the opening. The player’s pitch for the Jumping Bird is indicated by the bird. Players hit the right pitch when they can hold the note to keep the bird inside the jumping rope.

The Snail Success

The Snail Fail

Water Flower 2 Success

Water Flower 2 Fail

Watering Flowers 1 and 2 add more water droplets to the line when players are getting close to the desired pitch. If the pitch is too low, no droplets get added to the line. If the pitch is too high, the droplets fall to the right and disappear. If the pitch is right, the water droplet starts building up in the middle and will fall to water the plant.

What I Learned

  • To spend more time researching and narrowing down the purpose of creating a product. Not knowing how deep the topic of harmony is hindered me from focusing on just a part of it from the get go.

  • Quality (functional product) > quantity. I was too focused on wanting to make 12 Harmony Tools that I failed to give each tool the same amount of thought. In the end, I was only able to make 7 Harmony Tools within the deadline. Furthermore, only 4 out of 7 Harmony Tools were successful as visual cues.

VOICE-ACTIVATED GAME

Visual Harmony

Problem

Harmonization is not a skill that is easily learned. I've been singing for more than a decade and I still have a hard time finding the right note the harmony should be in.

Solution

Visual Harmony aims to measure notes in a different way from the traditional meter interfaces often seen in many pitch tuners. The game itself, Visual Harmony Hotel, teaches players how to harmonize through mini games in which there are visual indicators that tell them if they're singing too high or too low compared to the desired pitch.

View Final Design

Role

UX/UI, illustration, animation, visual design, and web dev

Time

5 months

Team

Personal Project

Year

Jan 2020 - May 2020

Goals

Create a visual cue that would help users memorize how to sing in harmony.

Proposal

Music first started with melodic voices used in the Gregorian chants. It wasn’t until the 16th century that classical Western harmony began to form into what it is today. Harmony, in music, is defined as the sound of two or more notes heard simultaneously. This is similar to playing a chord, three or more pitches heard simultaneously, on a piano or guitar. 

 

Multiple notes playing at once can also be heard in an orchestra, when different instruments play multiple pitches, resulting in the formation of a chord. I intend to dive deeper into how notes come together as a harmonic chord using the human voice as my medium.

 

I was able to memorize numerous chords after recognizing the visual patterns that I saw while playing the piano. When I tried to follow the same method with singing, I found myself having greater difficulty. Singers often have to rely on their ears and muscle memories in order to harmonize to a certain note.

Research

Vocal Harmony

First, I had to learn how to produce a vocal harmony. There are two parts to a song, chords and a melody. The notes that make up the melody usually come from the notes within the accompanied chord.

To sing in vocal harmony, one must choose from the remaining notes in the chord that are not already taken by the melody. A commonly used interval is called the third interval, which denotes a note that is two whole steps/four half steps higher than the note of the melody. The C Major scale consists of C, D, E, F, G, A, B, C. If the melodic note is a C, then its third interval is the E.

This is C & E played separately, then together on the piano.

This is C & E sung separately, then together.

Music in Art

The next thing I explored is musical interpretation in art. I took a deep dive into Kandinsky’s Composition series and Giorgia Lupi’s work in the area of information design. Kandinsky’s paintings are very emotive and they often generate a rollercoaster of emotions. Because I needed to create a visual cue that is direct and not open to interpretation, I took more inspiration from Kandinsky’s ‘calmer’ paintings, Dominant Curve and Composition IX. These two paintings are made up of shapes that are clearly separated from one another.

Dominant Curve, Wassily Kandinsky, 1936. Oil on Canvas.

Composition IX, Wassily Kandinsky, 1936. Oil on Canvas.

To Giorgia Lupi, data is human. She once said, “Data are always just a tool we use to represent reality, they’re always a placeholder for something else, but they’re never the real thing.” I’m mesmerized by how Lupi approaches information design and data in such a humane way.

Dear Data (left) was a year-long, analog data drawing project by Stefanie Posavec and Giorgia Lupi. Each week, for a year, they collected and measured a particular type of data about their lives, used this data to make a drawing on a postcard, and then sent it to each other.

Bruises: The Data We Don’t See (right) is a collaboration between Giorgia Lupi and Kaki King, which captures the impact an illness of a child has on King’s family. Kaki performed her score of music with Lupi’s work animated in the background. You can experience their work here.

Bruises: The Data We Don’t See (above) is a collaboration between Giorgia Lupi and Kaki King, which captures the impact an illness of a child has on King’s family. Kaki performed her score of music with Lupi’s work animated in the background. You can experience their work here.

Dear Data (above) was a year-long, analog data drawing project by Stefanie Posavec and Giorgia Lupi. Each week, for a year, they collected and measured a particular type of data about their lives, used this data to make a drawing on a postcard, and then sent it to each other.

bottom of page