https://github.com/bytehamster/webmidi-demo
Demo application that showcases webmidi in a fun way
https://github.com/bytehamster/webmidi-demo
Last synced: 3 months ago
JSON representation
Demo application that showcases webmidi in a fun way
- Host: GitHub
- URL: https://github.com/bytehamster/webmidi-demo
- Owner: ByteHamster
- Created: 2020-10-01T12:26:12.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2020-10-01T12:41:40.000Z (over 5 years ago)
- Last Synced: 2025-09-09T20:56:29.300Z (7 months ago)
- Language: HTML
- Size: 88.9 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# WebMIDI demo
This demo is inspired by piano tutorial videos where the notes slowly move down the screen. You can find examples for this on the [Rousseau channel on YouTube](https://www.youtube.com/watch?v=PaXKf0JEzEA). I was basically looking for the reverse effect where the song is not known in advance. I wanted to play piano and whatever note I played should appear on the screen and move upwards.
For this, I made a little WebMIDI application. It should work with USB midi keyboards and was tested in Chrome.
You can **[test this demo online](https://htmlpreview.github.io/?https://github.com/ByteHamster/webmidi-demo/blob/master/webmidi.html)**, directly in your web browser. If you do not have a midi keyboard at hand, you can also use the number keys of your PC (though, those have some glitches that do not happen with a real midi keyboard).
