본문 바로가기
자료는 자료지/외부에서 퍼온자료

5. Unity 셰이더 : 버텍스 오프셋을 이용한 촉수 성장 애니메이션

by 대마왕J 2026. 1. 5.

이번에서는 이전까지 다루었던 픽셀 셰이더(Fragment Shader) 중심의 효과에서 벗어나, 버텍스 셰이더(Vertex Shader)에 집중해 봅니다. 버텍스 터널 내에서 간단한 계산을 통해 모델의 정점을 변형시키고, 이를 통해 흥미로운 버텍스 애니메이션 효과, 구체적으로는 촉수가 자라나는 과정을 구현하는 방법을 다룹니다.

기본적인 원리는 원래 규칙적인 원기둥 형태의 모델을 스케일링하고, 윗부분을 잘라내어(culling) 마치 땅 밑에서 무언가가 자라나는 듯한 착각을 일으키는 것입니다.

 


1단계: 모델링 준비

먼저 3D 모델링 소프트웨어에서 촉수 모델을 준비합니다.

  • 기본 형태: 원기둥(Cylinder)으로 시작하며, 부드러운 변형을 위해 분할(segment) 수를 높게 설정합니다 (예: 높이 분할 50).
  • 변형: 'Path Deform' 기능을 사용하여 원기둥이 곡선을 따라 휘어지도록 만듭니다. 촉수의 끝부분은 가늘게 하여 자연스러운 모양을 잡습니다.
  • UV 및 내보내기: 모델의 바닥면을 제거하고 UV를 0-1 범위로 펼친 후 Unity로 내보냅니다.


2단계: 버텍스 오프셋 기초 및 성장 애니메이션 구현

Unity로 돌아와 셰이더 작업을 시작합니다. 먼저 기본적인 버텍스 이동을 구현한 후, 알파 테스트를 이용해 성장하는 효과를 만듭니다.

  • 버텍스 오프셋 (Vertex Offset): 셰이더 에디터(예: ASE)에서 Local Vertex Offset 노드를 활용합니다. 모델의 버텍스 법선(Normal) 벡터를 입력으로 사용하여 버텍스 좌표에 법선 방향으로의 이동값을 더해줍니다. 여기에 숫자를 곱하여 이동 범위를 조절하면 모델이 부풀어 오르거나 수축하는 효과를 줄 수 있습니다.
  • 성장 애니메이션 (Alpha Test): 렌더 큐를 'Alpha Test'로 설정하여 Opacity Mask 인터페이스를 활성화합니다. 모델의 UV y좌표(v좌표)에서 특정 수치를 빼는 계산을 수행합니다. 이 결과값이 설정된 마스크 값(예: 0)보다 작으면 해당 픽셀이 버려지게(clip) 됩니다. 이 수치를 조절하여 촉수가 바닥에서부터 자라나는 듯한 애니메이션을 구현합니다.

3단계: 모양 다듬기 및 디테일 추가

단순한 성장 애니메이션만으로는 촉수의 끝부분이 잘린 것처럼 보일 수 있습니다. 이를 해결하고 더 자연스러운 모양을 만듭니다.

  • 스무스스텝(Smoothstep)을 이용한 테이퍼링: UV y좌표를 기반으로 0에서 1 사이의 가중치 값을 계산하기 위해 Smoothstep 함수를 사용합니다. 이 가중치를 버텍스 오프셋 계산에 곱해주면 촉수의 끝으로 갈수록 이동량이 줄어들어 자연스럽게 가늘어지는 형태를 만들 수 있습니다.
  • 끝부분 처리 (End Control): 성장 애니메이션의 마지막 단계에서 끝부분이 완전히 닫히지 않는 문제를 해결하기 위해, 또 다른 Smoothstep을 사용하여 끝부분의 가중치 값을 고정시켜 줍니다. 이렇게 하면 촉수가 완전히 자랐을 때 끝이 둥글게 마무리됩니다.

전체 크기 조절: 테이퍼링을 위한 오프셋 외에, 전체적인 크기를 조절하는 별도의 버텍스 오프셋 계산을 추가하여 두 가지 변형을 합칩니다. 이를 통해 촉수의 굵기와 끝부분의 모양을 독립적으로 제어할 수 있습니다.


4단계: 재질 및 최종 완성

마지막으로 셰이더에 PBR 텍스처를 적용하여 사실적인 촉수 느낌을 완성합니다.

  • PBR 텍스처 적용: Diffuse, Normal, Smoothness 맵을 각각 연결하여 촉수의 질감, 입체감, 그리고 매끄러운 정도를 표현합니다. 특히 노멀 맵을 통해 디테일한 표면 질감을 살릴 수 있습니다.
  • 코드 구현 (선택 사항): 노드 기반으로 작업한 내용을 HLSL 코드로 변환할 수도 있습니다. 각 속성(Property)을 정의하고 버텍스 셰이더 함수 내에서 법선, 스무스스텝 가중치, 스케일 값을 이용해 최종 버텍스 오프셋을 계산하여 적용합니다.

이렇게 완성된 셰이더의 파라미터를 조절하면 땅에서 솟아나며 꿈틀거리는 듯한 촉수 애니메이션을 만들 수 있습니다. 여러분만의 창의적인 아이디어를 더해 다양한 효과를 만들어보세요!

반응형

댓글