MIDI モニター
Web MIDIアプリケーション
更新情報
July.26,2026
ペクトラムアナライザ（Spectrum Analyzer）
Web Audio APIを使ったスペクトラムアナライザ（スペアナ）です。 パソコンやスマートフォンの音をFFTで周波数分析し、 音の高さと強さをグラフで表示します。iPhoneにも対応しています。
Multi Youtube Viewer
ulti Youtube Viewerアプリは８個のYoutube画像を、ＰＣのキーボードや、 MIDIキーボードで切り替えて表示するアプリです。 Multi Youtube Viewerアプリはアプリケーションボタンからアクセスできます。
Loadボタンが効いていなかったので修正しました。
キーボードの"X"で、８画面表示となります。 もう一度"X"を押すと元の１画面表示に戻ります。
時間の長さの単位Tick
Tick（ティック）はシーケンサーなどで使われる時間の長さの単位です。４分音符の長さを480Tickと定義することが多いようです。 昔のシーケンサーではPCの時間精度が良くなかったので48あるいは96という数字でした。
Scratch MIDIの使い方
Scratch 3.0 は HTML5 と JavaScript で構成されています。 そのため、JavaScript で実装された機能を Scratch の拡張機能として追加できます。 Web MIDI API は JavaScript から利用できるため、Scratch の拡張機能として実装することで、 Scratch から MIDI 機器を操作できるようになります。
ピッチベンドの受信について追記しました。2026.06.25
ハットブロックについて追記しました。2026.06.26
レポーターブロックについて追記しました。2026.06.29
メッセージブロックについて記載しました。2026.06.30
ブーリアンブロックについて追記しました。2026.07.02
Bluetooth MIDIまとめ
- nodeでBluetooth MIDI
nodeのモジュールnoble/blenoを使って、Bluetooth MIDI でiPhoneとPCを接続する実験です。 Windows 10の時代の記事です。Windows 10ではBluetoothが一般的でなく苦労した覚えがあります。
- Bluetooth MIDIでiPhoneとMACをつなぐ
iPhoneもMACもBluetooth MIDIをサポートしています。Bluetooth すなわち無線で、 iPhoneの音源アプリをMACから鳴らしたり、iPhoneをコントローラとしてMACの音源を鳴らすことができます。 一番基本的な使い方かもしれません。
- ArduinoとMACをBluetooth MIDIでつなぐ
RedBearLab.comのBluetooth 4.0 Low Energy BLEシールド v2.1というArduino用のボードを持っています。 ８年程前に買ったモノと思われます。このボードを使って、ArduinoとMACをBluetooth MIDIでつないで見たいと思います。 特殊なBluetooth 4.0のシールドを使った記事です。
- ArduinoとWindows 11をBluetooth MIDIでつなぐ
RedBearLab.comのBluetooth 4.0 Low Energy BLEシールド v2.1 をArduinoと接続し、 Bluetoorh MIDI機器として動作させます。これをWindows 11 から認識させます。 こちらもいずれESP32 BLE MIDIで作りなおしたいと思います。 2026.6.15 Windows 11 25H2ではBLIDInoが接続できていません。 Bluetoothの「デバイスを追加する」の画面で、 接続しようとするとエラーになります。 ESP32 BLE MIDI（デバイス名はBasic MIDI Device)は 「デバイスを追加する」の画面で、デバイスが見えません。原因はわかりません。
- Bluetooth MIDIと5pin DIN MIDIの変換器
Bluetooth MIDIと普通の5pin DIN MIDIの変換器を作ります。 ArduinoはBluetooth MIDIを受信し、 SerialポートからMIDIを5pin DINに出力します。 また、5pin DINから受け取ったMIDIはArdhinoのSerialポートで受け取り、 Bluetooth MIDIに変換します。 こちらの記事も、Bluetooth 4.0 Low Energy BLEシールド v2.1を使っています。 そのうち、ESP32 BLE MIDIで作りなおしたいと思います。
- Bluetooth MIDIでSystem Exclusive
MacがBluetooh MIDIでSystem Exclusiveを送信する際、どのようなフォーマットで送信するかを確認します。 Arduino のプログラムは以下の通りです。Bluetoothを受け取って、シリアルに書き出しています。 System ExclusiveをBluetooh MIDIで送信するアルゴリズムを紹介しています。 2026.6.15 追記・修正しました
ESP32 BLE MIDIをインストールする
ESP32-S3はBluetoothに対応してみます。ライブラリを見てみるとそのものずばりのESP32 BLE MIDIがありましたのでインストールしました。
SP32-BLE-MIDIをいくつか修正しました。修正点は以下の通りです。リポジトリを https://github.com/mikatahara/MH-ESP32-BLE-MIDIにおきました。
- 引数を３つ取る、void pitchBend();関数が２つあったので１つの名前を変えました。
- void pitchBendTones(uint8_t channel, float semitones, float range = 4); 関数の中で、PitchBendの最大値を0x3FFFにリミットしました。
- System Exclusiveを送信する関数、 void sendSysEx(uint8_t *sysex, uint16_t sizeofsysex); を追加しました。
- sendMMCを修正してメッセージを送信できるようにしました。
ZIPファイルをダウンロードし、Arduino/librarysに展開、元々のESP32-BLE-MIDIをフォルダごと削除します。
MacでBluetooth MIDIデバイスを認識
ESP32-BLE-MIDIをインスチールしたデバイスは、MacのMIDI設定から”Basic MIDI Device"として見えます。
System Exclusiveの送信
ESP32-BLE-MIDIにSystem Exclusiveメッセージを送信する関数をBLEMidiServerに追加しました。
MIDIマシンコントロール
ESP32 BLE MIDIには、MIDI Machine Control（MMC）のメッセージを送信するためのAPIが 付属しています。（対応している製品があれば…ですが。）
Arduino ESP32-S3の使い方
Arduino ESP32-S3はUSB MIDIに対応しています。 ESP32-S3はTinyUSBというライブラリを使って、USB MIDIに対応しています。 加えてUSB-MIDIをインストールすることでMIDIデバイスとしてPCとメッセージをやりとりすることができます。
LubuntuにArduino IDEをインストール
Lubuntuは超軽量なUbuntuの公式派生版で、 古いPCや低スペックなPCでも快適に動作するよう設計されています。 次のような10年以上前のノートPCにも（快適かどうかは別として）インストールすることができます。 このPCにArduino IDEをインストールした時の記録です。
MIDI 2.0
- MIDI 2.0とは
MIDI 2.0は、 AMEI（音楽電子事業協会）のページによると、「2020年02月22日AMEI/MMAはMIDI 2.0規格書に署名しMIDI 2.0規格が誕生しました。」 と書かれています。それでは、MIDI 2.0の内容は、というと… わかる範囲で記載しました。
- デバイスを試作
MIDI 2.0 on Linuxのページ を見ながら、MIDI 2.0に対応したデバイスをRaspberry Pi Zero 2W（以下Zero2Wと略します）上に構築してみます。 Zero2Wを選択した理由はUbuntuが動作すること、OTGモードでUSB-MIDIのデバイス としてPCから認識できるように設定できることにあります。
- プロトコルの送信
Raspberry Pi Zero 2Wで作成したMIDI 2.0デバイスを使って、 MIDI 2.0プロトコルのMIDIメッセージを送信し、 Cubase 14 Pro（体験版）でレコーディングしてみます。 MIDI 2.0で拡張されたメッセージがどの程度Cubaseで録音できるのかを確認します。 パソコンとZero2WはUSB-MIDI 2.0で接続します。2024年暮れの現在、USB-MIDI 2.0はMACとLinuxで対応しているようです。
- プロトコルの受信
Cubase 14 Pro（体験版） で録音したデータを再生し、Zero2Wで受信します。 Cubase 14 ProがどのようにMIDI 2.0プロトコルを持っているのかを確認します。
このページについて
こちらのページにお越しいただき、ありがとうございます。このサイトは以前、「Web MIDI API実験室」という名前で公開していました。しかし、Web MIDI
API以外のコンテンツも増えてきたため、サイト名を変更しました。
現在もMIDIを切り口として、さまざまな技術に挑戦することをテーマにしています。PCやMac、Arduino、Raspberry
Piなどのシングルボードコンピュータを使ったMIDI機器との接続方法や、WebブラウザでのAudio機能の活用方法などを紹介しています。また、自作したMIDI・Audio関連のWebアプリケーションも公開しています。
なお、電子回路の設計は専門ではありません。そのため、掲載している回路や製作例には、必ずしも最適とはいえないものが含まれている可能性があります。内容をご利用いただく際は、ご自身の判断と責任のもとでお願いいたします。
MIDIについて
MIDIはMusical Instrument Digital Interfaceの略称です。直訳すれば、楽器のデジタルインターフェースということになります。MIDIの誕生は1983年、任天堂「ファミリーコンピュータ」と同じ年です。この年の暮れには、シンセサイザDX7が発売になっています。Windows 95のはるか以前のことです。
もの凄くざっくりと書くならば、MIDIは電子楽器と電子楽器をつなぐデータの形（フォーマット）と通信経路の規格です。２つの楽器をMIDIで接続すると、一方の楽器を弾くと、もう一方の楽器が鳴ります。ちょっと前のコンサートでは舞台のちょっと奥にシンセサイザーを１０台近く周りに並べて演奏するキーボーディストを見ることができました。大概の場合、キーボーディストはすべてのキーボードの鍵盤を弾くわけではありません。いずれかのキーボードがメインのキーボードになっていて、その他のキーボードはMIDIで接続されています。メインのキーボードを弾くとその他のキーボードの音が鳴るように設定されています。曲に合わせて、いろいろなキーボードの音色を使いたいということです。
その後MIDIはコンピュータのインターフェースとして取り込まれ、コンピュータから楽器を鳴らすことが一般的になりました。また、カラオケのデータとしても利用されるようになります。今日現在でも多くのポピュラー音楽の制作現場ではMIDIが使われています。MIDIの歴史は、2019年国立科学博物館の「かはく技術史大系（技術の系統化調査報告書）」I. 映像・情報・コンピュータ関連の一つとして調査された、「MIDI に関する技術系統化調査」井土秀樹著の中で詳しく書かれています。
さて、MIDIは楽器と楽器、コンピュータと楽器をつなぐインターフェースなのですが、私は楽器や音楽に関係無く使ってもとっても便利なインターフェースだと思っています。 コンピュータはPCでもMACでも、MIDIは簡単に扱えるようなドライバーやアプリケーションを持っています。また、iPhoneでもAndroidでもMIDIは扱えますし、ArdinoやRaspberry PiといったシングルボードコンピュータでもMIDIを扱うことができます。ですので、便利に何かと何かをつないでデータをやり取りするインターフェースとしてMIDIが使えるのでは無いかと思っています。
ここ数年では、MIDIやAudioを扱うWeb API(Web MIDI API, Web Audio API)が策定され、わりと簡単にウェッブアプリケーションを作成することができるようになりました。ウェッブアプリケーションはEdgeやChromeといったブラウザで動作します。アプリケーションをインストールしなくて使ええるのは良いですね。
このページでは、MIDIをつなぐ、つなぎ方を紹介するとともに、Web APIを使って製作したMIDI, オーディオのアプリケーションを紹介したいと思います。
2020年9月19日 MikataHara