[Tutorial] Cloaking Effect 2장 : Refraction 효과

 

이전에 Dissolve이펙트를 통해 메쉬를 제거했다면 이번엔 제거 이후 Refraction(굴절)이펙트를 만들어 투명효과를 표현해보겠습니다.

 

---

2개 SK Mesh 만들기

직접 쉐이더를 작성하지 않는 이상 언리얼4에서 2Pass를 구현하지 못합니다, 그래서 직접 SKeletalMesh를 한개더 생성합니다.

 

AThirdPersonCharacter.h

private:
UPROPERTY(VisibleAnywhere, BlueprintReadOnly, Category = Camera, meta = (AllowPrivateAccess = "true"))
		class USkeletalMeshComponent* m_p2PassMesh;

 

AThirdPersonCharacter.cpp

ACloakingTutorialCharacter::ACloakingTutorialCharacter()
{
	m_p2PassMesh = CreateDefaultSubobject<USkeletalMeshComponent>(TEXT("2PassMesh"));
	m_p2PassMesh->SetupAttachment(GetMesh());
	m_p2PassMesh->SetCollisionEnabled(ECollisionEnabled::NoCollision);
	m_p2PassMesh->CastShadow = false;
 

저는 C++ 코드에 직접 코드를 추가했습니다.

 

새로 추가한 SKMesh도 원본과 똑같이 애니메이션이 돌아가도록 원본에서 세팅된 Anmiation세팅과 동일하게 합니다.

(AnimBP만 세팅하면 됩니다.)

 

 

새로 마테리얼을 생성한 후 위 처럼 디테일 옵션을 설정후에 우측과 같이 노드를 작성합니다.

 

그 결과 위 처럼 문제가 생긴 결과를 확인 할 수 있습니다, 이는 똑같이 메쉬가 겹쳐있다보니 렌더링 순서가 잘못된 결과입니다, 이 문제를 다음장에서 해결해 보겠습니다.

 

 

 

---

메쉬 겹침 문제 해결하기

이를 해결하기 위해서는 렌더 순서를 변경하거나 굴절 쉐이더 오브젝트를 작게 만들어야합니다, 렌더 순서는 노드 에디터로 건들 수 없음으로 오브젝트를 작게 만들어야하는데, 그냥 Scale을 줄이는게 아닌 위 참고 사진 처럼 버텍스의 로컬 노말 방향대로 줄여야합니다.

 

 

월드 포지션 오프셋은 버텍스 위치를 조절할 수 있는 핀입니다, 그리고 VertexNormalWS노드는 로컬 버텍스 노말 방향을 출력하는 노드로 해당 값에 Offset값을 곱하여 포지션을 설정하면 의도한대로 노말방향대로 확대 축소가 가능합니다.

 

 

좌측과 같이 버텍스 노멀 방향대로 확대 축소한 모습을 확인할 수 있고 우측은 버텍스노말을 살짝 줄여서 불투명 마테리얼이 먼저 출력되게 만든 모습을 확인 할 수 있습니다.

 

 

 

 

---

연출 구현 : 소개, 마스킹 구현

투명화 되는것을 더욱 멋있게 연출하기 위해 위와 같이 설계했습니다,

 

 

이전 Dissolve이펙트 구현때와 비슷한 마스킹을 만들었습니다, 하지만 이번엔 다른 방법으로 구현했습니다.

 

마스킹용 텍스처를 제작해서 해당 텍스처의 UV를 조작해서 마스킹을 구현했습니다.

위 패턴마다 길이, 강도를 조절하므로 채널별로 나눴습니다.

T_Gradient.tga

0.01MB

 

MF_GetObjectBoundSize는 이전 포스팅에서 만든 Material Function입니다, 월드 좌표 기준으로 UV를 값을 가져올 수 있습니다, 이 함수를 이용해서 UV 타일링, 오프셋을 제작했습니다.

 

이 마스킹정보를 이용해서 Hex Emissive, Hex Normal, 굴절강도를 조절하겠습니다.

 

 

---

연출 구현 : Refraction 강도 조절

우선 오파시티 값을 0으로 만듭니다, 리프렉션값이 오파시티가 투명해야 잘보입니다.

 

이전에 만든 마스크 노드를 따로 뒤로 뺐습니다.

 

리프랙션 효과는 1 값이면 굴절이 없고 1에서 멀어지면 굴절이 됩니다.

 

위와 같은 노이즈 텍스처를 이용해 리프랙션을 구현하겠습니다.

 

위와 같이 노드를 구현하고 우측에 Lerp의 Alpha는 이전에 만든 마스크 노드에서 R채널 값을 가져왔습니다,

마스크에서 1에 가까우면 굴절강도를 강하게 만들고 0이면 굴절을 약하게 구현했습니다.

 

결과 화면입니다.

 

 

 

---

연출 구현 : Hex 노멀맵 추가

노멀맵은 언리얼4 StarterContent에 들어있는 "T_Tech_Hex_Tile_N"를 사용했습니다.

 

노드는 위와 같습니다, 텍스처 UV에 육각패턴을 촘촘하게 하기 위해 15x만큼 타일링을 했고 R, G채널을 뽑아서 노멀 강도를 조정 가능하게 만들었습니다,

이후 이 데이터를 Lerp노드에 넣고 Alpha값은 이전 마스크 데이터의 R채널을 이용했습니다, 위 Lerp값은 노멀 핀으로 연결합니다.

 

결과 화면입니다.

 

 

 

---

연출 구현 : Hex Emissive추가

Emissive맵도 StarterContent에 있는 텍스처를 활용했습니다.

 

이번엔 마스크 G채널을 받아서 마스킹했습니다, G채널은 R채널보다 짧고 강도가 약합니다.

 

처음에 의도한대로 푸른 Hex패턴 -> 노멀 Hex패턴 순으로 보이고 굴절강도 조절도 됩니다.

 

 

추가+

추가로 Opacity에 Fresnel효과를 추가해봤습니다.

 

 

 

---

Refraction효과를 다 구현했습니다, 다음 포스팅으로 이전에 만든 Dissolve효과와 이번에 만든 Refraction효과를 실제로 적용하고 C++코드로 기능을 작동하는 주제로 다뤄보겠습니다.