2019/9/25-6に開催されたUnite Tokyo 2019の講演スライドです。 岡村 雄一郎（株式会社スパーク/株式会社スパーククリエイティブ） 広本 則行（株式会社スパーク/株式会社スパーククリエイティブ） こんな人におすすめ ・VFXへの興味 ・Unityを始めとする3Dへの興味 受講者が得られる知見 ・最新のVFX事情 ・最新のSPARKGEARのテクノロジ Unityのイベント資料はこちらから： https://www.slideshare.net/UnityTechnologiesJapan/clipboards

1. P. 1
ラストクラウディア×SPARKGEAR
「3D」あるいは「超2D≠3D」の話
株式会社アイディス
和泉森人

2. P. 22
自己紹介
略歴：
・代表作
・ブレイブ フロンティア (VFX)
・ファイナルファンタジーブレイブエクスヴィアス (VFX)
・現在は「ラストクラウディア」のVFXのディレクション
と制作、後進の育成に従事
和泉 森人
株式会社アイディス
デザイン部 リードVFXデザイナー
izumi@aidis.co.jp
※1 ©Alim Co., Ltd. All Rights Reserved.
※2 © 2015-2019 SQUARE ENIX CO., LTD. All Rights Reserved. Developed by Alim Co., Ltd.
※1
※2

3. P. 33
ラストクラウディアの特徴
タイトル ：ラストクラウディア
ジャンル ：RPG
配信日 ：2019年4月15日
公式サイト ：https://www.lastcloudia.com/
公式Twitter：https://twitter.com/lastcloudia
・リリース4ヶ月で７０万ユーザー突破
・様々な技術のMIX
・2Dキャラ+3D背景のMIX
・ドット、2D、3D、ハイクオリティなムービー
・海外展開を前提としたアート
・3D造形差による好みを回避するドット
・日本で受け入れられるテイストのキャラ
・特殊な装備アイテム「アーク」
・詰め込まれたこだわりと遊び

4. P. 44
パレットテクスチャで実現したフレキシブルデザイン
＜「シャープ」と「ソフト」のいいとこどり＞
パレットテクスチャのオフセットによるアルファクランチ表現
+
グレースケールテクスチャとパレットテクスチャの組み合わ
せでシャープにもソフトにも自由に設定できる
さらにパレットの適用度をオフセットさせることで
アルファクランチも可能
アルファチャンネルの推移の幅を狭めれば、よりシャープに
派手さ、発光感を要求されるところでは、シャープなエッジと
ボケ足の長い加算エフェクトを併用
セルルックな見た目を要求されるところでは、アルファチャンネ
ルの0～255の幅を短くしたり、あえてマッハバンド的なパレット
を使用したり…
特殊スキルエフェクト その他…
ヒットエフェクト
派手さを担保しつつ、視認性を考慮して、発生後、
余韻を残しつつ中央から晴れていくデザイン
パレットテクスチャの活用によって、
アルファクランチ表現によるシャープな輪郭も、発光感のあ
るボケ足の長いソフトな表現も、自由自在
専用テクスチャの作成も不要

5. P. 55
「超2D≠3D」3Dエフェクトと2Dイラストの融合
アーク
古代文明の遺物という設定の装備品
「スノードーム」がモチーフ
ユニット詳細
イラストを元にした、ユニット（プレイヤーキャラ）のアニ
メーションが鑑賞できる
＜イラストを活かし「命」を吹き込む＞
2Dのイラストが動き出すまで
5層に分解
SPARK
Spine
SPARK
SPARK
Spine
元イラストを、描画順、回り込
みなどを考慮して、SPARK3層、
Spine2層の計5層に分解
元イラスト
完成

6. P. 66
「超2D≠3D」3Dエフェクトと2Dイラストの融合
＜Spineとの連携で3Dと2Dを融合＞
Spineで制作された
キャラクターの
アニメーションに
SPARKのエフェクトの
動きを合わせたい
後ろの人物の持つ剣自体はSpineだが、
表面の虹模様のアニメーションはSPARK
(虹模様をUVスクロールさせ剣の形でマスク、
ボーンアタッチ機能を使用して剣の動きに同期)
謎の少女ティリア
Spineボーンアタッチ機能
キャラクターの持つ
杖の先端の宝玉の光
モンスターの口から
流れるヨダレ
ボーンアタッチ機能活用例

7. P. 77
「超2D≠3D」3Dエフェクトと2Dイラストの融合
ちなみに…
パーティクル種「ポリライン」を使用
設定によりバネやヒモのような挙動ができ、
慣性を表現できるパーティクル種
モンスターの口から流れるヨダレ
鳥の翼や…
火炎放射など、応用次第で様々な状況で
活用できる

8. P. 88
「超2D≠3D」3Dエフェクトと2Dイラストの融合
＜元イラストを「超2D化」する＞
元イラスト
イラストの形にあわせた
メッシュを作成
Z投影用UVと、ディス
トーション用のUVを作成
する
■マスク付きディストーションマップ
RGBのBチャンネルの成分がある
箇所にだけディストーションがか
かる
完成！
黒キ死神メルザ

9. P. 99
おまけ…
氷の刹姫セヴィア
ラストクラウディア開発初期…
まだSpine担当デザイナーがいない頃
「このキャラを、SPARKGEARを使って
『動かして』くれないか」
と言われて渡されたのが左のイラスト
動かせと言われても
Spineのようなメッシュ変形は使えないし…
ボーンとかないし…
そもそもそういうツールじゃないし…
体の各パーツのメッシュつくるの面倒くさいなぁ…
とはいえまぁディストーションとか使えばそこそこまぁ…
とりあえずやってみるか…

10. P. 1010
おまけ…
できちゃった…♥
↑これ全部SPARKGEAR

11. SPARKGEARの
最新機能について
株式会社SPARK
代表取締役 岡村雄一郎
取締役副社長CTO 広本則行

12. SPARKGEARとは？

13. SPARKGEARの概要

14. SPARKGEARの概要
• VFXを作るためのミドルウェア
• Windows用のオーサリングツールとSDKから構成
• Unity他メジャーなゲームエンジンに対応済み
• パーティクルツールではなくタイムラインやギミック機能も
はいったVFX統合ツール

15. 対応プラットフォーム

16. Unity SDKでの
対応プラットフォーム
• Windows(DirectX9/DirectX11/DirectX12/OpenGL/Vulkan)
• OSX(OpenGL/Metal)
• Android(OpenGLES/Vulkan)
• iOS(OpenGLES/Metal)
• Universal Windows Platform(DirectX11)
• WebGL
• PlayStation 4
• Nintendo Switch

17. Unity SDKでの
対応機能
• ScriptableRenderPipeline
• LWRP(2018.3)
• LWRP(2019.1)
• アセットバンドル
• Prefab
• フレームバッファエフェクト
• 深度バッファエフェクト
• Culling Maskによるカメラ毎のレンダリング

18. SPARGEARのVFXを
Unityで扱う

19. Unity向けのバイナリ出力

20. インポートとPrefab

21. Unity上で出来る事
• Transformを使った移動回転拡縮
• Culling Maskを用いた描画対象のカメラの切り分け
• D&D時に自動的にPrefab化される
• VFXデータへのアクセスはSPFXInstanceコンポーネントで操作を行う
• Unityフォグの影響を受ける
• Unityライトの影響を受ける
• Unityコリジョンとの衝突判定
• 再生速度の操作

22. SPARKGEARのコンフィグ

23. フレームバッファの利用

24. 深度バッファの利用

25. バインダー

26. コリジョン

27. SPARKGEAR VER.2

28. SPARKGEAR VER.2
• 2019年9月よりご希望の会社様への提供を開始
• VER.1のデータは基本的にそのまま開くことが出来る
• 対応プラットフォームは Windows/OSX/Android/iOS/PlayStation4/NINTENDO
Switch/WebGL
• 対応ゲームエンジンは Unity他
• DirectX12に対応
• Vulkanに対応
• テクスチャの管理をよりシンプルに
• バイナリの出力オプションをよりシンプルに

29. UNITY
• DirectX12に対応（Unity2019.1より、Windows)
• Vulkanに対応（Unity2019.1より、Windows/Android)
• LWRPに対応（Unity2018.3より）

30. プロシージャルモデル

31. 概要
● ノードベースでエディットできるモデル
● ノードの状態をリアルタイムにVFXに反映
● モデルをFBXファイルに出力可能

33. 組み込み済みの
ジオメトリノード
● 円盤
● 球
● 円筒
● 竜巻
● 円盤
● ドーナツ
● モーションパス
● 平面
● 正二十面体

34. モデルノード
● 他のモデルをジオメトリノードにできる
● プロシージャルモデルもジオメトリノード
にできる

35. サブディビジョンノード
ピクサー社の
『OpenSubdiv』を使用

36. ディスプレイスメントマップ
ノード
テクスチャーをディスプレイスメントマップとして
変形

37. プロシージャルテクスチャ

38. 概要
● ノードベースでエディットできるテクスチャ
● ノードの状態をリアルタイムにVFXに反映
● テクスチャをTGAファイルに出力可能

40. GPUパーティクル
• GPUを用いて大量のパーティクルを
発生させるためのシステム
• GPUが対応していない場合は
CPUでのエミュレーションに切り替わる
• フローマップを使ったMotionVectorにも対応

41. 流体
• Stable Fluidsベースの流体シミュレーション
• そのまま実機上で出せるのはCS5.0と
ボリュームテクスチャが使える環境のみ
• レンダリングしてフリップブックとして使う想定
• フローマップのレンダリングにも対応

42. 流体テクスチャペインター
• StableFluidを用いた流体ペインター
• 上下左右が連続してつながっており
画像が必ずループするようになって
いる

43. モーションベクター
フローマップを使った
モーションべクターパー
ティクルをGPUパーティ
クルの機能として対応
Houdiniなどから出力した
フローマップを使って少
ない枚数でもフリップ
ブックを綺麗に

45. 頂点アニメーションテクスチャ
位置情報などをテクス
チャに焼き付けて複雑な
メッシュアニメーション
が出来る機能
Houdiniなどから出力した
VATデータの再生ができる
ようになりました

47. 粒子流体
• こちらはまだ開発中
• GPUを用いた粒子ベースの流体シミュレーション
• こちらもグリッドべースの流体と同様にVATデータでの出力を行ってモバイルでも
動作するように開発中

48. 実演

49. 今後のバージョンアップ
について

50. 今後のバージョンアップについて
• ノードベースのマテリアルエディター
• プロシージャルテクスチャのノードの順次追加
煙や炎などのボリュームレンダリング系の開発が進行中
• プロシージャルモデルのノードの順次追加
ブール演算と破砕の開発が進行中
• 流体のシミュレーション結果のキャッシュ
• 流体のVertexAnimationTexture出力対応
• GPUパーティクル／流体用のベクターフィールドエディター
• 不透明パーティクルのシャドウキャスト
• NativeRenderingPluginを用いないバージョンの開発

51. Ｑ＆Ａ