Musical Controller – Make Music In Your Browser

            I’ve had the idea of being able to make music with a game controller for a while now. In fact, I’ve made several versions of this very idea, testing different control schemes and adding features to make it something not unlike a real instrument. The controller can play 27 unique notes or more than 2 octaves, a wide enough range to play lots of music. Master the controller with the 8 lessons in the game and play to your heart’s content!

            To play, just plug in a controller to your computer and try pressing some buttons. The controller on the title screen should react to what you press.

            Try playing along to music, it’s fun to try and harmonize. I spent half the development time “testing” it in this way

            Have fun!

How It Was Made

            The Musical Controller has gone through many iterations. At the very beginning, it could only play 8 notes in the C-Major scale; one for each direction and diagonal on the Left Control Stick. After being dissatisfied with how difficult is was to consistently play a note on the diagonal and with how few notes you could play, I thought up the string system in the game now which uses the back left buttons.

            You hold a combination of L1 and L2 to choose between 4 strings while pointing the Left Stick in one of up, down, left, and right to play a note on that string, thus giving access to 16 notes. I decided that the default string when neither L1 nor L2 are pressed should be a C-String and L2 only should be the G-String above that making it easy to play a C-Major scale. I also made the back right buttons apply a sharp and flat so that players could reach the notes outside the C-Major Scale, bringing the grand total number of playable notes to 27.

            But there was one more problem. It was practically impossible to switch notes smoothly. If you wanted to go from F on the C-String to G on the G-String, unless you changed both the direction of the Left-Stick and started holding L2 on the exact same frame, then you would accidentally play an unwanted note. To solve this, I added something called pitchChangeDelay.

            pitchChangeDelay is the time between the player changing notes, and the output sound reacting to that change. By default it is only 0.05 seconds, but this makes all the difference. It is much easier to change 2 things within 0.05 seconds than within 1 frame which is about 0.015 seconds. It does put a limit on how quickly you can play, but the value can be changed in the game. Newer players may find it easier to have a higher value to make switching strings smoothly easier.

            The logic behind how the program creates and plays each note is also pretty interesting. You can read more about it here

1 thought on “Musical Controller – Make Music In Your Browser”

  1. Pingback: Squarb Stack: How it was Made - Mowin People Games

Leave a Comment

Scroll to Top