Efek Hologram dalam Kesatuan

Hologram adalah proyeksi tiga dimensi suatu benda atau seseorang ke area terdekat, dengan menggunakan teknik yang disebut perpotongan berkas cahaya.

Meskipun tidak ada hologram yang sebenarnya, konsep ini sebagian besar dipopulerkan oleh film dan novel bergenre fiksi ilmiah.

Dalam tutorial ini, saya akan menunjukkan cara membuat Shader hologram dengan efek glitch di Unity.

Periksa Horizon Bending Shader ini

Langkah 1: Buat Hologram Shader

Efek hologram dilakukan dengan bantuan Shader khusus.

Untuk membuat Shader hologram, ikuti langkah-langkah di bawah ini:

• Buat Shader baru dan beri nama "Hologram"
• Hapus semua yang ada di dalamnya lalu tempelkan kode di bawah ini:

Hologram.shader

//sharpcoderblog.com @2019
Shader "FX/Hologram Shader"
{
	Properties
	{
		_Color("Color", Color) = (0, 1, 1, 1)
		_MainTex("Base (RGB)", 2D) = "white" {}
		_AlphaTexture ("Alpha Mask (R)", 2D) = "white" {}
		//Alpha Mask Properties
		_Scale ("Alpha Tiling", Float) = 3
		_ScrollSpeedV("Alpha scroll Speed", Range(0, 5.0)) = 1.0
		// Glow
		_GlowIntensity ("Glow Intensity", Range(0.01, 1.0)) = 0.5
		// Glitch
		_GlitchSpeed ("Glitch Speed", Range(0, 50)) = 50.0
		_GlitchIntensity ("Glitch Intensity", Range(0.0, 0.1)) = 0
	}

	SubShader
	{
		Tags{ "Queue" = "Overlay" "IgnoreProjector" = "True" "RenderType" = "Transparent" }

		Pass
		{
			Lighting Off 
			ZWrite On
			Blend SrcAlpha One
			Cull Back

			CGPROGRAM
				
				#pragma vertex vertexFunc
				#pragma fragment fragmentFunc

				#include "UnityCG.cginc"

				struct appdata{
					float4 vertex : POSITION;
					float2 uv : TEXCOORD0;
					float3 normal : NORMAL;
				};

				struct v2f{
					float4 position : SV_POSITION;
					float2 uv : TEXCOORD0;
					float3 grabPos : TEXCOORD1;
					float3 viewDir : TEXCOORD2;
					float3 worldNormal : NORMAL;
				};

				fixed4 _Color, _MainTex_ST;
				sampler2D _MainTex, _AlphaTexture;
				half _Scale, _ScrollSpeedV, _GlowIntensity, _GlitchSpeed, _GlitchIntensity;

				v2f vertexFunc(appdata IN){
					v2f OUT;

					//Glitch
					IN.vertex.z += sin(_Time.y * _GlitchSpeed * 5 * IN.vertex.y) * _GlitchIntensity;

					OUT.position = UnityObjectToClipPos(IN.vertex);
					OUT.uv = TRANSFORM_TEX(IN.uv, _MainTex);

					//Alpha mask coordinates
					OUT.grabPos = UnityObjectToViewPos(IN.vertex);

					//Scroll Alpha mask uv
					OUT.grabPos.y += _Time * _ScrollSpeedV;

					OUT.worldNormal = UnityObjectToWorldNormal(IN.normal);
					OUT.viewDir = normalize(UnityWorldSpaceViewDir(OUT.grabPos.xyz));

					return OUT;
				}

				fixed4 fragmentFunc(v2f IN) : SV_Target{
					
					half dirVertex = (dot(IN.grabPos, 1.0) + 1) / 2;
					
					fixed4 alphaColor = tex2D(_AlphaTexture,  IN.grabPos.xy * _Scale);
					fixed4 pixelColor = tex2D (_MainTex, IN.uv);
					pixelColor.w = alphaColor.w;

					// Rim Light
					half rim = 1.0-saturate(dot(IN.viewDir, IN.worldNormal));

					return pixelColor * _Color * (rim + _GlowIntensity);
				}
			ENDCG
		}
	}
}

Langkah 2: Tetapkan Shader ke Material

Untuk tujuan demonstrasi, saya akan menggunakan Space Robot Kyle.

Untuk menetapkan Shader hologram ke suatu material, ikuti langkah-langkah di bawah ini:

• Buat Material baru dan beri nama "hologram_material"
• Tetapkan Shader yang baru dibuat padanya, yang seharusnya berlokasi di 'FX/Hologram Shader'

• Untuk Warna saya akan memilih Cyan (0, 1, 1, 1) tetapi Anda dapat memilih warna apa saja

• Untuk Base (RGB) tetapkan Tekstur yang disertakan dengan model

• Tetapkan Materi ke model 3D Anda

Namun seperti yang akan Anda lihat, Modelnya tidak terlihat seperti Hologram, itu karena kita perlu menetapkan satu Tekstur terakhir yaitu Alpha Mask (R).

Dalam kasus saya, saya akan menggunakan tekstur sederhana dengan garis horizontal dan transparansi (untuk menambahkan efek "Holographic segmentation").

• Periksa teksturnya di bawah ini:

• Tetapkan Tekstur di atas ke Alpha Mask (R)

Jauh lebih baik, sekarang modelnya lebih mirip Hologram!

Langkah 3: Tambahkan Efek Glitch

Hologram Shader juga mendukung efek glitch yang dapat dikontrol dari skrip.

Untuk menambahkan efek glitch pada hologram Shader, ikuti langkah-langkah di bawah ini:

• Buat skrip baru dan beri nama "GlitchControl"
• Salin kode di bawah ini di dalamnya:

GlitchControl.cs

using System.Collections;
using UnityEngine;

public class GlitchControl : MonoBehaviour
{
    //How often should the glitch effect happen (higher value means more frequently)
    public float glitchChance = 0.1f;

    Material hologramMaterial;
    WaitForSeconds glitchLoopWait = new WaitForSeconds(0.1f);

    void Awake()
    {
        hologramMaterial = GetComponent<Renderer>().material;
    }

    // Start is called before the first frame update
    IEnumerator Start()
    {
        while (true)
        {
            float glitchTest = Random.Range(0f, 1f);

            if (glitchTest <= glitchChance)
            {
                //Do Glitch
                float originalGlowIntensity = hologramMaterial.GetFloat("_GlowIntensity");
                hologramMaterial.SetFloat("_GlitchIntensity", Random.Range(0.07f, 0.1f));
                hologramMaterial.SetFloat("_GlowIntensity", originalGlowIntensity * Random.Range(0.14f, 0.44f));
                yield return new WaitForSeconds(Random.Range(0.05f, 0.1f));
                hologramMaterial.SetFloat("_GlitchIntensity", 0f);
                hologramMaterial.SetFloat("_GlowIntensity", originalGlowIntensity);
            }

            yield return glitchLoopWait;
        }
    }
}

• Lampirkan skrip GlitchControl ke GameObject yang sama dengan komponen Renderer dengan materi 'hologram_material'.
• Tekan Play dan amati efek glitchnya: