7
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

VAST形式で静止画を配信したい。

Last updated at Posted at 2024-12-21

この記事は、Supershipグループ Advent Calendar 2024の 22日目の記事になります。

Supership株式会社の @hosomin0211 です。
普段はデータソリューション領域で、ECサイト向けの広告配信プロダクトやSupership Touch Giftの開発を行っています。

はじめに

VAST形式を使用して動画広告を配信する中、通信環境が悪く、動画広告が再生できない場合に容量の少ない静止画を配信すれば良いのではと考えました。
そこで、静止画広告表示用の実装を入れずにVAST形式でまとめて一括で再生できるようにする方が効率的ではないかと考え調査したので、本記事にまとめます。

検討した方法

VAST形式で静止画を配信するに当たり、以下3つの方法を検討しました。

  • CompanionAdsタグに静止画を入れる
  • NonLinearタグで静止画を表示する
  • 静止画を動画に変換して、動画として表示する

CompanionAdsタグで静止画を入れる

初めに、CompanionAdsタグに静止画を入れれば良いのでないかと考えました。
コンパニオン広告とは、動画広告といっしょに配信される広告であり、動画サイト等で動画の横等に表示されている広告になります。
https://support.google.com/admanager/answer/1191131?hl=ja

エンドカードの用に使われることもあるため、動画広告を抜いてエンドカードのみを表示するようにすればそのまま表示できるのでは?と考えました。

しかし、この方式の場合には、配信APIを導入頂く側のアプリに別途実装が必要になることが分かり断念しました。
コンパニオン広告は通常、動画外に表示される広告なため、google imaのようなvast playerとは別に別途xmlを解析して画面上に表示して頂く必要がありました。

NonLinearAdsタグで静止画を表示する

次に、NonLinearタグを用いて静止画を表示すれば良いのではと考えました。
NonLinearタグは、オーバーレイ広告と呼ばれる再生中の動画の上に表示される静止画の広告を設定するためのタグです。
動画広告枠ピッタリのサイズでオーバーレイ広告を出せばvast playerで読み込むだけで静止画広告を表示できるのでは?と考え、google imaのテスト環境で再生した際には綺麗に表示されました。

しかし、結果的にこの方式は断念しました。
理由としては、google imaのSDKがiOSとAndroid用共にNonLinearタグに対応していないことが発覚したためです。
https://developers.google.com/interactive-media-ads/docs/sdks/ios/client-side/compatibility?hl=ja

Web上で綺麗に表示されていたにもかかわらず、iOSでテストした際に表示されず、がっかりした記憶があります。
先に導入先のiOS, Androidへの互換性を調べておくべきでした。

静止画を動画に変換して、動画として表示する

最後に、一番シンプルな形ですが、静止画を動画に変換して入稿すれば良いのではと考えました。
vast playerで再生する際は動画として再生するので、当たり前ですが問題なく表示できました。

しかし、動画に変換すると容量が大きくなってしまい、通信環境が悪い状態では表示できなくなってしまいます。
また、mp3やpngから動画に変換するとどうしても色味が変わってしまい、元のデザインを維持することができませんでした。
(Finalcutが一番綺麗に変換できていました。)

容量の問題に関しては1fpsの動画を作成することで、画像と同等サイズに抑えることができましたが、色味の問題は要検討です。

おわりに

VAST形式で静止画を配信する方法を検討しましたが、最終的に静止画を動画に変換する方式を選択しました。
動画広告用のフォーマットで静止画のまま再生させることは難しいと感じ、断念しました。
動画でも静止画でもまとめて配信できるようなフォーマットがあれば良いなと思い日々調べてます。

最後に宣伝です。

Supershipではプロダクト開発やサービス開発に関わる人を絶賛募集しております。
ご興味がある方は以下リンクよりご確認ください。
Supership 採用サイト
是非ともよろしくお願いします。

7
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?