방법: 기하 도형 기반 그라데이션 셰이더 만들기How to: Create a Geometry-Based Gradient Shader

이 문서에서는 셰이더 디자이너 및 DGSL(Directed Graph Shader Language)을 사용하여 기하 도형 기반 그라데이션 셰이더를 만드는 방법을 보여 줍니다.This document demonstrates how to use the Shader Designer and the Directed Graph Shader Language to create a geometry-based gradient shader. 이 셰이더는 세계 좌표 위치에서 개체의 각 점 높이로 상수 RGB 색 값의 비율 크기를 조정합니다.This shader scales a constant RGB color value by the height of each point of an object in world space.

이 문서는 다음 활동을 보여 줍니다.This document demonstrates these activities:

  • 셰이더 그래프에 노드 추가Adding nodes to a shader graph

  • 노드 속성 설정Setting node properties

  • 노드 연결 해제Disconnecting nodes

  • 노드 연결Connecting nodes

기하 도형 기반 그라데이션 셰이더 만들기Creating a geometry-based gradient shader

픽셀의 위치를 셰이더로 통합하여 기하 도형 기반 셰이더를 구현할 수 있습니다.You can implement a geometry-based shader by incorporating the position of the pixel into your shader. 음영 언어에서 픽셀에는 2D 화면의 색상 및 위치 보다 더 많은 정보가 포함되어 있습니다.In shading languages, a pixel contains more information than just its color and location on a 2-D screen. 일부 시스템에서는 조각이라고 하는 픽셀은 픽셀에 해당하는 표면을 설명하는 값의 모음입니다.A pixel—known as a fragment in some systems—is a collection of values that describe the surface that corresponds to a pixel. 이 문서에 설명된 셰이더는 조각의 월드 공간에서 최종 출력 색상에 영향을 미치는 3D 개체의 각 픽셀 높이를 사용합니다.The shader that's described in this document utilizes the height of each pixel of a 3-D object in world space to affect the final output color of the fragment.

시작하기 전에 속성 창과 도구 상자가 표시되는지 확인하세요.Before you begin, make sure that the Properties window and the Toolbox are displayed.

기하 도형 기반 그라데이션 셰이더를 만들려면To create a geometry-based gradient shader

  1. 사용할 DGSL 셰이더를 만듭니다.Create a DGSL shader to work with. DGSL 셰이더를 프로젝트에 추가하는 방법에 대한 내용은 셰이더 디자이너의 시작 섹션을 참조하세요.For information about how to add a DGSL shader to your project, see the Getting Started section in Shader Designer.

  2. 최종 색 노드에서 점 색 노드의 연결을 끊습니다.Disconnect the Point Color node from the Final Color node. 점 색 노드의 RGB 터미널을 선택하고 연결 끊기를 선택합니다.Choose the RGB terminal of the Point Color node, and then choose Break Links. 그러면 다음 단계에서 추가되는 노드에 대한 공간이 생깁니다.This makes room for the node that's added in the next step.

  3. 곱하기 노드를 그래프에 추가합니다.Add a Multiply node to the graph. 도구 상자수학에서 곱하기를 선택하고 디자인 화면으로 이동합니다.In the Toolbox, under Math, select Multiply and move it to the design surface.

  4. 마스크 벡터 노드를 그래프에 추가합니다.Add a Mask Vector node to the graph. 도구 상자유틸리티에서 마스크 벡터를 선택하고 디자인 화면으로 이동합니다.In the Toolbox, under Utility, select Mask Vector and move it to the design surface.

  5. 마스크 벡터 노드에 대한 마스크 값을 지정합니다.Specify mask values for the Mask Vector node. 선택 모드에서 마스크 벡터 노드를 선택하고 속성 창에서 녹색 / Y 속성을 True로 설정하고 빨간색 / X, 파란색 / Z알파 / W 속성을 False로 설정합니다.In Select mode, select the Mask Vector node, and then in the Properties window, set the Green / Y property to True, and then set the Red / X, Blue / Z and Alpha / W properties to False. 이 예제에서 빨간색 / X, 녹색 / Y파란색 / Z 속성은 세계 좌표 위치 노드의 x, y, z 구성 요소에 해당하며 알파 / W는 사용하지 않습니다.In this example, the Red / X, Green / Y, and Blue / Z properties correspond to the x, y, and z components of the World Position node, and Alpha / W is unused. 녹색 / YTrue로 설정했기 때문에 마스킹한 후 입력 벡터의 y 구성 요소만 유지됩니다.Because only Green / Y is set to True, only the y component of the input vector remains after it is masked.

  6. 세계 좌표 위치 노드를 그래프에 추가합니다.Add a World Position node to the graph. 도구 상자상수에서 세계 좌표 위치를 선택하고 디자인 화면으로 이동합니다.In the Toolbox, under Constants, select World Position and move it to the design surface.

  7. 조각의 세계 좌표 위치를 마스크합니다.Mask the world space position of the fragment. 선택 모드에서 세계 좌표 위치 노드의 출력 터미널을 마스크 벡터 노드의 벡터 터미널로 이동합니다.In Select mode, move the Output terminal of the World Position node to the Vector terminal of the Mask Vector node. 이 연결은 x 및 z 구성 요소를 무시할 조각의 위치를 마스크합니다.This connection masks the position of the fragment to ignore the x and z components.

  8. RGB 색 상수에 마스크된 세계 좌표 위치를 곱합니다.Multiply the RGB color constant by the masked world space position. 점 색 노드의 RGB 터미널을 곱하기 노드의 Y 터미널로 이동한 다음 마스크 벡터 노드의 출력 터미널을 곱하기 노드의 X 터미널로 이동합니다.Move the RGB terminal of the Point Color node to the Y terminal of the Multiply node, and then move the Output terminal of the Mask Vector node to the X terminal of the Multiply node. 이 연결은 세계 좌표 위치에서 픽셀의 높이로 색상 값의 배율을 조정합니다.This connection scales the color value by the height of the pixel in world space.

  9. 비율 크기가 조정된 색 값을 최종 색에 연결합니다.Connect the scaled color value to the final color. 곱하기 노드의 출력 터미널을 최종 색 노드의 RGB 터미널로 이동합니다.Move the Output terminal of the Multiply node to the RGB terminal of the Final Color node.

    다음 그림은 구에 적용된 셰이더의 완료된 셰이더 그래프 및 미리 보기를 보여 줍니다.The following illustration shows the completed shader graph and a preview of the shader applied to a sphere.

참고

이 그림에서 주황색은 셰이더의 효과를 더 잘 보여 주기 위해 지정되었지만, 미리 보기 도형은 세계 좌표 위치에서 위치가 없으므로 셰이더 디자이너에서 셰이더를 완전히 미리 볼 수 없습니다.In this illustration, an orange color is specified to better demonstrate the effect of the shader, but because the preview shape has no position in world-space, the shader cannot be fully previewed in the Shader Designer. 전체 효과를 보여 주려면 실제 장면에서 셰이더를 미리 봐야 합니다.The shader must be previewed in a real scene to demonstrate the full effect.

셰이더 그래프 및 효과 미리 보기Shader graph and a preview of its effect

일부 셰이더의 경우 특정 도형을 사용하면 미리 보기가 더 잘 표시될 수 있습니다.Certain shapes might provide better previews for some shaders. 셰이더 디자이너에서 셰이더를 미리 보는 방법에 대한 자세한 내용은 셰이더 디자이너셰이더 미리 보기를 참조하세요.For information about how to preview shaders in the Shader Designer, see Previewing shaders in Shader Designer

다음 그림은 방법: 3D 지형 모델 만들기에서 설명하는 3D 모델에 적용되는 이 문서에서 설명된 셰이더를 보여 줍니다.The following illustration shows the shader that's described in this document applied to the 3-D scene that's demonstrated in How to: Model 3-D Terrain. 세계 좌표 위치에서 점의 높이와 함께 색의 농도가 증가합니다.The intensity of the color increases with the height of the point in the world.

3D 지형 모델에 적용된 그라데이션 효과Gradient effect applied to a 3-D terrain model

3D 모델에 셰이더를 적용하는 방법에 대한 자세한 내용은 방법: 3D 모델에 셰이더 적용을 참조하세요.For more information about how to apply a shader to a 3-D model, see How to: Apply a Shader to a 3-D Model.

참고 항목See Also

방법: 3D 모델에 셰이더 적용 How to: Apply a Shader to a 3-D Model
방법: 셰이더 내보내기 How to: Export a Shader
방법: 3D 지형 모델 만들기 How to: Model 3-D Terrain
방법: 회색조 질감 셰이더 만들기 How to: Create a Grayscale Texture Shader
셰이더 디자이너 Shader Designer
셰이더 디자이너 노드Shader Designer Nodes