GTMF2016「Unreal Engine 4で高品質なVRコンテンツを 制作するために知っておきたい100のテクニック」

GTMF 2016 Unreal Engine 4で高品質なVRコンテンツを 制作するために知っておきたい100のテクニック Epic Games Japan 下田純也 #UE4 #gtmfjp2016

2016年、ハイエンドVRHMD発売！ •3/28 Oculus Rift •4/5 HTC Vive •10/13 PS VR #UE4 #gtmfjp2016

UE4はMobileでのVRもサポート • Gear VR • Google Cardboard • Google Daydream • Project Tango • OSVR • Magic Leap (coming soon) #UE4 #gtmfjp2016

Unreal Engine 4 の国内動向 • 国内発のVRタイトル！ • • • • サマーレッスン（バンダイナムコエンターテインメント様） エースコンバット ダンガンロンパVR 実はあのタイトルも・・・ #UE4 #gtmfjp2016

Unreal Engine 4 の国内動向 • イベント系VR • PEPSI STRONG BALL、ガジラVR、トリンプ、四季の世界遺産ドライブ • 6/29～7/1のコンテンツ東京でも多数出展があった模様 • GodSpeed VR • 映像系ももろもろ • インディー系VR • マブラヴVR (steam) • ネコパライブVR (steam) • VR ZONE Project i Can （バンダイナムコエンターテインメント様） #UE4 #gtmfjp2016

VR ZONE Project i Can 体験されまし た？ • オープン時の6アクティビティ中、4アクティビティでUE4採 用！ #UE4 #gtmfjp2016

VR ZONE Project i Can 本日7/15より 新たに2アクティビティが登場！！ • オープン時の4アクティビティと合わせて6アクティビティがUE4！ #UE4 #gtmfjp2016

VRクリエイターなら VR ZONE Project i Canは 体験しておいて絶対損はないです #UE4 #gtmfjp2016

映像クオリティと体験の質を上げたい • 現在皆様が体験できる UE4が採用されたVRコンテンツはどれもクオリティが高いです • が・・・、このレベルに仕上げるには様々な注意点があります • これまでにEpic Gamesでは幾つものVRデモを制作し、そのノ ウハウをサンプルやドキュメントで共有してきました。 • 今回はこれまでに得られたノウハウをひとまとめ #UE4 #gtmfjp2016

ここから本題 #UE4 #gtmfjp2016

映像クオリティと体験の質を上げたい？ • VRが産業として成り立つようにするため （VRで継続してお金が得られるレベルのものにする） • VRでお金が得られるようにするためには？ • 映像クオリティの向上が必要 • 現実と見紛う程の品質が得られないと、一般ユーザーへの訴求は難しい • （クオリティが低いものは、おもちゃレベルのものという認識） • 体験の質の向上が必要 • 酔うコンテンツにわざわざお金を払うユーザーはいない • 体験の時間もある程度の長さが必要（その為にも酔わせるわけにはいかない） #UE4 #gtmfjp2016

Couch Knightsデモ • 2014/3 GDCにて公開 • Oculus DK2にて実現されたヘッドトラッキングへの対応 • 1人称視点のおっさんとなって、3人称視点のチビきゃらを操作 GDC 2014 にて • ネットワーク対戦 Oculus DK2のヘッドトラッキング #UE4 #gtmfjp2016 Road to VR (www.roadtovr.com)

Couch Knightsデモ以前に得られたもの • 実はCouch Knights以前にもDK1でUE4のコンテンツのVR化を 試していました • が、DK1では酔いやすいコンテンツが多かった・・・ • ヘッドトラッキングが効かないので、実際の頭の動きと映像とに大き な差異 • 単純にフレームレートも低いので回転の応答も遅い。 • 実際の身体は動いていないのに映像側が動いていると、身体も動いて いるように感じてしまうこと・感覚をベクションと呼ばれていた りしますが • ベクションやこれに類する感覚の差異がVR酔いを起こす大きな要因と なります。 #UE4 #gtmfjp2016

Couch Knightsデモから何が得られたか • DK2以降のヘッドトラッキングによって • 頭の動きと映像が一致するとかなり酔いを抑えられる！ • フレームレートが低かったり遅延が多かったりするともちろん酔う • 高フレームレートは死守すべし • ちなみに、Couch Knightsとは関係ないですが・・・ • ヘッドトラッキングができないモバイルVRは引き続き注意が必要 • ハイエンドVRHMDとモバイルVRの大きな違い • この違いによりハイエンドとモバイルで同一のUXは難しい #UE4 #gtmfjp2016

Couch Knightsデモから何が得られたか • 体験者自身が座っていることとゲーム内でも座っていることが 一致すると酔わない • 自身の体を見せる事で実際にその世界に居る感覚が得られる #UE4 #gtmfjp2016

Couch Knightsデモから何が得られたか • 自身が見える1人称視点かつヘッドトラッキングする場合 頭等の位置が追随できないと違和感がある #UE4 #gtmfjp2016

Couch Knightsデモから何が得られたか • ゲームプレイ自体が1人称視点のように自身の体験でなくても、 3人称視点でVRを活かしたゲームプレイも楽しめる #UE4 #gtmfjp2016

Couch Knightsデモから何が得られたか • ネットワーク対戦はVRでも引き続き楽しめる • が・・・ 同一PC環境で複数のVRHMD対応は難しいので、複数人プレイでは必 然的にネットワークプレイが前提になる #UE4 #gtmfjp2016

ヴィークルゲームのVR化 • Epic Games Launcherから無料でダウンロードできるヴィーク ルゲームをVR化してみた • 2014/7 CNTES (DK1でとりあえずVR化) • 2014/9 CEDEC 2014 (DK2で再挑戦したが酔うとの感想多数) • 2014/10 OcuFes開発者会に向け酔いの低減とそのノウハウ公開 #UE4 #gtmfjp2016

ヴィークルゲームのVR化で酔う要因 • ベクション系 • 体験者は座ってプレイしているのに、バギーカーはすごい揺れや挙動 をすることの差異により酔いが発生 • 激しい車の挙動（実際の車載カメラ等でも起こりえる問題） • バウンドや振動も大きい • 上下左右の回転・ブレ #UE4 #gtmfjp2016

ヴィークルゲームのVR化と酔いの検証 • これらの検証にはカメラの動き等のビジュアライズが有効 • UE4の場合ゲームプレイ中にビジュアルログを残したものをF8キーで いつでもエディタ操作で観察できます • Draw Debugノード群 https://docs.unrealengine.com/latest/INT/BlueprintAPI/Rendering/Debug/index.html #UE4 #gtmfjp2016

ヴィークルゲームのVR化の酔い対策 • 対策は？ • 上下バウンドや振動を抑える • 上下左右の回転・ブレを抑える • 人間ってよく出来てる STEADICAM社より • 身体や首が振動や回転を吸収してくれる • 動いていても目（と脳）はかなり正確に 特定のものをトラッキングできる • 実際の撮影ではどんな対策をしてるの？ • ステディカム・ジンバル・スタビライザー等 #UE4 #gtmfjp2016 Feiyu G3 Ultra 3-Axis Gimbal Stabilizer Introduction - Helipal.com

ヴィークルゲームのVR化で得られた知見 • どうやれば解消できる？ • UE4にはSpringArmというコンポーネントがあって、固定位置とカメ ラの間にSpringArmを挟んでプロパティを調整する • 上下左右の揺れを抑える • 上下左右の回転を抑える • Enable Camera Rotation Lagにチェックを入れ • Camera Rotation Lag Speedを調整（今回は20に設定） • それでもまだ足りない！ • 酔う #UE4 #gtmfjp2016

ヴィークルゲームのVR化の酔い対策２ • どうやればベクションを抑えられる？酔いを解消できる？ • ロールとピッチは車に追随しないようにする • 要はロールとピッチしないようにしてシーン水平を保つことで、プレ イヤーが水平に座っている感覚に近づける 水平線 #UE4 #gtmfjp2016

ヴィークルゲームのVR化、少し補足 • 補足 • アーケードで可動筐体等が使える場合には、シートと体験者に車の挙 動に近い挙動を与える事ができますので、ロールやピッチを抑える必 要はない場合もあります • それでも上下の振動と上下左右の細かな回転・ブレを抑えるのは、酔 いの低減に有用 #UE4 #gtmfjp2016

Showdownデモ • 2014/9 Oculus Connectにて公開 • OculusのハイスペックVR基準機Crescent Bayに対応 • まるで本物のような街角と非現実的なスローモーションの世界 #UE4 #gtmfjp2016

Showdownデモで何が得られたか？ • 酔いを低減するために • 低速移動（Showdownでは世界全体がスローモーション） • 等速直線移動 • 高フレームレートを維持してヘッドトラッキングから実映像までの遅 延を極力減らす • スローモーションにする事で獲得できたもの • 非現実的な体験をユーザーに与えられた • 高品質のモデルをじっくり見ていただけた • 作りこむ世界の範囲を絞る事ができた #UE4 #gtmfjp2016

Showdownデモで何が得られたか？ • 高品質かつ高パフォーマンスを実現するためにはフェイク表現 も含め様々なテクニックを駆使する必要がある • 丸影シャドウを足につける • クルマ型シャドウ #UE4 #gtmfjp2016

Showdownデモで何が得られたか？ • 高パフォーマンスを実現するために有用なテクニック • Parallax Mappingによる窓 • 半透明を何枚も重ねるよりはるかに軽い #UE4 #gtmfjp2016

Showdownデモで何が得られたか？ • 高パフォーマンスを実現するために有用なテクニック • POMによる凹み • 銃弾の凹み • 爆発の凹み #UE4 #gtmfjp2016

Showdownデモで何が得られたか？ • VRにする事で難しくなった（ごまかせなくなった）部分 • 爆発エフェクト等はスプライトや板ポリにすると立体感がなくなる事 がわかった • Showdownでは爆発エフェクトを立体的に作ることで回避 #UE4 #gtmfjp2016

Showdownデモで何が得られたか？ 高速化パラメータ • • • • • • • • • • • • r.SeparateTranslucency=0 r.HZBOcclusion=0 r.FinishCurrentFrame=1 r.MotionBlurQuality=0 r.PostProcessAAQuality=3 r.BloomQuality=1 r.EyeAdaptationQuality=0 r.AmbientOcclusionLevels=0 r.SSR.Quality=1 r.DepthOfFieldQuality=0 r.SceneColorFormat=2 r.SSSSS=0 #UE4 #gtmfjp2016 • • • • • • • • • • • r.TranslucencyVolumeBlur=0 r.TranslucencyLightingVolumeDim=4 r.MaxAnisotropy=8 r.LensFlareQuality=0 r.SceneColorFringeQuality=0 r.FastBlurThreshold=0 showflag.decals=0 r.SSR.MaxRoughness=0.1 r.compileshadersfordevelopment=0 r.rhicmdbypass=0 r.TiledReflectionEnvironmentMinimum Count=10

Bullet Trainデモ • 2015/9 Oculus Connect 2にて公開 • 新たなVRコントローラーOculus Touchへの対応 • ステージ上の銃等を拾いながら迫り来る敵達を撃ち倒す #UE4 #gtmfjp2016

Bullet Trainデモで何が得られたか？ • 酔いを低減 • 基本的には定点で戦うことで、移動に伴うベクションを回避 • 移動はテレポート（ワープ） • テレポートの際はホワイトアウト・インを挟むことで違和感を低減 #UE4 #gtmfjp2016

Bullet Trainデモで何が得られたか？ • 違和感の低減 • 腕を青い半透明にして • 微妙な肌の質感等の違和感をなくす • 実際の指の動きとの違いから感じる違和感もこれにより低減 #UE4 #gtmfjp2016

Bullet Trainデモで何が得られたか？ • Instanced Stereo Rendering • プロジェクト設定 - Engine - Rendering “Instanced Stereo” #UE4 #gtmfjp2016

Bullet Trainデモで何が得られたか？ • 映り込みのフェイク表現 #UE4 #gtmfjp2016

Bullet Trainデモで何が得られたか？ • 複数マテリアルのベイクによる軽量化 After: 2 materials, 77 inst. / mat #UE4 #gtmfjp2016 Before: 5 materials, ~270 inst. / mat

Bullet Trainデモで何が得られたか？ • VRゲームならでは • オブジェクトをつかめる範囲の調整 • 奥行き方面にはかなり余裕をもって取得できるように • つかめるオブジェクトをハイライト #UE4 #gtmfjp2016

VRエディタ • 機能をONにするには • エディタ設定 - General - Experimental “Enable VR Editing” • まだまだ製作中なので • フィードバックください！ #UE4 #gtmfjp2016

ジャパンVRハッカソン UE4のサポートしながら1人ハッカソン • コントローラーでものを掴んで投げる • 物理挙動をしているオブジェクトは物理挙動がONのままコントロー ラーにアタッチして、放出したい所でデタッチすれば思い通りに投げ られる • こちらに公開しました https://epicgames.app.box.com/s/kxfvasvq1duylq5wtgwt3m0qhp617q4w • VRUtils.zipを解凍して、4.12の適当なプロジェクトのContentフォルダに入れて VRutilsTestMapを開いてプレイするとOculus TouchやHTC Viveのコントロー ラー等で動きます。 #UE4 #gtmfjp2016

VR制作 そもそもどこから始めれば良いの？ • FirstPersonテンプレートは既にVRコントローラーに対応済 • 他のテンプレートでもMotionControllerコンポーネントを付けるだけ #UE4 #gtmfjp2016

VR制作 せっかくなのでVRコントローラーで遊びた い • 手に何かを持たせるには？ • MotionControllerにStaticMeshを付ける • 4.12以降 • エンジンのコンテンツに コントローラーのメッシュがあります #UE4 #gtmfjp2016

VR制作 Leap Motionとか使えるの？ • 使えます • Leap MotionのプラグインはUE4に同梱されているので https://developer.leapmotion.com/unreal からドライバ等インストールしてLeap Motion Pluginにチェック • Leap Motionを利用したブループリントクラス群が使えるようになります #UE4 #gtmfjp2016

VR制作 始めてみたけどパフォーマンスが出ない • パフォーマンスの検証の仕方 • まずはCPUネックかGPUネックか確認 • UnitGraph機能が便利 • コンソールコマンド 「stat UnitGraph」 • エディタの統計データの 「UnitGraph」 #UE4 #gtmfjp2016

VR制作 パフォーマンスが出ない時は？ • まずはシェーダーの雑度を見てみよう！ https://docs.unrealengine.com/latest/JPN/Engine/UI/LevelEditor/Viewports/ViewModes/index.html • 赤い所はシェーダーが複雑過ぎて重い（白はさらに複雑） • なるべく緑に #UE4 #gtmfjp2016

VR制作 パフォーマンスが出ない時は？ • VRでよくあるパフォーマンスを落とす要因とその対策 • デフォルトの状態ではGPUネックの場合が多い • 「ProfileGPU」コンソールコマンドもしくは「Shift+Ctrl+,」（カンマ） • 処理時間の多い所を深く調査 #UE4 #gtmfjp2016

VR制作 描画クオリティが出ない時は？ • GPUの中でもライトとシャドウがネックになっている事が多い • 設定次第でかなり変わります • ライトはなるべく事前計算を使う • スタティック < ステーショナリ < ムーバブル • シャドウを落とす必要がないものは 思い切って設定を切る #UE4 #gtmfjp2016

VR制作 描画クオリティが出ない時は？ • 軽めのはずのステーショナリーライト、実は落とし穴が・・・ https://docs.unrealengine.com/latest/JPN/Resources/ContentExamples/Lighting/2_2/index.html • ステーショナリーライトは4個までしか同じエリアでオーバーラップで きなくて、5個目からは☓マークが付きます。 • ☓マークが付いているとムーバブルライトと同じになってしまい、か なりGPU負荷が高くなってしまうので要注意。 • Visualizeの「Stationary Light Overlap」で確認できます。 #UE4 #gtmfjp2016

VR制作 描画クオリティが出ない時は？ • 動的オブジェクトへのシャドウ • Showdownのようにフェイクシャドウを使うのも手ですが • どうしても使いたい場合 • 詳細設定の「ShadowFrustum」確認 • 親子にまとめて「Light Attachments as Group」 #UE4 #gtmfjp2016

VR制作 描画クオリティが出ない時は？ • ポストプロセスも標準状態ではかなりリッチ • Ambient Occlusion (SSAO) を軽めの設定もしくはOFFに • Screen Space Reflection (SSR) を軽めの設定もしくはOFFに • Depth of Field (DOF) を軽めの設定もしくはOFFに • 前述のShowdownデモの設定も有用 • Qiitaにも細かな情報を投稿してありますのでぜひご覧ください http://qiita.com/junyash/items/3ba225d8a2f86046cd23 #UE4 #gtmfjp2016

VR制作 パフォーマンスと描画クオリティの両立？ • パフォーマンスを出そうとすると描画クオリティが出せない • パフォーマンスと描画クオリティ、VRではパフォーマンスが超重要 • 最終手段としては解像度を下げる • 動的に描画解像度を制御するシステムも検討中 • 今でも無理やりやればできるけど、もう少しスマートな方法 • ハイエンド・デスクトップ向けのフォワードレンダラ • 秋頃を目指して実装中 • 高FPSかつMSAA等が扱いやすくなります #UE4 #gtmfjp2016

フォワードレンダリングとMSAA 秋公開目標 • Oculusさんが既にGitHubで4.11ベースの拡張を公開 https://developer.oculus.com/blog/introducing-the-oculus-unreal-renderer/ • Clusteredフォワードレンダリング • MSAA #UE4 #gtmfjp2016

低パフォーマンスPCでVR開発したい • パフォーマンスの低いPCで開発したい時には • エディタの環境設定- General - Miscellaneous “Monitor Editor Performance” をオフにしましょう！（オンになっているとパフォーマ ンスが低いと自動的に描画クオリティを下げようとします） • 設定の「エンジンの拡張機能設定」でも細かく設定可能 • フレームレートを落とす方法もあり • コンソールコマンド「t.MaxFPS 30」 • もしくは、config/ConsoleVariables.ini • [Startup] 項目に //under it write: t.MaxFPS=30 #UE4 #gtmfjp2016

補足と今後の予定 • MetalとVulkanは既にサポートされていますが、デフォルトの モバイルプレビューはOpenGLES系になっています • エディタの環境設定 - General - Experimental “Enable Metal/Vulkan/High-end mobile Preview Rendering Level in Editor” • 今後の対応予定 • Leap Motion対応 #UE4 #gtmfjp2016

#UE4 #gtmfjp2016

モバイルVRも忘れていませんよ！ • Gear VR • Google Cardboard • Google Daydream • Magic Leap (対応予定) #UE4 #gtmfjp2016

モバイルVR向けのコンテンツは なるべく軽量に保つこと！ • ProjectのTarget Hardwareを • Mobile/TabletとScalable 3D or 2Dに #UE4 #gtmfjp2016

UE4でAndroidの開発をする手順 • UE4のインストールフォルダにAndroidWorksのインストーラが 入っているので、こちらを使うと簡単に環境を構築できます • UE4.12だと C:\Program Files (x86)\Epic Games\4.12\Engine\Extras\AndroidWorks\Win64 • の、CodeWorksforAndroid-1R4-windows.exe を実行 • 詳しくはこちらのドキュメントをご参照ください • https://docs.unrealengine.com/latest/INT/Platforms/Android/GettingStarted/1/index.html #UE4 #gtmfjp2016

Google VR/Daydreamに対応するには？ • EditメニューからPluguinsを選んで Google VRのEnabledにチェック #UE4 #gtmfjp2016

UE4でGoogle VR/Daydreamの 開発をするための環境設定 1 • EditメニューからProject Settingsを選んでPlatform-Android • Minimum SDK VersionとTarget SDK Versionを21に • Enable FullScreen Immersive on KitKat and abobe devicesにチェック • Configure GoogleVR for sustained-performance modeにチェック • Android SDK • SDK API LevelとNDK API Levelをandroid-21に #UE4 #gtmfjp2016

UE4でGoogle VR/Daydreamの 開発をするための環境設定 2 • 現時点ではDaydreamの場合 • NEXUS 6P（+Android N）での開発を推奨 https://developers.google.com/vr/concepts/dev-kit-setup • Android NDK 11c以上のインストールと設定も必要 https://docs.unrealengine.com/latest/INT/Platforms/GoogleVR/Daydrea m/index.html #UE4 #gtmfjp2016

ちなみに Daydreamのコントローラー対応 • UE4から見ると、Oculus TouchやHTC Viveのコントローラーと同 じようにハンドリングできます。 • PluginsのGoogle VR Motion Controllerにチェックして • MotionControllerというコンポーネントをPawnやCharacterに付けるだけ #UE4 #gtmfjp2016

モバイルVRプラットフォーム向けの コンテンツの開発中のテスト • プレビューモードをAndroid向けに • 簡易テストはSimpleHMDプラグインにチェック • VRプレビュー #UE4 #gtmfjp2016

モバイルVR向けの開発準備は完了！ 開発時に留意すべきポイントは？ • まずは「モバイル ゲームの開発」ページ https://docs.unrealengine.com/latest/JPN/Platforms/Mobile/index.html • 「 モバイル プラットフォーム向けコンテンツの作成 」ページ https://docs.unrealengine.com/latest/JPN/Platforms/Mobile/Content/index.html • モバイル版特有の制限 • キャラクタの骨が75ボーンまで • 1モデルの頂点が6万5千頂点まで #UE4 #gtmfjp2016

モバイルVR向けの開発準備は完了！ 開発時に留意すべきポイントは？ • その他の大きな違い (Dynamic Shadow, Postprocess, Material) • 「 モバイル プラットフォーム上でのポストプロセス エフェクト 」 https://docs.unrealengine.com/latest/JPN/Platforms/Mobile/PostProcessEffects/index.html • 「モバイル プラットフォーム向けのマテリアル」 https://docs.unrealengine.com/latest/JPN/Platforms/Mobile/Materials/index.html • モバイル向けコンテンツ開発のコツ • 「モバイル デバイスのパフォーマンス ガイドライン」 https://docs.unrealengine.com/latest/JPN/Platforms/Mobile/Performance/index.html • 「モバイル パフォーマンス ヒントとコツ」 https://docs.unrealengine.com/latest/JPN/Platforms/Mobile/Performance/TipsAndTricks/index.html #UE4 #gtmfjp2016

ありがとうございました！ • 何かご質問は？ ブース出展もしております 懇親会にも参加予定ですので お気軽にお声がけください #UE4 #gtmfjp2016