Unity

Unity Shader : UV 매핑

코샵 2024. 3. 17. 10:05
반응형
이 글에서는 텍스쳐를 자유롭게 조작하고 다양한 시각 효과를 만들 수 있는 UV 매핑 심화 개념을 다룹니다. 텍스쳐 타일링, 오프셋, 애니메이션, 불 쉐이더 제작 과정을 예시와 함께 자세하게 설명하며,  텍스쳐 래핑 모드, 셰이더 변수, 시간 기반 애니메이션 등 관련 개념들을 심층적으로 이해할 수 있도록 돕습니다.

 

텍스쳐 타일링

텍스쳐 타일링은 텍스쳐를 반복적으로 표현하여 더 넓은 영역에 적용하는 기술입니다. 벽돌, 타일, 천, 바닥 등 여러 표면에 텍스쳐를 자연스럽게 적용하는 데 사용됩니다.

텍스쳐 타일링을 하기 위해서는 Wrap Mode를 Repeat로 변경해야 합니다.

 

예시

  • 벽돌 벽: 벽돌 텍스쳐를 타일링하여 벽 전체를 채웁니다.
  • 바닥 타일: 타일 텍스쳐를 타일링하여 바닥 전체를 채웁니다.
  • 천: 구름 텍스쳐를 타일링하여 하늘을 표현합니다.
  • 옷: 천 텍스쳐를 타일링하여 옷감을 표현합니다.

코드 

Shader "MyShader"
{
    Properties
    {
        _MainTex("텍스쳐" , 2D) = "white" {}
        _U ("오프셋 U", Float) = 1
        _V ("오프셋 V", Float) = 1
    }
    SubShader
    {
        Tags { "RenderType"="Opaque" }
        LOD 200

        CGPROGRAM
        #pragma surface surf Standard fullforwardshadows
        #pragma target 3.0

        sampler2D _MainTex;
        float _U, _V;

        struct Input
        {
            float2 uv_MainTex;
        };

        void surf (Input IN, inout SurfaceOutputStandard o)
        {
            fixed4 mainTex = tex2D(_MainTex, float2(IN.uv_MainTex.x * _U, IN.uv_MainTex.y * _V));
            o.Emission = mainTex;
        }
        ENDCG
    }
}

 

텍스쳐 오프셋

텍스쳐 오프셋은 텍스쳐를 이동시켜 원하는 위치에 표현하는 기술입니다. 텍스쳐 전체를 보여주지 않고 특정 부분만 선택적으로 표현하거나, 여러 텍스쳐를 조합하여 새로운 효과를 만들 수 있습니다.

 

예시

  • 벽돌 벽: 벽돌 텍스쳐를 오프셋하여 특정 벽돌만 강조합니다.
  • 바닥 타일: 타일 텍스쳐를 오프셋하여 패턴을 만듭니다.
  • 천: 구름 텍스쳐를 오프셋하여 구름의 흐름을 표현합니다.
  • 옷: 천 텍스쳐를 오프셋하여 옷의 무늬를 조절합니다.

코드

// ...
void surf (Input IN, inout SurfaceOutputStandard o)
{
    fixed4 mainTex = tex2D(_MainTex, IN.uv_MainTex + float2(_U, _V));

    o.Emission = mainTex;
}
//...

 

텍스쳐 애니메이션

텍스쳐 애니메이션은 시간에 따라 텍스쳐를 변화시켜 동적인 효과를 만드는 기술입니다. 물결, 불꽃, 나뭇잎 흔들림 등 자연적인 움직임을 표현하거나, 게임 캐릭터의 옷이나 무기 등에 애니메이션 효과를 적용하는 데 사용됩니다.

 

예시

  • 물결: 물 텍스쳐를 애니메이션하여 물결의 움직임을 표현합니다.
  • 불꽃: 불 텍스쳐를 애니메이션하여 불꽃의 타오르는 모습을 표현합니다.
  • 나뭇잎: 나뭇잎 텍스쳐를 애니메이션하여 나뭇잎이 바람에 흔들리는 모습을 표현합니다.
  • 게임 캐릭터: 캐릭터 옷 텍스쳐를 애니메이션하여 옷이 펄럭이는 모습을 표현합니다.

빌트인 쉐이더 변수

  • Unity의 Shader에는 미리 선언되어 있는 변수인 빌트인 쉐이더 변수가 있습니다. 
  • 자세한 내용은 https://docs.unity3d.com/Manual/SL-UnityShaderVariables.html 에서 확인해보세요.
  • 현재 포스팅에서는 현재 프레임 이후 경과된 시간을 초 단위로 반환하는 _Time 변수를 활용하겠습니다.

코드

// ...
void surf (Input IN, inout SurfaceOutputStandard o)
{
    fixed4 mainTex = tex2D(_MainTex, float2(IN.uv_MainTex.x + _Time.y, IN.uv_MainTex.y));

    o.Emission = mainTex;
}
//...

 

 

불 쉐이더 제작

불 쉐이더는 텍스쳐 애니메이션과 컬러 블렌딩을 활용하여 불꽃의 움직임과 색상을 표현하는 쉐이더입니다. 불꽃의 불규칙한 움직임, 타오르는 모습, 연기 효과 등을 사실적으로 표현하는 데 사용됩니다.

 

예시

  • 모닥불: 여러 텍스쳐를 조합하여 불꽃의 다양한 색상과 형태를 표현합니다.
  • 촛불: 텍스쳐 애니메이션을 사용하여 촛불의 흔들림과 연기 효과를 표현합니다.
  • 용암: 텍스쳐 래핑 모드를 사용하여 용암의 흐르는 모습을 표현합니다.
  • 게임 캐릭터: 캐릭터 스킬 효과로 불꽃을 표현합니다.

투명 렌더링 설정

  • 유니티 셰이더에서 알파값을 활용하여 투명 효과를 표현하기 위해서는 렌더 타입을 불투명에서 투명으로 변경해야 합니다.
  • 표면 셰이더 컴파일 지시자의 파라미터를 알파-블렌딩으로 변경합니다.

 

코드

Shader "MyShader"
{
    Properties
    {
        _MainTex("텍스쳐" , 2D) = "white" {}
        _Mask("마스킹", 2D) = "white" {}
    }
    SubShader
    {
    Tags { "RenderType"="Transparent"}
        LOD 200

        CGPROGRAM
        #pragma surface surf Standard alpha:blend
        #pragma target 3.0

        sampler2D _MainTex, _Mask;
        struct Input
        {
            float2 uv_MainTex, uv_Mask;
        };

        void surf (Input IN, inout SurfaceOutputStandard o)
        {
            float4 mask = tex2D(_Mask, float2(IN.uv_Mask.x, IN.uv_Mask.y - _Time.y));
            float4 mainTex = tex2D(_MainTex, IN.uv_MainTex + mask.r * 0.2);

            o.Emission = mainTex.rgb;
            o.Alpha = mainTex.a;
        }
        ENDCG
    }
}