Link to my app
Please provide constructive criticism! This is a work in progress.
I just made this a few days ago on a whim, to try and find a way to explain Western music notes to school children with little to no musical education. This is coded in Processing.js and hosted on my Github page.
This shows all the 12 notes of the Western chromatic scale, and the basic pattern from which all modern musical scales are constructed. Note names in white represent the white keys on a piano, note names in black represent the black keys. (Naturally, I will display it alongside an actual piano keyboard I can demonstrate the notes on)
Use the letter 'v' (visible) to show or hide unused note names. Use the '+' and '-' keys to rotate the note wheel (hold shift at the same time to rotate seven steps at once, simulating the circle of musical fifths). Use the '<' and '>' keys to rotate the pattern on top, which is how musical modes are constructed.
It works on touchscreens too, just touch the corners to rotate the note wheel, and touch the center to show/hide unused notes in a scale. You can click and drag with a mouse as well to rotate the note wheel, and hold shift at the same time to rotate the pattern on top.
I would like to add a feature where I can touch a note name and have it play the sine wave associated with that note, but I have no idea whether it's possible to generate tones in Processing.js ...perhaps one of you with coding experience can help me out here.
Submitted October 15, 2018 at 12:07AM by Boloar https://www.reddit.com/r/Learnmusic/comments/9o90b7/i_made_a_miniappthing_with_the_notes_of_the/?utm_source=ifttt