Unityでピクセルを散らしながら消えていくイメージエフェクトを書いてみた

デモ

作成したものがこちらです。

RPGとかでボスが死亡するときの演出に使えるかと思います。

ピクセルを散らしつつ、ついでに小刻みに震えながら消滅していきます。

開発環境

• Unity2017.3
• Windows10

　Androidは実機で動作確認しましたが、iOSでは未検証ですのでご注意ください。

実装概要

シェーダー側でモンスターのピクセルを散らす処理を実装しました。

イメージエフェクトとして実装します。イメージエフェクトについてはこちらのサイト様が参考になります。

【Unity】カスタムイメージエフェクトのつくりかた
www.f-sp.com/entry/2015/08/11/185815

カメラ１とカメラ２を用意します。

カメラ２はレンダーテクスチャに描画しています。モンスターだけを映します。

DisintegrationEffectというコンポーネントをカメラにAddComponentしてます。

Disintegrationは崩壊という意味です。

カメラ１ではUnity UIのRawImageを表示させます。RawImageのTextureに先ほどのレンダーテクスチャをセットし、カメラ２の描画結果が表示されるようにしてます。

コードの抜粋

using UnityEngine;

[RequireComponent (typeof(Camera))]
public class DisintegrationImageEffect : MonoBehaviour
{
// ~一部省略~

    void Awake ()
    {
        Shader shader = Shader.Find (ShaderName);
        m_Material = new Material (shader);
    }

    void OnRenderImage (RenderTexture source, RenderTexture destination)
    {
        UpdateMaterial ();
        Graphics.Blit (source, destination, m_Material);
    }

    void UpdateMaterial ()
    {
        m_Material.SetFloat ("_StrengthX", StrengthX);
        m_Material.SetFloat ("_StrengthY", StrengthY);
        m_Material.SetFloat ("_BeginY", BeginY);
        m_Material.SetFloat ("_EndY", EndY);
    }

 // ~一部省略~

}

詳しくは下記のプロジェクトデータを見てもらうとよいかとおもいます。

Download

プロジェクトデータがBitbucketにあげてますので自由にご利用ください。

https://bitbucket.org/macnaga/disintegration_shader

素材サイト様

ドラゴンの画像は「シアンのゆりかご」様から拝借させていただきました。

http://cyanyurikago.web.fc2.com/index.html

ありがとうございます。