How Chapterize Your Videos Using Webvtt Files
Tech Talk
Interactive video
動画にチャプターを追加する方法:WEBVTTファイルまたはインタラクティブ機能
Oct 22, 2024
動画チャプタは、視聴者が動画の特定の部分にジャンプするのに役立ちます。WebVTT ファイルまたはインタラクティブ オーバーレイを使用してビデオ チャプターを作成し、アップロードする方法について説明します。

マーケターは、コンテンツを小分けにするのが大好きです。電子書籍はブログに、インフォグラフィックはソーシャルバッジに、長編ビデオはハイライトリールやクリップになります。
スナック的なコンテンツが効果的なのは事実だが、そのために観客は短編コンテンツしか求めていないと思われがちだ。しかし、もしそうだとしたら、核物理学者を描いた3時間の歴史ドラマが2023年第3位の興行収入を記録するはずがない。
視聴者は、あなたの動画が短くなることを必要としているのではなく、動画に何を期待すればいいのかを知る必要があるのです。そのための最善の方法は、動画にチャプターを追加することです。
ビデオ・チャプターとは何ですか?
チャプターは、ビデオをセクションに分割するクリック可能なラベルで、ユーザーは見たいコンテンツを選択できます。ウェブページのヘッダーのように、チャプターはアウトラインとして機能し、サムネイルをスクラブするよりも情報を見つけやすい視聴体験を提供します。
ビデオは、ファイルのメタデータにチャプターが埋め込まれた状態で、ビデオ編集スイートからエクスポートできます。残念ながら、このデータはウェブ用にフォーマットされていないため、メタデータ・チャプターはオンライン・ビデオ・プラットフォーム(OVP)で表示できません。そのため、ほとんどのウェブベースの動画は、WebVTTファイルまたはインタラクティブ オーバーレイを使用してチャプターを作成します。
いつビデオ・チャプターを使うか
すべての動画にチャプターを追加する必要はありません。たとえば、ティーザーやプロモのような認知度向上のための動画や、デモ、説明、証言の動画は、短すぎて分割できません。コンテンツのチャプター化は、以下のような長編動画に最適です:
- ウェビナー。このようなビデオプレゼンテーションは長いだけでなく、すでに明確なセクションに分かれています。添付スライドの見出しをチャプターに変換するだけです。
- チュートリアル。ウェビナーと同様、説明やその他の教育コンテンツもチャプターに適しています。これらの動画には通常、参照するスライドはありませんが、タイトルカードやヘッダーのような情報が記載された下3分の1がある場合もあります。そうでない場合は、クリエイティブ・ブリーフとビデオ・スクリプトを見直しましょう。これらの資料には、コンテンツのアウトラインが含まれていることが多い。
- トレーニング。新入社員研修、スキルアップ、その他の社内動画は、ビデオプレゼンテーションとトーキングヘッドビデオが混在していることがよくあります。ウェビナーで述べたように、チャプターを使ったプレゼンテーションはわかりやすいものであるべきですが、その他のスタイルではクリエイティブなライセンスが必要になるかもしれません。部門によって、コンテンツを代理店に依頼したり、自主制作したりする場合があり、その場合、制作前の資料にアクセスできなかったり、存在しなかったりすることがある。このような場合は、自分でコンテンツを確認し、推奨される章タイトルを作成し、コンテンツ作成者やSMEとタイトルを吟味する必要があります。
- インタビュー。どのように制作されたかにもよるが、インタビュー映像はしばしば概要から逸脱したり、専門家のパネルのように意図的に構成されたスタイルでないことがある。司会者の質問に沿ってインタビューを章立てするのがベストな場合もありますが、作品全体を見直し、独自の構成を考えなければならない場合もあります。このような章立ては、インタビュアーやSMEに承認してもらうことを忘れずに。
前述した例は、長編コンテンツの一般的な例であるが、すべてを網羅しているわけではない。ケーススタディや企業文化のビデオにも、ビデオチャプターが有効な場合があります。5分以上の動画は、チャプターを追加するのが良い方法です。
ビデオ・チャプターのベスト・プラクティス
チャプターは、ユーザーが必要なトピックを素早く見つけられるようにする必要があります。つまり、重要な場面を説明的に簡潔に要約する必要があります。以下のベストプラクティスは、読者のこの期待に応えるのに役立ちます。
- 長さ。タイトルは3~5語程度にする。ウェブページの小見出しのように、タイトルは熟読されるよりもざっと目を通されることが多いので、各章を短いフレーズに凝縮する必要があります。ビデオ・プレゼンテーションには、独自のセクション・タイトルが含まれることがよくありますが、特に技術的なトピックの場合、あまり簡潔ではないかもしれません。既存のタイトルを修正するには時間がかかり、追加の承認が必要になることもありますが、より良いユーザー体験にはそれだけの価値があります。
- スタイルタイトルは一貫性を持たせ、読み飛ばしやすいように予測可能な形式に従う。例えば、ブログでよく使われるのは、小見出しを命令形の動詞句として書くことです:ビデオを見直す、アウトラインを作成する、章タイトルを作成する。慣れ親しんだ構造により、ユーザーは情報をより速く摂取し、自分のニーズに最も関連する特定の章を選択することができる。
- 頻度。章を追加するのは、サブトピックに目立った変化があった場合に限ります。例えば、ウェビナーでは、製品とは何か、なぜその業界に必要なのか、どのように使うのか、といった章を設けることができます。それぞれを章にすることもできます。逆に、製品の使い方を説明する各ステップは、章にすべきではありません。最適な章数はありません:10分のビデオに3つのチャプターがあってもいいし、12のチャプターがあってもいい。ビデオの最大のアイデアを表現していれば、合計の数は何でもいいのです。
- 配置。動画を公開または保存する前に、必ずチャプター マーカーを確認して、正しく配置されていることを確認してください。たとえば、タイムコードとタイトルが動画プラットフォームの外部で表記されている場合、タイプミス、直前の編集、新しいイントロによって、チャプターの配置がずれることがあります。制作ワークフローの終了間際にチャプターを追加するのがベストである理由もここにあります。
VTTファイルでチャプターを追加する方法
Web Video Text Track(WebVTT) ファイルは、通常クローズドキャプションに使用されるテキストファイルですが、ビデオチャプターにも使用できます。WebVTTファイルの作成はとても簡単です。
WEBVTT 00:00:00.000 --> 00:00:30.000 Lionfish 00:00:30.000 --> 00:00:54.000 Anemone 00:00:54.000 --> 00:01:25.000 Clownfish 00:01:25.000 --> 00:01:54.000 Sea Horse 00:01:54.000 --> 00:02:23.000 Crab 00:02:23.000 --> 00:02:35.000 Dolphins
You can use the above example to create your own file by copying and pasting the content into a text editor, like TextEdit on Mac or Notepad on PC. However, the file has to be in plain text format, not rich text. Notepad only supports plain text, but if you’re using TextEdit, make sure you select Format > Make Plain Text.
テキストをエディターにコピーしたら、チャプター名とタイムコードを更新します(例では、時:分:秒:フレームという標準的なSMPTEタイムコードに従っています)。その後、更新したファイルを保存し、拡張子を.vttに変更します(例:filename.vtt)。
OVP への WebVTT ファイルのアップロードは、動画にキャプションを追加するのと同様のプロセスです。たとえば、Brightcove では、次のようにファイルをアップロードします:
- Mediaモジュールでビデオを選択
- Select the Tracks tab
- Select +Add in the Text Tracks section You should see a small chapter icon in the bottom right corner of your video (next to the volume control). Click on it and you’ll see your chapters. Visit our support page for more information on how to create a WebVTT file.how to create a WebVTT file.
インタラクティブなチャプターの追加方法
インタラクティブ機能では、Web リンク、クイズ、投票、感情ボタン、他の動画への分岐、もちろんチャプタなど、クリック可能なオーバーレイを動画プレーヤに追加します。VTT ファイルとは異なり、テキスト エディタは必要ありません。また、少なくともブライトコーブでは、動画プラットフォームから離れる必要はありません。以下の手順に従ってください:
- インタラクティブ・モジュールを選択
- 新しいプロジェクトを作成する
- Select a time in the video, click the Add a chapter marker button, and add the chapter title (as well as any edits to the position or style)
- すべてのチャプターを追加した後、チャプター・メニュー・アイコンをクリックしてメニューを追加する。
ブライトコーブでは、目次を列として表示するかフルスクリーンとして表示するか、デフォルトで展開状態または折りたたみ状態にするか、位置を変更するかを設定できます。また、動画外のチャプタ メニューを作成するオプションもあり、プレーヤの横に表示されるため、トレーニング動画に最適です。インタラクティブ機能を使って動画にチャプターを追加する方法については、サポートページをご覧ください。
双方向ビデオ・チャプターの利点
ほとんどのコンテンツ・マネージャーやビデオ制作者は、キャプション用にWebVTTファイルをアップロードすることにすでに慣れているでしょうが、インタラクティブ・ビデオには明確な利点があります。
- より多くのコントロール。VTTチャプターはプレーヤーのデフォルトの表示設定に制限されますが、インタラクティブ機能にはさらにオプションがあります。位置や配置からスタイルやブランディングまで(カスタムCSSを追加することで)、ユーザー体験をより自由にコントロールできます。
- データを増やす。VTTファイルは、追加のエンゲージメントデータを作成しません。そのため、どのチャプタや重要な瞬間が反響を呼んだかを確認するには、動画のエンゲージメントをチャプタのタイムスタンプやタイトルと比較する必要があります。一方、ブライトコーブ インタラクティブでは、チャプタのエンゲージメントに関するレポートが自動的に生成されます。これはより効率的なプロセスであるだけでなく、各チャプタの視聴回数とクリック数を比較できます。特定のチャプタでのエンゲージメントのピークは、受動的な視聴によって引き起こされることもありますが、クリック データは能動的なエンゲージメントをより正確に示すため、より実用的です。
- より正確に。VTTファイルを使用するということは、視覚的な参照なしにビデオ・チャプターを作成するということです。これは決して難しい作業ではありませんが、些細なタイプミスが大きな問題を引き起こす可能性があることも意味します。インタラクティブは、ビデオのWYSIWYGのようなものです:作りながら出力をプレビューできる。ユーザーにとってはより良い体験であり、ミスを素早く発見できるレビューのレイヤーが追加されます。
WebVTTファイルは、動画にチャプターを追加する効果的な方法ですが、インタラクティブ機能を使えば、さらに簡単に追加できます。最適なオプションを選択し、動画のエンゲージメントに注目してください。動画の内容がはっきりわかり、重要な場面に簡単にナビゲートできる長い動画が、視聴者にどれだけ好まれるか驚くことでしょう。