Earlier this year Italian company Kodaly proposed a collaboration. They created the Kibo MIDI controller instrument and I enjoy making web apps for musical use. Together we will explore how the Kibo instrument and online apps can be integrated. As a first experiment I made the Kibo Keyboard app.
Kibo Keyboard app
Kibo Keyboard is a simple musical keyboard. It plays just eight notes because the Kibo instrument has eight pads to play MIDI notes with.
The app plays the notes with an added effect: Each time you trigger a note a small ball launches from the bottom of the screen. The ball bounces around and each time it hits another object it repeats its note, with the sound lowering in volume as the ball slows down. This way the bouncing balls create a random delay effect.
You will notice that the harder you hit a note, the higher it sounds. This is because MIDI velocity is used to determine the note’s octave. The harder you hit, the higher the octave. Visually higher octaves are represented as smaller balls.
Try the demo of the app on its Github page. If you don’t have a Kibo or other MIDI controller handy you can use your computer’s number keys 1 to 8.
Or see it in action with the Kibo instrument here:
The Kibo is a MIDI controller with eight wooden shapes that can be played like drum pads or piano keys. MIDI transmits wireless over Bluetooth LE or wired via a USB cable.
The Kibo’s eight shapes send MIDI notes with pitch values 60, 62, 64, 65, 67, 69, 71 and 72. If you use another MIDI controller be sure to play these notes.
The settings panel shows when the app starts. It can be recalled by clicking the cogwheel icon in the top right corner of the screen.
The panel only has two settings:
- Bluetooth – Click ‘Connect’ to connect to a Bluetooth LE device that transmits MIDI over Bluetooth.
- MIDI – Select a MIDI input from the dropdown.
Chrome is currently the only browser that can run the app. The desktop as well as the mobile Android version of Chrome.
The project is open source under the MIT license. The complete source in on GitHub: https://github.com/hisschemoller/kibo-keyboard