MIDI モニター

Web MIDIアプリケーション



Web MIDI APIの動作テスト

このページでは、訪問者のブラウザでWeb MIDI APIを利用できるかどうかを自動的にテストします。




更新情報

Aug.7,2026

Python Arcade

Arcadeは、Pythonを使って絵を描いたり、キャラクターを動かしたりして、 2Dゲームやアニメーションを作るためのライブラリです。Scratchで学んだ考え方をそのまま活かせるので、 Pythonを楽しく学び始めるのにぴったりです。 ここでは、テキストに沿って「絵を描く方法」のライブラリを試しながら説明しています。



碁石拾い

碁石拾いパズルです。息抜きにどうぞ!



rtpMIDIまとめ

rtpMIDIは、ネットワーク(Wi-Fiや有線LAN)を通じてコンピュータやiOSデバイス間でMIDI信号を送受信するための仮想MIDIドライバおよび規格です。 ワイアレスでWindowsとMac、iPadなどをワイヤレスで接続できます。 rtpMIDIの接続は、Windows PC、Mac、iPhone、Raspberry Piの4つのデバイスで動作を確認しています。 このページでは、それぞれのデバイス間でrtpMIDI接続を行う方法を紹介します。

WindowsでrtpMIDIを利用するには、rtpMIDIアプリケーションをインストールする必要があります。 インストール方法や基本的な使い方については、こちらのページをご覧ください。

rtpMIDIは、Windows 11 Pro 25H2でも動作を確認しました。 しかし、Raspberri PiのRavelox MIDIとの接続が不安定になってしまいました。

Raspberry PiをrtpMIDI化するRavelox MIDIを再度インストールしてみました。 こちらのページを参照して下さい。

loopMIDIでつなぐ

loopMIDIは、PC内に仮想MIDIケーブル(Virtual MIDI Cable)を作成するソフトウェアです。 PC上で動作するアプリケーション同士をMIDIで接続できるため、 例えば自作のアプリケーションからソフトウェアシンセサイザーを演奏できます。 プログラムからは、PCに接続された外部MIDI機器(音源モジュールなど)も、 PC内のソフトウェアシンセサイザーも同じように扱えるため、接続先を意識することなくMIDIアプリケーションを開発できます。 Windows 11 PRO 25H2 でも使えました。 今日現在、loopMIDISetup_1_0_16_27.zipがダウンロードできました。

ペクトラムアナライザ(Spectrum Analyzer)

Web Audio APIを使ったスペクトラムアナライザ(スペアナ)です。 パソコンやスマートフォンの音をFFTで周波数分析し、 音の高さと強さをグラフで表示します。iPhoneにも対応しています。

Multi Youtube Viewer

ulti Youtube Viewerアプリは8個のYoutube画像を、PCのキーボードや、 MIDIキーボードで切り替えて表示するアプリです。 Multi Youtube Viewerアプリはアプリケーションボタンからアクセスできます。





Loadボタンが効いていなかったので修正しました。

キーボードの"X"で、8画面表示となります。 もう一度"X"を押すと元の1画面表示に戻ります。



時間の長さの単位Tick

Tick(ティック)はシーケンサーなどで使われる時間の長さの単位です。4分音符の長さを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まとめ

  • ESP32 BLE MIDIをインストールする

    SP32-S3はBluetoothに対応してみます。ESP32 BLE MIDIライブラリをインストールします。 ESP32-BLE-MIDIにいくつかミスを見つけましたので修正しました。 さらに、System Exclusiveに対応しました

    • 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用のボードを持っています。 8年程前に買ったモノと思われます。このボードを使って、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 追記・修正しました

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は電子楽器と電子楽器をつなぐデータの形(フォーマット)と通信経路の規格です。2つの楽器をMIDIで接続すると、一方の楽器を弾くと、もう一方の楽器が鳴ります。ちょっと前のコンサートでは舞台のちょっと奥にシンセサイザーを10台近く周りに並べて演奏するキーボーディストを見ることができました。大概の場合、キーボーディストはすべてのキーボードの鍵盤を弾くわけではありません。いずれかのキーボードがメインのキーボードになっていて、その他のキーボードは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