ROYGBIV Keys

ROYBGIV Keys
Note on Keyboard
D# Note Played on Keyboard
Chord Played on Keyboard
Chord Played on Keyboard
B Note Played on Keyboard
Reference Page with Reference Guide
Downloadable Reference Sheet

Inspiration

As most of us are musically inclined, we were inspired by the idea of creating a project related to music using our knowledge of computer science. Being familiar with the traditional methods of teaching music, we wanted to add a unique twist which involves associating notes with colors and images to help beginners in music, as well as hearing or visually impaired learners. Synesthesia, the involuntary experiences between senses, is not just a phenomena of our brain, but is prevalent among artists, and has even been touted by composers as essential to their feeling of music.

What it does

There are two main tools. One connects the notes' audio with colors when using the keyboard like a piano. When pressing keys as described by the reference page, the corresponding note letters, along with colors to associate them with, will show on the screen in order. The other connects audio with sheet music notes.

How we built it

The whole project was made with vanilla Javascript, HTML, and CSS. No libraries are involved in the source code. The audio files are sourced from the University of Iowa.

Challenges we ran into

After considering using other libraries or frameworks to code with, we wanted to start with simple enough that it would be easy to build off of. Without any dependencies, there is a decreased risk in our code's usability. Another big limitation of creating a virtual piano is that most commercial keyboards do not support pressing multiple keys at once. This is not something we could get around of, so we had to shift out focus from supporting chords and edge cases as they have decreased relevancy.

Accomplishments that we're proud of

We are proud of being able to brainstorm many separate ideas and consolidate it into one, workable project that we now have a start on. We are also proud that we were able to work with a project that fell under multiple categories, namely accessibility (social good) and music (entertainment).

What we learned

In creating a new application from scratch, we were able to learn a lot about efficiency in both our code and project management. The about 100 lines of code we had originally spent the first few hours on was able to be shortened down to less than 20 using aspects of the language we had not thought of using to our advantage. With the creation of this app, we've also learned how to manage workflow in a group using Git.

What's next for ROYGBIV Keys

Our original intent when coming up with the idea for this project was to provide a free learning platform for learning music. Potential next steps would be to include a lessons platform with guided tutorials on basic music theory and specific songs using the color-to-note associations that our project is meant to ingrain into the learner. We also considered creating a new form of "sheet music" that would incorporate stacked bars of color that would signify the order of notes that should be played to perform a song.