[WEB App] SID Player v3.2 — reSID + fake6502 WASM + AudioWorklet によるブラウザ完結型 Commodore 64 SIDプレイヤー

[WEB App] SID Player v3.2 — reSID + fake6502 WASM + AudioWorklet によるブラウザ完結型 Commodore 64 SIDプレイヤー

SID Player — Commodore 64 SID Music Player

1980年代に世界で最も売れたパソコン「Commodore 64(C64)」に搭載された伝説的音源チップSID(MOS 6581/8580)を、ブラウザ上で完全にエミュレートし、.sidファイルをリアルタイムに再生するWebプレイヤーです。

C++製のSIDチップエミュレーター「reSID」とC製の6502 CPUエミュレーター「fake6502」をEmscriptenでWASMビルド(82KB)し、AudioWorkletスレッド内で直接ロードしてリアルタイム音声合成を行っています。サーバーへのファイルアップロードは一切不要で、すべてブラウザ内で完結します。

ツール

スクリーンショット

3Voice分離波形表示:

SID Player - 3Voice分離波形

波形 + スペクトラム(Bothモード):

SID Player - Both Mode

3D Terrain:

SID Player - 3D Terrain

動画(GIF):

SID Player 動作動画(GIF) SID Player 動作動画(GIF)3D Terrain

.sidファイルの入手先

.sidファイルはHVSC(High Voltage SID Collection)やDeepSIDから入手できます。

特徴

reSID + fake6502 による完全エミュレーション

産業標準のSIDチップエミュレーター「reSID」が、MOS 6581/8580の波形生成、アナログフィルター、ADSRエンベロープをトランジスタレベルで再現。パブリックドメインの6502 CPUエミュレーター「fake6502」が.sidファイル内の6502マシン語を実行し、SIDレジスタに書き込みます。

AudioWorkletによるリアルタイム音声合成

WASMバイナリ(82KB)をAudioWorkletスレッド内で直接instantiateし、128サンプル(約2.9ms)単位でリアルタイム音声合成を行います。メインスレッドのUI処理に影響を与えません。

3Voice分離波形ビジュアライザー

SIDの3つの独立したオシレーターの出力を個別に取り出し、赤(Voice 1)、緑(Voice 2)、青(Voice 3)の波形としてリアルタイム表示。ミックス波形と周波数スペクトラムの表示も対応。リングバッファによるスクロール表示で波形の経時変化が見やすくなっています。

3Dリボンビジュアライザー

Three.jsによる3D空間上のリボンメッシュで3Voice波形を立体表示。512ポイント×3本のBufferGeometryリボンが、voiceBuffersからの線形補間とピーク自動スケールにより滑らかに波形を再現。UnrealBloomPassによる発光エフェクトとOrbitControlsによるカメラ操作に対応。

Audio-Reactive 3Dテレイン

fbm(Fractal Brownian Motion)+ Simplexノイズによるプロシージャルワイヤーフレーム地形。SIDのAnalyserNodeから取得したbass周波数帯に連動して地形がうねり、発光色が変化。3Dリボンがテレイン上を浮遊する演出で、SID音楽を視覚的に体験できます。

10バンドEQ & プリセット機能

10バンドのイコライザーを搭載し、c64warm や c64bright をはじめとする各種プリセット切替およびカスタム調整に対応。

可変UI & パネルリサイズ

ドラッグおよびタッチ操作による左右パネルの無段階リサイズに対応。直感的なレスポンシブ配置に対応しています。

チップモデル切替(MOS 6581 / MOS 8580)

初期型6581(12V駆動、泥臭いアナログ歪み)と後期型8580(9V駆動、クリアなサウンド)をリアルタイムに切り替えて音色の違いを比較できます。

SIDレジスタモニター

$D400-$D41Fの32レジスタの値をリアルタイムに16進数表示。変化したレジスタがハイライトされ、SIDプログラムの動作を視覚的に確認できます。

完全ローカル処理

.sidファイルはブラウザのメモリ内でのみ処理されます。外部サーバーへのアップロードは一切ありません。

82KBの軽量WASMバイナリ

reSID + fake6502 + PSIDパーサー + C64メモリマップの全機能が82KBに収まっています。初回ロードが高速で、モバイルブラウザでも快適に動作します。

使い方

  1. .sidファイルをドロップまたは選択する

    • 画面左上の破線エリアに.sidファイルをドラッグ&ドロップするか、クリックしてファイルを選択します。ビューポート領域へのドロップにも対応しています。
    • ファイルを読み込むと自動的に再生が開始されます。
  2. 再生を操作する

    • ▶/⏸ ボタンで再生/一時停止を切り替えます。一時停止後の再開は途中からの再生です。
    • ■ ボタンで完全停止(最初に戻る)。◀◀/▶▶ ボタンで前曲/次曲に切り替え(複数曲収録の.sidファイル)。
  3. チップモデルを切り替える

    • CHIP MODELセクションでMOS 6581 / MOS 8580を選択すると、リアルタイムに音色が変わります。
  4. 音質とビジュアルの調整

    • 10バンドEQで音質をカスタマイズ。
    • VISUALIZERでWaveform/Spectrum/Both/3D Ribbon/3D Terrainの5モードを切り替え可能。
    • 3D Ribbonモード:3Voice波形をBloom付きリボンメッシュで立体表示。マウスドラッグでカメラ回転、スクロールでズーム。
    • 3D Terrainモード:SIDオーディオ連動のプロシージャル地形の上にリボンが浮遊。Colorピッカーでテレインの発光色を変更可能。
    • レジスタ情報やクレジットは右パネルへ集約され、境界線をドラッグすることでパネル幅を自由にリサイズできます。
  5. ビジュアライザーを楽しむ

    • VISUALIZERセクションでWaveform/Spectrum/Bothモードを切り替え。色も変更可能。
    • 3Voice分離波形(赤/緑/青)で各オシレーターの動きを視覚的に確認できます。
  6. SIDレジスタを観察する

    • SID REGISTERSセクションで32レジスタの値がリアルタイムに更新されます。

.sidファイルとは

.sidファイルはMIDIや音声データではなく、Commodore 64の6502 CPU用マシン語プログラムそのものです。ファイル先頭にPSID/RSIDヘッダー(タイトル、作者、init/playアドレス等)が付き、その後にC64のRAMに配置される実行バイナリが続きます。

再生するには6502 CPUでマシン語を実行し、SIDチップのレジスタ(D400D400-D41F)に値を書き込むことで音声を生成します。本プレイヤーはこの一連の処理をすべてブラウザ内のWASMで実現しています。

技術スタック

  • Astro — ページ構築
  • reSID — SIDチップエミュレーション(C++, MOS 6581/8580対応)
  • fake6502 — 6502 CPUエミュレーション(C, パブリックドメイン)
  • Emscripten — C/C++ → WASM ビルド(STANDALONE_WASM, 82KB)
  • AudioWorklet — リアルタイム音声処理スレッド
  • WebAudio API — GainNode, AnalyserNode
  • Canvas 2D — 波形/スペクトラム描画
  • Three.js r160 — 3Dリボンメッシュ、Audio-Reactiveテレイン、UnrealBloomPass、OrbitControls

開発の経緯

「数日はかかるだろう」と踏んでいたSIDプレイヤーの実装が、わずか数時間で完成した。reSIDのEmscriptenビルドは最初から通り、AudioWorkletでの_initialize()呼び忘れとmemoryエクスポート名の不一致で1時間格闘した後、テストトーンの「ブーーー」が鳴った。

fake6502(パブリックドメインの6502 CPUエミュレーター)をCブリッジファイルで分離コンパイルして組み込み、PSIDヘッダーパーサーとC64メモリマップを配線。.sidファイルをドロップした瞬間、スピーカーから40年前のSIDサウンドが響いた。

その後、3Voice分離出力のためにreSIDのvoice[3]配列をpublic化してWASMリビルド、リングバッファによるスクロール波形表示、チップモデル切替、一時停止/再開機能を追加して現在のv1.0に至る。

SIDチップについて

SID(Sound Interface Device / MOS 6581・8580)は、Commodore 64に搭載されたカスタム音源チップ。設計者はBob Yannes(後にEnsoniqを創業)。

  • 3基の独立したオシレーター(鋸歯状波、三角波、パルス波/PWM、ノイズ)
  • ハードウェア・リングモジュレーションとオシレーター同期
  • 本格的なADSR(Attack/Decay/Sustain/Release)エンベロープ制御
  • アナログフィルター(Low-pass / Band-pass / High-pass 切替可能)

SIDは「ゲームの効果音発生器」ではなく「1チップに凝縮された本格派アナログ・シンセサイザー」であり、Rob Hubbard、Martin Galway、Chris Hülsbeckらの名コンポーザーが生み出した楽曲は、ゲームミュージックの枠を超えた音楽ジャンルとして今なお世界中で愛されている。

関連ツール

更新履歴