Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

UE4モバイルでノンゲームコンテンツ

3,634 views

Published on

2019年7月16日に行われた「UE4モバイル勉強会 in 東京」における遠藤 俊太様(@tonkotsu3656)による講演の資料です。
https://connpass.com/event/137717/

動画はこちら:https://www.youtube.com/watch?v=luYTZHI0byg

Published in: Engineering
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks }} ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

UE4モバイルでノンゲームコンテンツ

  1. 1. #UE4Mobile UE4モバイル勉強会 UE4モバイルでノンゲームコンテンツ
  2. 2. フリーランス プログラマー 遠藤 俊太 #UE4Mobile お仕事 ・ゲーム系 ・東映ツークン研究所 @tonkotsu3656
  3. 3. 東映ツークン研究所 #UE4Mobile Unreal Fest 2016 映像制作のための"リアルタイム"ワークフロー ホームページ 求人ページ
  4. 4. #UE4Mobile 話さない内容 ・環境構築 ・最適化、プロファイル ・映像、建築など分野固有の話 話す内容 ・モバイル向け機能紹介 ・実装方法
  5. 5. #UE4Mobile 特に環境構築については、 ネットに情報を上げてくださっている方々や公式ドキュメントもある。(圧倒的感謝) ・Android クイックスタート ・iOS クイックスタート ・【UE4】いろんなパターンのiOSアプリ開発環境を用意してみる - Soramame Games ・【UE4】Blueprint & C++のiOS向けプロジェクトをWindowsで開発する - Soramame Games ・UE4 で Android アプリをビルドするには - FRAME SYNTHESIS
  6. 6. #UE4Mobile ※ 本資料について ・エディターの言語は英語です。 ・UE4.22がベースになっています。 (一部 4.21 以前の情報もあります)
  7. 7. おしながき #UE4Mobile AR ・概要、クイックスタート ・マーカー認識 ・環境マッピングとライティング ・Tips VR ・SimpleHMD ・Oculus VR ・Google VR Other ・Virtual Camera ・便利プラグイン
  8. 8. おしながき #UE4Mobile VR ・SimpleHMD ・Oculus VR ・Google VR Other ・Virtual Camera ・便利プラグイン AR ・概要、クイックスタート ・マーカー認識 ・環境マッピングとライティング ・Tips
  9. 9. #UE4Mobile UE4 対応済み ARプラットフォーム AR : 概要、クイックスタート Apple ARKit Google ARCore
  10. 10. #UE4Mobile 対応状況 ARKit 寄り ARCore は対応していない機能がちらほら、ARKit に比べてサンプルが少ない AR : 概要、クイックスタート Apple ARKit Google ARCore >
  11. 11. #UE4Mobile 何はともあれ、 ”Handheld AR” テンプレートプロジェクトを動かしてみる AR : 概要、クイックスタート
  12. 12. #UE4Mobile ”Handheld AR” テンプレートからではなく、 別テンプレートや既存プロジェクトでAR機能を動かすまでの手 順 AR : 概要、クイックスタート
  13. 13. #UE4Mobile AR機能を動かすまでの手順 ① AR : 概要、クイックスタート AR Plugin を有効に
  14. 14. #UE4Mobile AR機能を動かすまでの手順 ② AR : 概要、クイックスタート ARSessionConfig 作成
  15. 15. #UE4Mobile AR機能を動かすまでの手順 ③ AR : 概要、クイックスタート ARSessionConfig のパラメータ設定
  16. 16. #UE4Mobile AR機能を動かすまでの手順 ④ AR : 概要、クイックスタート StartARSession ノードに 手順 ②、③ で作成した ARSessionConfig を指定 ARSession 系のノード ポーズやストップもできます。
  17. 17. #UE4Mobile これだけで動く! AR : 概要、クイックスタート
  18. 18. おしながき #UE4Mobile VR ・SimpleHMD ・Oculus VR ・Google VR Other ・Virtual Camera ・便利プラグイン AR ・概要、クイックスタート ・マーカー認識 ・環境マッピングとライティング ・Tips
  19. 19. #UE4Mobile ARKit、ARCore はマーカーレス型のARプラットフォームですが、 画像検出機能でマーカーを利用することも可能です。 AR : マーカー認識
  20. 20. #UE4Mobile 検出する画像をUE4のテクスチャアセットとしてインポート AR : マーカー認識
  21. 21. #UE4Mobile ARCandidateImage を作成し、テクスチャ登録 AR : マーカー認識 Friendly Name と 検出したい画像の原寸大を設定(cm)
  22. 22. #UE4Mobile ARSessionConfig に登録 AR : マーカー認識
  23. 23. #UE4Mobile 動的に追加することも可能 AR : マーカー認識
  24. 24. #UE4Mobile 検出したものをごにょごにょ AR : マーカー認識 https://youtu.be/bZM-r6Ds0Ak
  25. 25. #UE4Mobile 検出した画像の位置情報取得 AR : マーカー認識 ARSessionConfig で設定した Friendly Name の取得 やっていること
  26. 26. #UE4MobileAR : マーカー認識 どんな画像がマーカーに適しているのか
  27. 27. #UE4MobileAR : マーカー認識 認識しやすい画像 Good ・明暗はっきりしている ・解像度が縦横 480px 以上 Bad ・3:1より横長 ・色の均一領域が広い ARKit Good ・明暗はっきりしている ・解像度が縦横 300px 以上 Bad ・特徴点がまばら ・繰り返しが多い ARCore
  28. 28. #UE4MobileAR : マーカー認識 画像はグレースケールに変換されて検出されるため、 色相ではなく、明度の差(コントラスト)で認識しやすさが変わる。
  29. 29. #UE4MobileAR : マーカー認識 とはいっても、肉眼では判断しにくい。。
  30. 30. #UE4MobileAR : マーカー認識 ARCore では明確に画像の認識しやすさを判定してくれる 「arcoreimg」 というツールが存在。 ARKit でも判定基準にそこまで差はないはずなので使えるはず。
  31. 31. #UE4MobileAR : マーカー認識 ツールのディレクトリ ¥¥UE_[Version]¥Engine¥Plugins¥Runtime¥AR¥Google¥GoogleARCore¥Binaries¥ThirdParty¥Google¥ARCoreImg¥[OS] Windows arcoreimg.exe eval-img --input_image_path=hoge.png MacOS ./arcoreimg eval-img --input_image_path=hoge.jpg コマンドプロンプト、ターミナルから以下のコマンドを実行すると、 0~100 のスコアが表示されます。 ARCore では 75 点以上が望ましいとされている。
  32. 32. #UE4MobileAR : マーカー認識 例えば、 解像度同じ以下の二つの画像のスコアを出してみる
  33. 33. #UE4MobileAR : マーカー認識 100点 30点 ※ 他意はないです。
  34. 34. #UE4MobileAR : マーカー認識 グレースケール化すると 左 の方がコントラストが高いのが分かる
  35. 35. おしながき #UE4Mobile VR ・SimpleHMD ・Oculus VR ・Google VR Other ・Virtual Camera ・便利プラグイン AR ・概要、クイックスタート ・マーカー認識 ・環境マッピングとライティング ・Tips
  36. 36. #UE4Mobile 環境マッピングとライティング AR上のオブジェクトを現実に馴染ませるために、 周りの環境情報をオブジェクトの見た目に反映させる。 AR : 環境マッピングとライティング
  37. 37. #UE4Mobile 環境マッピング 擬似的な周囲環境の映り込みを再現するテクスチャマッピング手 法の1つ。 反射する質感のオブジェクトに、周りの環境を写り込ませる。 現状 ARKit のみ対応 AR : 環境マッピングとライティング
  38. 38. #UE4Mobile Project Settings > iOS > Mobile Desktop Renderer を有効に AR : 環境マッピングとライティング
  39. 39. #UE4Mobile ARSessionConfig の Environment Capture Probe Type を Automatic に 環境を受ける範囲を自動検出してくれる AR : 環境マッピングとライティング
  40. 40. #UE4Mobile Manual の場合は、影響を受ける範囲を任意で指定 AR : 環境マッピングとライティング
  41. 41. #UE4Mobile SkyLight がレベル上に置いてある場合は削除し、 ARSkyLight を配置 AR : 環境マッピングとライティング
  42. 42. #UE4Mobile キャプチャーした環境情報を ARSkyLight に渡す AR : 環境マッピングとライティング トラッキング済みのキューブマップテクスチャが生成され、LightComponent に渡される
  43. 43. #UE4Mobile こんな感じ AR : 環境マッピングとライティング ワールド(レベル)上に配置されている他のアクターも映り込む。 カメラ情報を元に生成している。カメラに映っていないもの(撮影デバイスなど)は映り込まない。
  44. 44. #UE4Mobile ライティング 画面全体の明るさを、 AR空間上のオブジェクトの見た目に反映させる。 AR : 環境マッピングとライティング
  45. 45. #UE4Mobile GetCurrentLightEstimate で周囲の明るさ情報を取得可能 AR : 環境マッピングとライティング ARCore の場合はこちらからも取得可能
  46. 46. #UE4Mobile Directional Light の Intensity と Color に適用 AR : 環境マッピングとライティング https://youtu.be/jd51zSw1S1c
  47. 47. #UE4MobileAR : 環境マッピングとライティング 周囲の明るさを単一の数値としてしか取得できないため、 光源の場所などは特定できない。 現状は画面全体の明暗のみ取得可能
  48. 48. おしながき #UE4Mobile VR ・SimpleHMD ・Oculus VR ・Google VR Other ・Virtual Camera ・便利プラグイン AR ・概要、クイックスタート ・マーカー認識 ・環境マッピングとライティング ・Tips
  49. 49. #UE4MobileAR : Tips デバイスを移動させても3D空間上でオブジェクトが移動しない場合がある 上記現象が起きた場合は、 Player Controller に紐付いている Pawn に、カメラコンポーネントがぶら下がっていな いのが原因で起きていることが多い カメラコンポーネントが付いていないとカメラの座標は動かない
  50. 50. #UE4MobileAR : Tips トラッキング情報のデバッグ表示
  51. 51. #UE4MobileAR : Tips トラッキングした特徴点の取得 https://youtu.be/-TXFqtnPUqw
  52. 52. #UE4MobileAR : Tips Passthrough Camera ノードで背面カメラの映像情報を取得し、 オブジェクトに貼り付けることでガベージマットのようなことが実装できる
  53. 53. #UE4MobileAR : Tips マテリアルをごにょごにょ組みます。 デバイスの画面比率に合わせたカメラ情報を作っています。
  54. 54. #UE4MobileAR : Tips 板ポリの後ろに円錐を置き、 一定区間を円錐が板ポリと平行の方向に移動するシーンを作りました。 板ポリには Passthrough Camera マテリアルを適用しています。
  55. 55. #UE4MobileAR : Tips こんな感じになりました。 (講演用にマテリアルを少し弄って板ポリの場所がわかるように紫色にしています) https://youtu.be/t4u_oODLRxc
  56. 56. #UE4MobileAR : Tips マテリアルの補足
  57. 57. #UE4MobileAR : Tips CameraW、CameraH にはデバイスの縦横サイズを指定 サイズは GetSupportedARVideoFormats で取得できる
  58. 58. #UE4MobileAR : Tips ARKit の各 Passthrough ノードの Texture Type は以下のように設定
  59. 59. #UE4MobileAR : Tips 各カスタムノードのシェーダーコードは以下のように書く
  60. 60. #UE4MobileAR : Tips ARKit プラグイン内にあるマテリアルを参考にしています。
  61. 61. #UE4MobileAR : Tips Face Tracking iPhone の 表情検出機能で顔の動きをトラッキングし、 その動きを Live Link プラグインを介して UE4 で使用できる。 おかずさんがとても分かりやすい記事を上げてくださっていたり、サンプルがあるので 本資料では割愛。 UE4の標準機能とiPhoneXを使って、簡易フェイシャルキャプチャーシステムを実現してみた Facial animation capture using UE4 and iPhone X Face AR Sample
  62. 62. #UE4MobileAR : Tips 先日 WWDC 2019 にて ARKit 3 が発表されました。 モーションキャプチャーや人認識機能なども発表され、今後が楽 しみです。
  63. 63. おしながき #UE4Mobile VR ・SimpleHMD ・Oculus VR ・Google VR Other ・Virtual Camera ・便利プラグイン AR ・概要、クイックスタート ・マーカー認識 ・環境マッピングとライティング ・Tips
  64. 64. #UE4MobileVR : SimpleHMD SimpleHMD モバイルデバイスで VR を動かす機能が最低限入っているプラグイン。 手順もほぼプラグインを有効にするだけ。主に Cardboard 向け。
  65. 65. #UE4MobileVR : SimpleHMD SimpleHMD プラグインを有効に 他の VR 系のプラグインは無効にします。
  66. 66. #UE4MobileVR : SimpleHMD これだけで動きます
  67. 67. #UE4MobileVR : SimpleHMD デフォルトの設定では、 VR において不要な UI が表示されている
  68. 68. #UE4MobileVR : SimpleHMD Virtual Joystick Project Settings > Input > Mobile > Default Touch Interface クラスを指定無しに
  69. 69. #UE4MobileVR : SimpleHMD Navigation Button Project Settings > Android > Enable FullScreen Immersive on KitKat and above devices. 有効に
  70. 70. #UE4MobileVR : SimpleHMD VRコンテンツの妨げになるような UI は非表示に
  71. 71. #UE4MobileVR : SimpleHMD SimpleHMD プラグインはモバイルですぐに VR を試せる。 VR で最低限動かせる程度の簡易的な VR ビューアー。 動かす端末によってはドリフトなどの問題も起こり、 他の VR プラグインと比べると精度はイマイチな印象。
  72. 72. おしながき #UE4Mobile VR ・SimpleHMD ・Oculus VR ・Google VR Other ・Virtual Camera ・便利プラグイン AR ・概要、クイックスタート ・マーカー認識 ・環境マッピングとライティング ・Tips
  73. 73. #UE4MobileVR : Oculus VR モバイルで Oculus VR モバイルで VR 体験ができる HMD(ヘッドマウントディスプレイ)、GearVR を使用。 GearVR とは、サムスン社とOculus社が共同開発している HMD。 「Galaxy」シリーズでのみ使用可能。 公式ドキュメントにサンプルプロジェクトがある (UE4.17)
  74. 74. #UE4MobileVR : Oculus VR Oculus VR プラグインを有効に 他の VR 系のプラグインは無効にします。
  75. 75. #UE4MobileVR : Oculus VR Pawn クラスにカメラを追加して、Z座標を現実の身長分高くする。 カメラの設定 トラッキングの原点を目の位置からに
  76. 76. #UE4MobileVR : Oculus VR Pawn に Motion Controller Component の追加 モーションコントローラー Gear VR モーションコントローラーのメッシュを追加
  77. 77. #UE4MobileVR : Oculus VR HMD のタッチパッドとモーションコントローラーの二種類の入力方法 どちらも自前で実装する必要あるが、公式ドキュメントに手順が記載あり インプット ・モーションコントローラー ・タッチパッド
  78. 78. おしながき #UE4Mobile VR ・SimpleHMD ・Oculus VR ・Google VR Other ・Virtual Camera ・便利プラグイン AR ・概要、クイックスタート ・マーカー認識 ・環境マッピングとライティング ・Tips
  79. 79. #UE4MobileVR : Google VR Google Cardboard と Google Daydream に対応
  80. 80. #UE4MobileVR : Google VR Google VR プラグインを有効に 他の VR 系のプラグインは無効にします。
  81. 81. #UE4MobileVR : Google VR モーションコントローラー、カメラの実装手順は Oculus VR とほぼ同じ モーションコントローラーは Google VR Motion Controller プラグインを有効にする必要あり
  82. 82. #UE4MobileVR : Google VR タッチパッド操作 自前で実装しなければいけない 公式ドキュメントに手順記載あり サンプルプロジェクトもある(UE4.16)
  83. 83. #UE4MobileVR : Google VR Project Settings > Rendering > Mobile HDR の項目を無効にします。 VR で立体的に描画するために必要な設定
  84. 84. #UE4MobileVR : Google VR 以下の項目を有効に Project Settings > Android > Configure GoogleVR for sustained-performance mode 最大FPSは落ちますが、デバイスの発熱による処理速度の低下がなくなります。
  85. 85. #UE4MobileVR : Google VR サポートするデバイスの種類を指定 Project Settings > Android > Configure GoogleVR to support specific hardware configurations
  86. 86. #UE4MobileVR : Google VR DOF とは Degrees of freedom(自由度)の略 3DOF と 6DOF の デバイス がある ※ Depth of field ではない!
  87. 87. #UE4MobileVR : Google VR 3DOF 3軸の回転移動 6DOF 3DOFに加えて、3軸の並行移動
  88. 88. #UE4MobileVR : Google VR 対応デバイスの 6.3DOF とは 6DOF のHMD + 3DOF のコントローラー という意味 Daydream View 3.3DOF Mirage Solo 6.3DOF
  89. 89. おしながき #UE4Mobile VR ・SimpleHMD ・Oculus VR ・Google VR Other ・Virtual Camera ・便利プラグイン AR ・概要、クイックスタート ・マーカー認識 ・環境マッピングとライティング ・Tips
  90. 90. #UE4MobileOther : Virtual Camera Virtual Camera ARKit, Vive, LiveLink で 取得したトラッキング情報をリアルタイムでUE4エディタ上のカメラに反映できるプラグイン ARKit ではデバイス上にUE4エディタのプレビュー画面が映り、デバイス側から カメラの焦点位置、フォーカス位置の操作やシーケンサーとして録画することができる。
  91. 91. #UE4MobileOther : Virtual Camera https://youtu.be/y0lPeaFX4Vk
  92. 92. #UE4MobileOther : Virtual Camera ランチャーからサンプルプロジェクトをダウンロードしてすぐに動かすことができる (ただ、Paragonアセットがハイクオリティなので結構重いシーン。。)
  93. 93. #UE4MobileOther : Virtual Camera Virtual Camera を動かすまでの手順(ARKit)
  94. 94. #UE4MobileOther : Virtual Camera Virtual Camera 手順 ① プラグインを有効に 再起動時に Remote Session プラグインも有効になっていることを確認します。
  95. 95. #UE4MobileOther : Virtual Camera Virtual Camera 手順 ② iOSデバイスで App Store から Unreal Remote 2 アプリをダウンロードします。
  96. 96. #UE4MobileOther : Virtual Camera Virtual Camera 手順 ③ あとは UE4エディタ側でプレイし、 Unreal Remote 2 アプリで PC の IP を指定するだけ
  97. 97. #UE4MobileOther : Virtual Camera もう少し掘り下げた話
  98. 98. #UE4MobileOther : Virtual Camera PC~iOSデバイス間の通信部分は ほぼ Remote Session プラグインの機能が使われている PC側、iOSデバイス側、両方のプロジェクトでお互い何の情報を読み込み、書き込むか チャンネルという単位で指定されている
  99. 99. #UE4MobileOther : Virtual Camera DefaultEngine.ini ini ファイルもしくは C++ にてチャンネルの指定ができる C++
  100. 100. #UE4MobileOther : Virtual Camera チャンネルの種類 ・Frame Buffer ・Input ・XR Tracking ・AR Camera Virtual Camera での流れ PC iOSデバイス Frame Buffer Input, XR Tracking
  101. 101. #UE4MobileOther : Virtual Camera 問題点 現状 AR Camera チャンネルが機能しておらず、iOSデバイス側から PC側に カメラ情報を送ることができない。 Dev-VR ブランチで実装中 UE4.23 では機能が入っているかも?? AR 周りを担当している Epicスタッフの Joe Graf さんが開発時の動画を公開している https://www.youtube.com/watch?v=wBVmYkLJuok&feature=youtu.be
  102. 102. おしながき #UE4Mobile VR ・SimpleHMD ・Oculus VR ・Google VR Other ・Virtual Camera ・便利プラグイン AR ・概要、クイックスタート ・マーカー認識 ・環境マッピングとライティング ・Tips
  103. 103. #UE4MobileOther : 便利プラグイン ブループリントで実装できるモバイル向けプラグインを さらっと紹介
  104. 104. #UE4MobileOther : 便利プラグイン Mobile Location Services 位置情報を取得できる
  105. 105. #UE4MobileOther : 便利プラグイン 初期化 参照記事 UE4 モバイル用GPSロケーションサービスを使ってみる 位置情報変更時のイベント
  106. 106. #UE4MobileOther : 便利プラグイン Optional Mobile Features
  107. 107. #UE4MobileOther : 便利プラグイン デバイス情報の取得ができる
  108. 108. #UE4Mobile ご清聴ありがとうございました!

×