Esteban Manchado Velázquez
Add an animation when playing from the keyboard
When playing the keys with the mouse, there's the feedback from pressing the "button". However, there was no feedback when playing from the keyboard, which is more important because it's not evident which note is being played. Hence, add a 300ms animation when playing from the keyboard, so it's clear what is happening.
|1 year ago|
|lib||4 years ago|
|public||1 year ago|
|src||1 year ago|
|test||4 years ago|
|.gitignore||4 years ago|
|README.md||4 years ago|
|package.json||1 year ago|
This is a small piano that can be used to learn and explore basic music theory. All keys have their note names, and you can select scales and chords and see how they look (and sound!) on the piano. You will also see which chords fit in the scale, and have the chance to easily play them and experiment with them.
If you want to see it in action, go to:
Having learned a bit of guitar, music theory felt disconnected from the instrument and hard to relate to. However, seeing the scales and chords on a piano made everything click and make sense. This is a humble attempt to help other people learn the basics of music theory in a visual way, with an interactive piano. It might also be useful for inspiration and maybe even to help write some songs.
Technically, it's a small experiment to learn React, more EcmaScript 6, and a bit more music theory. The HTML and CSS was shamelessly stolen from http://codepen.io/garypaul/pen/jgKqc.