[LearnShader] 스켈레톤에 버텍스 컬러 및 홀로그램 적용 연습해보기

Shader "Custom/skel"
{
    Properties
    {
        _MainTex("Albedo (RGB)", 2D) = "white" {}
    }
        SubShader
    {
        Tags { "RenderType" = "Opaque" }

        CGPROGRAM
        #pragma surface surf Standard
        #pragma target 3.0

        sampler2D _MainTex;

        struct Input
        {
            float2 uv_MainTex;
            float4 color : COLOR;
        };

        void surf(Input IN, inout SurfaceOutputStandard o)
        {
            fixed4 c = tex2D(_MainTex, IN.uv_MainTex); // 원본 텍스처 샘플링
            fixed4 colorOverlay = fixed4(0, 0, 0, 0); // 초기 오버레이 색상 설정

            // 버텍스 컬러의 R 채널을 사용하여 빨간색 적용
            if (IN.color.r > 0.5) {
                colorOverlay += fixed4(1, 0, 0, 1) * IN.color.r; // R 채널에 따른 빨간색 강조
            }

            // 버텍스 컬러의 B 채널을 사용하여 파란색 적용
            if (IN.color.b > 0.5) {
                colorOverlay += fixed4(0, 0, 1, 1) * IN.color.b; // B 채널에 따른 파란색 강조
            }

            // 원본 텍스처 색상과 오버레이 색상을 합침
            o.Albedo = lerp(c.rgb, colorOverlay.rgb, max(IN.color.r, IN.color.b));
            o.Alpha = 1.0; // 알파 값 설정
        }
        ENDCG
    }
        FallBack "Diffuse"
}

 

 

+++

 

이제 빨간색 부분과 파란색 부분을 홀로그램으로 만들기 위해 

 

해당 부분의 투명화를 시켜보았다.

 

Shader "Custom/holo"
{
	Properties
	{
		_MainTex("Albedo (RGB)", 2D) = "white" {}
		_Color("Color", Color) = (1,1,1,1)
		_RedIntensity("Red Hologram Intensity", Float) = 1.0
		_BlueIntensity("Blue Hologram Intensity", Float) = 1.0
	}
		SubShader
		{
			Tags { "RenderType" = "Transparent" "Queue" = "Transparent" }
			CGPROGRAM
			#pragma surface surf Lambert alpha:fade

			sampler2D _MainTex;
			float4 _Color;
			float _RedIntensity;
			float _BlueIntensity;

			struct Input
			{
				float2 uv_MainTex;
				float3 viewDir;
				float4 color : COLOR; // 버텍스 컬러 입력
			};

			void surf(Input IN, inout SurfaceOutput o)
			{
				fixed4 c = tex2D(_MainTex, IN.uv_MainTex); // 원본 텍스처 샘플링
				float rim = saturate(dot(o.Normal, IN.viewDir));
				fixed4 emissionColor = fixed4(0,0,0,1);

				// 홀로그램 효과 적용 조건 검사
				bool isRedHologram = IN.color.r > 0.5;
				bool isBlueHologram = IN.color.b > 0.5;

				if (isRedHologram) {
					emissionColor += fixed4(1, 0, 0, 1) * pow(1 - rim, 3) * _RedIntensity;
				}

				if (isBlueHologram) {
					emissionColor += fixed4(0, 0, 1, 1) * pow(1 - rim, 3) * _BlueIntensity;
				}

				// 홀로그램 효과가 적용되는 경우 투명 처리, 아니면 원본 텍스처 색상 유지
				if (isRedHologram || isBlueHologram) {
					o.Albedo = c.rgb; // 홀로그램 적용 부분도 원본 색상을 유지하려면 이 줄을 유지
					o.Alpha = 0; // 투명 처리
					o.Emission = emissionColor.rgb; // 홀로그램 색상 적용
				}
				 else {
	  				o.Albedo = c.rgb; // 원본 텍스처 색상 유지
	 				 o.Alpha = 1; // 불투명 처리
  		}
}
ENDCG
		}
			FallBack "Diffuse"
}

 

 

++++

 

 

홀로그램 부분에 Rim Lighting 효과를 적용한 모습

 

 

정면으로는 눈 부분의 홀로그램이 잘 보이진 않고, 측면으로 잘 보이는 모습

 

이 이유는 Rim Lighting 효과의 구현 방식 때문이라고 한다.

 

Rim Lighting 효과는 객체의 가장자리 부분이 더 밝게 보이도록 하는 데 사용되는 시각적 기법인데, 

 

뷰 방향과 표면의 노멀 벡터 간의 각도에 기반하여 계산되며, 보통 가장자리에서 더 큰 값을 가진다.

 

float rim = 1.0 - saturate(dot(normalize(IN.viewDir), o.Normal));

 

dot(normalize(IN.viewDir), o.Normal)는 뷰 방향과 표면의 노멀 벡터 사이의 각도의 코사인 값을 계산한다.

 

이 값은 표면이 카메라를 정면으로 바라볼 때 최대가 되고 (코사인 값이 1에 가까워짐),

표면의 가장자리에서 최소가 된다. (코사인 값이 0에 가까워짐).

 

따라서 rim 값은 표면이 카메라를 정면으로 바라볼 때 최소가 되고(0에 가까워짐),

가장자리에서 최대가 된다.(1에 가까워짐)

 

 

이 계산 방식 때문에, 정면에서 바라볼 때는 rim 값이 매우 낮아져 홀로그램 효과의 강도가 약해지고,

 

따라서 파란색 홀로그램이 잘 보이지 않게 된다고 한다.

 

Shader "Custom/holo"
{
    Properties
    {
        _MainTex("Albedo (RGB)", 2D) = "white" {}
        _Color("Color", Color) = (1,1,1,1)
        _RedIntensity("Red Hologram Intensity", Float) = 1.0
        _BlueIntensity("Blue Hologram Intensity", Float) = 1.0
    }
        SubShader
        {
            Tags { "RenderType" = "Transparent" "Queue" = "Transparent" }
            CGPROGRAM
            #pragma surface surf Lambert alpha:fade

            sampler2D _MainTex;
            float4 _Color;
            float _RedIntensity;
            float _BlueIntensity;

            struct Input
            {
                float2 uv_MainTex;
                float3 viewDir;
                float4 color : COLOR; // 버텍스 컬러 입력
            };

            void surf(Input IN, inout SurfaceOutput o)
            {
                float rim = 1.0 - saturate(dot(normalize(IN.viewDir), o.Normal));

                fixed4 c = tex2D(_MainTex, IN.uv_MainTex); // 원본 텍스처 샘플링
                fixed4 emissionColor = fixed4(0,0,0,1);
                bool applyHologram = false;

                // 빨간색 홀로그램 조건 검사 및 적용
                if (IN.color.r > 0.5) {
                    emissionColor += fixed4(1, 0, 0, 1) * _RedIntensity * pow(rim, 3);
                    applyHologram = true;
                }

                // 파란색 홀로그램 조건 검사 및 적용
                if (IN.color.b > 0.5) {
                    emissionColor += fixed4(0, 0, 1, 1) * _BlueIntensity * pow(rim, 3);
                    applyHologram = true;
                }

                if (applyHologram) {
                    o.Emission = emissionColor.rgb;
                    o.Alpha = pow(rim, 3); // Rim 기반 투명도 조절
                }
     else {
      o.Albedo = c.rgb; // 홀로그램이 적용되지 않는 부분은 원본 텍스처 색상 유지
      o.Alpha = 1; // 불투명 처리
  }
}
ENDCG
        }
            FallBack "Diffuse"
}