ふくふくHukuhuku LLC
EP.115Toolbox 11分公開:

Phononをブラウザーで動かす:英語読み上げと単語ハイライトをローカルで試す

Phononの第三者実装blixt/phononをMacで試用。WebGPUとCPUの生成結果、44.3MBの意味、単語時刻の活用、英語専用・数字の読み・31Mと40Mの利用条件を解説します。

#Phonon#音声合成#ローカルAI#WebGPU#英語教材
執筆 / 監修
松尾 亮合同会社ふくふく 代表社員

データ基盤・データパイプライン構築 / BI / 生成 AI 活用支援を専門とするエンジニア (28 年)。 本記事は AI 利用ポリシーに基づき、生成 AI の補助で執筆 → 人間が監修・編集して公開しています。

プロフィール詳細
シェア

英語の説明文を読み上げながら、いま話している単語を画面で追いたい。英語教材、訪日客向けの案内、海外利用者向けの操作説明では、音声を作るだけでなく「文字と音をどう合わせるか」が実装の課題になります。Phononをブラウザーで動かす第三者実装「blixt/phonon」は、そのための単語時刻を音声と一緒に返します。

ATTENTION:日本語の読み上げには使えません

標準のPhonon 31Mは英語専用です。40Mの多言語版も英語・フランス語・ドイツ語・スペイン語・ポルトガル語が対象で、日本語は含まれません。また、blixt/phononはGradium公式のブラウザーパッケージとは別の実装です。日本語の会議を文字起こしする機能や、学習者の発音を採点する機能もありません。

2026年11月5日に公開デモをこのMacで試し、英語の短い案内文について、WebGPUとCPUの両方で生成結果・単語表示・エラーなしの表示を確認しました。本記事では、その手順と適する用途、導入時に見落としやすい条件を整理します。

何が新しい? モデル公開とブラウザー実装の更新を分ける

GradiumのPhonon発表は2026年10月21日です。今回取り上げるのは、そのモデルを動かすAndreas Blixt氏の別実装です。モデル自体を11月の新製品として紹介するものではありません。

このリポジトリは11月1日に作成され、11月4日にはCPU経路の整理やメモリ解放処理、同じ端末でCPU動作を選んで試せるデモの更新が入りました。本記事が確認したコミット36e7e5eは11月4日16:54:50 UTC、つまり11月5日1:54:50 JSTです。朝の調査開始から約5時間前の更新で、正式な番号付きリリースは確認時点ではありません。

名前役割混同しない点
Gradium Phonon 31M文章から英語音声を生成するモデル学習済みの重み。公式モデルカードは英語・Apache 2.0と明記
phonon-ttsGradium公式のブラウザーパッケージ公式の実行環境。数字や日付などの読みへの変換機能を持つ
blixt/phonon(パッケージ名phonon-webgpu)第三者のWebGPU/WebAssembly実行環境単語・トークンの時刻を返す。本記事の試用対象

ローカルAIとしての価値:文章を音へ変える部分を端末で持つ

TTSはText-to-Speech、文字から音声を作る処理です。LLMに回答文を考えさせる部分と、その文を読み上げる部分は別に設計できます。たとえば、ローカルLLMが作った英語の説明文をPhononへ渡す構成や、あらかじめ人が書いた英語原稿だけを読み上げる構成が考えられます。今回、LLMとの接続は試していません。

WebGPUはブラウザーからGPUを計算に使う仕組みです。GPUを使えない場合のCPU経路には、ブラウザーで効率よくプログラムを実行するWebAssemblyを使います。端末内で音を作るため、読み上げのたびにクラウドの音声生成APIを呼ぶ構成にする必要がありません。ただし、最初にページ・プログラム・モデルなどを取得する通信は必要です。

「ローカルだから完全にオフラインで安全」とも言い切れません。公開デモの配信元や外部ファイルの取得先、組み込むサイトのアクセス解析は別の通信経路です。本試用では通信監査やオフライン再読込を行っていません。機密原稿を扱う場合は、自社で配信するファイルと通信先を確認し、キャッシュが消えた場合の動作まで検証してください。

44.3MBはダウンロード量。必要メモリの上限ではない

実装のREADMEでは、31M版の初回取得量は重み・トークナイザー・声を合わせて44.3MBと説明されています。重みの大きな行列を8ビット整数へ変換した配布物を使い、ブラウザーのキャッシュへ保存します。公式モデルカードのGGUF重み64.5MBとは、配布形式も集計対象も異なります。

ダウンロードが小さくても、実行中は計算用の領域が追加で必要です。開発者は31MのGPUバッファーなどを約108MB、CPUのWebAssemblyメモリを約115MBと説明していますが、これはブラウザーやページ全体の消費量ではありません。本記事でピークメモリは測定していません。手元のMacに大容量メモリがあることを、必要条件と読み替える必要もありません。

最初の試用は、アカウントなしで英語二文から

  1. 1公開デモを開き、Modelを「Phonon 31M, English」のままにします。今回の試用ではアカウント作成やAPIキーの入力はありませんでした。
  2. 2VoiceをDelia、Speedを1.0×にして、下の英文をText to speakへ貼り付けます。初回はモデル取得があるので通信できる環境で試します。
  3. 3Speakを押し、生成後のspeech made、first audio、GPUまたはCPUの表示を確認します。音を聞く場合は端末の音量・出力先も確認してください。
  4. 4同じ英文でもう一度試し、初回の取得時間と読み込み後の生成を混ぜずに記録します。別の声や速度を試す場合は、一度に一つの条件だけ変えます。
  5. 5CPU経路はCPUを選ぶデモで試せます。CPUのスレッド数などはCopy detailsで確認できます。動作しないときも、この情報が切り分けに役立ちます。
編集部が用意した試用用の架空の館内案内。日本語の文を英語として読ませるテストではありません。
Text
Welcome to our museum. Please follow the blue signs to the next room.

館内案内として実際に採用する前には、経路・表現・聞き取りやすさを担当者が確認します。生成が終わったことと、利用者に正しく伝わることは別の評価です。

Macで確認した結果:WebGPUとCPUの両方で生成

確認日は2026年11月5日JST。Apple M2 Ultra、メモリ192GiBのMac上のアプリ内ブラウザーを使用しました。ブラウザーの詳細表示はChrome 156系、GPU表示はapple / metal-3でした。31M・Delia・Speed 1.0×、上の同じ英文を各経路で1回ずつ生成しました。以下は公開デモ自身が表示した値で、独立した計測器によるベンチマークではありません。

項目WebGPU経路CPUを指定した経路
バックエンド表示GPU: apple metal-3CPU: 8 threads, relaxed SIMD
生成された音声の長さ4.4秒4.4秒
first audio表示5.0ms5.4ms
real time表示95×42×
読み込み側の表示first visit 9.1秒cold start 791ms
Copy detailsのerrornonenone

first audioは、生成呼び出しから最初の音声チャンクができるまでの指標です。スピーカーから実際に聞こえるまでの遅延ではありません。CPU試用はWebGPU試用の後で行っています。前者のfirst visitと後者のcold startはキャッシュ条件が違うため、読み込み速度の勝敗には使えません。95×も「95倍速でしゃべる」という意味ではなく、音声の長さに対する生成処理の速さを示すデモの指標です。読み上げ速度はSpeedで別に指定します。

確認できたのは、生成完了に相当する表示、単語を分けた表示、バックエンド情報、エラーなしの記録です。人による聞き取り評価、単語時刻の精度測定、連続運転時の安定性、スマートフォンでの再現は未実施です。開発者の「M3 Maxで115×」などの比較値も、本記事の実測結果とは区別してください。

単語の時刻があると、英語教材や操作説明を作りやすい

実装は音声に加え、単語ごとの開始・終了時刻を秒単位で返します。APIではspeech.wordsで一覧を受け取り、onWordで生成途中の結果を受け取れます。これを再生時刻と照合すると、話している単語を色付けする表示を作れます。音声全体を後から別の認識器に渡して時刻を調べる工程を減らせる可能性があります。

試しやすい用途最初に作るもの採用前に確かめること
英語学習教材短い英文と、再生位置に合わせた単語表示語の読み、表示のずれ、繰り返し再生の使いやすさ
訪日客向けの案内施設の英語説明を数文ずつ読み上げる画面固有名詞・経路・数字が正しく伝わるか
海外利用者向けの操作説明画面の手順を英語で読み上げる試作ボタン名との一致、停止・再開、低性能端末
ローカルAIの音声出力AIが生成した英語文を音へ渡す構成案文の生成と音声生成の待ち時間を分けて測る

ただし、onWordが呼ばれた瞬間をそのまま画面の点灯時刻にすると、生成が再生より先に進む分だけ表示も先走ります。再生開始からの経過時間と、返されたstart・endを合わせる設計が必要です。長い単語や遅い端末では時刻の通知が音声開始に間に合わない場合も、開発者の説明にあります。

時刻は、モデルが生成中にどの文字へ注意を向けているかを示すattentionと、音量を手がかりにした推定です。録音音声と正解文を照合するforced alignmentとは異なり、誤差もあります。学習者が話した音声の発音採点には使えません。その設計上の違いはLLMと発音評価の記事も参考になります。

数字・日付・金額は、先に読みを確定させる

見落としやすいのが、公式phonon-ttsとの機能差です。blixt/phononのREADMEは、数字・金額・日付・記号を読みの単語へ変換する処理を未対応としています。公式実装でうまく読めたという評価を、そのままこちらに当てはめないでください。

まずは「3:30 PM」を「three thirty in the afternoon」のように、原稿側で人が意図した読みへ直す方法が考えられます。ただし、日付の表記順や単位には地域差があります。商品価格・便名・型番など、読み間違いが問題になる箇所は自動変換だけで確定しないでください。

AIへ英語読み上げ原稿の下準備を頼む指示例
次の英語原稿を、英語の音声合成で試すために整えてください。
1. 意味と数値を変えない。原文と読み上げ用の文を並べる。
2. 数字、時刻、金額、略語は、想定する読みを英単語で示す。
3. 読みや意味が一意に決まらない箇所は、勝手に補わず「要確認」にする。
4. 固有名詞は別の確認一覧にまとめる。
5. 音声で正しく読めたとは主張しない。
対象地域・用途:[入力]
英語原稿:[機密情報を含めず入力]

これは原稿整理のための指示例です。モデルの日本語対応を追加する設定ではなく、読みの正しさを保証するものでもありません。手元の記録には、空の試用記録シートを使えます。

組み込み時の条件と費用:31Mと40Mを取り違えない

Gradiumのモデルカードは31Mの英語版をApache 2.0として公開しています。blixt/phononのコードもApache 2.0です。ライセンスの条件を守って利用する必要があります。一方、40Mの各言語版・多言語版はCC BY-NC 4.0で、同じ画面から選べても商用利用条件は同じではありません。商用利用はGradiumの案内で別途確認する対象です。

今回の31Mデモ試用に、有料契約・APIキー・従量課金APIは使っていません。自社サイトへ組み込めば、配信・通信・端末の計算資源・保守には費用がかかります。音声の生成回数だけでコストを見積もらず、初回ダウンロードと利用端末の負担も含めて考えましょう。

開発者の動作報告はmacOS/WindowsのChrome、iOSのSafariなどです。ブラウザー名だけで全端末の動作を保証するものではありません。WebGPUが使えない場合のCPU経路もWebAssembly SIMDが必要です。CPUを複数スレッドで動かすにはcross-origin isolationの条件があり、自社配信ではCOOP・COEPヘッダーと外部リソースの読込条件を検討します。既存サイトに無条件でヘッダーを追加せず、別ページで先に確認してください。

最初の採用判断は「短い英語原稿を、対象端末で確認できるか」

便利なのは、英語の音声と文字の対応を端末側で扱えることです。いきなり長い教材や業務システムへ組み込まず、数文の原稿、利用予定の端末、同じ声と速度を決めて試すと、導入判断に必要な情報が集まります。日本語音声が必須なら、今回のモデルは候補から外す判断になります。

確認日:2026年11月5日JST。実装仕様は36e7e5eを参照し、試用は同日の公開デモで行いました。デモ自身の配信コミット表示は確認していません。Show HNの紹介は開発者自身の投稿です。広範な第三者評価が定まった製品としては扱っていません。

よくある質問

日本語を読み上げられますか?
標準の31Mは英語専用です。40M多言語版も日本語を含みません。日本語の会議文字起こしや発音採点をするツールでもありません。
44.3MBのメモリがあれば動きますか?
44.3MBは実装側が示す初回ダウンロード量です。実行中には計算用のメモリなどが別に必要で、ブラウザー全体の必要メモリを示す数字ではありません。
今回のデモはGradium公式のものですか?
blixt/phononはAndreas Blixt氏による第三者実装です。GradiumのPhononモデルを使いますが、公式ブラウザーパッケージphonon-ttsとは別で、数字や日付の読みへの変換などに機能差があります。
シェア

この記事の感想を教えてください

あなたの 1 クリックで、本当にこの記事は更新されます。「もっと詳しく」「続編希望」が一定数集まった記事は、 ふくふくが 実際に内容を拡充したり続編記事を公開 します。 送信したリアクションはお使いのブラウザに記録され、再カウントされません。

シリーズの外も探す:

まずは、現状を聞かせてください。

要件が固まっていなくて大丈夫です。現状診断と方針提案までを無料でお手伝いします。

無料相談フォームへ hello [at] hukuhuku [dot] co [dot] jp