アニメーション サムネイル（動画プレビュー）

アニメーション サムネイルとは？

アニメーション サムネイルは、本編動画から抽出された短いループ再生のプレビューです。静止画像の代わりに表示することで、より魅力的な視聴体験を提供します。

アニメーション サムネイルの特長:

• 1つ以上の HLS マニフェストとして配信
• デフォルトの長さ：約10秒
• デフォルトの開始位置：先頭フレーム（カスタマイズ可）
• グリッドやリストなどのプレビュー用途で、静止ポスター/サムネイル画像の代替として使用

Brightcove Player でアニメーション サムネイルを設定する

Brightcove Player でアニメーション サムネイルを使用するには、次の手順に従います。

1. Players モジュールに移動し、対象のプレーヤーを選択するか、新しいプレーヤーを作成します。
2. Player バージョンを 7.37.3 以降に設定します。
3. プレーヤーの JSON 設定に videoPoster プラグインを追加します（オプションは以下を参照）。

   

4. 保存 をクリック
5. 公開 をクリック

プラグイン オプション

プラグイン設定例

{
              "plugins": [
              {
                "name": "videoPoster",
                "options": {
                  "playMode": "hover",
                  "loop": true,
                  "delay": 300,
                  "playButtonVisible": true
                },
                "is_packaged": true
              }
            ]
      }
          

Media モジュールでアニメーション サムネイルを取得する

アニメーション サムネイルを取得するには、次の手順に従います。

1. Media モジュールを開き、対象の動画を選択します。
2. プレビューを開始したいフレームにスクラバー（再生ヘッド）を合わせ、キャプチャー をクリックします。

   

3. 動画プレビュー を選択し、保存 をクリックします。

   

API を使用してアニメーションサムネイルを確認する

video_preview フィールドは、Playback API と CMS API の両方で利用できます。これにより、アニメーションサムネイルの取得や管理をプログラムから行えます。

Playback API

次のリクエストでは、Playback API の動画オブジェクトのトップレベル プロパティとして video_preview フィールドが返されます。

• ID／リファレンスIDで動画を取得<
• ID／リファレンスIDでプレイリストを取得

例：video_preview（プレイリスト Playback API）

{
          "account_id": "...",
          "id": "...",
          "videos": [
            {
              "account_id": "...",
              "sources": [ "..." ],
              "video_preview": [
                {
                  "ext_x_version": "7",
                  "src": "http://manifest.prod.boltdns.net/.../preview.m3u8?...",
                  "type": "application/x-mpegURL"
                },
                {
                  "ext_x_version": "7",
                  "src": "https://manifest.prod.boltdns.net/.../preview.m3u8?...",
                  "type": "application/x-mpegURL"
                }
              ]
            }
          ]
        }
          

CMS API

Playback API に加えて、CMS API でも video_preview フィールドにより、動画プレビューの取得と更新が可能です。

• GET Video by ID/Reference ID
• GET Videos in Playlist

リクエスト例

https://cms.api.brightcove.com/v1/accounts/<account_id>/videos/<video_id>?include_video_preview=true
          

レスポンス例

{
          ...
          "video_preview": {
            "start": 10000,
            "sources": [ ... ]  // Playback API と同形式
          }
          ...
        }
              

{
          "video_preview": {
            "start": new_value
          }
        }