UDN
Search public documentation:

MaterialMasksKR
English Translation
日本語訳
中国翻译

Interested in the Unreal Engine?
Visit the Unreal Technology site.

Looking for jobs and company info?
Check out the Epic games site.

Questions about support via UDN?
Contact the UDN Staff

UE3 홈 > 머티리얼과 텍스처 > 머티리얼 마스크

머티리얼 마스크


문서 변경내역: David Green 원저. 홍성진 번역.

개요


이 튜토리얼에서는 텍스처가 아닌 머티리얼 표현식을 사용하여 마스크, 에지(선분), 그레디언트(색이 부드럽게 변하는 모양)를 만드는 방법에 대해 다뤄 보겠습니다.

텍스처를 사용하면 여러가지 모양의 마스크를 사용할 수 있다던가 머티리얼 인스트럭션 수도 적다든가 하는 장점이 있기는 하지만, 알고리즘적으로 디자인된 표현식 마스크 역시도 나름의 장점이 있습니다.
알고리즘적으로 디자인된 표현식 마스크의 장점은: 텍스처가 없어 패키지 크기가 더 작고, 언리얼 에디터에서 마스크 모양을 빠르게 변경할 수 있으며, 패너 / 로테이터 / 사인 / 타임 등의 다양한 머티리얼 표현식을 사용하여 움직이는 마스크도 가능한 데다, 여러가지 마스크 프로퍼티를 키즈멧으로 조절할 수도 있습니다.

이러한 알고리즘적 마스크를 표준 텍스처-기반 머티리얼에 사용할 수도 있는데, 그렇게 하면 불투명/투명 마스크를 내기도 하고, 텍스처의 일정한 영역에 마스크를 덮어 스페큘러나 스페큘러 파워(빛의 반사로 인한 광택 모양이나 세기)를 바꾸기도 하며, 여러 개의 텍스처를 섞기 위한 LinearInterpolate (선형 보간) 표현식의 마스크로 쓰기도 하는데다, 심지어 이펙트용 그레디언트 컬러 세트로 쓰이는 머티리얼을 만들 수도 있습니다.

기본 빌딩 블록


알고리즘적 마스크는 다양한 빌딩 블록을 조금 모은 세트로 구성한 것입니다. 머티리얼 표현식의 이미지를 포함하여 이들 각각에 대해 자세히 설명하도록 하겠습니다.

마스크의 메인 소스는 기본적인 회색조 그레디언트를 내기 위해 연결된 DotProduct 표현식을 사용하여 만들었습니다.
DotProduct 표현식은 "채널" 수가 같은 인풋을 둘 필요로 하는데, 우리의 경우 인풋별로 두 채널씩으로, TexCoord 에서 U 와 V, Constant2Vector 에서 R 과 G 를 내어주고 있습니다.
DotProduct 연산은 이 값 세트 둘을 받은 다음 스칼라량을 반환하는데, 이는 적절한 인풋 값을 사용했을 때 그레디언트를 닮은 연속된 값을 생성합니다.

DotProduct 의 A 노드에 연결된 TexCoord 표현식은 UV 값 1.0 을 디폴트로 삼는데, B 노드 값 0 과 1 을 섞을 때 부드러운 그레디언트가 나오는 것입니다.

GradientSource.gif

TexCoord UV 값을 바꾸면 그레디언트가 바뀝니다만, 그 작업에는 B 노드에 연결된 Constant2Vector 표현식 값을 바꾸는 편이 낫습니다.

GradientSourceU2.gif

DotProduct 의 B 노드에 연결된 Constant2Vector 표현식은 스칼라량을 계산하는 데 사용된 값의 둘째 쌍을 줍니다. 0 에서 1 사이의 값을 사용하여, DotProduct 표현식은 0 에서 1 사이의 회색 값으로 된 그레디언트를 내어 주는 것입니다.
Constant2Vector 값을 R=0 G=1 로 설정하면 세로 그레디언트가 만들어 집니다. R=1 G=0 이 되면 가로 그레디언트 입니다. R=1 G=1 은 대각선 이고요. -1 을 사용하면 또다른 변종을 만들 수도 있지만, 그리 쓸모는 없습니다.

GradientDirections.gif

Materials 에는, 0.0 값이 검정이며 1.0 값이 하양입니다. 1.0 보다 크면 색을 블룸으로 "밀어"(push)줍니다. 이런 기능을 알고리즘적 마스크에 어떻게 활용할 수 있냐면, 단색(solid)과 그레디언트 비율을 변경하여 색이 변화하는 부분을 짧게 만들거나, 부드러운 페더 그레디언트 에지 효과를 낼 수도 있습니다.
Constant2Vector 의 RG 프로퍼티 중 하나를 1 보다 큰 값으로 설정하면 그레디언트 양의 범위가 검정에서 하양쪽으로 바뀌어, 그레디언트 비율이 줄고 하양 비율이 늘어납니다. 아웃풋에 ConstantClamp (상수 제한) 표현식을 추가하면 범위를 0 에서 1 로 제한시킬 수도 있습니다.

GradientMultiplier.gif

에지가 그레디언트가 아닌 단색 마스크를 만들기 위해서는, Subtract 표현식을 사용하여 단색 검정 부분의 양을 설정하고, Multiply 표현식을 사용하여 아웃풋이 단색 검정에서 하양으로 전환되도록 하고 있습니다.

SolidEdge.gif

전부 묶어서


다수의 빌딩 블록을 합쳐서, 폭넓은 다양성의 마스크와 그레디언트 스타일을 만들 수 있습니다. 다음 예제 알고리즘적 마스크 머티리얼은 그저 빙산의 일각일 뿐입니다.

이 알고리즘적 마스크 머티리얼에 사용된 표현식 다수는 ScalarParameter 나 VectorParameter 표현식을 통해 머티리얼 인스턴싱이나 키즈멧 제어가 가능하다는 점, 참고하시기 바랍니다.
Panner, Rotator, Sine, Time 등의 머티리얼 표현식으로 값을 애니메이트시킬 수도 있습니다.

가로 그레디언트

GradHorz01Thumb.gif

GradHorz01.gif

가로 그레디언트

GradHorz02Thumb.gif

GradHorz02.gif

가로 그레디언트 50% 푸시

GradHorzPush01Thumb.gif

GradHorzPush01.gif

세로 그레디언트

GradVert01Thumb.gif

GradVert01.gif

세로 그레디언트

GradVert02Thumb.gif

GradVert02.gif

대각 그레디언트

GradAngle01Thumb.gif

GradAngle01.gif

대각 그레디언트

GradAngle02Thumb.gif

GradAngle02.gif

컬러 그레디언트

GradColor01Thumb.gif

GradColor01.gif

컬러 페더 그레디언트

GradColorFeather01Thumb.gif

GradColorFeather01.gif

컬러 멀티밴드 그레디언트

GradColorMulti01Thumb.gif

GradColorMulti01.gif

세 지점 그레디언트

GradThreePoint01Thumb.gif

GradThreePoint01.gif

위 단색

SolidTop01Thumb.gif

SolidTop01.gif

아래 단색

SolidBottom01Thumb.gif

SolidBottom01.gif

왼쪽 단색

SolidLeft01Thumb.gif

SolidLeft01.gif

오른쪽 단색

SolidRight01Thumb.gif

SolidRight01.gif

테두리 단색

SolidBorder01Thumb.gif

SolidBorder01.gif

예제 애니메이트 마스크


이 예제 머티리얼 구성은 옆에서 옆으로 쓸고 지나가는 단색 마스크 모양을 냅니다. 마스크 백분율 Constant 는 Sine 표현식으로 대체되었는데, 마스크에 0 에서 1 로 쓸어가는 백분율 값을 주기 위해서입니다.

SweepingMask.gif