셰이더 그래프의 새로운 마스터 스택 소개

Unity 2020.2의 셰이더 그래프에는 아티스트의 워크플로를 개선하는 새로운 기능이 도입되었습니다. 예를 들어, 전반적인 사용자 경험을 개선하고 그래프 인스펙터를 도입하여 그래프 에디터 성능이 크게 개선되었습니다. 이제 그래프의 엔드포인트인 마스터 스택이 단일 마스터 노드를 대체하여 기능 블록이 모인 모듈식 집합으로 개선되었습니다. 마스터 스택은 셰이더 그래프의 엔드포인트로 셰이더의 최종 결과물을 정의합니다. 이를 활용하면 사용자가 버텍스 스테이지와 프래그먼트 스테이지에서 이루어지는 작업 사이의 관계를 시각화할 수 있습니다. Unity 2020.2에서는 마스터 스택이 기존 Unity 버전의 마스터 노드를 대체합니다.

그래프 인스펙터는 그래프 내의 마스터 노드와 기타 노드의 설정을 단일 위치로 통합하며, 여기에서 액티브 타겟(Active Target)과 셰이딩 모드를 설정할 수 있습니다.

아래 동영상에서 새로워진 셰이더 그래프의 모든 기능을 확인할 수 있습니다.

새로운 마스터 스택 기능을 사용해 보려면 GitHub에서 샘플 프로젝트를 다운로드하세요. 이제 샘플 프로젝트를 열어 몇 가지 예시를 보여 드리겠습니다.

먼저 샘플 프로젝트를 클로닝하거나 다운로드하세요.이 샘플 프로젝트는 Unity의 URP(유니버설 렌더 파이프라인)를 이용하여 제작되었습니다. 이 프로젝트의 미니어처 해변 환경에는 셰이더 그래프에서 만든 셰이더로 빌드한 두 종류의 물(절벽에서 떨어지는 폭포, 섬과 연결된 바다)이 있습니다. 완성된 샘플 씬은 Asset > Scenes > MasterStackDemoScene에서 확인할 수 있습니다.이제 새로운 마스터 스택 기능으로 물 셰이더를 빌드하는 방법을 살펴보겠습니다.

폭포 셰이더의 경우, 셰이더의 기본 컬러 채널과 알파 채널만 설정하면 됩니다. Voronoi 노드를 사용하여 텍스처를 생성하고, 폭포 모델의 UV를 오프셋하고 타일링할 수 있습니다. One Minus 노드 두 개를 사용하여 알파 채널에서 메시의 가장자리를 마스킹 영역에서 제외하면 폭포가 더 자연스러워집니다.

실제 그래프를 조정하기 전에 물 셰이더가 가지고 있어야 하는 기본 속성에 관해 생각해 볼 필요가 있습니다. 먼저 물의 컬러를 결정하고, 파도와 조류와 같은 요소로 물을 더욱 실감나게 만들어 줍니다. 물의 반사도 매우 중요하며, 바닷물이 해안에 닿을 때 포말도 추가해야 합니다. 마지막으로 바다의 일부가 해안에 꽤 가까우므로 깊이도 추가합니다.물 셰이더의 속성을 정했으니 이제 샘플 셰이더를 통해 원하는 결과를 도출하는 방법을 살펴보겠습니다.

먼저 유리 구 아래에 컬러를 적용합니다. 물 셰이더는 네 가지 컬러 속성을 사용합니다. 이 중 두 가지는 전체적인 그레디언트를 제어하고 나머지 두 가지는 깊은 물과 얕은 물을 담당합니다. 깊은 물과 얕은 물 사이의 전환은 뎁스값으로 제어되는데, 이에 대해서는 나중에 자세히 이야기하겠습니다.다음으로 샘플 셰이더에서 조류를 표현하기 위해 버텍스 변위를 활용하는 방법에 관해 알아보겠습니다. 새로운 마스터 스택은 버텍스(Vertex) 및 프래그먼트(Fragment) 셰이더를 따로 표시하므로 버텍스에 영향을 미치는 노드를 명확하게 파악할 수 있으며 그래프 업데이트 과정도 간단해집니다.

셰이더 그래프의 이 부분에서는 버텍스가 y축 상에서 변위됩니다. 속성을 조절하여 변위의 강도와 빈도를 제어할 수 있습니다. Gradient Noise 노드를 사용하면 조류의 빈도에 더 많은 배리에이션을 추가할 수 있습니다. 작은 파도를 시각적으로 표현하려면 두 개의 노멀 맵을 반대 방향으로 타일링하고 시간을 기준으로 타일링 속도를 조절합니다.

이제, 물의 반사 와 깊이를 표현하는 방법을 알아보겠습니다.물의 반사는 셰이더에 평활도를 적용하여 표현할 수 있습니다. 여기에는 항상 두 가지 값이 있으며 하나는 유리 구의 상단에, 하나는 측면에 사용합니다.

셰이더를 사용하여 깊이를 만들기 전에 프로젝트에서 사용 중인 에셋에서 Depth Texture 옵션이 선택되어 있는지 확인합니다. 사용 중인 렌더 파이프라인 에셋의 General 섹션에서 Depth Texture 옵션을 찾을 수 있습니다. 현재 사용 중인 렌더 파이프라인 에셋은 Edit > Project Setting > Graphics > Scriptable Render Pipeline Asset을 통해 액세스할 수 있습니다.

Depth Texture가 활성화되어 있는지 확인한 후에는 물 셰이더에 뎁스를 추가하면 됩니다.

물의 깊이는 Scene Depth 노드, Screen Position 노드와 카메라의 먼 평면 거리(far plane distance)를 사용하여 계산할 수 있습니다. 또한 여러 가지 뎁스 속성이 블랙보드에 설정되어 있으므로 물의 깊이를 머티리얼 인스펙터에서 제어할 수 있습니다. 그런 다음 Lerp 노드와 뎁스값을 사용하여 깊은 물과 얕은 물의 컬러를 함께 보간할 수 있습니다.

깊은 물과 얕은 물의 컬러뿐 아니라 물의 포말도 뎁스값에 따라 달라집니다. 하지만 이 경우에는 물이 다른 물체와 만날 때만 포말이 나타나야 하므로 뎁스값을 반전할 필요가 있습니다. 이때 One Minus 노드가 도움이 됩니다.이제 핵심적인 속성을 모두 살펴보았습니다! 자유롭게 둘러보며 프로젝트 내에서 원하는 대로 값을 조정해 보세요. 셰이더 그래프 버전이 10.0 이상인 경우, 이전 버전으로 만든 셰이더 그래프를 그래프 에디터에서 열면 마스터 스택을 사용하도록 업그레이드됩니다. 프로젝트를 최신 버전으로 업그레이드하는 방법을 자세히 알아보려면 업그레이드 가이드를 참고하세요.

셰이더 그래프를 빌드하는 데 관심이 있다면 포럼 공간에 참여하거나 Discord를 찾아주세요. 많은 관심과 참여를 부탁드립니다.

시유(트레이시) 첸(R&D, 그래픽스 부문 테크니컬 아티스트)은 셰이더 생성, 툴 개발, 룩 디벨롭먼트에 관심이 많은 테크니컬 아티스트입니다. 유니티에서 테크니컬 아티스트 인턴으로 재직하다 카네기 멜론 대학교의 엔터테인먼트 테크놀로지 센터를 졸업하고 최근에 복귀했습니다.다양한 AR/VR 기기와 콘솔 등 여러 플랫폼에서 프로젝트를 진행한 바 있습니다.현재는 반복 작업 속도를 높이기 위해 셰이더 그래프의 안정성과 확장성을 향상하고, 사용자 친화적인 도구로 발전시키고 있는 엔지니어 및 디자이너와 함께 일하고 있습니다.