XFLAG スタジオにおける資産の有効活用術
~いかにして数万アセットを管理したか?~
2018/5/7-9
下田 淳
株式会社 ミクシィ
XFLAG スタジオ XFLAG ARTS テクニカルアートグループ
下田 淳
CGアーティストとして映像業界でゲームムービーや
遊技機映像制作など様々なプロジェクトに参加。
その後、コンシューマーゲーム開発会社、ソーシャ
ルゲーム開発会社を経て、2014年より株式会社ミク
シィに所属。
現在はテクニカルアートグループのマネージャーと
して、メンバーの育成・チーム強化を行っている。
株式会社 ミクシィ
XFLAG スタジオ XFLAG ARTS テクニカルアートグループ
atsushi.shimoda@mixi.co.jp
本セッションの内容
 XFLAG スタジオの紹介
 SHOTGUN導入事例
 ライブラリとしての活用事例
 プロダクト開発事例
 Unityを用いたハイエンド映像制作
 リアルタイム映像コンテンツの作り方
 TAのその他の取り組み
本セッションについて
資料は即日公開されます
撮影は禁止致しませんが、シャッター音など鳴らさないよう
にお願い致します。
動画は後日公開されます
動画の撮影は可能です。
XFLAG スタジオについて
©XFLAG
友達や家族とワイワイ楽しめる
“アドレナリン全開”の
バトルエンターテインメント
を創出し続ける。
©XFLAG
SHOTGUN導入事例 〜当時の課題〜
ある3Dのプロダクトにアサインされたとき…
従来の管理方法の問題点
 アセットが複数のスプレッドシートで管理されていた
 最新のデータがどこにあるかわかりにくい
 管理コストが高い
©XFLAG
他に抱えていた問題
• サムネイルの一覧表示ができない
• 情報にたどり着くまで時間がかかる
• 誰がボールを持っているかわからない
• データの先祖返りが発生した
など
©XFLAG
ツール選定から検証まで
ツール選定
• ツール選定において重要視したこと
・サムネイルの一覧表示ができる
・ガントチャート機能がある
・映像データの管理ができる
・コメント通知機能がある
・日本語でのサポートが受けられる
・さほどコストがかからない
・使いやすい
Shotgun ならば解決が出来るのでは?
コミュニケーションの改善
情報の共有、蓄積
プロジェクトの進捗管理
スプレッドシートの上位互換
クラウド上で情報を一元管理出来る!
©XFLAG
主な選定理由
 フィルター機能が強力
 APIによる拡張ができる
 進捗状況が把握しやすい
 レイアウトを自由に組める
 動画の管理に強い
 細かいパーミッションの設定ができる
 セキュリティーが高い
 グラフ機能がある
©XFLAG
欲しい機能がほぼ備わっていた
検証を開始
 SHOTGUNの習得方法
・公式サイト
https://support.shotgunsoftware.com/hc/en-us
・AREA JAPANのサイト
https://area.autodesk.jp/product/shotgun/
・Born Digitalサポートのサイト
https://support.borndigital.co.jp/hc/ja/categories/202636278-Shotgun
・サポートへ問い合わせ
など
検証スケジュール
 検証から運用までの期間(約2ヶ月)
©XFLAG
導入後の活用イメージ
©XFLAG
SHOTGUNを使ってみて
スプレッドシートの管理業務が不要になり…
©XFLAG
約150時間/月の削減になった
SHOTGUN を使ってみて
©XFLAG
SHOTGUN を使ってみて
メリット
● ほぼ全ての情報、データを一元化できた
● 開発メンバーの管理意識が高くなった
● 管理コストを下げられた
デメリット
● 導入コストが高い
→ ガイドを作成し説明会を何度か行った
● データ通信に時間がかかる
→ フィルターを活用して通信量を抑えた
● 設定項目が多く複雑
→ パーミッション項目をリスト化した
ライブラリとしての活用事例
モンストには、
キャラ、バナー、アイテム類などの
デザイン素材が数万点存在する
課題①:データを探すのに時間がかかる
→ データ検索時間の削減が必要!
課題②:データ取り違えや削除ミスが発生しやすい
→ セキュリティ・資産の保全が必要!
©XFLAG
ライブラリ化することのメリット
• 資産の二次利用ができる
• ナレッジの共有により知識レベルの向上に繋がる
• データ受け渡しの手間と時間を削減できる
• 制作サイクルが上がることでクオリティーアップができる
• セキュリティ、資産の保全ができる
• 企画書などのドキュメント作成素材として使える
などにより…
早く帰れる!
©XFLAG
プロジェクトのライブラリ化
©XFLAG
ライブラリの種類
サウンドモンスト
新規プロ
ダクト
セミナー
Unity
アセット
エフェク
ト
©XFLAG
ライブラリの種類
©XFLAG
フィールドのカスタマイズ例
• 選んだ項目ごとにセルの背景色が変わるように条件を設定
©XFLAG
ページのレイアウト例 ①
©XFLAG
ページのレイアウト例 ②
©XFLAG
ページのレイアウト例 ③
©XFLAG
動画をご覧ください
〜アセットライブラリのデモ〜
アセットライブラリのデモ
ライブラリへの簡易アクセスツール
SHOTGUN Launcher(mac) SHOTGUN Launcher(win)
©XFLAG
アセットのアップロードツール
Asset Uploader各種アセット
©XFLAG
動画をご覧ください
〜UnityからSHOTGUNへのアップロードツールのデモ〜
UnityからSHOTGUNへのアップロードツール
GitHub・SHOTGUN・Slackの連携
©XFLAG
動画をご覧ください
〜GitHub・SHOTGUN・Slackの連携のデモ〜
GitHub・SHOTGUN・Slackの連携
ライブラリ化をするのではなく
意識せずともライブラリ化
されていることが理想
©XFLAG
プロダクト開発事例
〜パイプラインツールについて〜
©XFLAG
動画をご覧ください
〜「ファイトリーグ」のご紹介〜
プロダクト紹介
アセットパイプライン
©XFLAG
APP Launcher
 アプリケーションを、各プロジェクトの
規定された環境で起動するツール
 ドライブのマウント、指定したプラグイ
ンのロード、DCCツールの各環境パスな
どが自動で設定される
 プリセットは専用ツールから登録
©XFLAG
File Manager
• ファイルのOpen/Saveを行うツール
• Saveの際にファイルのサムネイル、解
像度、ユーザー名、日時、コメントなど
の情報を保存する
• SubversionのUpdate, Commitが行え
る
• SHOTGUNのコメント機能(Notes)に
も対応
©XFLAG
動画をご覧ください
〜File Managerのデモ〜
File Manager
File Managerの活用イメージ
PhotoshopMaya
©XFLAG
プロダクト開発事例
〜 Mayaツールについて〜
MayaビューポートでのUnityシェーダー再現
Unity Maya
©XFLAG
MayaビューポートでのUnityシェーダー再現
• ShaderFXでのシェーダ設計
©XFLAG
バリデータツールとSHOTGUNの連携
一括チェック
(Batch版)
個別チェック
(GUI版)
©XFLAG
バリデータツールとSHOTGUNの連携
• バリデータツール(GUI版)
©XFLAG
バリデータツールとSHOTGUNの連携
• バリデータでのチェック結果をSHOTGUNに反映
©XFLAG
バリデータツールとSHOTGUNの連携
• エラー統計をグラフ表示
©XFLAG
Shotgunにご興味をお持ちの方は、
AREA JAPAN をご覧下さい
ゲーム開発における導入企業
展示ブースにお立ち寄りください
プロダクト開発事例
〜 Unityツールについて〜
AssetChecker
選択したアセットのパスや参照しているテクスチャ等の情報を一覧表示するツール
©XFLAG
AssetBundle Selector
• AssetBundleを選択しやすくしたツール
• デフォルトでできる機能(未使用の名前
を削除、Noneを設定、バリアントの設
定等)はカバーしている
• 名前を検索する機能も追加している
©XFLAG
Effect Regulation Checker
• ParticleSystemのデータの不正な部分
を検出、修正するツール
• 各種チェックを一括で実行する(個別で
のチェックも可能)
チェック結果チェック項目
©XFLAG
Effect Material Inspector
• エフェクト用のマテリアルのインスペク
ターを拡張
• 選択したシェーダーに合わせたマテリア
ル名にリネームする機能がある
• RenderQueueを選択出来るようドロッ
プダウンで選択できるようにしている
©XFLAG
Effect Previewer
• 既存のエフェクトデータを読み込んで再
生するツール
• 関連するデータをシーン上に配置して確
認できる
• エフェクト用マテリアルデータを板ポリ
ゴンに適用しシーン上に一覧で見れるよ
うに配置できる
• 3Dキャラクターのプレハブを読み込ん
でシーン上に配置できる
©XFLAG
SpritePacker Window
• SpritePackerのアトラステクスチャを
確認できるツール
• 名前を検索する機能もある
©XFLAG
Chara Prefab Maker
• キャラクターのプレハブを1ボタンで設
定してプレハブを保存するツール
©XFLAG
Unityを用いたハイエンド映像制作
アニメ制作コストを抑えつつ
ハイクオリティーな映像を作る
目的
達成条件
• 魅力的なキャラクターであるか
• 躍動感のあるアニメーションであるか
• 映像品質が担保されているか
©XFLAG
手法
• ゲームエンジンによるリアルタイムシーケンスの構築
• マーザ・アニメーションプラネット様と共同研究
©XFLAG
ツール環境
• Unity5.5a6
• Maya2016SP5
• Substance Painter
など
ワークフロー比較
©XFLAG
動画をご覧ください
〜Unity映像技研のご紹介〜
Unity映像技研
モデル
• ハイモデルをベースに改修
• rig用のLowモデルとUnity用のHighモデルの2種類
©XFLAG
テクスチャー
• Photoshop:肌、髪、眼球を作成
• Substance Painter:上記以外の体など
©XFLAG
アニメーション
• AlembicではなくFBXを使用
• Smooth Skinning Decomposition with Rigid Bones(SSDR)の技術を利用
BaseRig With SSDR
©XFLAG
リギング
• mGear1.1を使用
©XFLAG
シェーダー
• マーザ様が“THE GIFT”制作時に開発していたものを拡張
Standard Shader Skin Shader(SSS強め)
©XFLAG
シェーダー
• Marza Standard Shader
• Skin Shader
• Eye Shader
• Hair Shader
• Gem Shader
©XFLAG
ライティング
• Directional Lightを4灯使用
• Ambient Sourceは『Gradient』を使用
• Light ProbeによるBakeは不使用
• Reflection Probeも『Realtime』
©XFLAG
カットシーン
• 『Storyteller(現Timeline)』を使用し実装
• Animation Trackだけでカットシーンを構築
• 各項目をStorytellerで生成したアニメーションで制御
©XFLAG
フレームレート計測値
• キャラクター単体のショットでは120fps~155fpsを計測
©XFLAG
フレームレート計測値
• カットシーンのショットでは24fps~90fpsを計測
©XFLAG
映像の方向け注意事項(技術的制約)
• 1オブジェクト65000vertex制限がある
• インフルエンスの最大が4本まで
• メッシュに対しての制限ジョイント数が256本まで
制作コスト
• 4クール(52話)のCG映像制作費の概算
第01話 第13話 第26話 第39話 第52話
↑
制
作
費
©XFLAG
ゲームエンジンを使いリアルタイム
で映像制作することで、映像品質を
担保し中長期的にコストを抑えて
いけることが試算できた。
結果
リアルタイム映像コンテンツの作り方
〜人気のライブイベント! モンストークライブ〜
モンストークライブとは?
• XFLAGがプロデュースするLIVEエンターテインメントショー 「XFLAG PARK
2017」のコンテンツで、スマホアプリ「モンスターストライク」で大人気の3
キャラクター(アーサー、ガブリエル、ルシファー)と観客が直接トーク出来る
ステージショー
©XFLAG
モンストークライブとは?
• ゲーム中の声優本人がキャラクターの声を担当し、大勢のファンとトークに
セリフ合唱にと大盛況のステージとなった
©XFLAG
動画をご覧ください
〜「モンストークライブ」のご紹介〜
モンストークライブ
システム構成
©XFLAG
©XFLAG
©XFLAG
©XFLAG
TAのその他の取り組み
動画をご覧ください
〜リアルタイムモーションキャプチャ検証のご紹介〜
リアルタイムモーションキャプチャ検証
リアルタイムモーションキャプチャ検証
©XFLAG
動画をご覧ください
〜Hololens検証のご紹介〜
Hololens検証
動画をご覧ください
〜ARKit検証のご紹介〜
ARKit検証
以上となります
お知らせ
積極採用中!
XFLAG スタジオは、
様々なエンターテインメント領域で採用を強化中です。
詳細はWEBで!
(スポーツ領域にも新たに参入しています!)
https://career.xflag.com/career
※選考に関する問い合わせ先※
career@mixi.co.jp
©XFLAG
Thank you!

【Unite Tokyo 2018】XFLAG スタジオにおける資産の有効活用術 ~いかにして数万アセットを管理したか?~