Cloudinary Video 入門:動画配信を最適化する 3 つのコア機能

Cloudinary Video 入門:動画配信を最適化する 3 つのコア機能

Cloudinary Video は、1 本の動画をアップロードするだけで f_auto・sp_auto・Video Player により最適なフォーマット、コーデック、ストリーミング形式、再生環境を自動で配信できる SaaS。動画配信のコスト削減と視聴体験向上を、自前構築なしで実現します。
2026.05.29

ベルリンから伊藤です。

スマホ・SNS の普及により、ユーザーが商品を認知・検討・購入から、使い方を学ぶまで、ウェブには多くの動画が配信されるようになりました。
一方で、エンコード、キャプション、CDN など動画配信を支える様々な要素を自前で組み合わせると、運用負荷もコストも膨らみがちです。

Cloudinary は画像や動画などあらゆるウェブコンテンツを最適化・CDN 高速配信できる SaaS で、AI 搭載の高機能な動画プレイヤーも提供しています。

本記事では、動画配信ソリューションとして Cloudinary を検討する方向けに、コスト削減とユーザ体験向上に直結するコア機能を整理します。

cloudinary-video

この記事でわかること

  • Cloudinary Video の全体像
  • 配信コストとパフォーマンスを左右する f_auto, sp_auto
  • Cloudinary Video Player で実現できること
  • 導入を検討する際に押さえておきたいポイント

Cloudinary Video とは

Cloudinary では、1本のオリジナル動画をアップロードし、配信時に URL のパラメータを調整するだけでフォーマット最適化、画質最適化、サイズ変換、エフェクト適用、ストリーミング形式選択を瞬時に適用できます。

例えば次の URL は、それぞれ同じ my-video というオリジナルから配信されます。

# 通常のプログレッシブダウンロード
https://res.cloudinary.com/<cloud-name>/video/upload/v1/my-video.mp4

# ブラウザに応じて最適フォーマット(AV1 / VP9 / H.264 など)に自動切替
https://res.cloudinary.com/<cloud-name>/video/upload/f_auto,q_auto/v1/my-video.mp4

# スマホ画面に合わせた 9:16 で大事な要素を中心に切り取るスマートクロップ
https://res.cloudinary.com/<cloud-name>/video/upload/ar_9:16,c_fill,g_auto/v1/my-video.mp4

# HLS アダプティブビットレートストリーミング
https://res.cloudinary.com/<cloud-name>/video/upload/sp_auto/v1/my-video.m3u8

オリジナルは1本だけ、配信時に都度生成 — このシンプルさが、デジタルアセット管理を効率化し、運用コスト削減にもつながります。

機能 1:f_auto — 自動トランスコーディング

f_auto視聴側のブラウザ・デバイスに応じて最適な動画フォーマット・コーデックを自動で選択してトランスコードする変換パラメータです。

コーデックはそれぞれ圧縮仕様や対応ブラウザが異なり、同じ画質を維持する前提でも、次世代コーデックを使えるなら配信データ量を大幅に削減できます。

コーデック 主な対応ブラウザ
H.264 (AVC) ほぼすべて(互換性が最も高い)
H.265 (HEVC) Safari、Edge(一部)
VP9 Chrome、Firefox、Edge
AV1 Chrome、Firefox、Edge

f_auto を使うと、Cloudinary が Accept ヘッダーや User-Agent から視聴側の対応状況を判定し、その時点で再生可能な最良のフォーマットを選んで配信します。

↓ こちらのデモから機能を試すことができます

https://videoapi.cloudinary.com/video-demo/video-optimization

f_auto の効果

  • 帯域コスト削減:対応ブラウザの割合が高いほど、平均ファイルサイズが下がる
  • 再生開始までの時間短縮:ファイルが軽い分、初期バッファが速い
  • オリジナルは1本でよい:複数フォーマットへそれぞれ変換する必要がない

機能 2:sp_auto — アダプティブビットレートストリーミング

長尺・高解像度の動画では、MP4 を直接配信すると再生開始が遅く、回線が不安定になるとバッファリングが発生します。これを解決するのがアダプティブビットレートストリーミング (ABR) です。
ネットフリックスなどの動画視聴中に、急に画質が落ちたことはありませんか?それが ABR によるもので、ネット回線速度に応じて再生品質をリアルタイムで切り替えているのです。

ABR では、1本の動画を複数の解像度・ビットレートに事前変換(レンディション)します。代表的なプロトコルは HLS と DASH です。

通常、HLS / DASH を提供しようとすると、各レンディションをどう作るかを事前にプロファイルとして定義する必要があります。Cloudinary には組み込みのストリーミングプロファイルが複数用意されていますが、sp_auto を指定すればプロファイルの選定そのものも Cloudinary に任せられます

# HLS
https://res.cloudinary.com/<cloud-name>/video/upload/sp_auto/my-video.m3u8

# DASH
https://res.cloudinary.com/<cloud-name>/video/upload/sp_auto/my-video.mpd
  • 拡張子に .m3u8(HLS)または .mpd(DASH)を指定
  • 初回リクエスト時にレンディション一式を生成(CMAF 形式で書き出される)
  • 4K 出力にも対応(最大解像度の指定可)

⚠️ 注意点

  • 初回リクエスト時には処理時間が発生します。DASH の場合、処理完了までは 423 レスポンスが返ります(HLS は段階的に再生可能)。本番運用では Eager transformation で事前生成しておくことでレイテンシーを低減することが推奨されています。
  • sp_auto と併用できる変換は限定的です。例えば overlay や複雑な crop は同時に使えないケースがあります。
  • ABR を再生するには、HLS / DASH に対応するプレイヤーが必要です。素の <video> タグでは Safari 以外は再生できません — ここで活躍するのが次の Video Player です。

↓ こちらのデモから機能を試すことができます

https://videoapi.cloudinary.com/video-demo/adaptive-bitrate

機能 3:Cloudinary Video Player

Cloudinary Video Player は、Cloudinary が公式に提供する JavaScript ベースの動画プレイヤーです。プレイヤー側の設定だけで f_auto, sp_auto, クロスブラウザ対応、アクセシビリティ、多言語字幕、ブランドカスタマイズ、再生分析、Shoppable Video、動画広告までを一通りカバーできます。

主な特徴

  • クロスブラウザでの HLS / DASH 再生:素の <video> タグでは難しい ABR ストリーミングも、ブラウザ問わず再生可能
  • 変換パラメータの統合f_auto, q_auto, sp_auto 、リサイズなどの変換がプレイヤー設定だけで有効化
  • ブランドカスタマイズ:カラー、フォント、ロゴ、ポスター画像など、ブランド統一感のあるプレイヤーを構築可能
  • アクセシビリティ標準対応:WCAG 2.1 AA 準拠、多言語字幕、キーボード操作、スクリーンリーダー対応などを標準搭載

多言語字幕とアクセシビリティ

動画のアクセシビリティ対応は、ユーザビリティ向上だけでなく、市場によっては法的要件になります。例えば EU では European Accessibility Act(EAA) が 2025 年 6 月に発効し、EU 市場で動画コンテンツを提供する事業者に WCAG 2.1 AA 準拠が求められます。

Cloudinary Video Player は、VTT / SRT 字幕のアップロードに加え、AI による文字起こし・多言語翻訳・字幕生成にも対応。多言語ユーザーへの提供や、WCAG 準拠の要件を、プレイヤー側の設定だけで満たせます。

Video Player Studio でノーコードでカスタマイズ

コードを書かずにプレイヤーをカスタマイズしたい場合は、Video Player Studio が便利です。GUI でカラー、フォント、ロゴ、ポスター画像、コントロール表示などを調整し、生成された埋め込みコードをそのままコピーして利用できます。

cloudinary-video-player-studio

その他の主要機能

他にも動画に関する主要機能を簡単に整理します。

機能 概要
動画変換 トリミング、クロップ、回転、結合、オーバーレイ(画像・テキスト・字幕)、ウォーターマーク、サムネイル生成
AI 機能 AI チャプター、メタデータ自動生成(タイトル・説明・タグ)、コンテンツ分析、サムネイル自動選択(字幕・キャプションは Video Player のアクセシビリティ項を参照)
コンテンツモデレーション Amazon Rekognition / Google AI アドオンによる動画の自動審査(不適切コンテンツの検出・フラグ付け)
ライブストリーミング RTMP / WebRTC 入力対応のライブ配信機能
アセット管理 フォルダ、タグ、メタデータ、Search API、アクセス制御
セキュリティ 署名付き URL、トークン認証、地域制限、HTTPS 強制

「動画配信プラットフォーム」「動画 CDN」「動画変換 API」「動画プレイヤー」「DAM」— このあたりが従来別ベンダーになりがちな領域ですが、Cloudinary は基本的にこれらを 1つのプラットフォームで完結できます。これが運用負荷削減の大きな要素です。

コスト最適化の考え方

Cloudinary の動画関連コストは大きく3つに分かれます。

  1. Storage:保管しているアセットの容量
  2. Bandwidth:配信した動画のデータ量/秒数
  3. Transformations:配信時の変換処理(f_auto, sp_auto などを含む)

このうち動画では Bandwidth が支配的なコストになりやすく、ここに f_auto / q_auto / sp_auto が効いてきます。

対策 効果
f_auto でモダンコーデックを配信 同等画質で 30〜50% のデータ削減
q_auto で視覚的画質を維持して圧縮 過剰な高画質の抑制
sp_auto で ABR 化 視聴側に必要なビットレートのみ配信

✏️ プランやユニット換算の詳細、消費量のモニタリング方法は以下の記事で扱っています。

https://dev.classmethod.jp/articles/cloudinary-pricing-and-usage-monitoring-guide/

導入の流れ

まずは、気になる機能を Cloudinary Demos で実際に触ってみることをお勧めします。Video Player、ABR ストリーミング、Shoppable Video、動画変換などをブラウザ上でインタラクティブに体感でき、自社のユースケースに当てはめてイメージしやすくなります。

cloudinary-demo

そのうえで実際に検証を始める段階になったら、まだ Cloudinary アカウントがない場合は こちら から無料でサインアップいただけます。無料プランでも f_auto, sp_auto, Video Player すべて利用可能です。

最適な Cloudinary 導入方法を最も効率良く進めるために、以下の流れで進めます。

1. 既存状況の整理

  • 構成の整理:オリジンサーバがどこにあるか、システム構成など
  • アセット状況の把握:どのようなアセットがどのくらいあるか、既存の階層構成、そのうちどれをどうインポートするか、動画ファイルの最大サイズなど
  • アセット管理の検討:アセットを最大限活用するには、後に検索可能となるようタグ付けやメタデータの利用も検討します。

2. 動画の取り込み

  • アップロード (Cloudinaryにアセットを保管し、マスタとする)
    • コンソールから: アセット数が少なく丁寧に移行したい場合
    • Upload API: 動画や大量アセットをシステム的に取り込む最適解
    • Upload Widget: ユーザごとにカスタマイズしたアップロードを実現する場合
    • Auto Upload:既存オリジンからのマッピングでリクエスト時に取り込む
  • Fetch (オリジンをマスタとし、Cloudinary にキャッシュする)

加えて、Upload Presets を使うことで事前定義したアップロードオプションを柔軟に適用させられます。上記アップロードのいずれの方法とも組み合わせることが可能です。

例えば容量の大きい動画に対してアップロード時に q_auto で圧縮することで、圧縮版を Cloudinary のマスタ動画として保管することができます。これはストレージ使用量をセーブするのに大きく役立ちます。アップロード以前に別途変換・圧縮しておく必要はありません

3. 配信 URL の置き換え / Video Player の埋め込み

  • 既存サイトの <video> タグを Cloudinary URL に置き換える
  • もしくは Cloudinary Video Player で置き換え
  • 変換の適用:f_auto,q_auto 、ABR なら sp_auto などタグや URL に含める

4. 本番移行前の検証

  • 主要ブラウザ/デバイスでの再生確認
  • 配信コストのシミュレーション

まとめ

Cloudinary Video は、動画配信に必要な機能を 「アップロード → URL ベースで自動最適化配信」 のシンプルなモデルで提供します。

本記事でご紹介した自動トランスコーディング(f_auto)、アダプティブビットレートストリーミング(sp_auto)、Video Player などの豊富な機能に加えて、2026 年に入ってからは AI モデレーションやエージェント機能など、ブランドガバナンス・運用自動化の領域も急速に拡大しています。

自前CDNやプレイヤーからの移行や、動画配信サービスの代替を検討しているなら、ぜひ Cloudinary を試してみてはいかがでしょうか?

クラスメソッドでは Cloudinary の導入支援を行っています。動画配信のコスト削減・最適化を検討中の方は、ぜひお気軽にお問い合わせください。

以上、ご参考になれば幸いです!


「AI×SaaSで加速するWeb制作」ウェビナー開催

60分でわかる、Contentful・Cloudinary・v0・Vercelの連携によるWeb制作ワークフロー。
アイデアを即座に形にする 新しい仕組みを 豊富な実践デモ を交えながら解説します。開発のスピードアップ、リソース最適化、コスト削減を実現したい方は必見です。

AI×SaaSで加速するWeb制作ウェビナー

とりあえず申し込む



SaaS導入支援はクラスメソッドに!

クラスメソッドでは Contentful・Cloudinary・v0・Vercel など各種SaaS製品 の導入支援もしております。
具体的に課題をお知らせいただければ、適した商材のご提案も可能です。製品の詳細や支援の内容についてお気軽にお問い合わせください。

クラスメソッドに相談する

この記事をシェアする

関連記事