エフェクト実習
教材一覧

Appearance

第11回 描画バッファとポストエフェクト ​

前回: 第10回 メッシュとシェーダーによる斬撃 / 次回: 第12回 VFX Graph入門

描画の途中結果を保持する領域をバッファと呼びます。画面の色を読み直すと、明るい場所をにじませたり、背景がゆがんで見える表現を作れます。今回は既存の斬撃へ効果を追加し、元の輪郭が読み取れる強さを選びます。

今回の授業内容 ​

  • Volumeによる画面の後処理と、Scene Colorを読む透明物体の描画を区別する
  • Bloomか歪みのいずれかを設定し、同じカメラで有無を比較する
  • 追加した効果を調整し、元の形が読める状態へ戻せるようにする

開始状態と方法の選択 ​

第10回のLesson10をLesson11.unityとして別名保存します。未完成の場合は、先にメッシュとUVと表示範囲の設定までを完成させます。比較中はCrescent Slashを無効にし、Playしていない状態でMaterialのPhase 0.5、Intensity 1へ戻して形を固定します。

方法利用する情報主な影響範囲
Bloomカメラの描画結果にある強い明るさ画面全体の後処理
Scene Color透明物体を描く前に保存した不透明な背景色そのMaterialを持つメッシュの範囲

基本課題ではどちらか一方を選びます。両方に取り組む場合も、一方を完成させて比較した後に進みます。

選択A：VolumeによるBloom ​

URPにはVolumeを使うポストプロセスが統合されています。この授業では追加のPost Processing Stack v2を導入しません。構成はUnity公式のURPポストプロセス資料で確認できます。

発光部分の準備 ​

  1. SlashGraphとSlashMaterialを複製し、SlashBloomGraphとSlashBloomMaterialにします。複製したMaterialのShaderをSlashBloomGraphに変え、Slashへ割り当てます。
  2. GraphへFloat Property Glowを追加します。Referenceは_Glow、Default 4、Exposedを有効にします。
  3. 既存のSample Gradientの色とGlowをMultiplyで掛け、FragmentのBase Colorへ接続します。Alphaの既存接続は維持してGraphを保存します。

URP Unlit GraphではBase Colorへ1を超える明るい値を出力します。Lit Graphで使うEmission入力を探す必要はありません。ここでのGlowは画素の明るさ、後で設定するBloom Intensityはにじみの強さです。

カメラとVolume ​

  1. Project SettingsのQualityを開き、現在のQualityで使うRender Pipeline Assetを確認します。Quality側が未指定の場合はGraphicsの既定のURP Assetを使います。そのAssetでHDRを有効にします。
  2. Main CameraのRenderingでPost Processingを有効にします。カメラのHDR設定はURP Assetの設定を使う状態にします。
  3. HierarchyのVolume > Global Volumeで作成し、名前をBloomVolume、LayerをDefaultにします。既存のGlobal Volumeがある場合は効果の重複を避けるため、比較中は無効にします。
  4. BloomVolumeのProfile欄でNewを選び、Profileを作ります。Weightは1にします。
  5. Add Override > Post-processing > Bloomを追加します。ThresholdとIntensityの左のチェックを有効にして、それぞれ1、0.5に設定します。
  6. Main CameraのVolume MaskにDefaultが含まれることを確認します。

GameビューでBloomVolumeを有効・無効にし、明るい弧の外へにじみが広がるか比較します。形が固定された同じ状態で、Intensityを0.5 → 2 → 0.5と変えます。最後は0.5へ戻し、白くつぶれる場合はGlowを4 → 2へ下げて比較します。採用する値を記録してください。

Screen Space - OverlayのUIは通常、このカメラのポストプロセス後に描かれます。UIも含めて必ずすべてにBloomが掛かるわけではなく、Canvasの描画方式により扱いが異なります。

選択B：Scene Colorによる歪み ​

比較する背景と取得設定 ​

背景の輪郭を読むため、Cubeを2個、Position (-0.5, 0, 2)と(0.5, 0, 2)、Scale (0.2, 4, 0.2)で置きます。これは歪みの比較用の目印です。明るい色のURP Unlit Materialを割り当てます。カメラは前回と同じ位置に固定します。

現在使われているURP AssetのOpaque Textureを有効にします。Main CameraのOpaque Texture設定がUse Pipeline Settingsとなっていることも確認します。Opaque Textureは透明物体の描画前に保存されるため、ほかの透明エフェクトまで含む最終画像ではありません。

歪み用Graph ​

SlashGraphとSlashMaterialを複製し、SlashDistortionGraphとSlashDistortionMaterialにします。複製したMaterialのShaderを変更し、Slashへ割り当てます。Surface TypeはTransparent、Blending ModeはAlpha、Render FaceはBothを維持します。

  1. Float Property Distortionを追加し、Referenceを_Distortion、Defaultを0、Exposedを有効にします。
  2. Screen Positionノードを追加し、ModeをDefaultにします。Splitへつなぎ、RとGをCombineのRとGへ接続して、RG出力を画面UVとして使います。
  3. UVノードのUV0をSimple Noiseへ接続し、Scaleを12にします。出力からSubtractで0.5を引き、DistortionをMultiplyで掛けます。
  4. この結果を別のCombineのRへ入れ、Gを0にします。RG出力を、画面UVへAddで加えます。
  5. Addの結果をScene ColorのUVへ、Scene Colorの色をFragmentのBase Colorへ接続します。前回までのAlphaの接続は残します。
  6. Graphを保存します。MaterialのSpeedは0、Phase 0.5、Intensity 1へそろえます。

ノイズから0.5を引くと、左右両方向へのずれを作れます。Distortionが0なら元の画面位置を読み、値を大きくすると離れた位置の色を読みます。模様のUVと、背景を読む画面UVを取り違えないでください。

ずれの比較と復元 ​

Distortionを0 → 0.01 → 0.03 → 0へ変更します。0では背景の線がつながり、0.01では弧の範囲にある線が少し揺らいで見えることを確認します。0.03では輪郭を読み取りにくくならないか比較し、採用値を決めます。

変化が分からない場合は、背景が不透明であること、Slashより奥にあること、Opaque Texture、Screen PositionのMode、Scene ColorのUV接続を順に確認します。背景色が一様な場所では、読み取る位置を変えても差が出にくくなります。

保存と提出 ​

比較前後でカメラ・背景・斬撃のPhaseをそろえます。効果を強めた画像だけで判断せず、元の輪郭が読める強さを選び、値と理由を添えます。

Playを終了して採用値をMaterial・Graph・Volumeへ保存します。Crescent Slashを使う場合は再び有効にし、Playで開始から消失まで確認します。静止比較用の設定と、再生スクリプトが上書きする値を区別してください。

  • 選択した方法、使ったバッファ、影響する範囲を説明する
  • 効果なし・採用値の画像または短い動画を提出する
  • 強さを変えるPropertyと、元の状態へ戻す値を記録する

SceneとPrefabを保存し、次回は新しいSceneでVFX Graphを始めます。