【CG】Pixel Streaming対応のEXEをPCで起動して、スマホから操作する【UE4】

Pocket
email this

 先々月にtwitterに実験動画を載せたのですが、投稿した気になっていて記事にするのを忘れていました。
 まあまんま公式を日本語化しただけです、的な内容です。UE4上の手順は。
 でもそれじゃあ記事としてあまり価値を感じないので、ピクセルストリーミングしているPCにスマホからアクセスして、操作するところまでを紹介します。

やってみよう

次の順序で作ってみましょう。

準備するもの、環境

ハード

・Windows 10 64bit OSを搭載したPC
・Wi-Fi環境。自前のWiMAXのルーターを用意。
・スマホ。今回はandroidのSONY EXPERIA XZ。(iPad Airでも検証済。手順は同じ。)

ソフト

・Unreal Engine。4.21以降。
 既存プロジェクト(UE4.19で作成)がある前提で話を進めます。
・Node.js

Node.jsをインストール

予め入れておきましょう。https://nodejs.org/ja/にアクセスしてダウンロード。LTS版でよいです。

UE4エディタでPixel Streaming対応の実行モジュールを出力

まずはプロジェクトをUE4.21にバージョンアップしましょう。

UE4.21でプロジェクトを開いたら、メインメニュの[編集]→[Plugins]を選択。[Built-in]→[Graphics]に「Pixel Streaming」がありますので、EnabledをチェックONにします。
再起動を促されるので再起動。

再起動後、2つ設定をします。
①メインメニュの[編集]→[プロジェクト設定]を開き、[インプット]の「Always Show Touch Interface」をONにします。

②メインメニュの[編集]→[エディタの環境設定]を開き、[プレイ](英語:Play)の「Additional Launch Parameters」エディットボックスに「-AudioMixier」と記述します。

準備はこれだけです。あとはパッケージ化しましょう。
メインメニュの[ファイル]→[プロジェクトのパッケージ化]→[Windows]→[Windows (64ビット)]を選択してパッケージ化します。しばし待とう。
Full RebuildじゃなくてもOKみたいです。2回目以降のビルドだと数分で終わるかと思います。

実行ファイルが出力されたら、WindowsNoEditorフォルダのEXE形式ファイルを選択し、右クリックメニュを開き「ショートカットの作成」を選択。ショートカットが出来ます。

次にショートカットを選択し、右クリックメニュを開き「プロパティ」を選択。
実行の文字列の末尾に「 -AudioMixier」と追記します。「”」と「-」の間には半角スペースを忘れずに。

 

これでUE4の作業は終わり。

実行ファイル(EXE形式)を開く

UE4を実行するPCをWi-Fiに接続します。

エンジンの中にプラグインがあるのですが、そのなかにPixelStreamingのプラグインがありますので開きます。
(例:エンジンのインストール先が D:¥Epic Games¥UE_4.21 の場合であれば、)
D:¥Epic Games¥UE_4.21¥Engine¥Source¥Programs¥PixelStreaming¥WebServers¥SignallingWebServer¥run.bat
を起動します。

なんか15秒ほどゴチャゴチャ動いていますが、緑色の文字の
  **:**:**.*** Http listening on *: 80
が出たら準備完了。

次に
D:¥Epic Games¥UE_4.21¥Engine¥Source¥Programs¥PixelStreaming¥WebRTCProxy¥bin¥Start_WebRTCProxy.bat
を起動します。3行くらい文字が出ればOKです。

 

いよいよEXEを起動します。
このとき、ショートカットの方を起動しましょう。

はい、起動しました。

スマホからアクセスして、操作する

さてここから本題。

UE4を起動したPC側で Windowsキー + R を押すと[ファイル名を指定して実行]が出ますので「cmd」と入力します。

黒い画面がでます(DOS)。「ipconfig」と入力して、Enterキーを押します。
するとIPアドレスがでます。「IPV4 アドレス」というところの数字を覚えておいてください。今回はIPV4アドレスが「111.222.33.44」の場合で話を進めます。DOSは画面上に出しっぱなしにしておけばいいです。

スマホはPCと接続しているものと同じWi-Fiとルーターに接続します。
Google Chromeを開きます。
アドレスバーに「111.222.33.44」と入力して、GOします。

すると黒背景にClick to startという文字がでてきました。アクセスできています。
次に再生マークが出ますので選択。

できました! ぐーだね。
画面の両端にある「◎」マークがコントローラーですから、あとは自由に操作してみましょう。

※皆さんに質問:スマホのブラウザのフルスクリーンモードってどうやるんでしたっけ? …ならない

スマホでサイトにアクセスできない場合

 おおよそ以下の原因が考えられます。ご参考に。(私が全部ひっかかったやつです(笑))

●PC側
・セキュリティソフトの設定を見直してみてください。
・UE4のPixel Streamingプラグインは本当に有効になっていますか?
・EXEはショートカットから起動しましたか?
・2つのバッチは立ち上がっていますか?
・ポートの80番を使用するソフトが動いていませんか? 例:Apache、Skypeなど

●スマホ側
・ブラウザは最新ですか?
 私が試した環境だとGoogle Chromeでしか成功しませんでした。FireFoxはを押すと最初に戻されるし。iOSではSafariも同じでした。
・社内ネットワーク等であれば、プロキシ設定をしましたか?

コメントを残す