Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
『Cygames展 Artworks』におけるShadowverseデジタルサイネージ制作事例
Search
Cygames
December 18, 2024
Technology
0
15
『Cygames展 Artworks』におけるShadowverseデジタルサイネージ制作事例
Cygames
December 18, 2024
Tweet
Share
More Decks by Cygames
See All by Cygames
最高のアートワークを発信する『Cygames展 Artworks』企画制作事例
cygames
0
13
社内にバーチャルスタッフ!?「スイちゃん」のキャラクターデザインと施策の広げ方の秘訣
cygames
0
43
全高3m超のバハムート像がスマホを通して躍動する! ~『Cygames展 Artworks』ARコンテンツの開発プロセスと実装~
cygames
0
6
最高の資料を目指すために!社内フリーイラスト制作チームの取り組みについて
cygames
0
43
「生きているモーション」を作り出すCygamesのモーションキャプチャー
cygames
0
30
『GRANBLUE FANTASY: Relink』 原作の世界観に没入するステージの絵作り
cygames
0
15
『GRANBLUE FANTASY: Relink』イラストを再現する為のキャラクターモデル制作事例
cygames
0
16
『GRANBLUE FANTASY: Relink』キャラクターの魅力を支えるリグ制作事例
cygames
0
22
『GRANBLUE FANTASY: Relink』の長期開発を支え続けたテスト自動化の取り組み紹介
cygames
0
49
Other Decks in Technology
See All in Technology
20241220_S3 tablesの使い方を検証してみた
handy
3
360
組織に自動テストを書く文化を根付かせる戦略(2024冬版) / Building Automated Test Culture 2024 Winter Edition
twada
PRO
13
3.6k
TSKaigi 2024 の登壇から広がったコミュニティ活動について
tsukuha
0
160
ガバメントクラウドのセキュリティ対策事例について
fujisawaryohei
0
530
re:Invent をおうちで楽しんでみた ~CloudWatch のオブザーバビリティ機能がスゴい!/ Enjoyed AWS re:Invent from Home and CloudWatch Observability Feature is Amazing!
yuj1osm
0
120
ずっと昔に Star をつけたはずの思い出せない GitHub リポジトリを見つけたい!
rokuosan
0
150
alecthomas/kong はいいぞ / kamakura.go#7
fujiwara3
1
300
MLOps の現場から
asei
6
640
Snowflake女子会#3 Snowpipeの良さを5分で語るよ
lana2548
0
230
マルチプロダクト開発の現場でAWS Security Hubを1年以上運用して得た教訓
muziyoshiz
2
2.2k
AIのコンプラは何故しんどい?
shujisado
1
190
日本版とグローバル版のモバイルアプリ統合の開発の裏側と今後の展望
miichan
1
130
Featured
See All Featured
Why You Should Never Use an ORM
jnunemaker
PRO
54
9.1k
A better future with KSS
kneath
238
17k
Large-scale JavaScript Application Architecture
addyosmani
510
110k
RailsConf 2023
tenderlove
29
940
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.3k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
159
15k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
226
22k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
365
25k
GraphQLとの向き合い方2022年版
quramy
44
13k
StorybookのUI Testing Handbookを読んだ
zakiyama
27
5.3k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
330
21k
Documentation Writing (for coders)
carmenintech
66
4.5k
Transcript
1/31 AIテクノロジー エンジニア / 朝日田 卓哉 『Cygames展 Artworks』における Shadowverseデジタルサイネージ制作事例 エンジニアリング/プロダクション
2/31 この講演について 本講演ではCygames展Shadowverse サイネージコンテンツの開発事例を紹介します。 エンジニアが中心となりフィードバックを繰り返して 方向性を定める制作プロセス、イベントコンテンツ特有の 制約に対する解決手法について解説します。
3/31 朝日田 卓哉 AIテクノロジー 先端コンテンツチーム / エンジニア 広告系の制作会社でネイティブアプリや、XRコンテンツ、インスタレー ションなどの開発を経て、2018年7月に株式会社Cygamesに合流。 合流後もARアプリ開発や、VRコンテンツ開発、デジタルサイネージを活
用したコンテンツ開発など、オフラインイベントに向けたコンテンツ制作 を多く担当。 自己紹介
4/31 アジェンダ ◼ Cygames展で展示したShadowverseのコンテンツについて紹介 ◼ コンテンツの仕様や使用した機材等について コンテンツ紹介 ◼ エンジニア主導とはどういったものか ◼
なぜエンジニアが主導する必要があるのか ◼ 実際にエンジニアが主導することでうまく進められた事例 エンジニア主導による制作プロセス ◼ 機材選定やオペレーションを踏まえたシステム構成の考え方 ◼ 実際に発生した不具合とその対応について イベントコンテンツ開発のTips
5/31 コンテンツ紹介
6/31
7/31 コンテンツ紹介 ◆ 東京上野の森美術館で行ったCygames展のShadowverseコーナー ◆ タッチパネル18枚を敷き詰め歴代のカードを展示(すべてのカードがタッチ可能!) ◆ Shadowverse歴史をたどれるコンテンツ
8/31 歴代のカードで展示コンセプトを体現 ◼ Cygames展のコンセプトは 最高のコンテンツの系譜 ◼ 歴代のカードを大量に展示し 系譜を表現 ◼ タッチ操作でShadowverse
の進化を体験
9/31 展示されたカードの詳細 ◼ 第28弾までが対象 ◼ すべてプレミアムカード ◼ トークンカード含む一部コラボカードも展示 ◼ タッチすることでカードに応じたアニメーションが再生
◆カード総数4122枚を展示
10/31 タッチパネル仕様 ◆75型タッチディスプレイ ◆横13枚縦18枚で構成 ◆10点マルチタッチ ◆10枚まで同時に触ったときに 一番きれいに見える位置にアニメーション ◆11枚以上は範囲内でランダムに移動 ◆全カードがタッチ可能!
11/31 カードタッチによるインタラクション ◼ 10枚まで同時にタッチ可能 ◼ 10枚を敷き詰めたときにカード が一番大きくなるように配置 ◼ 配置パターンはAかB のパターンに限られる
◼ ABをランダムで表示 4つの配置パターン 何度も触りたくなるような演出に
12/31 カードの種類ごとのアニメーション スペル・アミュレット • 移動アニメーションは フォロワーと同じものを利用 • エフェクトはゲーム内のものを 組み合わせて今回のために作成 フォロワー
• 進化モーションやエフェクトは ゲーム内と同じものを使用 • 移動量のみ今回用に調整 すべてのカードを触れる イベントコンテンツとして制作
13/31 展示会場や美術館といった環境で 展示体験するコンテンツ イベントコンテンツとは? ◆ 入力機器と出力が異なる程度の違い ◼ タッチパネルによる入力や、プロジェクターによる投影やHMDなど ◆ コンテンツの作り方はゲームもイベントコンテンツも同じ
◼ ほぼゲーム開発と変わらない=すでに開発しているリソースを そのまま流用して新しいコンテンツを作ることができる ゲーム開発との違いは意外と少ない
14/31 ◆ 決めないといけない項目は 実際に実物を見ないと想像がつかない ◆ 特に通常のゲーム開発とは離れたコンテンツほど イメージがしにくい ◆ ハードウェア的な問題点・注意点は エンジニアしか把握していない場合が多い
イベントコンテンツ特有の問題
15/31 エンジニア主導による制作プロセス
16/31 エンジニア主導の制作プロセスとは 設置時の注意点 • 機械特性を考慮した設置環境 • メンテナンスを見据えた導線や システム構成 • 設置に必要な時間をもとにした
スケジュール コンテンツの動きや仕様 • 本番に近い環境を再現 • どういったコンテンツなのかを 体験できるように • 次に何を決めればよいのか イメージできるように作る エンジニアが主体的に動き、周りを巻き込みながら コンテンツ制作を進めていく
17/31 なぜエンジニア主導で進めるのか ◆ 実装や検証はエンジニアの得意分野! ◼ テキストだとイメージしにくいので実際に体験できることが重要 ◼ 体験できることでその場でイメージを共有できる ◼ 足りない要素も仮実装して議論を進めることが可能に
◆ 逆算して制作を進められる ◼ 開発や設営工数だけでなく、必要な設営環境もエンジニアが把握 ◼ イベント日から逆算してスケジュールを引き、どんなコンテンツ であれば内容を最大化できるのか提案することができる ◼ 機材の動作環境や設営における注意点から会場として 設計できる空間を逆算できる
18/31 実際にエンジニアから出た不明点 コンテンツの動きや仕様 ◆ コンテンツの動きや仕様 ◼ スペル・アミュレットは進化しないがどうするか ◼ すべてプレミアムだと画面がうるさくならないか ◼
画面にカードを敷き詰めたときのサイズ感 ◆ 設置時の注意点 ◼ 廃熱対策のエアフローをどうすか ◼ トラブル発生時のメンテナンスはどこで行うか ◼ 設置やセットアップにかかる時間から逆算したデッドライン
19/31 まずは実装してから確認する理由 実際に作ってみないとわからない! ◆ 文章や画像、キャプチャした動画ですら イメージがつきにくい ◼ 表示内容や動きの確認は必ず実機でチェック ◆ PCで動かしても筐体の大きさが異なるため
体験がまったく違ったものになる ◼ 可能な限り本番環境と同じものを用意するのが望ましい
20/31 指定のない演出を見つけたとき まずは適切なものを見繕って実装して、どのように調整して いくか相談できる環境にする スペル・アミュレットに は進化に似た演出がない ゲーム内で使用されている 演出からコンテンツに あった演出を実装してみる エンジニアはただ作るだけでなく、コンテンツへの深い理解も必要
21/31 実機で確認するときのTips 確認時に複数パターン切り替えられる仕組みを 仕込んでおくことも重要 ◆ いわゆるデバッグコマンドを仕込んでおき、動作中に切り替える ◆ 遅延なく切り替えることで、どのパターンがより良いか判断しやすくなる
22/31 イベントコンテンツ開発のTips
23/31 コンテンツで使用する機材について 会場のみの特定環境に特化した機材構成 ◆ 会場で設置した環境でしか動かさないため、不特定多数 の端末に対応する必要がない ◆ 動作環境を自前で用意することで、コンテンツに応じた 機材の選定により、スペックによる制限がなくなる
24/31 今回のコンテンツに特化した機材 メモリ管理が必要になるとメモリリークの 可能性が含まれてしまう すべてのリソースを起動時に読み込み、 動作中のアセットロード等をなくすことで、 メモリ管理自体を行わないような設計に メモリを潤沢に用意してメモリリークを抑制!
25/31 現地の環境や運用を見越した設計 その1 その2 現地で微調整が行えるようにする オペレーションを踏まえた操作方法にする
26/31 現地で微調整が行えるようにする ◆ 最終調整は必ず発生する ◼ 本番に近い環境は本番環境ではない ◆ 主に外部ファイルで調整できるように設計 ◼ 今回は対応ディスプレイ番号をファイルで管理
不具合発生時に簡単に機材を交換できるように
27/31 オペレーションを踏まえた操作方法 注意点 会期中は運営スタッフが不具合対応含めてすべて対応 可能な限り操作をなくし 自動ですべて動作するのが理想 ◼ 立ち上げとシャットダウンもすべて自動化 ◼ 外部ファイルの内容に従って表示内容が変化
◼ 不具合発生時にPCを変更する場合、設置場所以外で ファイルを書き換えることで簡単に機材更新が可能
28/31 実際に発生した不具合 安価なノーブランド品を 利用したのが原因 信頼性の高いメーカー品に 購入して切り替えて対応 設営時に4K解像度で出力できない! 準備段階でHDMIとDポートの変換アダプタの相性が悪く、 本来出したい4K解像度で表示できなかった
29/31 展示期間中の不具合 展示期間中にシステム的な問題は発生せず、 終了まで問題なく動作し続けた この中に文字を打ち込む エンジニアとしては逆に 何も起きていないのは不安でした
30/31 まとめ ◼ 展示したShadowverseのコンテンツはどのようなものだったのか ◼ カードの詳細や使用したタッチパネルについて解説 展示を行ったコンテンツについて ◼ イベントコンテンツ制作では実際に全員で体験してみることが重要 ◼
体験するためにはエンジニアが主体的に動いて作らなければならない ◼ 足りない要素があってもまずは作ってみて議論できるようにする コンテンツ制作におけるエンジニア主導 ◼ 機材選定の考え方について ◼ 設営やオペレーションを踏まえて調整しやすいようにシステムを考える ◼ 実際に発生した不具合とその対応について イベントコンテンツ開発のTips
31/31