#CS2 事例セッション #2
クラウドが加速させる デジタルクリエイションの世界
meets
株式会社 バスキュール取締役/プロデューサー 田中 謙一郎プロデューサー 西村 真里子
2012年9月13日(木)
AGENDA
• 本日の登壇者、バスキュールについて
• バスキュールとクラウドコンピューティング
• 事例紹介• クラウドコンピューティングのメリット• Google App Engine, Microsoft Azure ?!• バスキュールの未来はAWSとともに
Who are we?
•田中謙一郎(Ken-ichiro Tanaka)取締役/プロデューサー/テクニカルディレクター
2000年入社の純粋培養バスキューラー。こなした案件数百↑キーワード:「三方良し!」
Who are we?
2011年入社の新参バスキューラー。IBM, Adobe, Grouponを経て現職に至る。キーワード:「機動力で勝負!」
•西村 真里子(Mariko Nishimura) プロデューサー
•インタラクティブクリエイティブの企画/制作•2000年7月28日設立•社員数41名
16%
29%
18%
11%
16%
11% プロデューサーディレクターPMデザイナーフロントエンドエンジニアサーバーサイドエンジニア
MISSION
誰も体験したことが無い新しいデジタルコミュニケーションを
生み出していく
DOMAIN
インタラクティブ広告ソーシャルキャンペーンデジタルサービス
Bascule × Cloud Computing?
MISSION
誰も体験したことが無い新しいデジタルコミュニケーションを
生み出していく
デジタルの力を利用して、沢山の人々の心を動かし、行動させたい
具体的にどんな現象を起こさせたいのか?
MAKE MOVEMENT!
バスキュールのチャレンジを成功させるにはCloud Computingが欠かせません
MAKE MOVEMENT!
3 years ago
The story has started...
2009
mixiアプリサンシャイン牧場
FacebookアプリMafia Wars
2009
Social Games use Cloud-Computing
We started using;• Amazon Web Service• Google App Engine• Microsoft Azure
Cloud-Computing!
Case Studies30 over
Azure × 3
GAE × 12
× 15
2009/12 mixi mixiXmas ソーシャルキャンペーン Google App Engine2010/3 自社 お宝ほりっくOttiki ソーシャルゲーム AWS2010/5 ユニリーバ・ジャパン AXE yobage ソーシャルゲーム Google App Engine2010/9 ユニリーバ・ジャパン AXE新宿駅前風呂場 ソーシャル×イベント AWS2010/10 ユニリーバ・ジャパン the Actress ソーシャルゲーム Google App Engine2010/12 mixi mixiXmas 2010 ソーシャルキャンペーン Google App Engine2011/6 サムスンテレコム SPACE BALOON PROJECT デジタル×イベント AWS2011/8 AXE Sochool of Lock! ラジオ×ソーシャル Google App Engine2011/9 NTTぷらら AKB48プレミアムチケット ソーシャルキャンペーン AWS2011/10 NTTドコモ Bag Interview WEBキャンペーン AWS2011/10 パナソニック Share The Passion Facebook App Google App Engine2011/12 Bascule Go! mixiXmas 2011 ソーシャルキャンペーン Azure2011/12 TOYOTA AQUA SOCIAL FES! WEBキャンペーン AWS2012/1 パナソニック The World Face Games iPhone App Google App Engine2012/2 明治製菓 Gum! カムカム ソーシャルキャンペーン AWS2012/2 ソニー DOT SWTICH テレビ×ソーシャル AWS2012/2 TOYOTA AQUA SOCIAL DRIVE iPhone App AWS2012/2 Bascule Go! Pelo iPhone App Google App Engine2012/2 JFA/adidus 日本代表スタジアム iPhone / Android App AWS2012/3 Bascule Go! Cotto Android App Google App Engine2012/3 KDDI au FUN GATE イベント×デジタル AWS2012/4 コカコーラジャパン Fantaソーシャルラジオ ラジオ×ソーシャル Google App Engine2012/5 ユニリーバ・ジャパン AXE Hot Angle イベント×デジタル AWS2012/5 Nike Nike iD Friend Studio ソーシャルバナー Azure2012/5 Adobe Font me イベント×デジタル AWS2012/6 TOYOTA ソーシャルヒッチハイク イベント×デジタル AWS2012/6 KDDI PASS OR GUN ソーシャルキャンペーン AWS2012/7 サントリー エスプレッソーダ WEBキャンペーン Google App Engine2012/8 mixi mixi Photoキャンペーン ソーシャルキャンペーン Google App Engine
Today’s Pick-up
デジタルキャンペーン#1 AXE Hot Angle#2 新宿駅前風呂場#3 Space Balloon Projectソーシャルキャンペーン#4 mixiXmasソーシャルTV/ダブルスクリーン#5 mixiXmas CM連動#6 Social Stadium
AXE HOT ANGLE
#1 Latest Work
http://www.axeeffect.jp/dry/index.html
ライブ中継でも目線インタラクティブがしたかった♪
当マイクロサイトはS3とCloudFrontを利用、動画の配信時にもAWSを利用
Of course..!
360度カメラの映像をできるだけ高ビットレートで配信する必要がある
配信している映像の一部をワイプで切り出しているから、元の配信映像は巨大
Technical Challenge
Adobe Flash Media Serverを用いたライブストリーミングシステムをCloudFormationのテンプレートを利用して、すごく簡単にインフラを構築できた!
http://aws.typepad.com/aws_japan/2011/04/live-streaming-with-amazon-cloudfront-and-adobe-flash-media-server.html
Approach
Tips - What we learned
S3 や CloudFrontを利用して独自ドメインの静的サイトを構築できる(すごく簡単に)
Cloud Formation や FMS on EC2 を利用することで大規模なライブ中継を実施するための配信プラットフォームを構築することができる
#2 On- & Off-line Event-1
2年前に実施した初めてのリアルイベント連動の事例
2010年9月、新宿駅前に公開風呂場を設置しお風呂場をテーマにライブイベントを実施してネットで中継
Twitterからリアルタイムに質問を受け付けたり
ハッシュタグ付Tweetでリアルタイムにクイズに参加出来たり
回答者をリアルタイムに抽選して番組に反映
Ustreamやニコ生では実現できなかった視聴者参加型のライブイベント(番組)を実施
Twitterからハッシュ付きTweetをひろってきて、リアルタイムに集計し番組に反映しないといけない
風呂場システム
新宿
Technical Challenge
風呂場PDP
Operation PC
nginx(reverce proxy)
Django
Django (クローラー)
MySQL MySQL
US WEST
nginx
Django
Django
MySQL MySQL
US EAST
Django Django
User PC
イベントへの参加
Approach
Twitterと連動するライブ中継イベントをAWSにて構築、問題なく無事終了することができた。
クラウド以前はリアルイベントを実施しても数千人しか参加できなかったが、ネットからのリアルタイム参加が可能になり、ソーシャルネットワークを通じ、多数ユーザーを巻込むイベントが実施可能になった。
Result
SPACE BALLOON PROJECT
#3 On- & Off-line Event -2
http://s3-ap-northeast-1.amazonaws.com/bascule-archives/archive/2011/space_balloon_project/01/index.html
30,000メートルの上空でのTweet体験
宇宙からのライブ中継Tweetを宇宙のGalaxyに届ける
Technical Challenge
Approach
Japan
Apache/PHP
US EAST
ネバタ砂漠
上空3万メートル
MySQL MySQL
Apache/PHP
Apache/PHP
nginx
MySQL
Approach
誰もが共感できるモノやコトをインターネットでリアルタイムに配信することにより、数十万規模のユーザーに
感動を届ける事が実現可能になった。
Result
mixi Xmas
#4 Social App
2009年冬、当時2つのソーシャルアプリの開発を進めていた。クラウドを利用することが初めてだったこともあって、IaaSの代表としてAWS、PaaSの代表として
Google App Engineを同時並行で採用して、メリット/デメリットを知りたかった。
Ottiki mixiXmas
Background
PaaS =リソース制限無し!と勘違いが.....
”Datastore Entities Fetched” Quota Over... orz
However, But, Unfortunately...
2009年:参加者100万人
2010年:3日間で100万人到達25日間で250万人登録
Daily Active User = 100万人達成
Result
さらに...2011年はマイクロソフト様がプラチナスポンサーにGoogle App EngineからAzureへの置き換えを実施。
2011年:2日で100万人到達!
2011
mixi Xmas CM
#5 TV CM & Social App
3回しか放送されない特別CMの時間にきてくれた全てのユーザーに参加機会を与える
Challenge
徹底的にアクセスを予測。
0時台にActiveなモバイルユーザーの人数を5万人と予測。そのうち関東は3万人。
3万人がCM後の3分間にどれくらい分散化し、どれくらい集中するのかを予測し、その数倍のキャパをもつインフラを、その時間だけ増強。
Approach
秒間数千APIリクエストに耐え3日間で50万人が参加
Result
Social Stadium
#6 TV & App ©
ユーザーのアクションをリアルタイムにシェア
Social Stadium実現の3つのチャレンジ
同時に大量のユーザーの熱量を受付ける
ユーザーのアクションをリアルタイムに集計し抽出
視聴率1%でも100万人視聴率10%だと1000万人
いままでとは桁がちがう相手を同時にアクセスを受付、
リアルタイムに処理する必要がある
テレビ視聴を考慮
MySQL
MySQL
Japan
Django (APP)
nginx (reverce proxy)
RabbitMQ (SQS)
Celery (job que)
Redis (master) Redis (slave)
1st Approach
Cloud Computingを採用するメリット
イニシャルコストランニングコスト
・利用ユーザーが極端に増大していく企画 ソーシャルアプリ/ソーシャルゲーム
・瞬間的にユーザーが集まるような企画 CM連動/リアルイベント連動
Cloud Computing Serviceの登場以前夢みていたけど、避けていた企画を実現できることこそ
バスキュールにとって最大のメリット
Value for using Cloud-Computing
Google App EngineやAzureを利用しているバスキュールがAWSを選択する理由とは?
Curiosity..
AWS GAE Azure
開発期間が短い △ ◯ △同時アクセスが多い ◯ ◯ ◯アクセスの変動が激しい ◯ ◯ ◯構成の自由度を求める ◯ × △レスポンスがクリティカル ◯ × ◯開発言語の自由度を求める ◯ × ◯複数地域でのスタンバイが必要 ◯ × △静的コンテンツが大量にある ◯ × ◯
C#やSilverlightが必要 △ × ◯※バスキュールの調べ
開発要件からの各サービス比較
要件に応じてIaaSとPaaSの特性をふまえ選択
IaaS or PaaS?
国産IaaS or Amazon
Amazonのソリューション群がバスキュールの多様なクリエイティブ案件にマッチ
選択の自由、フレキシブルな対応
現状では痒いところに手が届く
多様なAmazonソリューション群がクリエイティブ案件に最適
国産IaaS or Amazon
Cloud Computingを活用した次のチャレンジ
NEXT CHALLENGE!
ダブルスクリーン、ソーシャルTV
Original Solutions
大量同時投票受付/集計BaaS
Harvest Moon
Social Activity プッシュ配信BaaS
Sonic Shooter
9/28 TBSにてソーシャルTV体験発動!
大炎上生テレビ オレにも言わせろ!9月28日(金) 24:45~26:15
ありがとうございました!
#CS2 事例セッション #2
meets