アルファチャンネルでない動画をUnityでクロマキー処理して再生する

Unity

2019.10.31

ココのコイン落としのアップデートを重ねるうちに、動画を用いた演出を考えるようになりました。
動画といっても画面を彩る演出の一部なので、もちろん画面全体を覆うようなものではなく、画面の一部をメラメラと炎が踊って期待感を煽ったり、爆発や電流のアニメーションが流れて大当たりを飾るようなものを考えています。
そういった動画素材を探す場合、「アルファチャンネル」という「ここが透過部分ですよ」という付加情報のある動画を探さなければなりません（アルファチャンネル付き動画をUnityで再生する方法についてはこちらの記事がわかりやすいです）。しかし意外と見つからない・・・。

そこで役に立つのが、特定の色(色範囲)をクリップする事で透過処理を行うクロマキー合成です。これを行う事で背景が一色で塗りつぶされた様な動画であればそれを透過部分として抜いて再生する事ができます。
これを簡単に実現することができるこういったアセットもあるようです。

シェーダーを作成
3Dオブジェクトとして配置
uGUIに配置

シェーダーを作成

アセットに頼らずクロマキー合成を自前でUnityで実装する為には、まず以下のようなシェーダを用意します(ソース引用：
http://onoty3d.hatenablog.com/entry/2016/02/06/141002 )

Shader "Onoty3D/ChromaKey" {
	Properties{
		_KeyColor("Key Color", Color) = (0,1,0)
		_Near("Near", Range(0, 2)) = 0.2
		_MainTex("Base (RGB) Trans (A)", 2D) = "white" {}
	}

	SubShader{
		Tags{ "Queue" = "Transparent" "IgnoreProjector" = "True" "RenderType" = "Transparent" }
		LOD 200

		CGPROGRAM
			#pragma surface surf Lambert alpha

			sampler2D _MainTex;
			fixed3 _KeyColor;
			fixed _Near;

			struct Input {
				float2 uv_MainTex;
			};

			void surf(Input IN, inout SurfaceOutput o) {
				fixed4 c = tex2D(_MainTex, IN.uv_MainTex);
				clip(distance(_KeyColor, c) - _Near);
				o.Albedo = c.rgb;
				o.Alpha = c.a;
			}
		ENDCG
	}

	Fallback "Transparent/Diffuse"
}

このシェーダーを新規マテリアルに割当、透明化する色を設定します。また色の許容範囲も適当な値に設定します。

3Dオブジェクトとして配置

3Dオブジェクトとしてゲーム空間に配置したい場合はQuadを設置して、VideoPlayerを追加し、更に作成したマテリアルを追加します。

uGUIに配置

uGUIとして動画を配置したい場合、まずcanvasにRaw Imageオブジェクトを作成し、VideoPlayerとAudioSource を追加します。
videoclipに再生したい動画を割り当てます。
以下のようなスクリプトを作成し、Raw Imageオブジェクトにアタッチします。(参考：
https://dskjal.com/unity/videoplayer-on-ugui.html )

using UnityEngine;
using UnityEngine.UI;
using UnityEngine.Video;

[RequireComponent(typeof(RawImage), typeof(VideoPlayer), typeof(AudioSource))]
public class VideoPlayerOnUGUI : MonoBehaviour {
    RawImage image;
    VideoPlayer player;
    void Awake() {
        image = GetComponent<RawImage>();
        player = GetComponent<VideoPlayer>();
        var source = GetComponent<AudioSource>();
        player.EnableAudioTrack(0, true);
        player.SetTargetAudioSource(0, source);
    }
    void Update() {
        if (player.isPrepared) {
            image.texture = player.texture;
        }
    }
}