Repolode
anghunk

anghunk/video-transcript

ローカルのMP4に字幕を付けて編集・装飾し、焼き込んで書き出せるブラウザベースの字幕編集ツール。Whisperによる端末内文字起こしにも対応。

代替できる製品:CapCutDescript

スター
214
フォーク
11
未解決の Issue
0
最終コミット
25 日前

これは何?

Video Transcriptは、すべてブラウザ内で動作する字幕編集ツールです。ローカルのMP4を読み込み、必要に応じて端末上で動作するWhisperで字幕を生成し、タイムライン上で字幕セグメントやタイミングを編集できます。字幕全体のスタイルを設定して、字幕を焼き込んだMP4を書き出せます。

動画、字幕、書き出しデータはすべて現在の端末内に保存されます。アカウントは不要で、音声や動画がアップロードされることもありません。プロジェクト、字幕の進捗、動画キャッシュはIndexedDBにローカル保存され、アプリはPWAとしてインストールできます。

音声認識にはTransformers.js経由でONNX Whisperモデルを使用し、WebGPUを優先して、利用できない場合はCPU上のWASMにフォールバックします。モデルはHugging Faceから一度ダウンロードされてキャッシュされます。中国語、英語、日本語、韓国語に対応し、言語の自動検出も利用できます。

主な機能

  • 01ローカルのMP4ファイルを読み込み、解像度、長さ、音声トラックの情報を表示します。
  • 02言語の自動検出に対応し、Whisperで端末内に字幕を生成します。
  • 03動画の再生と同期したタイムライン上で、字幕セグメントやタイミングを編集できます。
  • 04プリセットや色、サイズ、位置、配置を指定して、字幕全体のスタイルを設定できます。
  • 05元のAAC音声を維持したまま、元動画に近い画質、4K、1080pでMP4を書き出せます。

ユースケース

  • クラウドサービスにアップロードせず、ローカル動画に字幕を焼き込む。
  • 中国語、英語、日本語、韓国語の動画をすばやく文字起こしし、内容を修正する。
  • ブラウザ上で、SNSやプレゼンテーション向けの字幕付きMP4クリップを作成する。

クイックスタート

  1. 1

    リポジトリをクローン

    git clone https://github.com/anghunk/video-transcript.git
  2. 2

    プロジェクトフォルダーに移動

    cd video-transcript
  3. 3

    依存関係をインストール

    npm install
  4. 4

    開発サーバーを起動

    npm run dev

使う前に知っておきたいこと

  • 音声認識モデルとランタイムファイルは、初回使用時にHugging FaceとjsDelivrからダウンロードされます。
  • 認識とエクスポートは、デバイスのメモリとブラウザーの対応状況に依存します。デスクトップではChromeまたはEdgeを推奨します。
  • 大きな動画(2 GB超、または長時間の4K動画)は、処理に失敗したり遅くなったりする場合があります。

トピック

よくある質問

video-transcript とは?
ローカルのMP4に字幕を付けて編集・装飾し、焼き込んで書き出せるブラウザベースの字幕編集ツール。Whisperによる端末内文字起こしにも対応。 Video Transcriptは、すべてブラウザ内で動作する字幕編集ツールです。ローカルのMP4を読み込み、必要に応じて端末上で動作するWhisperで字幕を生成し、タイムライン上で字幕セグメントやタイミングを編集できます。字幕全体のスタイルを設定して、字幕を焼き込んだMP4を書き出せます。
video-transcript は無料で使えますか?ライセンスは?
video-transcript は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。
video-transcript は今もメンテナンスされていますか?
活発にメンテナンス中。video-transcript の最終コミットは 2026年9月25日 です。
video-transcript は何に使えますか?
クラウドサービスにアップロードせず、ローカル動画に字幕を焼き込む。 中国語、英語、日本語、韓国語の動画をすばやく文字起こしし、内容を修正する。 ブラウザ上で、SNSやプレゼンテーション向けの字幕付きMP4クリップを作成する。
video-transcript のインストール方法は?
リポジトリをクローン: git clone https://github.com/anghunk/video-transcript.git プロジェクトフォルダーに移動: cd video-transcript 依存関係をインストール: npm install 開発サーバーを起動: npm run dev
video-transcript はどこで入手できますか?
ソースコードとインストール手順は GitHub にあります:https://github.com/anghunk/video-transcript

概要はプロジェクトの README をもとに AI が生成しています。GitHub の数値は毎日更新されます。

関連プロジェクト