0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

PostProcessのBloomにアニメーションを付与する

Last updated at Posted at 2024-05-27

タイトル

PostProcessで光の強弱を表現するようなエフェクトをかける

完成したもの↓

ランタン、屋台の明かりなどの元から明るい箇所を光らせるようなエフェクトをかけました
作成物

誰に向けた記事か

内容としてはほぼ備忘録です
PostProcessはじめたての人、簡単に↑のようなエフェクトをかけたい人へ

前提条件

まず以下の準備が整っていることを条件としています

  • PostProcessのインストール
  • DoTweenの簡単な知識

Unity側の操作

まずエフェクトをかけたいカメラにPost-process Layer、Post-process Volumeをアタッチします。
カメラを分けないとオブジェクトすべてにエフェクトがかかってしまいます。
image.png

次に↑で設定したカメラをエフェクトをかけたいオブジェクトのみを配置したCanvasのRender Cameraに設定します。
今回はこのCanvasの子にImageの背景を設定しました。
image.png

次にInspectorのLayerからAddLayerを選択し、「PostProcessing」という名前のレイヤーを追加します。
これはエフェクトをかけたものを描画する際に他のオブジェクトとかぶらないためにレイヤーを分けるためです。
レイヤーの追加を行えたらカメラにアタッチしたPostProcessの設定をおこないます。
Post-process Layerの方はLayerを先ほど作成した「PostProcessing」に設定します。
Post-process VolumeはIsGlobalをtrueにし、Profileの欄で「New」をクリックして新しいプロファイルを作成します。
image.png

プロファイルを作成したらAdd effectでBloomを追加します。
今回は

  • Intensity(光る度合い)
  • Threshold(エフェクトをかける範囲)
  • Color(何色に光らせるか)

の3つを設定します。この辺りは使う素材によって変わってくるのでてある程度は手当たり次第で色々いじってみるのが良いと思います。
ただColorの中にあるIntensityは1より大きくないとBloomのエフェクトがかからないので注意してください。
image.png
image.png

今回はこのプロファイルの値をDoTweenで操作してアニメーションを付与します。
image.png

アニメーションスクリプト

カメラにアタッチするスクリプトを書いていきます
以下はPostProcessのプロファイラのBloomのIntensityの値をDoTweenのYoyoでループさせることでアニメーションを付けています

Effect.cs
using DG.Tweening;
using System.Collections;
using System.Collections.Generic;
using System.Linq;
using UnityEngine;
using UnityEngine.Rendering.PostProcessing;

public class Effect : MonoBehaviour
{
    [SerializeField]
    private PostProcessProfile m_PostProcessProfile = null;

    private static float fMinIntensity = 0.8f;
    private static float fMaxIntensity = 2.75f;

    private void Start()
    {
        var pSettings = m_PostProcessProfile.settings;
        var pBloom = pSettings.Where(x => x as Bloom).FirstOrDefault() as Bloom;
        pBloom.intensity.value = fMinIntensity;
        if (pBloom != default)
        {
            var pSequence = DOTween.Sequence();
            DOTween.To(() => pBloom.intensity.value, (x) => pBloom.intensity.value = x, fMaxIntensity, 1.75f).SetLoops(-1, LoopType.Yoyo);
        }
    }
}

参考資料

お借りした素材

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?