Subway Surfersの動画広告を調べてみた
海外の人気アプリで動画広告がどのように実装されているのかを調べているけど、正直マンネリを感じ始めてしまった。単純過ぎるものは省いて、実装の参考になるものだけを厳選してお届けしたいとは思う。
ゲーム自体は非常に良く出来ているランゲーム。
電車に落書きしていたら、警官に見つかって逃げるという設定。
Subway Surfers - Google Play の Android アプリ
走りながら左、真ん中、右に移動して、電車や障害物を避ける。
コインやアイテムが出てくるので、取ると有利にゲームを進めたりする。
アイテム取ると、こんな感じで大ジャンプできたり、
磁石でコインを吸い取ったりできる。
アイテムで一定時間空を飛ぶこともできる。
障害物にぶつかると、警官に捕まる。鍵を使うことでコンティニューできる。
ゲームオーバー時にたまにアイテムが貰えることが！
Double Up!のボタンが出るが、動画広告であることは知らされない。
AdColonyの動画が再生された。
インセンティブとして、２倍のコインが貰えた。
通信内容
設定されている動画アドネットワークはこちら。
AdColony、Vungle、Flurry、Tapjoy、inmobi。
だが、起動時に読み込まれたのはAdColony、Tapjoy、inmobiのみ。
実際に読み込まれた動画はAdColonyの２案件分（WALKING WAR ROBOTS、LINEのブラウンファーム）。WALKING WAR ROBOTSの動画ファイルが５Mでちょっと重めだが、１アドネットワークしか動画を読み込ませていない。
まとめ
動画リワードの観せ方が上手い。毎回ゲームオーバー時に出すのではなく、たまにしか出ないし、コインが２倍になるよ？となれば、動画観るぐらい大したことないので、みんな喜んで観る。ゲーム自体も楽しんでできるので、ランキング上位なのも納得。
COLOR SWITCHの動画広告を調べてみたら、実際にゲームとしてトライアルプレイできる広告が表示された。
海外で人気のタイミングゲーム。タップするとボールを真上に弾くことができ、重力ですぐに落ちてくるので、タイミング良くタップし続けながら（サッカーのリフティングと同じ）、障害物が回転しているので、同じ色の時だけすり抜けられる。
一定以上の高さまでたどり着けばゴール。
Color Switch - Google Play の Android アプリ
広告は、もりもり組み込まれている。
タイミングよくタップしてボールを上にあげていく。
同じ色のときだけすり抜けられる。
違う色の時にぶつかると終了。
ゲームオーバー画面で＋３０の動画リワードが表示されている。
常に表示されるので有り難みは無い。
今回はAppLovinが選択された。
通信内容
まず起動画面でheyZapでメディエーションしていることから、各アドネットワークが呼ばれる。フッターにはモバイルバナーが常設。
先読みとしてインタースティシャル、ネイティブ、動画と盛りだくさん。
heyZap、admob、FAN（Facebook Audience Network）、inmobiなど
動画リワードはAdColony、AppLovin、UnityAds、Vungle。
ゲームオーバー時に、たまに自動で全画面インタースティシャル（admob？全画面インタースティシャルはなかなかみないので新鮮）や、同意なしで動画リワードの動画が再生される。
まとめ
ゲームとしてはタイミングゲームが苦手なので、長く続けられなかった。ゲーム自体は何度でも再チャレンジできるので、インセンティブの意味合いが薄い。
動画リワードの実装方法としては真似しないほうが良い。
inmobiの広告なのか？ハッキリとわからなかったが、ゲームとして遊べる広告が表示された。
真ん中にいるのが自分。周りから敵が迫ってくるので、タップして銃撃する。
この画面で遊べるゲームとしてはぶっちゃけ全くおもしろくない。
１５秒ほどで、以下のタイトルが表示され、もう一度プレイするかストアに飛ぶか選択。ただし、ストアに飛んでバックボタンで戻ってくると、ストアに強制移動させられて、通常のゲームが遊べなくなってしまった。
こちらは、もう少し凝っている作り。ドラッグアンドドロップで、戦うためのオブジェクトを配置。
放置してたら、５分ぐらいで敗退してた。
ゾンビキャッチャー (Zombie Catchers)の動画広告を調べてみた
海外アプリで動画リワードが実装されている状況を調査。
主にリワードの実装方法、アドネットワーク、メディエーションなど中心に。
ゾンビキャッチャー (Zombie Catchers) - Google Play の Android アプリ
ゲーム内容は、捕獲したゾンビを材料にジュースを作って、それを店で売る。売って稼いだお金でゾンビを捕まえる為の装備や、新しいジュースを作れるようになったりする。
自由に横スクロールできるアクションゲーム。
脳みそを置いてゾンビをおびき寄せる。ゾンビが沼からでてくるので、モリで突いて捕獲する。
武器を強化したり、網で一網打尽に捕まえたり、罠をしかけたり様々。
特別な武器は、一度使うと一定時間が経過しないと再び使えない。
捕まえてきたゾンビをここで押しつぶしてジュースを作る。右に行くほど強いゾンビでかつ、高額で売れるジュースになる。
地下で作ったジュースは、地上に運ばれて、お客さんが列を成しているので売ってお金を稼ぐ。
捕まえたゾンビをジュースにすると、また新たに捕まえてこないといけない。
ドローンがゾンビを探すのだが、一定時間が経たないと、ゾンビが見つからない。
アイテムか動画視聴することで、すぐに見つけてくれる。
SponsorPayが表示された。エンドカードは無いようだ。
通信内容
端末：Android SO-02H（6.0）
通信環境：WIFI
アプリ起動直後に最優先でchartboostが呼ばれる。
2秒後：fyberとsponsorpayが呼ばれる。
4秒後にAppLovinとUnityAdsが呼ばれる。
5秒後にAdColonyが呼ばれる。
UnityAdsの動画ファイルが6秒後に１つだけ読み込まれる。
まとめ
ゲームとしてよく出来てる。これは単純なタップのみのゲームじゃないのでハマる。
メディエーションツールはfyber。
sponsorpayは初めて見た。動画視聴中に閉じるボタンを押下すれば、途中で視聴を止めることができる。ダイアログが表示されて、インセンティブが受け取れないけど良いか？と聞かれる。
今回も初期化時に動画ファイルはUnityAdsの１つしか読み込まれなかった。
やはり無駄に動画ファイルを読み込ませないような設定があるのか？それともfyberが上手くコントロールしているのか？
Tap Titansの動画広告を調べてみた
海外ゲームで動画リワードってどうのような実装されているのか興味はあったけど、きちんと調べたことがなかったので、世界中で1300万人が遊ぶと言われるTap Titansの動画広告を調べてみた。
調べる目的で何気なく始めたんだけど、結構ハマって1週間はタップしまくった。右手・左手合わせて八本の指をスマホの画面で連打しまくる様は、他者からみたら奇怪な行動にみえただろうな。
温泉行って、食事食べてる時もカタカタずっとタップしてるし。。
こんなにスマホ画面を連続タップしたことないほど叩きまくった。
Tap Titans（世界中1300万人突破のタップRPG） - Google Play の Android アプリ
以下はアイテムを使って一定時間、影分身が代わりに連続斬りしてくれているところ。
ゲーム中に不定期で妖精が飛んでくるので、タップするとアイテムやダイヤ、ゴールドをくれる。
まれに、妖精からのボーナスとして大量のゴールドが貰えるチャンスが。
ギフトを集めるボタンを押下すると、動画が再生される。
今回は、UnityAdsが選択された。
大量のゴールドがゲットできるので、アイテムや仲間を増やしてよりゲームを楽しめる。
通信内容
検証端末：Android、SO-02H（6.0）
接続：WIFI
起動したら真っ先にTapjoyとAppsFlyerが呼ばれる。
4秒後にchartboost、UnityAdsが呼ばれ、6秒後にAppLovinが呼ばれる。
SSPは使っていないようだ。自社メディエーションかもしれない。
AppLovinの動画ファイルは２M以下で軽い。
UnityAdsは動画ファイルは容量が軽かった印象があるのだが、今回は3M。
Tapjoyの動画ファイル読み込みが見当たらないので、フリクエンシーキャップにかかった可能性がある。
まとめ
初期化で読みこむ動画ファイルの数が少ないと思った。動画ファイルの読み込み数ってお願いすればコントロールできるのだろうか？
初期化でアドネットワークを呼び出す時間をずらしている意図は感じる。何度かアプリ起動時の挙動をみてみたが、やはりTapjoyを最優先で呼び出している。
AdColonyが入ってないのはなぜだろう？
グローバルで大ヒットしているゲームにSSPが入ってないのは、自社メディエーションツールを使っているからだろうか？
単純にゲームとしてハマる。面白かった。
HTTP Live Streaming(HLS)形式の動画をAWS(Amazon Elastic Transcoder、S3、CloudFront)で配信
Apple仕様のHTTP Live Streaming（HLS）をアダプティブ配信する環境をAWS（Amazon Elastic Transcoder→S3→CloudFront）で構築して、配信最適化できるか試してみた。
※Akamaiでの配信方法は以下
動画配信技術 その1 - HTTP Live Streaming(HLS) - Akamai Japan Blog
動画配信技術 その3 - Universal Streaming(HDS/HLS) - Akamai Japan Blog
HTTP Live Streamingとは、容量の大きい動画ファイルを10秒ごとに分割して、読み込みながらでも再生できる。特別なストリーミングサーバを必要とせず、通常のWEBサーバで配信ができるのも利点。iOS、Androidともに対応端末が幅広い。
Apple公式の資料
「特別なサーバソフトを使用しないオーディオとビデオの送信」
https://developer.apple.com/jp/documentation/StreamingMediaGuide.pdf
アダプティブ配信とは？
回線品質によって、読みこむファイルを切り替えながら再生する。
３G→LTE→WIFIのように通信環境が変化すると、それに応じた動画再生に切り替えられる。
S3に元動画を入れる用と、出力用の２つのバケットを準備する。
元となるMP4動画を-inの方にアップロードする。
素材はNHKのクリエイティブ・ライブラリーを引用。
わかりやすく
・高画質（飛行機）
着陸する飛行機（６）ズームイン:素材をさがす:NHKクリエイティブ・ライブラリー
・中画質（新幹線）
東北新幹線「はやぶさ」:素材をさがす:NHKクリエイティブ・ライブラリー
・低画質（船）
ベネチア 運河（１）:素材をさがす:NHKクリエイティブ・ライブラリー
としてみた。
Amazon Elastic TranscoderでMP4ファイルを
ts分割したファイルとプレイリスト（m3u8）をS3へ保存する。
Elastic Transcoderを選択
Create New Pipelineから、以下のように入力する。
今度は左のメニューでJobsを選択肢、Create New Jobを押下。
Create New Jobから高画質の場合はhighというフォルダに出力されるよう登録。
右下のCreate New Jobを押下すると、以下のようにS3の-out/high/〜に出力される。
これをmidとlowの分繰り返す。
それぞれのプレイリストの中身は以下。
10秒指定したのに、きっちり10秒で分割されるわけではない。
high.m3u8
#EXTM3U
#EXT-X-VERSION:3
#EXT-X-MEDIA-SEQUENCE:0
#EXT-X-ALLOW-CACHE:YES
#EXT-X-TARGETDURATION:13
#EXTINF:12.078733,
high00000.ts
#EXTINF:9.009000,
high00001.ts
#EXTINF:9.009000,
high00002.ts
#EXTINF:1.768433,
high00003.ts
#EXT-X-ENDLIST
mid.m3u8
#EXTM3U
#EXT-X-VERSION:3
#EXT-X-MEDIA-SEQUENCE:0
#EXT-X-ALLOW-CACHE:YES
#EXT-X-TARGETDURATION:13
#EXTINF:12.012000,
mid00000.ts
#EXTINF:9.009000,
mid00001.ts
#EXTINF:9.009000,
mid00002.ts
#EXTINF:12.012000,
mid00003.ts
#EXTINF:9.009000,
mid00004.ts
#EXTINF:9.009000,
mid00005.ts
#EXTINF:12.012000,
mid00006.ts
#EXTINF:9.009000,
mid00007.ts
#EXTINF:8.942267,
mid00008.ts
#EXT-X-ENDLIST
low.m3u8
#EXTM3U
#EXT-X-VERSION:3
#EXT-X-MEDIA-SEQUENCE:0
#EXT-X-ALLOW-CACHE:YES
#EXT-X-TARGETDURATION:13
#EXTINF:12.058444,
low00000.ts
#EXTINF:8.241567,
low00001.ts
#EXT-X-ENDLIST
通信回線の状態により、これらを切り替える為にindex.m3u8を自分で作成してoutバケット直下にアップロード。
index.m3u8
#EXTM3U
#EXT-X-STREAM-INF:PROGRAM-ID=1, BANDWIDTH=400000
https://d1h36s1zyfuae3.cloudfront.net/low/low.m3u8
#EXT-X-STREAM-INF:PROGRAM-ID=1, BANDWIDTH=600000
https://d1h36s1zyfuae3.cloudfront.net/mid/mid.m3u8
#EXT-X-STREAM-INF:PROGRAM-ID=1, BANDWIDTH=2000000
https://d1h36s1zyfuae3.cloudfront.net/high/high.m3u8
CloudFrontで配信するための設定。
Originも設定する。
バケットに直接アクセスされたくなく、常にCloudFrontからの配信になるよう制限したかったら、Restrict Bucket AccessをYesにする。
一通り設定完了したら、しばらく時間がかかる場合もあるが、CloudFrontでアクセスできるようになる。
URLは以下
https://d1h36s1zyfuae3.cloudfront.net/index.m3u8
AndroidのChromeで開くと、ファイルをダウンロードしてしまう。
※HTMLのvideoタグでリンクすると、Androidでも再生可能。
iPhoneのsafariで開くと、動画が読み込まれ再生準備になる。
再生ボタンを押下すると、標準のプレーヤーが立ち上がり、再生が開始する。
再生途中から、電車の動画に切り替わる。
index.m3u8がリクエストされて、low.m3u8の指示でtsファイルが読み込まれ、回線品質によって、mid.m3u8に切り替わって、midのtsファイルが読み込まれ始める。
iPhone端末の設定 ＞ デベロッパ ＞ NETWORK LINK CONDITIONER
から、回線品質を変更してテストすることができる。
回線が良ければ、飛行機が配信される。
まとめ
Appleの仕様なので、safariでリピート再生した場合、動画を読み込み直さないでキャッシュを上手く利用してくれるのだが、Androidのchromeだとリピートなのにtsファイルを読み込み直すので無駄がある。
↓リピート再生するたびに、low00000.ts、low00001.tsをダウンロードしてしまう。（表示は降順）
ブラウザの挙動なのでアプリで実装する場合は、上手くキャッシュを再利用すればいいが、ブラウザベースのHTML5配信でリピート再生すると、端末依存かもしれないがパケ死配慮されない残念な作りになっている。
Elastic Transcoderの設定が雑なのか、MP4ファイルを元にtsに細かく出力した場合に、元ファイルよりもファイルサイズが大きくなってしまうという本末転倒なことになってしまった。この辺をチューニングする必要があるのだろう。
S3のinputバケットにMP4の動画をアップしたら、Elastic Transcoderでhigh, mid, lowに書き出されるなど自動化することもできるようだ。
AWS便利すぎてやばい。配信コストはどうなのか？要調査。
LINEポイントの動画リワード
iPhone・Androidの端末からMacbook Airにネットワークが繋がらなくなってしまい、通信内容調べる環境がこわれ、半日ハマってしまった。本当にちょっとした端末の設定だったり、ネットで問題を絞り込むためにひたすら調べるのに時間かかり過ぎて四苦八苦。通信内容みれないと不安で眠れなくなる。（嘘です）
LINEってメッセのやりとり（コミュニケーションツール）としてしか使っていなく、スタンプを購入したことすらない。LINEポイントというものがあり、ゲームをインストールすると、ある程度のポイントが貰えるリワードがあると教えてもらった。
以下のアプリをインストールすると、70ポイントもらえる。
動画リワード
「ビデオ」というコーナーがあり、動画を完全視聴すると１ポイントもらえるメニューがある。ほとんどブランド広告。
ワイモバイルを選択。動画を観ていないので、「詳しくはこちら」がグレーになっていて、LPに飛べない。
スクロールすると、細かい説明が書いてある。視聴完了すれば１ポイントもらえる。※別に何回観てもいいけど、１人１ポイント以上はもらえない。
視聴してみると、フルスクリーン横画面で動画が流れる。
画面をタップする毎に一時停止／再生を繰り返す、初めて観るパターン。
Androidのバックボタンが無効にされていないので、バックボタンで前画面に戻れる。
視聴完了すると、勝手にプレーヤーが閉じられて、代わりにダイアログが表示される。
この時点でポイントが付与されて、「詳しくはこちら」から、LPへ遷移してもよい。
インセンティブであるポイントを付与する通信はこの時点で完了している。
※動画再生完了時（30秒後）に再度、動画ファイルをダウンロードしている。
LPは以下のようにブラウザで閲覧する。
LINEポイントのトップページに戻ると、ポイントが＋１増えている。
まとめ
ブランド広告なので広告主から高画質を求められ、再生時間も３０秒だしファイル容量５〜６Mなんだろ？と、思いきや驚きの１M前後という少なさ。
動画によっては１M以下もある。３０秒では驚きの圧縮率。
LINEのブランド広告動画は、圧縮しすぎて画質は荒いが、少量パケットでユーザーがパケ死しにくい配慮がされていて好感がもてる。
動画再生中の何パーセント再生されたとかのログを通知することはしていない。
ログは再生開始と視聴完了のみ。
ただし、WIFIでも低画質動画が流れてきたのはどういう判定基準なのか少し気になるけど。
あと動画視聴完了後に全く同じ動画ファイルを、謎にもう一度リクエストしているのは何なのだろうか。
動画リワードのエンドカードについて
動画リワードで動画再生が完了すると、エンドカードと呼ばれるHTMLベースで作られたページが表示される。
エンドカードから、ストアに遷移してアプリをインストールするか、もしくは閉じるボタンでエンドカードを閉じて、インセンティブ（アイテムや仮想通貨のポイントなど）を貰う。
そのエンドカードがアドネットワークによって特徴があって面白かったのでピックアップ。
Vungle
Vungleは先日のFacebookで発表があったように、2011年に動画制作の会社からスタートしているとのこと。
６月から動画やエンドカードを集中して観る機会があって、クリエイティブにこだわっているのは強く感じていたし、以前Vungleの東京オフィスにおじゃました時に、日本人クリエイターが作る質の高い動画に驚かされた。
昔はサッカー関係の仕事で、取材しながら動画編集もやったりしてたんだけど、動画って作るのにすごく時間かかるし大変なんだよね。１箇所でも修正すると、全て書き出し直さないといけなくて、やたら時間かかる。。
動画広告なので動画の質にこだわれば、当然にコンバージョンも高くなるのはわかっているけど、製作コストも静止画に比べると１〜２桁違ってしまう。
で、エンドカードの静止画像があるのですが、ここにも手を抜かずにきっちりとデザインを綺麗に作りきるあたり、デザイナーとしての強いこだわりを感じて好感がもてる。
他アドネットワークとの差別化にもなるので、今後もクリエイティブにこだわることを期待。
maio
エンドカードがシンプルな時代しか知らなかったので、いつ変わったのか気が付かなかったけど、スワイプして画像が複数枚みれるようになってた。
最後までスワイプすると動画のリプレイも加わっている。
動画の質にこだわるのはもちろんなんだけど、このようなHTMLベースのレイアウトも手を抜かずに作りこむことで、コンバージョンにどう違いがあるのか、A/Bテスト実績あれば結果を知りたい。
