音から始めるギター練習ゲームをブラウザーで作る

画面の形を追う前に、音を聴く練習をしたいと考えました。図をなぞるだけでは、聴く作業を置き換えてしまうからです。そこでサウンド・ファースト ギター道場を作りました。マイク使用時は検出した入力を採点し、マイクなしでは自己評価を使います。

ゲームには5つのモジュールと23の練習があり、検出は1音ずつです。進捗は端末に保存し、ログインするとアカウントと同期します。音色の練習は持続時間、明瞭さ、音程のばらつきを評価します。運指、ミュート、姿勢の評価ではありません。レッスンの抜粋は人工知能による書き起こしで、逐語確認はしていません。

私はこのサイトとAI Maker Labチャンネルの所有者・制作者であり、これは独立したレビューではなく制作記録です。人工知能と自動化を動画分析、図版制作、翻訳、記事のレビューに使いましたが、最終的な文章と出典確認には私が責任を持ちます。ゲームはトモ藤田のレッスンに着想を得たもので、公式コースではありません。

形より音を先にする、ひとつの方針

アプリ内の書き起こしは、速さより丁寧な演奏、音色、両手の連動を重視しています。「ゆっくりが上達の近道」を設計方針にしました。学習速度が上がるという保証ではありません。各モジュールの出典は、次の公開動画です。

• トモ藤田直伝！！ 地味練！
• 短時間で上達できる効果的な運指練習 / TFGL#1
• Picking control & Keep in Time with Metronome / TFGL#2
• ３音で自由になれるトライアドアプローチ！/ TFGL#3
• ３音コード(R37)３つだけでブルースとジャズも弾ける！/ TFGL#4

視覚的な手助けは練習ごとに変え、常に指板を空白にするわけではありません。表示方針は非表示、ルートのみ、聴いた後、全表示です。コードでは none、root、after、all に対応します。聴いた後の方針では、ライブ検出がその音を捉えると目標を表示します。採点済みの音とは限りません。他の方針では、弾く前から目標が見える場合もあります。

5本のレッスンを5つのモジュールへ

練習経路は、何を聴くかで分けました。ゲームの文法で扱った流れ、情報、反応の問いを使っています。何から始められるか。画面は何を見せるか。その反応で、実際には何が分かるか。

モジュール2〜5は、直前のモジュールの全練習で星を1つ以上得ると開きます。これは進行のルールであり、習得の証明ではありません。自己申告の星も数えます。解放されたことだけでは、測定済みの演奏を保証できません。

6種類の練習を、ひとつのマイクで

ブラウザーではレッスンを6種類の練習に置き換えています。正解とみなす入力は、種類ごとに異なります。音程を合わせる課題と、拍に合わせて弾く課題は別です。点数がその違いを曖昧にしないようにしました。

• tone： 目標ごとに3回弾きます。マイク使用時は、取り込んだ音から評価します。
• sequence： 目標の音程を順番に弾きます。モジュール1〜2では時間を測りません。まずメトロノームなしで始めるという抜粋の方針に合わせています。
• timing： 開放G弦でメトロノームの位置に合わせます。音程ではなくアタックを採点します。
• ear-find： 見本音を聴き、同じ音名を弾きます。オクターブを問わない音名の分類を、ピッチクラスと呼びます。
• triad-arpeggio： 3音の配置を1音ずつ弾きます。和音を同時に鳴らす課題ではありません。
• play-along： B♭の12小節ブルースです。小節ごとに必要なピッチクラスを弾いたかを評価します。最初は毎分60拍（BPM）の設定で、時間を測らず練習します。次は120 BPMで、2拍目と4拍目にクリックが鳴ります。

アプリは限界を明記しています。「和音は1音ずつ弾きます。この検出器では同時に鳴る和音、ミュートの技術、姿勢は評価できません。」ここで確認するのは個別の音です。動画のようにかき鳴らした和音全体ではありません。

ブラウザーが音程を捉える仕組み

マイク入力は、4096サンプルの窓を持つ音声解析部品 AnalyserNode に渡します。検出には音の基本周波数を推定するYINを使います。出典はde CheveignéとKawaharaによる2002年の論文です。YIN, a fundamental frequency estimator for speech and musicで方式を確認できます。基本周波数は音程の土台となる推定値で、音に含まれる全周波数ではありません。

検出はアタックから110ミリ秒待ち、300ミリ秒分の履歴を保持します。候補には、音を番号で表すMusical Instrument Digital Interface（MIDI）を使います。丸めた候補音の±42セント以内を240ミリ秒保つと、受理の条件を満たします。セントは音程差を表す単位です。明瞭さも0.72以上必要です。校正では1.8秒の無音を聴き、背景ノイズの1.5倍を検出しきい値にします。

音色は順番に判定します。持続が600ミリ秒未満なら muted、不明瞭なフレームが15%を超えたら buzzy です。次に音程のばらつきが12セントを超えたら unstable、それ以外は clean です。ばらつきは解析対象の明瞭なフレームを要約した値で、演奏全体の評価ではありません。しきい値は実装上の選択であり、検証済みの演奏技術の尺度ではありません。確認したゲームのコードは、マイクのサンプルや録音を送信しません。ログイン時に同期するのは進捗です。

ゆっくり進むためのテンポと星

星が進行を決めます。3つ星は90点以上、2つ星は70点以上、1つ星は50点以上です。時間を測る練習は、レッスンの遅いテンポから始まります。3つ星を得ると、その練習の上限まで4 BPMずつ解放します。テンポ選択には未獲得の速さを出しません。時間を測らない練習にはテンポの選択肢がありません。

表示の間を取っても、入力は止めません。音色練習以外で進行すると、目標マーカーは600ミリ秒後に切り替わります。その間も次の回答を受け付けます。これは目標表示の遅延であり、すべての反応が続く時間ではありません。

評価できないことを明示する

点数が示す範囲は、先生の指導より狭いものです。技術を自動評価できるとは言わず、結果と一緒に次の限界を示します。

• 検出は単音のみです。同時に鳴る和音、ミュート、姿勢は評価しません。
• 正確な音高を求める練習では、オクターブの誤検出が起こり得ます。設計上、倍音補正は行いません。
• 「マイクなしで練習」は自己申告です。「自己申告の結果です。音声の測定は行っていません。」と表示します。
• 抜粋は人工知能による書き起こしで、人による逐語確認はしていません。リズムのレッスンは英語で、他は日本語です。
• 私の制作記録では、画面なしのブラウザーで合成音による検証を行ったとしています。実際の部屋で本物のギターを使った検証は、まだしていません。今回の撮影ではマイクが聴取状態になりましたが、待機中に音色の評価は出ませんでした。自己申告モードの図版は、以前の検証結果を独立して裏付けるものではありません。

レッスンをデータにするまで

制作は、5本の公開動画をダウンロードするところから始めました。Geminiのファイル送信機能であるFiles APIで、動画を丸ごと渡しています。使用モデルは gemini-3.8-flash です。全実演をJavaScript Object Notation（JSON）形式の記録として返すよう依頼しました。その後、各レッスンの最初の5実演を6種類の練習へ対応させました。運指のレッスンは実演が3つだったため、練習も3つです。

レビューでは、書き起こしがC7とした配置がF7だったことを発見しました。読みやすい文章だけでなく、音の組み合わせも確認すべきだと分かります。これは私による研究過程の説明であり、撮影画像が独立して証明する来歴ではありません。実装したカリキュラムはアプリで確認できます。それでも、書き起こしのすべてが正しいとは限りません。

次に試すこと

検出した音と練習経路はつながりましたが、点数は技術への助言を代替できません。サウンド・ファースト ギター道場を開き、マイクを有効にして校正し、モジュール1を弾いてみてください。