# 動画・音声から無料で字幕を自動生成｜ブラウザ完結・オフライン対応の Whisper 字幕ガイド

> VideoBuff の自動字幕生成機能を技術背景・操作手順・他ツールとの違いまで含めて完全解説。OpenAI Whisper Large v3 Turbo をブラウザ内で動かし、音声をアップロードせずに日本語・英語の字幕に変換します。会議の議事録字幕、ポッドキャスト書き起こし、インタビュー動画の字幕付け、ショート動画 (9:16) のキャプション付けなど、機密性の高い音源にも安心して使える設計。日本語音声の英語翻訳字幕、SRT / VTT / TXT 形式のダウンロード、推論中のライブプレビューにも対応。WebGPU で高速、非対応環境では WASM フォールバックで動作。

_Last updated: 2026-05-04 · First published: 2026-05-04_

## なぜブラウザ完結なのか — 仕組みとプライバシー

字幕生成サービスの多くは、音声をいったんクラウドへアップロードしてから AI 処理を行います。便利ですが、社内会議・インタビュー・取材音源・個人的な記録などを扱うときは、たとえ匿名化や暗号化が施されていても外部サービスに渡すこと自体が憚られる場合があります。NDA を結んでいる取材音源、医療や法務領域の会話、未公開の社内議論など、用途によっては「外部に出さない」が要件になります。

VideoBuff の自動字幕は、ブラウザ上で動作する [OpenAI Whisper Large v3 Turbo](https://huggingface.co/openai/whisper-large-v3-turbo) の ONNX 化モデルを [Hugging Face Transformers.js](https://huggingface.co/docs/transformers.js) ランタイムで実行します。録音データはブラウザのメモリ内だけで処理され、ネットワークに送信されることはありません (アップロードゼロ、外部 API 呼び出しなし、サーバーログなし)。初回利用時にだけモデルファイル (約 1GB) がブラウザのキャッシュ (Cache API / IndexedDB) にダウンロードされ、それ以降はオフラインで動作します。継続的に利用している限り、キャッシュは LRU 方式で永続的に保持されます (数ヶ月放置した場合や、デバイスのストレージが逼迫した場合は再ダウンロードが発生する可能性があります)。WebGPU 対応ブラウザ (Chrome / Edge) では GPU で高速推論、非対応環境では WASM にフォールバックして動作します。

技術的には Whisper の **encoder-decoder Transformer** をブラウザ内で実行する設計です。30 秒単位で音声をチャンク化し、それぞれの開始・終了タイムスタンプ付き字幕を生成。各チャンクは前後 5 秒のオーバーラップを持たせて境界の取りこぼしを抑えています。

機密性が高い音源、組織のコンプライアンス要件で外部アップロードが禁じられているケース、あるいは単純にクラウドへのアップロードを避けたい場合に、選択肢として有効です。

## 使用モデル — Whisper Large v3 Turbo

[Whisper Large v3 Turbo](https://huggingface.co/openai/whisper-large-v3-turbo) を使った多言語モデル一本で運用しています。パラメータ数 809M (Whisper Large v3 比でデコーダ層を 32 → 4 に削減し 6 倍高速化)。日本語・英語の精度は実用域で、固有名詞が頻出する取材音源や長尺インタビューでも安定します。

以前は「高速 (Whisper Small)」「高品質 (Turbo)」の 2 段階を提供していましたが、軽量版のメリット (短い DL + 低スペック対応) よりも「精度差で 2 度走らせる」コストの方が大きいと判断し、Turbo 単一モデルに統合しました。「字幕生成 → モーダルを開く → 開始」の 3 アクションで最良結果が得られる、というシンプルさを優先しています。

初回利用時のみブラウザキャッシュに約 1GB のモデルファイルがダウンロードされ、2 回目以降は瞬時に立ち上がります。WebGPU 対応ブラウザでは GPU で並列処理され、30 秒の音声を数秒で処理可能。WASM フォールバック環境ではその数倍時間がかかります。

精度の目安としては、明瞭な話速と環境ノイズの少ない録音であれば、日本語の文字単位エラー率 (CER) が 5〜10% 程度、英語の単語単位エラー率 (WER) が 5% 前後に収まるケースが多いです。話者が複数で重なる、専門用語が極端に多い、録音環境が悪いなどの条件では精度が落ちるので、後段の手動編集前提で運用するのが現実的です。

## 翻訳字幕 (日本語音声 → 英語字幕)

音声の言語に「日本語」を選択すると、「字幕の言語」に「英語に翻訳」が現れます。日本語音声を翻訳した英語字幕として出力するモードで、社外向け動画やグローバル配信に有用です。

技術的には Whisper の "translate" タスクを利用しています。Whisper の仕様上、英語以外の言語への翻訳はサポートされていません (例: 日本語音声 → 中国語字幕、英語音声 → 日本語字幕は不可)。日本語 → 英語の片方向のみ対応します。

英語に翻訳した字幕は、英語音源と同じトラックに配置されます。日本語字幕も同時に欲しい場合は、それぞれ別々に実行してテキストトラックを 2 つ並べてください。

## 字幕の編集とダウンロード

生成が終わると、モーダル内に字幕が一覧表示されます。各行のテキストを直接クリックして修正、× ボタンで不要な行を削除できます。タイムラインに反映する前に、ここでざっと整えておくと後の手戻りが減ります。

字幕ファイルが必要な場合は SRT・VTT・TXT のいずれかでダウンロードできます。SRT は YouTube や多くのプレイヤーが受け取れる字幕形式、VTT は HTML5 の <track> 要素で読み込める形式、TXT は単純なプレーンテキスト書き起こしです。

「タイムラインに追加」を押すと、字幕がテキスト専用トラックとしてタイムラインに置かれます。動画のキャンバス比 (16:9 / 9:16 など) に応じて、フォントサイズと 1 行の長さは自動調整されます。配置後は通常の TextClip と同じく位置・色・アウトライン・フォントを Inspector から自由に変更可能です。

## ライブプレビュー

推論中、確定した字幕がリアルタイムで表示されます。最終結果が出るまで待たなくても「もうこのあたりまで処理が進んでいる」「冒頭の認識精度が低そうだから設定を見直そう」といった判断ができます。

長尺音声 (10 分以上) では特にこのフィードバックが効いてきます。完成までの心理的な待ち時間が大幅に短縮されます。

なお、ライブプレビューは Whisper のストリーミング中間出力 (30 秒ウィンドウ + 5 秒オーバーラップ) を生で表示するため、文の途中で切れたり重複したりして断片的に見えることがあります。完了時に Whisper 内部の `_decode_asr` がすべてのチャンクを統合・重複除去して綺麗な最終結果に整形しますので、ライブ表示が断片的でも完成版は問題ありません。

## カラオケ字幕モード — 単語ごとに色が変わる字幕

字幕生成モーダルの「詳細設定」で **「カラオケ字幕として配置」** を ON にすると、Whisper の単語タイムスタンプ機能を使って **再生中に単語ごとに色が変わるカラオケ風字幕** を生成できます。ショート動画で定番の表現が、ブラウザ完結 + 自動 + 無料で作れます。

通常の字幕モード (= OFF) はセグメント単位で TextClip を配置しますが、カラオケモードは行単位に細かく分割した TextClip 群を生成し、各クリップに **単語ごとの発話タイミング** を埋め込みます。プレビューでも書き出し動画でも、playhead が単語の発話時刻に達するたびに該当文字が accent 色に切り替わります。

**4 つの表示スタイル** — 字幕生成時に「カラオケ表示」で 4 種から選べます (生成後に Inspector からも変更可能)。

- **クラシック**: 発話済みの単語が accent 色のまま残る、実カラオケ風の塗りつぶし
- **ポップ**: 発話中の文字が一瞬だけ拡大 (弾むアニメーション)
- **グロウ**: 発話中の文字の周りに accent 色のハロー (光彩) が出る
- **バー**: 発話済みの文字の下に accent 色の下線が左 → 右に伸びる (プログレスバー)

accent 色も生成時に指定でき、すべての字幕クリップに一括適用されます。生成後は各 TextClip の Inspector で個別に「カラオケ色」「カラオケ表示」を変更可能。

**仕組みと精度** — Whisper の `return_timestamps: 'word'` オプションを使い、cross-attention に基づく **dynamic time warping** で単語境界を推定します。単語より細かい (= 文字単位の) タイミングは Whisper 自身は出さないので、VideoBuff 側で **単語の duration を文字数で均等割り** して補間しています。日本語の場合、Whisper は形態素の塊で 1 単語を出すため、文節ごとに自然なリズムで色が変わります。

精度は素材次第で、早口の音声や強い背景ノイズがある場合は単語タイミングが ±100〜300ms ずれることがあります。発話 + 音楽が同時の素材は不向き。誤認識やズレが目立つ場合は WordTimingPreview 内で行ごとに編集 / 削除してから配置できます。

**プレビューと書き出しの一貫性** — プレビュー (DOM / CSS) と書き出し動画 (Canvas 2D) で同じタイミング計算式 + accent 色解決ロジックを共有しているため、見た目はほぼ完全に一致します。書き出し動画にもカラオケ効果がそのまま焼き込まれます。

## 速度のヒント

初回はモデルダウンロードに時間がかかりますが、2 回目以降はブラウザのキャッシュから即起動します。WebGPU 対応ブラウザ (Chrome / Edge) では推論も高速。

長尺音声は事前に不要な箇所を削っておくと、純粋な処理時間も短縮されます。会議録音などで沈黙やノイズが多い場合は、自動無音カット (Auto-trim silences) を先に適用してから字幕生成を実行すると、不要なセグメントの混入が減って後の編集がラクです。

## 他の字幕自動生成ツールとの違い

字幕の自動生成は今や珍しくなく、CapCut・Vrew・Adobe Premiere Pro Speech to Text・Descript など、選択肢は豊富にあります。VideoBuff の立ち位置は以下の組み合わせです。

ブラウザだけで完結する点
CapCut や Vrew・Descript は自社サーバーへ音声をアップロードして処理します。Adobe Premiere Pro の Speech to Text はローカル実行ですが、Adobe Creative Cloud の有料サブスクリプションとデスクトップアプリのインストールが必要です。VideoBuff はインストール不要・アカウント不要・完全ブラウザ実行で、URL を開けばすぐ使えます。

動画編集と統合されている点
Web ベースの Whisper デモ ([whisper-web](https://github.com/xenova/whisper-web) など) はあくまで字幕生成専用ツールで、生成結果は SRT/VTT として手動で動画編集ソフトに取り込むワークフローが必要です。VideoBuff は字幕生成と動画編集が一体化しているため、生成された字幕がそのままタイムライン上に並び、フォント・色・位置・トランジションを Inspector でそのまま編集できます。

無料で使える点
クラウド型の多くは無料枠 (10 分まで等) があり、超過すると有料プラン (月額 $10〜30 程度) に誘導されます。Adobe Premiere Pro は Creative Cloud 全体で月額 6,480 円〜 (個人プラン)。VideoBuff は完全無料で、利用時間や月間文字数の制限はありません。コストはユーザー側のブラウザの計算リソースだけ。

プライバシーが事実として保証される点
クラウド型サービスはプライバシーポリシーで「学習に使用しない」「保管期間 N 日」と謳っていても、転送・保存自体を技術的にゼロにすることはできません。VideoBuff は「ネットワークに送信していない」ことが DevTools の Network タブで実測できる構造で、保証ではなく事実として担保されます。NDA 案件・医療・法務領域・社内会議などで重要になります。

トレードオフ
モデルがローカル動作する分、ハイエンドな商用 ASR (Google Speech-to-Text の latest_long、AssemblyAI Universal-2 など) と比べると精度の絶対値ではやや劣ります。固有名詞辞書や話者分離・感情分析といった高度機能も付帯しません。「最高精度を求めるが音源は外部に出さない」 → Whisper をローカルで動かす商用パッケージや GPU サーバー運用、というのが次のステップです。

## よくある質問

Q. 商用利用はできますか?
A. はい、生成された字幕に課金や利用制限はありません。VideoBuff 自体も MIT ベースの依存とブラウザ完結の Whisper モデル (MIT) を使っているため、業務用途で字幕を出力して動画として配布する用途を妨げる権利上の制約はありません。詳細は[OSS ライセンス](/ja/legal/oss)ページの「ランタイムで取得する機械学習モデル」セクションを参照してください。

Q. 何分の音声まで処理できますか?
A. 仕様上の上限はありませんが、実用上はブラウザの利用可能メモリと処理時間に左右されます。30 分以下の音声であれば多くの環境で問題なく動作します。1 時間を超える長尺音声は、事前に [自動無音カット](/ja/guides/timeline-editing) で不要部分を削るなど、入力サイズを減らすのが推奨です。

Q. WebGPU が無いブラウザでも動きますか?
A. WASM (WebAssembly) フォールバックで動作します。WebGPU 環境より数倍時間がかかりますが、結果は同等です。Safari は順次 WebGPU 対応が進んでいますが、現時点で確実に GPU 推論を使いたい場合は Chrome / Edge を推奨します。

Q. 翻訳機能の対応言語は?
A. Whisper の仕様上、**任意の言語 → 英語** の片方向のみサポートします (例: 日本語音声 → 英語字幕)。逆方向 (英語 → 日本語) や英語以外への翻訳には対応していません。多言語間の翻訳が必要な場合は、まず字幕を日本語/英語のいずれかで生成 → 別途翻訳ツール (DeepL や Claude など) で多言語化、というワークフローを推奨します。

Q. 音声データはどこに保存されますか?
A. ブラウザのメモリ内のみで処理され、生成完了後は破棄されます。VideoBuff サーバーや Hugging Face を含む外部サービスに送信・保管されることはありません。一方でモデル weights ファイルは初回利用時に Hugging Face からダウンロードされ、ブラウザの Cache API / IndexedDB に保存されます (これは通常の Web リソースキャッシュと同じ挙動)。

Q. 生成された字幕の編集はモバイルブラウザでもできますか?
A. テキスト編集と SRT/VTT/TXT ダウンロードは可能ですが、モデル DL のサイズ (約 1GB) と推論負荷を考えると、PC ブラウザでの利用が推奨です。モバイルでは初回 DL のストレージ消費とバッテリー消費が大きくなる可能性があります。

Q. 縦動画 (9:16) のショート動画でも使えますか?
A. もちろん使えます。VideoBuff は動画のキャンバス比に応じて字幕のフォントサイズと 1 行あたりの最大文字数を自動調整します。9:16 のキャンバスでは 1 行が短めに分割され、画面外にはみ出さないよう配慮されます。

Q. 字幕の精度を上げるコツは?
A. (1) 録音前にマイク位置を発話者に近づけ環境ノイズを抑える、(2) 既存録音は VideoBuff の[オーディオ編集機能](/ja/guides/audio-mixing)、または姉妹サービス [AudioBuff](https://audiobuff.app/) で先にノイズ除去・音量正規化してから字幕生成、の 2 点が効果的です。VideoBuff は単一の高精度モデル (Whisper Large v3 Turbo) を使用しているため、モデル選択での精度向上は不要です。

## 字幕生成ボタンが出ない場合 (応用)

字幕生成は **音声に紐づく機能** という設計なので、Inspector の「字幕生成」セクションは「字幕生成に使える音声」がそのクリップに紐づいているときだけ表示されます。

音声クリップを選択
常に表示されます。生成された字幕は音声クリップの位置にタイムライン配置されます。

動画クリップを選択 (リンクされた音声あり)
動画 import 直後のデフォルト状態。リンクされた音声を自動で使い、字幕は動画クリップの位置に配置されます。標準ケースで、特に意識する必要はありません。

動画クリップを選択 (Unlink 済み or 音声クリップを削除済み)
**字幕生成セクションは表示されません**。動画と音声を分離している状態では、字幕がどちらの位置に置かれるべきか曖昧になるためです。字幕を生成したい場合は分離後も残っている **音声クリップを選択** してください (字幕は音声クリップの位置に置かれ、結果的に音声と同期します)。
動画側にも字幕を置きたい場合は、Inspector のリンクボタンで再リンクするか、動画と音声を同位置に揃えてからリンクし直してください。

音声単体ファイル (m4a・mp3 など)
音声クリップとしてインポートしたものからの字幕生成にも対応。会議録音やポッドキャスト編集、Podcast 用音源など、映像が無いケースでも使えます。

なお、本格的なノイズ除去・音量正規化・EQ などの音声編集を字幕生成の前に施したい場合は、姉妹サービスの[AudioBuff](https://audiobuff.app/)で先に整音してから VideoBuff にインポートする運用がおすすめです。
