Skip to content
No description, website, or topics provided.
JavaScript HTML
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

##3D WebGL Interactive Piano Camilla Tassi, Shaquille Johnson

Our project involves creating an interactive learning tool that allows a user to associate music notation with its corresponding sound, as well as its location on a keyboard. The project includes the creation of a 3D piano keyboard that can be played using computer keyboard keys. Another interactive element is the buttons at the top of the screen outlining a C4 major scale, which can be pressed to hear the sound of the corresponding pitches.


­ Open ‘pianoOne.html’. You can mouse-click each of the 7 buttons up top corresponding to notes of a scale to hear the individual sound/pitches, so a user can learn how a pitch sounds and looks.

­ To animate the piano keys independently of the top buttons, press the keyboard keys

^ [Keyboard controls] (

The black notes in the images correspond to the # keys, such as C#3, etc and can be played/pressed

^ Corresponding piano keys

To adjust the camera view, use the arrow keys (up, down, left, right) and also use mouse­drag to move it as well.

You can’t perform that action at this time.