UnrealEngine奮闘記

アンリアルエンジンでの開発やTIPSをまとめたblogです

インベーダーゲームを作る その6背景とマテリアル

今回は背景とマテリアルを設定していきます。

  • 背景用メッシュの配置
  • テクスチャとマテリアルの作成
  • マテリアルエディタの概要
  • マテリアルエディタだけで2重スクロール
  • 弾、プレイヤー、敵のマテリアル適応
  • 露光調整フィルターのカット

背景用メッシュの配置

左側コンテンツブラウザのShapes内にある「Shape_Plane」を右クリックしてCreate Copyを選び、名前をShape_Spaceとします。

f:id:swiftnest:20140430225926j:plain:w460

いつものGeometryを使わないのはUVに違いがあるためです。
試しに適当なテクスチャを両方に貼ってみました。
=
左がGeometryで、右が「Shape_Plane」です。それぞれ3m四方です。

f:id:swiftnest:20140430230440j:plain:w460

GeometryはUVが1m単位で自動に切られます。
その為、壁などには良いのですが、遠景には不都合があります。

逆にShape_PlaneはUVが伸びるため、遠景に最適です。

次にShape_Spaceを画面に配置します。大きさは50 x 50 x 1で、回転を90,0,90にします。
後はカメラから見切れない遠景に配置します。

これでモデルの準備が整いましたので、次はマテリアルを作成します。

テクスチャとマテリアルの作成

まず左側コンテンツブラウザにあるTexturesを左クリックした状態でImportをクリックし
背景画像を読み込みます。

f:id:swiftnest:20140430230830j:plain:w460

今回は私が星っぽい画像を作成してみました。
クリック後、T_Space.jpgとして保存して下さい。

f:id:swiftnest:20140501011316j:plain:w512

Flicker等は権利が不鮮明だったので自分で描いてみたのですが…イマイチですね。皆さんはもっとカッコ良い星画像を探すのをオススメします。

次にコンテンツブラウザのMaterialsで右クリックし、Materialを新規作成します。
名前は「M_Space」とします。

f:id:swiftnest:20140430233953j:plain:w460

作成した「M_Space」をダブルクリックし、マテリアルエディタを起動します。

マテリアルエディタの概要

マテリアルエディタはBlueprintと同じくシェーダーをGUIで作成する事が出来るツールです。
項目が色々ありますが、UE4は物理シェーダーを採用していますので
MetallicやRoughnessといった素材の特性を指定するのが特徴です
詳細はマニュアルを確認して下さい。

https://docs.unrealengine.com/latest/JPN/Engine/Rendering/Materials/MaterialInputs/index.html

まず、中央のM_Spaceをクリックします。
左側のDetailに、このマテリアルの基礎情報が表示されます。

その中にある「Lighting Model」をDefault LitからUnlitに切り替えます。

Default Litはライティングの影響を受ける普通のマテリアルです。
UnLitはライティングの影響を受けません。遠景や発光体などに使用します。
Subsurfaceはサブサーフェススキャタリング用です。氷やワックス、鉱物などに使用します。
Preintegrated Skinは人の肌用に高速化されたSubsurfaceです。

他にも両面ポリゴン時に使用する「TwoSided」なども、このDetailsにあります。

次にマテリアルエディタ上で右クリックて「Texture Sample」を作成し、Emissiveと接続します。
Details内のTextureには先程作成したT_Spaceを指定します。

f:id:swiftnest:20140430234039j:plain:w460

これでマテリアルは完成です。

コンテンツブラウザに戻り、ShapesからS_Spaceをダブルクリックしてスタティックメッシュエディタを起動します。

「Element 0」にマテリアルの設定欄がありますので、そこに「M_Space」を指定します。

f:id:swiftnest:20140430234852j:plain:w460

これで、背景が宇宙になったかと思います。
ただ、折角なのでマテリアルエディタだけで宇宙を2重スクロールにしたいと思います。

マテリアルエディタだけで2重スクロール

マテリアルエディタに戻り、TextureCoordinateとPannerを作成します。
PannerのDetailsにSpeedY欄があるので、そこに-0.1を指定するとY方向にスクロールするようになります。
これをもう1つ用意し、SpeedYの速度を-0.05、TextureCoordinateのUVに(-1,1)を入れてズラします。

最後に両者をaddで加算します。これで星が2重スクロールするようになりました。

f:id:swiftnest:20140430235822j:plain:w460

しかしこんなにお手軽にシェーダーが書けるとは。UE4凄すぎです…

弾、プレイヤー、敵のマテリアル適応

同じように弾のマテリアルもM_PlayerBulletとM_EnemyBulletを新規作成し、Emissiveに3Vectorを接続します。
プレイヤーの弾は緑、敵の弾は赤にします。

f:id:swiftnest:20140501000404j:plain:w460

その際に、発光して欲しいのでmulで値を5倍します。

f:id:swiftnest:20140501000430j:plain:w460

後は何となくインベーダーとプレイヤーにサンプルのクロームと金を指定してみました。

これで完成…と言いたいのですが、弾を撃つと始めは発光しているのですが
徐々に光が薄れ、それとともに背景も暗くなります。

これは標準のポストエフェクトが自動で露光調整(トーンマップ)をしているためです。
FPSなどでは露光調整が有効なのですがインベーダーゲームでは微妙なのでカットします。

露光調整フィルターのカット

まず左上のモード内にあるVolume->Post Process Volumeをシーンに配置します。
次にサイズを適当に小さく(1 x 1 x 1)等にし、下の方にあるUnboundにチェックを入れます。
これでシーン全体のポストエフェクトを上書きすることが出来ます。

そしてAuto ExposureのMin BrightnessとMax Brightnessにチェックを入れ同じ数字(例えば1)を入れます。
これで露光調整フィルターがOFFになります。

f:id:swiftnest:20140501005622j:plain:w460

ポストエフェクトには他にも被写界深度(DoF)やブルーム、モーションブラーなどがあります。
それぞれデフォルトでONになってますので、値を変えたい場合や消したい場合は
各項目にチェックを入れて効果を上書きして下さい。

各項目の詳細はマニュアルを確認して下さい。
https://docs.unrealengine.com/latest/JPN/Engine/Rendering/PostProcessEffects/index.html

最後に邪魔な天球や地面を消せば完了です。
少しはインベーダーゲームっぽくなってきたでしょうか?

f:id:swiftnest:20140501010622j:plain:w460

次回は敵のループ制御です。