UnityでFPSをつくる その10-5 [ シーン遷移 ]

2021年7月18日

今回はタイトルシーンを作り、メインシーンへと遷移するようにします。

No.531

ProjectウィンドウのScenesフォルダへ、新規にSceneを作り、「TitleScene」にリネームしてください。

No.532

TitleSceneに切り替え、HierarchyウィンドウからMainCameraを選択。

No.533

Cameraコンポーネントの「ClearFlags」を「SolidColor」へ変更、「Background」を黒にします。

No.534

次に、以下の画像を右クリックで名前を付けて保存を選択。

TitleImage

ProjectウィンドウのImagesフォルダを選択、右クリックでImportNewAssetを選択、保存した画像「TitleImage」を選択して、Importします。

No.535

「TitleImage」を選択した状態のまま、InspectorウィンドウからTextureTypeをSprite(2D and UI)へ変更して、Applyで適用します。

No.536

Hierarchyウィンドウへ「TitleImage」をD&Dして、Transformの値を以下のようにします。

No.537

この「TitleImage」をライトで照らす演出を加えたいのですが、現状のままではライトの影響を受けません。

No.538

そこで、SpriteRendererコンポーネントのMaterialを変更して、ライトの影響を受けるようにします。
まずは、ProjectウィンドウのMaterialsフォルダ内に新規でMaterialを作成し、「Sprites-Diffuse」にリネームします。

No.539

「Sprites-Diffuse」を選択した状態のまま、InspectorウィンドウからShaderのタイプをSprites/Diffuseに変更します。

No.540

このMaterialを「TitleImage」に適用します。
Hierarchyウィンドウから「TitleImage」オブジェクトを選択し、SpriteRendererコンポーネントのMaterialに「Sprites-Diffuse」を選択してください。

No.541

これで「TitleImage」オブジェクトが、ライトの影響を受けるようになります。

No.542

次に、ライトの設定をしていきます。
HierarchyウィンドウからDirectional Lightを選択、「Point Light」にリネームしてください。
続いて、Inspectorウィンドウから各コンポーネントの項目を、以下のように変更します。

No.543

ライトに照らされる表現が完成しました。

No.544

今回選択したライトの種類「Point」は、電球のイメージで、ライトの原点へ近づけば近づくほど周囲のオブジェクトが強い光に照らされます。
Rangeに設定した数値が、球形で表示された光の届く範囲。

No.545

Intensityが、ライトの原点から発せられる光の強さです。

No.546

次に、STARTキーの入力を促すテキストを追加します。
HierarchyウィンドウにTextオブジェクトを追加し、「PressStart」にリネームします。

No.547

Inspectorウィンドウから各コンポーネントの項目を、以下のように変更します。

No.548
No.549

STARTキーが入力されたらフェードアウトするように見せる為、UIにImageオブジェクトを追加し、「FadeBoard」にリネームします。

No.550

ゲーム実行時の画面解像度(1920×1080)にFadeBoardのWidthとHeightを合わせて、Colorを黒色で透明にします。

No.551
続いて、この画面にポストプロセス(カメラに映ったシーンを画像として加工する処理)を使って、エフェクトを加えていきます。
Unityでポストプロセスを使うには「PostProcessing」というライブラリ(汎用性の高い複数のプログラムを再利用可能な形にまとめたもの)をインストールします。
メニューバーの「Window」から「Package Manager」を選択、
No.552

Package Managerウィンドウが開くので「Post Processing」を選択してInstallボタンを押します。

No.553

Installが完了するとチェックマークが付きます。

No.554

これでPostProcessingが使えるようになりました、ウィンドウは閉じてしまって大丈夫です。

PostProcessingのエフェクトは、Post-process Layerがアタッチされたカメラに対して作用します。
今回はUI(PressStart)とSprite(TitleImage)両方にエフェクトをかけたいのですが、UIはデフォルトではスクリーンに直接描画される方式(Screen Space – Overlay)でカメラを経由していない為、カメラを経由する描画方式(Screen Space – Camera)に変更します。

No.555

HierarchyウィンドウからCanvasを選択して、CanvasコンポーネントのRender Modeを「Screen Space – Camera」に、Render Cameraを「Main Camera」にします。

No.556

次に、カメラ側の設定をします。
HierarchyウィンドウからMain Cameraを選択して、Add ComponentでRendering → Post-process Layer を追加してください。

No.557

追加したコンポーネントのLayer項目で、対象となるレイヤーを新規作成します。
タグを追加した時と同様に、今回はLayerのコンボボックスをクリックして、Add Layerを選択します。

No.558

User Layer 8 の欄に「PostProcess」と入力してください。

No.559

HierarchyウィンドウでMain Cameraを選択し、Post Process LayerコンポーネントのLayer項目を「PostProcess」に変更します。

No.560

次に、エフェクトの種類や度合いを決める「Post-process Volume」を作成します。
Hierarchyウィンドウから、3D Object → Post-process Volume を選択してください。

No.561

MainカメラにアタッチしたPost-process Layerコンポーネントの対象になるよう、Layerを「PostProcess」に変更します。

No.562

Post-process VolumeコンポーネントのIs Globalにチェックを入れて、ProfileのNewボタンを押します。

No.563

Is Globalにチェックを入れない場合は、カメラの原点がBox Colliderの範囲内の場合のみエフェクトが適用されます。

No.564

チェックを入れた場合は、カメラの原点がBox Colliderの範囲内外に関係なくエフェクトが適用されます。

No.565

Newボタンを押して新規に作られたPost-process Volume Profileが設定ファイルとなり、どういった種類のエフェクトがかかるのか決まります。
今回は光の滲(にじ)みを表現する為に、「Bloom」というエフェクトを使用します。
Post-process VolumeのInspectorからAdd effect → Unity → Bloom を選択してください。

No.566

追加されたBloomの項目Intensityにチェックを入れ、値を「20」にします。

No.567

Post-process LayerにPost-process Volumeの設定が反映され、カメラに映ったシーンにBloomエフェクトがかかりました。

No.568

長くなってきたので続きは次回にしたいと思います、おつかれさまでした!

FPS

Posted by kenji