JS×MIDIキーボードでMIDI情報の表示

概要

　接続したMIDIキーボードのMIDI信号を読み取って、画面に表示する

以前、TouchDesignerで制作したものと比較

メリット
・ソフト共有時の設定が不要
・起動/リロードが早い
・TouchDesignerのライセンス料が不要

デメリット
・ビジュアル面を変更する際、時間が掛かる
・ネット環境が必要

　TouchDesigner/Pythonに慣れてる人やコードが書けない人は、前回の方が扱いやすい。JSもTouch Designerも両方書ける場合は、メリデメ見てそれぞれ使い分けていく方が良い。

システム構成

Web MIDI API
　ブラウザの対応状況はコチラ

MIDI信号
　MIDI信号は3バイトの構成で、以下の内容になっている。これらの情報をもとにグラフィカル面の動作をコーディングしている。

1：ノートオン信号・チャンネル
2 : ノート番号(音の高さ)
3: ベロシティ(音の強弱)

動画