UE5 Pixel Streamingで実現する、 デバイスを選ばない ⾼負荷アプリケーション

Transcript

1. UE5 Pixel Streamingで実現する、 デバイスを選ばない ⾼負荷アプリケーション 2024.7.31 ゲームソリューション部 えがわ
2. Xへの投稿の際は、 ハッシュタグ #cm_odyssey でお願いいたします。 2 お願い
3. ⾃⼰紹介 えがわ（頴川 武⽣） 3 ゲームソリューション部 ソリューションアーキテクト 好きなもの • データベース(RDB, NewSQL) • AI/ML • パン屋
4. 本⽇の内容 話さないこと • UE5の操作⽅法 • ゲームの作り⽅ • AWSの細かい設定周り ◦ EC2の作成やIAMなど • Pixel Streamingの細かい実装⽅法 • Pixel Streamingの最適化 4
5. 今⽇の内容 5 話すこと • Pixel Streamingとは！
6. 本題の前に (UEってなに？) 6
7. UEとは？ UE(Unreal Engine)は、Epic Games社が開発した⾼度な ゲームエンジン。リアルタイム3Dグラフィックスの 作成に使⽤され、ゲーム開発だけでなく、映画、建 築、シミュレーションなど多岐にわたる分野で利⽤ されています。 7
8. 本題の前に (⼀般のアプリケーションはどうなってる？) 8
9. ⼀般的なアプリケーション 量販店でソフトを購⼊ ソフトにあったハードでゲームをプレイ 9 帰ったら遊ぼー！ ゲーム売ってるでー
10. ⼀般的なアプリケーション ユーザーの端末にアプリをインストール 端末の性能を使いアプリをプレイ 10 遊びたいから インストールしよー ゲーム配布してるでー ダウンロード
11. ⼀般的なアプリケーション インストールしたはいいが、 スペックが⾜らず、動かないことも... 11 せっかくインストール したのに... もうやらん！
12. Pixel Streamingとは？ 12
13. Pixel Streamingとは？ UE5アプリケーションをサーバー上で実⾏し、 ウェブブラウザでストリーミングすることが可能 13 ゲーム遊ぶよー レンダリングするでー WebRTC(P2P) 動画、⾳声データ ⼊⼒
14. Pixel Streamingとは？ サーバーのGPUでフレームの計算を⾏うため、 ユーザーの端末は送られてきたフレームを描画するだけ 14 古いPCでも動く！ サイコー ワイが頑張るで...！ WebRTC(P2P) 動画、⾳声データ ⼊⼒
15. デモ動画 (再⽣できたら) 15
16. デモ動画 16
17. デモ画像 (動画が再⽣できなかったら) 17
18. デモ画像 18
19. Pixel Streamingの特徴まとめ 19 • 低遅延のストリーミング • ⾼品質なグラフィックス • クロスプラットフォーム対応 UnrealEngineのアプリケーションで使⽤可能な クラウドレンダリングの仕組み
20. 低遅延のストリーミング WebRTC(Web Real-Time Communication)を使⽤したP2P接続 クライアントとアプリサーバー間で通信 20 WebRTC(P2P) 動画、⾳声データ ⼊⼒ あんま違和感ないな ワイが頑張ってるからや！
21. ⾼品質なグラフィック UE5の⾼度なレンダリング技術を使⽤することにより フォトリアルな画質を実現 21 • Naniteによる⾼詳細なジオメトリ (LOD) • Lumenによるグローバルイルミネーション
22. クロスプラットフォーム対応 ユーザーの端末に依存せずブラウザで起動するため、 クラスプラットフォーム開発が容易 22 http://hogehoge
23. なんかよさそう 23
24. やってみる 24
25. まえに 25
26. 構築のための⽤語集 26
27. WebRTCの登場⼈物 • シグナリングサーバー ◦ 接続情報を交換する仲介サーバー • STUNサーバー ◦ ⾃⾝のIPアドレスを確認するためのサーバー • TURNサーバー(必要ならば) ◦ データを中継するためのサーバー 27 WebRTCを⾏うための登場⼈物
28. シグナリングサーバー 28 オファーアンサーモデルでSDP(Session Description Protocol )や ICE（Interactive Connectivity Establishment ）候補を交換 動画や⾳声はこんな感じで！ 接続先の候補も送るね！ 承知したやで！ ワイも送るで！ SDP、ICE候補 オファー アンサー
29. N A T STUNサーバー 29 外から⾒た時のパブリックIPを取得可能 NATを超えた接続で必要 N A T IP:192.168.aaa.aaa IP:10.0.ccc.ccc STUNサーバー 俺ってどう？ お前はIP: 200.bbb.bbb.bbbだ IP: 200.bbb.bbb.bbb IP: 500.ddd.ddd.ddd
30. N A T TURNサーバー 30 直接P2P接続が確⽴できない場合、 TURNサーバーを中継してデータを送信 N A T IP:192.168.aaa.aaa IP:10.0.ccc.ccc TURNサーバー 代わりに接続 おねがーい しゃあなしやで IP: 200.bbb.bbb.bbb IP: 500.ddd.ddd.ddd
31. やってみる (ローカル編) 31
32. UE5のアプリケーションを作成 UnrealEngineのサンプルプロジェクトを使⽤します 32 ※80GB以上あるので、容量には注意
33. PixelStreamingに対応 アプリケーションをPixelStreamingに対応させるには プラグインを追加するだけです 33 ※これにチェックいれるだけ！
34. サーバー構築(ローカル編) GitHubにフロントエンド、バックエンドが⽤意されて います 34
35. サーバー構築(ローカル編) ⼿順に従い実⾏するだけでサーバーが起動します 35
36. サーバー構築(ローカル編) UE5アプリケーションを起動します。 アプリケーションがサーバーに接続すると、 コンソール「Streamer connected」と表⽰されます 36
37. サーバー構築(ローカル編) 37 アプリケーションがサーバーに接続できたので、 ブラウザで確認します
38. やってみる (⼩規模AWS編) 38
39. AWSで試してみる 39 EC2(Windows)で試してみます。 可⽤性は考えず1台のEC2で試してみます。
40. サーバー構築(AWS) UE5アプリケーションをS3に配置 40
41. サーバー構築(AWS) EC2インスタンス(GPUが必要)に接続 以下をPowerShellで実⾏することでAWS CLIが使⽤できます msiexec.exe /i https://awscli.amazonaws.com/AWSCLIV2.msi 41 そしてUE5アプリケーションをダウンロード
42. サーバー構築(AWS) Nvidia ドライバーのインストール 42
43. サーバー構築(AWS) Firewallの80, 8888ポートを開けておきます 43
44. サーバー構築(AWS) サーバーを起動します 44
45. サーバー構築(AWS) アプリのショートカットに以下の内容をTargetに追加します -PixelStreamingURL=ws://127.0.0.1:8888 -RenderOffscreen -AllowPixelStreamingCommands 45 ※オフスクリーンでレンダリングすることで不要な リソースを使わずに済みます。
46. サーバー構築(AWS) ブラウザで仮想マシンのIPアドレスにアクセス すると！ 46 ※軽いサンプルプロジェクトに変更してます
47. なんか⼤変そう 47
48. AWS MarketPalace で簡単に構築できます！ 48
49. AWS MarketPlace Pixel Streaming⽤の製品が登録されてます 使⽤料はAWS費⽤だけ！ 49
50. AWS MarketPlace CloudFormationのパラメータを⼊⼒するだけ！ 50
51. AWS MarketPlace いかしたアーキテクチャを簡単に作れます！ 51
52. 簡単に構築できそうだし デメリットは...? 52
53. ⾼い！ 53
54. (費⽤が) めっちゃ⾼い！ 54
55. 費⽤について クラウドでGPUを使⽤することになるので、 数千⼈がプレイするようなアプリケーションになると とても⾼額になります 55
56. アプリケーションと マッチするタイミングで 使⽤しましょう！ 56
57. どんなアプリが適している？ 57
58. どんなアプリが適している？ デバッグ会社のテスト環境 58 バグみつけてやるんだから！
59. どんなアプリが適している？ アイドルのコンサートでの3D合成やメタバースなど 59