フレーム生成

video-generate

Imgix によってエンコードされた任意の動画アセット(imgix.video ドメインを持っている必要があります)に対して、video-generate パラメータを使用することで静止画像、GIF、またはストーリーボードを生成できます。

有効な値は以下のとおりです:

  • thumbnail:動画から静止画像を生成します。
  • gif:動画からGIFを生成します。
  • storyboard:動画からストーリーボードを生成します。

video-generate パラメータへのリクエストは トランスコーディングプロセス をトリガーしない点に注意してください。動画がまだトランスコードされていない場合は 404 を返します。

video-generate=thumbnail

動画のサムネイル画像を生成します。出力画像は任意のRendering API パラメータで変換可能です。デフォルトでは JPG を返します。

サムネイル生成の時間(秒)を指定するには、video-thumbnail-time パラメータ を使用します。

以下の例では、この動画から3秒、6秒、12秒、15秒の位置でサムネイルを抽出しています。

サムネイル時間:3秒
sandbox-demo
サムネイル時間:6秒
sandbox-demo
サムネイル時間:12秒
sandbox-demo
サムネイル時間:15秒
sandbox-demo

多くのビデオプレイヤーにポスター画像を追加するには、Imgix の画像URLを使用できます。以下は HTML5 の video 要素でポスター画像属性を使用した例で、12秒の位置をポスター画像に指定しています。

<video
  id="my-video"
  width="800"
  height="450"
  controls
  src="https://ix-www.imgix.video/video/Switzerland_w1562.mp4?fm=mp4"
  poster="https://ix-www.imgix.video/video/Switzerland_w1562.mp4?video-generate=thumbnail&video-thumbnail-time=3.5&w=800&h=450&fit=crop"
></video>

video-generate=gif

任意のRendering API パラメータで変換可能な GIF の URL を返します。軽量な動画プレビューを生成するためによく使用されます。下のサムネイルにマウスを合わせると GIF プレビューが再生されます。

sandbox-demo
sandbox-demo
sandbox-demo
sandbox-demo

GIF 出力の変更方法についての詳細は Video GIF ドキュメント を参照してください。

video-generate=storyboard

動画からストーリーボードを複数の形式(vttjpgpngjson)で生成します。

ストーリーボードの用途:

  • タイムライン上のホバープレビューの作成
  • 動画フレームのタイル状大画像を生成して視覚的に確認
  • 動画のチャプターマーカーの作成

以下は、ストーリーボードファイルを使って生成されたチャプター選択UIの例です。

Loading storyboard data...

ストーリーボード出力の詳細については フォーマットドキュメント を参照してください。