17鍵の仮想鍵盤レイアウトと入力インターフェース統合制御
本システムは,ブラウザネイティブのWeb Audio APIを活用した簡易的なシンセサイザーとして機能します.演奏インターフェースとして,C4(中央ハ)からE5までの計17鍵盤というコンパクトな音域を画面上に展開しています.この17鍵の構成は,白鍵と黒鍵の物理的な相対位置関係をDOM上で再現し,直感的な演奏操作を可能にします.
入力手段としては,マウスのクリック操作,スマートデバイス等のマルチタッチパネルによる操作,そしてQWERTY配列キーボードによる物理的な打鍵操作の三系統を統合的にサポートしています.キーマッピングはホームポジション周辺の「A」キーをC4に,「;」(セミコロン)キーをE5に割り当てるなど,自然な運指を考慮した設計となっています.
キーボード入力制御では,グローバルなkeydownイベントにおいてキー長押し時の連続発信であるリピート判定(e.repeat)の除外に加え,日本語入力等のIME変換中(isComposing)や,Ctrl・Meta・Altといった修飾キーが押下されている状態,さらにはinput,textarea,select,button,およびcontenteditable属性を持つ編集可能要素内部での入力イベントを無視するガード処理を導入しています.
ただし大文字入力との整合性を保つためShiftキー単独の併用は許容されています.一方でkeyupイベント側では,キー離鍵時に確実に発音を停止させるためこれらのガードによる中断を行わず,修飾キー併用時やフォーカス移動後であっても発音中のノートが正しくリリースされる設計を維持しています.
打鍵やクリック,タッチが検知されるとOscillatorNodeとGainNodeが生成され,AudioDestinationNodeへと音声信号がルーティングされます.タッチ時のスクロール抑止(preventDefault)などの基本動作は保たれていますが,ウィンドウのフォーカス喪失や可視性変化に伴う発音管理,ポリフォニー上限の厳密なライフサイクル制御などは包括的に再構築されておらず,プロ用途の低遅延や安全性を保証するものではありません.
基本4波形の数学的生成手法と音響特性
音響合成の心臓部として,本システムはサンプリングされた既存の楽器音の録音データ(PCM波形など)を一切使用せず,純粋な数学的演算によってリアルタイムに音波を生成するオシレーターを採用しています.具体的には,Web Audio APIが提供するOscillatorNodeのtypeプロパティを切り替えることにより,「サイン波(正弦波)」「矩形波(スクエア波)」「三角波(トライアングル波)」「のこぎり波(ソートゥース波)」という4種類の基本波形を出力することが可能です.
サイン波は基音のみで構成され,整数倍の周波数を持つ倍音を一切含まないため,音叉や時報のような丸みを帯びた澄んだ純音として耳に届きます.対照的に矩形波は,基音に対して奇数次の倍音を豊富に含み,その振幅が特定の割合で減少していく特性を持つため,クラリネットなどの閉管木管楽器を彷彿とさせる,独特の中空な響きを生成します.
三角波も奇数次倍音を含みますが,高次倍音になるにつれてその振幅が急激に減衰する数学的特性を有しており,結果として矩形波よりも柔らかく,サイン波に近い温かみのある音色となります.そしてのこぎり波は,奇数次だけでなく偶数次も含めたすべての整数次倍音を内包しており,非常に倍音成分が豊かで鋭く,ブラス(金管楽器)やストリングス(擦弦楽器)のような力強い響きを生み出します.
これらの波形生成プロセスは,外部の音声ファイルやマイクからの音声入力を必要とせず,端末のCPUを用いたブラウザ内でのローカルな演算のみで完結します.楽器特有の複雑な共鳴やサンプリング再生機能は持たず,純粋な基本波形の選択という最もシンプルかつ本質的な音色決定アプローチによって,軽量で高速な動作を実現しています.
周波数算定ロジックと表示音名の動的同期
本システムでは,基準となるC4(中央ハ)の周波数を261.63Hz,A4(一点イ)を440.00Hzとする一般的なA4=440Hzの基準の体系に基づき,各鍵盤の固有周波数を事前に定義しています.17鍵という物理的・視覚的に限定された鍵盤数であっても,幅広い音域や異なる調性(キー)での楽曲演奏に対応できるよう,オクターブシフト機能およびトランスポーズ(移調)機能を実装しています.
オクターブシフトは,基準となる音域全体を-2から+2までの範囲でオクターブ単位で上下にスライドさせる機能です.一方のトランスポーズは,半音単位で-12から+12までの範囲で音高をシフトさせる機能であり,運指を変えずに別の調で演奏することを可能にします.これらの設定値が変更された際,システム内部では打鍵時に算出される最終的な周波数に対して,十二平均律の数理モデルに基づく厳密な乗算処理が行われます.
基準周波数に対して「2の(オクターブシフト値)乗」を掛け合わせ,さらに「2の(トランスポーズ値÷12)乗」を掛け合わせるという浮動小数点演算を実行することで,シフト後の正確な周波数を導き出しています.特筆すべきは,これらの音高操作がユーザーインターフェース上の表示と完全に動的同期している点です.
鍵盤上に表示される音名ラベルは固定文字列ではなく,内部関数によってリアルタイムに計算・フォーマットされます.正規表現を用いて元のノート文字列からピッチクラスとベースオクターブ数値を分離し,オクターブシフトの値を加算した上で再結合して画面に描画します.これにより,ユーザーが設定を変更した場合でも,画面上の鍵盤表示が現在発音される実際の音高名と常に一致するため,音楽理論上の整合性を保ちながら直感的な演奏環境を維持しています.
ADSRエンベロープによる音量カーブのスケジューリング
シンセサイザーにおける音色決定のもう一つの重要な要素が,時間経過に伴う音量の変化を制御するエンベロープジェネレーターです.本システムでは,GainNodeを用いたADSRエンベロープ(Attack,Decay,Sustain,Release)を実装しており,打鍵から離鍵,そして音が完全に消滅するまでの音響的なライフサイクルをミリ秒単位の精度でスケジューリングしています.
アタック(立ち上がり時間)は,キーが押されてから音量が最大値に到達するまでの時間を定義します.ディケイ(減衰時間)は,最大音量に達した後,持続音量であるサステインレベルへと移行するまでの時間を指します.サステイン(維持音量レベル)は,キーが押し続けられている間に保持される一定の音量比率です.
そしてリリース(余韻の長さ)は,キーから指を離した瞬間に開始され,音が完全に減衰しきるまでの時間を決定します.これらの動的な音量変化は,Web Audio APIのAudioParamインターフェースが持つスケジューリングメソッド群を駆使して実現されています.
ノートオン時には,まずsetValueAtTimeで音量をゼロに初期化し,linearRampToValueAtTimeを用いてアタックタイムの間に音量を線形に引き上げます.その後,直ちにexponentialRampToValueAtTimeをスケジュールし,ディケイタイムの期間をかけてサステインレベルへと指数関数的に減衰させます.
ノートオフ時には,現在時刻における音量値を再度setValueAtTimeで固定し,スケジュールされていたそれ以降の変動をcancelScheduledValuesで破棄した上で,リリースタイムをかけて極小値へ向けて指数関数的にフェードアウトさせ,最後にオシレーター自体を停止させるという一連の処理を行っています.
これにより,UI上の余分な記号を排除した洗練された操作画面から,複雑で豊かな時間的音色変化を生み出すことが可能となっています.
ポリフォニー制御とオーディオノードのライフサイクル管理
複数の鍵盤を同時に操作して和音(コード)を演奏するためのポリフォニック(同時発音)機構は,本システムの演奏能力を決定づける中核機能です.単音しか発音できないモノフォニックな設計とは異なり,打鍵されたすべての音に対して独立したオーディオ処理経路を確立する必要があります.
これを実現するため,システム内部では現在アクティブに発音されている各ノートのオシレーターノードとゲインノードのペアを辞書オブジェクトとしてメモリ上に格納し,各ノートをキーとして一元管理しています.新しいキーが押下されると,新しいノード群がインスタンス化され,この辞書に登録された上で再生が開始されます.
もし同一のキーが連続して押下された場合,システムは辞書を参照して既存のノードに対して直ちにノートオフの処理(リリースのスケジュールとオシレーターの停止)を先行して呼び出し,音声のクリッピングや位相の干渉による不快なノイズを防いだ上で,新たな発音処理を開始します.
同時に,視覚的なフィードバックを提供するため,現在押されている鍵盤のリストをReactのステートとしても管理しています.このステート配列の中に自身のノート名が含まれているかどうかを各鍵盤コンポーネントが判定することで,CSSクラスが動的に切り替わり,鍵盤が沈み込むアニメーションやハイライト表示が行われます.
Web Audio APIの仕様上,一度生成して停止処理を呼び出したOscillatorNodeは再利用することができず,発音のたびに新しいノードを作成して破棄するライフサイクルを繰り返す必要がありますが,この厳密なメモリ管理とクリーンアップ処理により,PCキーボードの複数キー同時押しや,マルチタッチによる安定した和音の演奏が可能となっています.
ブラウザ内ローカル処理における音源の制約と設計思想
本システムはブラウザ上で完結する軽量な音源モジュールとして設計されているため,専用のハードウェアシンセサイザーやネイティブアプリケーションとは異なる,環境依存の固有の制約を持っています.最も顕著な制約はレイテンシー(遅延)です.打鍵の入力から実際にスピーカーから音声が出力されるまでの間には,ブラウザのJavaScriptエンジンの処理,AudioContextのオーバーヘッド,そしてOSレベルのオーディオバッファサイズに起因する遅延が必ず発生します.
そのため,レイテンシーゼロを保証することは原理的に不可能であり,ご利用の端末性能や設定によって体感的な遅延量は変動します.また,ポリフォニーの同時発音数に関してもシステム上のハードリミットは設けていませんが,多数の鍵盤を同時に押下し大量のオシレーターを並列稼働させた場合,計算処理能力を超過して音切れやノイズが発生する可能性があります.
加えて,本ツールは意図的に機能を絞り込んでおり,高度な音楽制作環境で求められるような未実装機能が多数存在します.具体的には,外部のMIDI機器を接続するためのMIDI入力APIのサポート,88鍵盤への展開,録音データやWAV・MP3等の音声ファイルへの保存・編集機能,マイク入力,バイカッドフィルターによる音質加工,打鍵の強弱(ベロシティ)検知,コードやスケールの自動認識機能などは一切搭載していません.
これらはすべて,外部サーバーとの通信を必要とせず,端末内でのみ完結するローカル処理の優位性を保ち,安全かつ手軽な動作を最優先するための意図的な設計判断であり,本ツールはあくまで基礎的な波形合成による簡易的な演奏体験に特化しています.