2025-05-16

VideoCaptionsプラグインで動画に字幕をつける

用語

用語	説明
字幕	動画の題・配役・説明・台詞(せりふ)などを文字で映し出すもの。
バリアフリー字幕	上記の字幕に加え、それ以外の情報、話者、動画の効果音などの音などの情報を文字で表した字幕。
SRT	動画に字幕をつけるためのファイルフォーマットの1つ(拡張子 .srt)。
VTT(WebVTT)	動画や音声トラックなどの他のメディアと時間軸を合わせて配置された特定のテキスト「キュー」を提供するテキストファイル(拡張子.vtt)。 subtitles : 音声のダイアログにテキスト翻訳を提供します。 captions : 話されたテキストの文字起こしを提供し、音楽や背景の音など、の音声に関する情報を記載することができます。これらは聴覚障害のあるユーザーのためのものです。 chapters : 高レベルなナビゲーション情報を提供し、ユーザーが関連するコンテンツに簡単に切り替えられるようにします。 metadata : 他のあらゆる時系列情報に用いられます。 ※ PowerCMS Xでは captions(または subtitles)と、chaptersに対応するVTTファイルを生成できます。
SRV3	動画に字幕をつけるためのファイルフォーマットの1つ(拡張子 .srv3)。XMLで記述し字幕にルビや色情報などを持たせることが可能です。
ハード字幕	SRT/VTT/SRV3などと異なり、映像そのものに字幕を合成(焼き付け)したものです。環境を問わずに字幕を表示させることができますが、字幕を消したりすることはできず、合成処理には時間(負荷)がかかります。
Groq (グロック)	言語モデル処理に特化したLPU(Language Processing Unit)を開発しているアメリカ企業。この会社が適用する自動文字起こしなどのAIサービス。
Amazon Transcribe	AWS(Amazon Web Services)が提供する音声からの文字起こしサービスの名称
Google Cloud Speech-to-Text	Google Cloudの音声からの文字起こしサービスの名称
プロンプト	AIに対するユーザーからの指示や質問のこと。AIによる文字起こしサービスに「Groq」を利用する時はAIにヒントや固有名詞などを渡すことで文字起こしの精度を上げることができます。

字幕テキストのフォーマット

SRT形式

シンプルで普及しているフォーマットです。

1
00:00:00,500 --> 00:00:05,000
吾輩は猫である


2
00:00:05,500 --> 00:00:10,000
名前はまだ無い

VTT (WebVTT)形式

cタグ(<c.vttTitle.vttWhite>吾輩は猫である</c>)はスタイルを適用するためのものです。HTMLを含めることができるので、ruby, rtタグを使うことでふりがなを付けることができます。PowerCMS Xの動画プレイヤーはこの VTT形式のファイルを利用します。

WEBVTT


00:00:00.500 --> 00:00:05.000  line:50%
<c.vttTitle.vttWhite>吾輩は猫である</c>


00:00:05.500 --> 00:00:10.000  line:100%
<c.vttBottom.vttWhite>名前はまだ無い</c>

WebVTTは字幕のほかにチャプターを作成することもできます。

WEBVTT


00:00:00.000 --> 00:10:00.000 0
第一章


00:10:00.000 --> 00:20:00.000 0
第二章

字幕とチャプターを両方読み込ませることで、動画プレイヤーの右下の部分で指定した箇所にジャンプすることができるようになります。

<video controls src="video.mp4">
  <track default kind="captions" src="captions.vtt" />
  <track default kind="chapters" src="chapters.vtt" />
</video>

動画プレイヤーの右下にチャプターがポップアップ表示されちる

SRV3形式

head内に位置、色、表示などの情報を記述しbody内に字幕の時間とテキスト、定義した表示情報を属性で指定します。WebVTTに rubyタグを入れたものは YouTubeには対応していないのに対して、SRV3形式でルビを指定したものは YouTubeでふりがな付きで表示できます(モバイルアプリは未対応)。

<?xml version="1.0" encoding="utf-8" ?>
<timedtext format="3">
<head>
<pen id="1" sz="400" fc="#FFFFFF" ec="#000000" et="3" bo="0" b="1" />
<pen id="2" sz="200" fc="#FFFFFF" ec="#000000" et="3" bo="0" b="1" />
<wp id="1" ap="7" ah="50" av="100"/>
<wp id="2" ap="4" ah="50" av="50" />
<ws id="1" ju="2"/>
</head>
<body>
<p t="500" d="4500" wp="1" ws="1"><s p="1">吾輩は猫である</s></p>
<p t="5500" d="4500" wp="2" ws="1"><s p="2">名前はまだ無い</s></p>
</body>
</timedtext>

利用するプラグイン

以下の4つのプラグインを有効化する必要があります。

FileUploader : 大容量のファイルアップロードを可能にするプラグイン
VideoCaptions : 動画の字幕作成や編集を行うプラグイン
SimplifiedJapanese : 字幕にふりがなを付けたり辞書を利用するために有効化します
BannedWords : 自動で文字起こしされたテキストの文字校正を自動で行います

ライブラリと環境変数

以下のソフトウェアをサーバーにインストールしてください。

FFmpeg / ffprobe : https://www.ffmpeg.org/ 別ウィンドウで開きます
MeCab / mecab-dict-index / IPA 辞書 : https://taku910.github.io/mecab/ 別ウィンドウで開きます
wkhtmltoimage : https://wkhtmltopdf.org/ 別ウィンドウで開きます

以下の環境変数を config.jsonに追加します。

ffmpeg_pathと ffprobe_path以外は初期値が登録済みです。

"mecab_path" : "/usr/local/bin/mecab",
"mecab_dict_index_path" : "/usr/local/libexec/mecab/mecab-dict-index",
"mecab_dic_path" : "/usr/local/lib/mecab/dic/ipadic",
"wkhtmltoimage_path" : "/usr/local/bin/wkhtmltoimage",
"ffmpeg_path": "/usr/local/bin/ffmpeg",
"ffprobe_path": "/usr/local/bin/ffprobe",

文字起こし AIの APIキーを取得する

以下のサービスに対応しています。

速度、コスト、精度と設定の容易さの面から Groqをオススメします(APIコール数に制限はありますが無料で利用できます)。

以下 Groqでの設定方法を示します。

https://groq.com/ 別ウィンドウで開きますにアクセスしてアカウントを作成
Developers → Free API Key → Create API Key で APIキーを作成
PowerCMS Xのシステムプラグイン設定 → Groqの設定に APIキーを登録して保存します。

モデルは whisper-large-v3 と whisper-large-v3-turboから選択できます。ここでは初期値 whisper-large-v3のままとします。

以上で準備は整いました。

動画をアップロードして AIで字幕を生成する

システムオブジェクト → ファイルを選択して「新しいファイル」から動画をアップロードします。字幕の作成を開始するために一度そのまま保存してください。
言語コード(規定値は「日本語」)を選択して「AI字幕生成」ボタンをクリックします。

言語コードが「日本語」の場合のみ次のダイアログが表示されます。ここに動画のシナリオや固有名詞などを含むテキストをペーストして「固有名詞を抽出する」ボタンをクリックします。

抽出された固有名詞にチェックを入れるとWhisper APIにプロンプトとして渡されるほか「ユーザー辞書」に固有名詞として登録され文字起こし後の後処理で誤りの自動修正に利用されます。

「単語を登録して字幕を作成する」をクリックすると、動画の長さに比例して処理時間がかかりますが、しばらく待つと字幕が生成されカード一覧のレイアウトになります。

カード一覧画面のレイアウト

動画プレイヤー(プレビューエリア)
「プレビュー」ボタン : 現在編集中の字幕をプレビュー再生します。
「 AI字幕生成」ボタン : もう一度実行すると現在編集中の字幕は破棄され再度自動文字起こしを行います(自動文字起こし実行済みの動画の場合は APIコールは発生せずにキャッシュから再生成します。辞書などを登録してから再実行することで固有名詞の反映などが可能です)。
「字幕合成」ボタン : 動画に字幕を合成します(いわゆるハード字幕で、処理には動画の長さと字幕のコマ数に応じて処理時間がかかります)。
「字幕作成」ボタン : テキスト字幕ファイルを生成します。フィーマットは「SRT」「VTT」「SRV3」の3種類です。
「時間調整」ボタン : 字幕全体、もしくはアクティブなカード以降の字幕の時間を秒を指定してずらします。前へずらす場合はマイナスの数字を指定します。
「言語コード」ドロップダウンメニュー : 言語を指定するほか「自動判別」を選択できます。言語が単一でわかっている場合は処理時間と正確性の点で指定した方が良い結果が得られます。
「カード」「タブ区切り」切り替えタブ : カードをパネル状にレイアウトした表示とテキストエリア表示を切り替えます。テキストエリア表示の時は時間と字幕、設定がタブ区切りテキストとして格納されています。Microsoft Excelなどの表計算ソフトのデータをペーストしたり表計算ソフトで字幕を編集することができます。
「カード追加」ボタン : プレビュー動画の現在の再生位置にカードを追加します。セットされる秒数は環境変数「video_captions_fill_card_per」で指定された秒(初期値は5秒)です。
「固有名詞」ボタン : ダイアログに固有名詞の一覧を表示し、代替の変換候補がある場合はあわせて表示します。対象の固有名詞を選択して一括置換が可能です。
「検証」ボタン : 字幕の長さ(文字数)、字幕の時間(短すぎる、重複しているなど)、常用漢字外の漢字、フィラーなどを検証します。エラーが検出されると一覧が表示されます。
「検索」ボタン : 検索と置換が行えます。Ctrl(⌘)キー+Fキーで呼び出すこともできます。
カード : 1つのシーンの字幕テキストと設定などは各々カードとして時間順に配置されます。カードをクリックすると編集ダイアログが開きます。動画プレイヤーの再生時間とマッチしているカードはアクティブなカードとして青い枠線が付きます。
カード時間(左上) : クリックするとプレビュー動画の再生時間がそのカードの開始時間にセットされます。
カード削除ボタン(右上1) : このカードを削除します。
カード追加ボタン(右上2) : このカードの後ろにカードを追加します。1秒以上の空きが必要です。

カード編集ダイアログ

カードをクリックすると編集ダイアログが開きます。新規カード作成ボタンをクリックした時も同じ画面となります。

動画プレイヤー(プレビューエリア)
開始時間・終了時間 : 右のビデオカメラアイコンをクリックすると動画プレイヤーの現在の時間をセットします。
録音 / 音声作成 : ボタンをクリックするとマイクの音声を録音します。録音した内容を再生して確認後、動画に合成することができます。「音声作成」チェックボックスは SimplifiedJapaneseプラグインで音声エクスポートの設定を有効化している場合のみ表示されます(AWS Pollyを利用してテキストの読み上げ音声を作成します)。
字幕編集エリア : 文字数が多い時は自動的に改行されます(プラグイン設定または個人設定で変更可能)。明示的に改行を入れるにはHTMLの「<br>」タグを入力します(Shiftキー+Returnキーで挿入できます)。
表示位置 : なし、上または下、タイトルを選択すると中央に文字サイズ大で配置されます。
テキスト処理 : ふりがなや分かち書きを自動処理することができます。
文字 : 文字色(白または黒)、半透明の背景を入れる・入れない、斜体の設定ができます。
チャプター : チャプターを選択すると別名のチャプター用 VTTファイルが生成されます(filename.mp4に対して filename-ch.vtt というファイル名で生成されます)。
編集 : 動画の簡易編集が可能です。動画編集処理には動画の長さに比例して処理時間がかかります。
1. 映像を一時停止 : 開始時間から終了時間の間映像を静止画にして無音部分を作ります。
2. シーンをカットする : 指定された開始時間から終了時間の間の動画をカットして動画を短くします。
3. シーンをエクスポートする : 指定時間の動画、または開始時間の静止画をエクスポートします。
4. ウォーターマークを合成 : テロップやロゴなど、静止画を指定時間範囲の動画に合成します。「シーンをエクスポート」で静止画としてエクスポートした画像をベースに作成することで、サイズをあわせることができます。
字幕を分割 : 字幕編集エリアのキャレット位置でカードを分割します(各々の時間は半分になります)。
次をマージ : 次のカードと編集中のカードをマージして 1シーンにまとめます。マウスオーバーすると次のカードの字幕の文字と時間を確認できます。
ふりがなボタン : 字幕編集エリアの選択されたテキストにふりがなを追加します(HTMLのルビタグでマークアップされます)。自動で付けたルビが誤っている時や特定の文字にルビを振りたい時に利用します。
校正支援ボタン : 固有名詞の誤りや常用漢字外の漢字など、修正の提案を表示します。詳しくは「BannedWordsプラグインによる新しい校正支援機能について別ウィンドウで開きます」をご覧ください。
プレビュー : 動画プレイヤーに現在編集中の字幕をプレビュー表示します。
プレビュー(カメラアイコン付き) : 動画プレイヤーに現在編集中の「ハード字幕」をプレビュー表示します(画像の生成に少し時間がかかります)。
削除 : このカードを削除します。
確定して前へ : 内容を確定して一つ前のカードの編集ダイアログに遷移します。
保存 : 内容を確定してダイアログを閉じます。
確定して次へ : 内容を確定して一つ次のカードの編集ダイアログに遷移します。
ダイアログオプション : ダイアログの項目の表示非表示、初期値などを個人ごとに設定するダイアログを表示します。

ダイアログオプション

ダイアログオプションボタンをクリックすると、カードの編集画面の表示項目のカスタマイズを行えます。設定はユーザーごとに保存されます。

表示 : チェックを外すとその項目が非表示となります。
規定の位置 : 上、下、またはタイトルから選択
規定の文字色 : 白、黒から選択
テキスト処理 : なし、ルビ、分かち書き、ルビと分かち書きから選択
自動的に改行する : 文字数が多い時、できるだけ均等に、単語の切れ目を避けた位置で改行します
最大文字数、1秒あたりの最大文字数、最小表示時間については「検証」ボタンをクリックしてチェックする時に目安として利用されます(文字数超過や短すぎる場合に警告を表示)。

追加ファイル

「追加ファイル」欄にファイルをドラッグ&ドロップすることで、動画や音声の合成や字幕テキストのインポートが可能です。

画像 (タイトル画像・エンディング画像)

画像を指定した時間静止画動画にして動画の前もしくは後ろに連結合成します。

オーディオ (MP3)

ナレーションやBGMなどの音声を合成することができます。合成する音量を調整することが可能です。一定時間または終了時間にあわせてフェードアウトすることもできます。

動画 (MP4)

動画を連結またはワイプ合成することができます。

テキスト字幕ファイル (VTT/SRT)

字幕をインポートできます。編集中の字幕とマージするか上書きするかを選択できます。YouTubeなどからエクスポートした字幕を反映することなどが可能です。

動画編集・合成後のファイル名について

ダイアログで動画編集を行う際、または追加ファイルで動画や静止画、音声を合成する時、ファイル名を選択するドロップダウンメニューが表示されます。保存できるファイルはオリジナルの他に2ファイルです。ファイル名に追加される文字列は環境変数で指定されています。これらの環境変数を空 "" とすると、ファイル名を選択するドロップダウンメニューは表示されず、オリジナルを常に上書きするようになります。

名称・種別	ファイル名	環境変数名	初期値
オリジナル	filename.mp4	-	-
字幕合成	filename-su.mp4	video_captions_postfix	-su
合成動画	filename-ed.mp4	video_captions_concat_postfix	-ed

カテゴリー：プラグイン | 技術情報 | リリース＆アップデート情報

投稿者：Junnama Noda