アルゴンUE4&アプリ開発日記

UE4の機能やプラグインを紹介します。初心者や中級者向けになってます!!

【UE4】ポストプロセスを使ってみる(その2)

ポストプロセスマテリアルを作ってみる。

今回はポストプロセスマテリアルの簡単なものを作りたいと思います。

マテリアルの部分も少し説明できたら嬉しいです。

下記の動画を参考にしてました。

www.youtube.com

それではポストプロセスのマテリアルの適応やマテリアルの紹介などを行っていこうと思います。

ポストプロセス用のマテリアルを作る。

今回はポストプロセス用のマテリアルを作って動かしていきます。

まずマテリアルのファイルを使いする必要があるので新規で追加します。

コンテンツブラウザを右クリックして追加します。

f:id:yoshikata1990:20190425211411p:plain

マテリアル追加

追加したらマテリアルドメインをPostProcessに変更します。

先ほど作成したマテリアルファイルを開いてすでに追加されている

マテリアルノードを選択して、詳細から「MaterialDomain」を変更します。

最初はSurfaceになっているのでPostProcessにします。

f:id:yoshikata1990:20190425214207p:plain

マテリアルドメインをPostProcessを変更

今回はマテリアルのパラメータをBPから変更できる、

マテリアルパラメータコレクションも使っていきます。

マテリアルを追加する容量で、詳細なアセットからマテリアル・テクスチャの「マテリアルパラメータコレクション」を追加します。

f:id:yoshikata1990:20190425215223p:plain

マテリアルパラメータコレクション

今回設定したマテリアルパラメータコレクションは、

このような形で設定しています。

下の画像のあとにこのマテリアルパラメータコレクションをどう使うのか説明していきます。

f:id:yoshikata1990:20190425220036p:plain

マテリアルパラメータコレクションの設定

上記のマテリアルパラメータコレクションと組み合わせたポストプロセスマテリアルがこちらになります。

今回やっていることは単純で、

1.キャラクターの位置をBPから取得してマスクを使いFloat3に変換する。

2.円の半径をBPのTimelineで動かした数値を取得する。

3.上記2つの情報を元に球状に明るくしていくマスクを追加

f:id:yoshikata1990:20190425220326p:plain

PostProcessのマテリアルノー

マテリアルの設定が完了したら動作させるため、

キャラクターのBPの設定をしていきます。

マテリアルパラメータコレクションのPositionというパラメータに、

キャラクターの位置情報を渡しています。

f:id:yoshikata1990:20190425223019p:plain

BPの設定

こちらも合わせて設定しています。

タイムラインでマテリアルパラメータコレクションの半径の値を設定してます。

f:id:yoshikata1990:20190425223233p:plain

明るさの半径をタイムラインの値で渡す。

実際のマテリアルを動かすとこんな感じになります。

ポストプロセスマテリアルに当てはめて動作させる。

あとはPostProcessVolumeのマテリアルにセットして完了になります。

f:id:yoshikata1990:20190425224142p:plain

ポストプロセスボリュームの設定

最後に・・・・

ポストプロセスマテリアルはマテリアルを作るためのノードの知識

視覚効果の数学も知っておくといろいろなものが作れて楽しいです(・∀・)

下のものは今回やったことの応用になっています。

ぜひいろんなことを覚えて自分のゲームに合う効果を作ってみてください!

【UE4】ポストプロセスを使ってみる(その1)

PostProcessで演出をよりきれいにする。

今回はポストプロセスの説明やマテリアルなどを紹介していきます。

下記のスライドシェアで公開しているポストプロセスの紹介が、

とても分かりやすいのでこちらを見て勉強するのがいいかなと思います!

(下のスライドがわかり易すぎるので、自分の説明いらな・・・・)

www.slideshare.net

公式サイトにもポストプロセスエフェクトの紹介が細かく書いてあるので、

こちらも確認してみるといいと思います!

api.unrealengine.com

ポストプロセスってなに?

ポストプロセスと言うのはレンダリングされた状態を元に行われる、

画像処理のことを指します。

UE4では様々なポストプロセスが用意されていて、

ポストプロセスを使ってよりリアリティのある表現にしたり、

表現をよりリアリティにしたりできます。

※説明に誤りがあったらコメントお願いします!

簡単なポストプロセスの紹介

ここからはそれぞれどのようなポストプロセスの設定が用意されているか、

機能別サンプルのポストプロセスサンプルを用いて説明していきます。

※ここで紹介しているのは一部です。

f:id:yoshikata1990:20190330151608p:plain

Film(フィルム)

まずはフィルム(Film)から。

これは画面の色合いの調整などで使われることがあります。

白とびや黒つぶれなどの軽減とかに使ったりしてます。

f:id:yoshikata1990:20190330153730p:plain

Bloom(ブルーム)

こちらはBloom(ブルーム)になります。

発光現象を表現するポストプロセスになります。

ライトなどで自然な明るさなどを表現するときに使ったりします。

f:id:yoshikata1990:20190330155355p:plain

明暗の順応(AutoExposure)

こちらは明暗の順応(AutoExposure)になります。

暗いところから明るいところへの光の取り込みの変化を表したり、

逆に暗いところから明るいところへの光の取り込みを表現します。

f:id:yoshikata1990:20190330162418p:plain

レンズフレア(LensFlares)

こちらはレンズフレア(LensFlares)になります。

カメラレンズの明るさの散乱をシミュレートして表現します。

太陽の日差しとか表現したりしてます。

f:id:yoshikata1990:20190330165313p:plain

モーションブラー(MotionBlur)

モーションブラーをポストプロセスで表現できます。

高速で動いているものに残像が残るような感じで表現されます。

f:id:yoshikata1990:20190330172906p:plain

ScreenPercentage(解像度変更)

スクリーンパーセンテージという設定もあります。

低解像度にしてぼやけさせるという設定になります。

他にも被写体深度とかありますが、それは今後で紹介していきます。

ポストプロセスを設定してみる!

ここからはポストプロセスの設定を設定していきます。

今回は下記のマケプレでやってるのを使っています。

www.unrealengine.com

まずプロジェクトでポストプロセスがONになっているかを確認します。

f:id:yoshikata1990:20190330200452p:plain

プロジェクト設定(レンダリング)

続いてポストプロセスを適応するポストプロセスボリュームを、

レベル上に配置します。

f:id:yoshikata1990:20190330200822p:plain

ポストプロセスボリュームの配置

配置が完了したら詳細でポストプロセスの設定をします。

今回は光ってる感じを出そうと思うのでBloomを使ってみます。

f:id:yoshikata1990:20190330202148p:plain

Bloomの設定

今回はstandardで設定しています。

設定パラメータについては下記です。

Method:StandardとConvolution(畳みこみ)にするかの切り替え

Intensity:ブルームが適応される強さです。光の強弱です。

Threshold:ブルームに影響を与えるカラーの輝度を指定します。

        -1にすると全ての色に適応されます。

もう少し細かい活用法はその2で説明をしていこうと思います!

ポストプロセスをブルームのアリとナシを比較したのは下記になります。

最後に・・・

今回はポストプロセスがどういったもので、

どういったものかを少し説明させていただきました。

レベル的には超初心者レベルだと思うので、

もう少し細かい説明やポストプロセスマテリアルとの組み合わせなどは、

その2で説明していこうと思います。

ありがとうございました!!

【UE4】VirtualCameraPluginを試してみる(・∀・)

VirtualCameraPluginを試してみる。

今回はiPadやViveTrackerなどからシネマカメラとして操作できる、

VirtualCameraPluginを試してみようと思います。

UE4のバージョンは4.21.2使用していきます。

iOSでのやり方を紹介します。

プロジェクトのセットアップ

まずはプロジェクトで使用するプラグインを追加します。

必要になるのはVirtualCameraとRemoteSessionになります。

f:id:yoshikata1990:20190224212310p:plain

VirtualCameraプラグイン

f:id:yoshikata1990:20190224212407p:plain

RemoteSessionプラグイン

今回はiOSで行っておりARKitを使用するので、

AppleのARKitも一緒に追加しておきます。

f:id:yoshikata1990:20190224212351p:plain

iOSのARKitプラグイン

プラグインの追加をしたら一度再起動します。

再起動をおこなったらGameModeをVirtualCameraGameModeを設定します。

f:id:yoshikata1990:20190224215817p:plain

ゲームモードの設定

今回はiPadで接続するので画面の設定をiPadに合わせています。

それぞれ使うデバイスに合わせてください。

f:id:yoshikata1990:20190224225703p:plain

ビューポートセッティング

プロジェクトの設定はこれで完了です。

ActiveEditorModeから新規エディタウィンドウ設定で

f:id:yoshikata1990:20190224231721p:plain

プレイの設定

起動してVirtualCamera用のビューを表示したら完了です。

f:id:yoshikata1990:20190224233045p:plain

PC側の起動画面

iPadでの動作チェック

iPadで動作させるために、あらかじめ下記のUnrealRemote2をダウンロードします。

Unreal Remote 2

Unreal Remote 2

 あとはwindowsであればipconfigでIPアドレスを確認して、

アプリにIPアドレスを入力して接続すれば完了です。

実際に動かすと下記のような感じになります(・∀・)

最後に

今回はただ単純に気になって動かしてみただけという感じです。

ゲームとして使うというより面白いPVだったり、

どんな感じのレベルデザインになっているか確認したりするのに使うのがいいかも?

今年やることと今後の課題について

すごい今更ですが、あけましておめでとうございます。

今回は今年やることと今後の課題についてを書きます(´・ω・`)

今年やろうと思っていること

昨年はいろいろとノウハウを貯めるためにUE4を使って遊んだり、

niagaraを初めて使ってみたり、プラグインを使ってみたりと

いろいろなことを行ってきましたが、まずは一つ作り上げることを

目標にしていこうと思います。

ゲーム・モデル・絵すべてを中途半端にしてきているので、

ちゃんと一つのものを作り上げて人に見せれるものを目標に頑張る!

ちなみに現在はCakePHPを勉強しています・・・。

サイトを作って欲しいと何故か頼まれたので(初心者なんですが汗)

とりあえずサイト作成を終わらせて、ゲーム作成や勉強をしていきます。

作っているゲームやその中の考えなどをブログで発信していこうと思います。

CakePHPのことも少し書くかもしれません。

今年やることは、自分で作ったものを紹介する年にしていきます!( ・`ω・´)

今後の課題や準備について

今後の課題については「とりあえず手を動かす」

これを目標に頑張っていくのと下記のツールを使えるようになることです。

・ZBrushCore

Substance Painter/Substance Designer

Blender

UE4のまだ使用したことがない機能とC++プロジェクト

上記を頑張って使えるようになりたいです。

作っているものを販売したりもしたいと考えているので、

もしよかったら見てもらえると嬉しいです。

直近の目標としてはBlenderとZBrushCoreで作ったキャラクターや

武器をUE4に持っていて組み込んで動かすということをがんばります。

それとちゃんと買った本を読んで蓄積していきたい。

最後に

わかってないところが多いので、引き続きこのブログとともに、

自分自身の知識をアップデートしていけたら良いなと思います。

よく使ってる便利なプラグインなどを紹介する。

この記事は「Unreal Engine 4 (UE4) その2 Advent Calendar 2018」の24日目の記事になります。

qiita.com

今回は自分がよく使ってる便利なプラグインを紹介していこうと思います。

よかったら使ってみてください(^o^)

その1・Spline Snapping Tool

このツールでは

スプラインに合わせて、

物体を配置するのに便利なツールとなっています。

 

このツールを使うためにはプラグインを入れる必要があります。

下記のリンクからプラグインをダウンロードします。

0を指定して、メールアドレスを入力します。

gumroad.com

メールアドレス先に下記の様なメールが届くかと思いますので、

販売コンテンツを見るを選択して、

使用したいバージョンのファイルをダウンロードします。

f:id:yoshikata1990:20181216083641p:plain

ダウンロードが完了したら、ファイルを解凍してフォルダに入れてください。

フォルダの場所はUE4のバージョンが4.21の場合は下記になります。

Program Files\Epic Games\UE_4.21\Enterprise\Pluginsに配置します。

配置完了したら、UE4を起動してプラグインが正常に適応できているか確認します。

モードの一番左にSpline Snapping Toolというのが追加されていればOKです。

f:id:yoshikata1990:20181216102743p:plain

ここからは使用方法を説明していきます。

まずコンポーネントでスプライトを追加します。

テスト用に上に配置しています。

f:id:yoshikata1990:20181216135056p:plainスプラインを設定したら、SplineSnappingToolからスプライン選択のアイコンを選択してスプラインを指定します。

f:id:yoshikata1990:20181216143504p:plain

選択したらオレンジ色にスプラインの色が変化します。

その後、配置したいオブジェクトを選択して左シフトキーを押します。

f:id:yoshikata1990:20181216143626p:plainf:id:yoshikata1990:20181216143641p:plain

そうすることでスプラインに合わせて物体を配置することができます。

Sphereを今回は配置しています。

f:id:yoshikata1990:20181216145614p:plain

こんな感じで配置できます。設定用のパラメータは下記で説明します。

スプラインと配置するオブジェクトの間隔などいろいろ設定できます。

f:id:yoshikata1990:20181216152606p:plain

スプラインスナッピングツールの説明は以上になります。

スプラインの起動に沿って、建物のパーツ配置をしたり

キャラクターの配置などもできるので、よく活用してます(*´∀`*)

その2・StreetMapPlugin

このプラグインはオープンストリートマップというサイトから

地図のデータを取得してそれを読み込むことで町並みを、

MapというファイルでUE4に表示したり町並みをメッシュとして書き出せます。

※こちらはVer.4.19まで使用できます。

※最新版ではプラグインのビルドに失敗します。ご注意ください。

C++のプロジェクトでビルドして使用するタイプのプラグインになります。

まずは下記リンクからダウンロードします。

github.com

ダウンロードしたら、インストールしたいC++プロジェクトフォルダの

直下にPluginsというフォルダを作成します。

フォルダを作成したら、Githubから落としてきたデータをStreetMapという

フォルダ名に変更します。

f:id:yoshikata1990:20181216195432p:plain

そうしたらあとはプロジェクトを起動して、

途中にプラグインのdllをリビルドするかどうか聞かれるので、

Yesを選択してリビルドします。

成功すればPluginの一番下にプラグインが追加されます。

f:id:yoshikata1990:20181216195727p:plain

ここまで行けばプラグインの登録は完了です。

つづいて下記のサイトから町並みのデータを作成します。

アカウントを作ることでエクスポートできます。

メールアドレスの登録は必要になります。

www.openstreetmap.org

データとして取得したい箇所に領域を当てて、

エクスポートを選択するとmap.osmというファイルがダウンロードできます。

f:id:yoshikata1990:20181216220856p:plain

map.osmのファイルをUE4プロジェクトのコンテンツブラウザに、

入れると認識されます。

f:id:yoshikata1990:20181216223611p:plain

あとはレベル内に配置してあげて見た目として表示されます。

緑色が道で茶色が建物になります。

f:id:yoshikata1990:20181216223836p:plain

これでマップの配置は完了になります。

マップを配置しただけだとCollisionがないので、

詳細のStreetMapの設定からCollisionSettingで「Generate Collision」

のチェックを入れることでCollisionが発生します。

f:id:yoshikata1990:20181216225755p:plain

Create Static Mesh AssetでStaticMeshとしても書き出せます。

その他変更可能な設定としては、

通常の道の色や高速道路の色などを変更できます。

その他プラグインや面白そうなプロジェクト

まず今回紹介したプラグインについては、

下記リンクのサイトで紹介されています。

https://www.openstreetmap.org/https://ue4resources.com/plugins

中でもCustomGravityPluginは面白いので試してみてください。

下記ブログで紹介済みだったため私の方では割愛します。

unrealbussan.hatenablog.com

長くなりましたが今回の説明は以上になります。

ありがとうございました。

次がラストでどんぶつさんのReplicationGraphになります。