Assistive music application for guitar and piano players to translate between instruments and explore chords and keys.
You can input a chord on either instrument and it will be translated to the other instrument to efficiently see how to play it.
Select any combination of notes, and click the play button to hear them. You can play all the notes at once, or arpeggiated.
Choose from all 12 major keys, and see the chords within them. Also choose additional types like 7th, suspended, etc.
When you have selected a key, it will tell you all of the chords. Additionally, it will tell you which degree of the scale each note is associated with, and will be colour coded accordingly.
A lot of musicians, particularly guitar players, are lacking in musical theory knowledge. A lack of understanding makes it challenging to translate what you are playing to other instruments, or other musicians.
Many people learn in different ways. If you are learning guitar or piano by reading music, you must learn how to read the notation, interpret it, and understand how it relates to your instrument. For standard notation, there is no visual correlation that shows you where certain notes or chords are on your instrument. That is a skill that has to be learned through repetition.
Translating between guitar and piano can be quite daunting if you are not familiar with both instruments. Each note on the piano only exists once, however, on the guitar, majority of the notes are repeated in multiple positions, and the pitch difference between strings is irregular and can be changed. This difference in functionality between instruments makes it challenging to translate between instruments.
It is laid out sequentially, and spans the frequency range of almost every other instrument.
It is invaluable for all musicians to learn how to play piano even moderately well. It is a great tool to organize and arrange your compositions.
Want to learn more about their instrument through exploring new keys and chords.
Want to take the chord progressions they are playing on one instrument, and translate it to another, or to other musicians.
In 2018, a minimal version of this prototype was created shared with Reddit. It received a lot of comments and positive feedback about how useful people found it, but they would’ve liked it to have more functionality.
After building the application in Swift, another survey was created and shared through the same reddit avenues, and also my personal network of musicians.
The survey explained several of the features of the application and showed examples of what they would look like while being used. Participants were asked to rate how useful they would find the individual features, as well as the overall application based on a 5 point Likert scale.
Overall, out of the 45 participants that took the survey, 85% state that they would find the app useful. This proved to be enough of a sample size to show that there was still a demographic of people that wanted this and would find it useful.
I built these 12 individual charts for each major key. This was the initial attempt for me to visualize this information. At this stage, I was creating this for myself, and hadn’t though about the fact that other people might want it.
I decided to create a large poster with all 12 of the individual keys I made, and 1 master chart in the center. I put this big poster above my piano as a reference as I was learning piano.
I manually created those charts in Illustrator which took a lot of time. They were great for getting my idea together, but this prototype was my first step into trying to make this idea more interactive and allow for more freedom and flexibility for the person using it.
At this point, I had gained a lot of experience with Adobe XD. I took my previous Processing prototype framework, and began exploring different features as well as different ways of organizing and displaying this information.
I tested this prototype with 5 users, and although it was well understood, it was limited in its ability to adequately represent what the full application would do. So, I needed to build the real prototype next!
I debated using MAX, or making a web app, but eventually decided to use Swift despite never using it before. There were a lot of challenges that I faced but it was great working in an environment that affords the opportunity to build anything you can think of.
This was the prototype that was used for the next round of testing. It was great to get some of the core functionality working like choosing chords and keys, as well as selecting individual notes on the instruments.
Overall, the prototype was well understood, however there were some great points of feedback used to improve the next iteration.
Some of the participants mentioned that it was difficult to tell which fret was which at a quick glance. So, the individual notes were separated into smaller boxes, also, horizontal strings were added as well as vertical fret grooves. After testing this version, participants found it much easier to understand which fret was where.
The colour scheme was lightened from a dark to a lighter one. Participants were having a difficult time discerning between notes that were active and notes that were not. Additionally, colour was removed from the active notes by making them gray and to only put prominence on notes that are actively selected.
Initially, colour was used to convey octaves. Two different participants mentioned how it would be useful to see the degrees of the scale in a key, and potentially have colour signify those degrees. The colours were modified to have a rainbow spectrum of colour to show each degree.
This was always the plan from the beginning, but it proved to be more challenging than anticipated. The way that chords were stored had to be re-structured. Previously, an array was used in each Key class that held the 7 main chords in the key. However, this proved ineffective as there are obviously more than 7 chords in a key. So, a master dictionary was created that held all the chords, and instead, that was used as a reference for all chords.