【UE5】거품 재질???? 만드는 법

거품 효과는 거의 머티리얼로 완결되기 때문에, 최근에 만들어 본 이 제작 방법을 소개합니다! DOF를 적용해서 조금 치트 같은 느낌은 있지만, 이런 그림을 억지로 만들 수도 있을 것 같아요.

????참조

원래는 이 영상이 X에서 흘러와서, 세련되고 좋다고 생각해 만들기 시작했습니다. https://x.com/aftelinagraphic/status/2009587724756615381

???? 머티리얼 내부 내용

Material의 전체 구성은 여기 있지만, 노드 하나하나가 읽을 수 있을 만큼 큰 크기로 이미지에 다 들어가지 않으므로, 요소별로 설명하겠습니다.

### 머티리얼 설정

결과적으로 거의 투명하지 않은 외관이지만, 시행착오 과정에서 투명하게 하거나 굴절을 넣는 실험을 했기 때문에 Blend Mode는 Translucent입니다. Shading Model은 Unlit로 설정했지만, 실제 게임에서 장면의 밝기에 맞추고 싶다면 DefaultLit로 하는 게 좋습니다.

!UE5.6 이전에는 Translucency Pass를 BeforeDOF로 하지 않으면 반투명에 DOF가 적용되지 않아야 했는데, 어쩐지 UE5.7에서는 DOF가 적용됩니다. 왜일까…? 나중에 기분 내키면 GPU Profiler로 렌더링 순서를 조사해 보고 싶습니다.

### 가짜 스페큘러 구성

UE5에 기본으로 포함된 큐브맵을 Reflection Vector로 환경맵처럼 적용하고 있습니다. 보석 예제에서도 소개했는데, 얼음 등에도 사용할 수 있고 편리하죠✨

사용 중인 큐브맵은 여기에 있습니다. /Engine/MapTemplates/Sky/DaylightAmbientCubemap

네트워크가 커지게 되었기 때문에 Named Reroute 노드를 사용하고 있습니다.

### 노멀 맵 구성

노멀 맵은 이렇게 세밀한 요철을 넣거나 강하게 적용하는 건 이번 거품에 맞지 않아서…

부드러운 노멀 맵을 선택하고 타일링도 거칠게 설정했습니다. 또한 타일링 수나 UV 스크롤 속도를 변경한 2개를 섞어 복잡한 물결 모양처럼 보이게 하면서, 영향도도 변경할 수 있도록 파라미터를 추가했습니다.

참고로 노멀 맵도 UE5 표준으로 포함된 것을 사용했습니다. /DatasmithContent/Materials/Water/Textures/TWaterLFN

### 가장자리용 부드러운 노이즈 마스크

노멀 맵과 비슷한 방식으로 타일링 수와 UV 스크롤 속도를 다르게 한 2개를 Add(가산)으로 혼합하고, Power(멱승)로 대비를 준 상태도 별도로 사용하고 있습니다. 하단의 텍스처에서 오른쪽으로 끌려가는 선은 WPO로 메쉬를 변형하는 데 사용하고 있습니다.

텍스처는 Material Maker의 Shard FBM 노드(참조)를 그대로 출력한 정도의 간단한 것을 사용하고 있습니다.

사용 중인 노드에서 미리보기하면 다음과 같습니다.

### WPO에서의 변형용 구성

이전의 부드러운 마스크 구성을 이용해 메쉬를 법선 방향으로 포함시키고 있습니다.

변형 부분만 미리보기하면 이런 느낌입니다. 강하게 변형시키면 구체 모델의 「극」 부분에서 깨지기 때문에, 강하게 넣고 싶다면 극 부분에 변형의 페이드를 넣는 등工夫가 필요할 것 같습니다.

### 윤곽을 강조한 에지 + 노이즈 마스크

구체 모델을 전제로 한 머티리얼이므로, Fresnel과 SmoothStep을 기반으로 윤곽의 그라데이션을 만들고 있습니다. 거기에 앞서 말한 부드러운 마스크 구성을 겹치면서, 목표하는 외관이 되도록 Add / Multiply / Power로 다양하게 섞거나 콘트라스트를 조정하며 구성해 골치 아픈 상태가 된 것뿐입니다. 이 구성으로 해야만 하는 것은 아닙니다.

상단의 SmoothStep은 중앙에 검은 영역을 만들고 있고, 하단의 SmoothStep으로 하얗게 솟은 에지를 만들고 있습니다. 우상단의 Multiply 부분에서 결과를 미리 본 것이 이것입니다.

### Opacity 용으로 조정

이전 구성에 Add로 0.7을 더해 전체적으로 색상을 밝게 보정하고 Opacity에 연결했기 때문에, 결과적으로 거의 불투명에 가까운 모습이 됩니다.

Opacity가 어떤 느낌인지 미리보기한 결과는 다음과 같습니다.

### 내부 색상

「강화된 윤곽 에지 + 노이즈 마스크」を Lerp의 Alpha로 사용해 구체 내부 색상과 에지 색상을 마스크로 분리해 착색하고 있습니다. 그 내부 색상은 이런 식으로 Fresnel의 외곽을 어두운 청색으로 낮추고 중심으로 갈수록 밝은 색상이 되도록 하고 있습니다. 프리뷰는 이런 느낌입니다. 텍스처는鸣潮의 십자광을 재현하기 위해 대충 만든 것입니다..

### 가장자리 내부의 색상

「윤곽을 강조한 에지 + 노이즈 마스크」로 마스크 분리한 외곽의 색은 이런 느낌입니다. 2장의 텍스처를 UV 스크롤해서 Add로 겹쳐놓은 것뿐입니다. Make Vector 3로 황색 성분을 뽑아낸 게 약간의工夫입니다.

텍스처는 평소처럼 「フリー素材 ぱくたそ」さん에서 가져왔습니다. 빨간 포인트 컬러와 청색 계열 색상을 넣고 싶었기 때문에 그에 맞는 것을 선택했습니다. 개인 제작용이므로 시임리스 가공 등 아무것도 하지 않고 그대로 콘텐츠 브라우저에 넣어 사용하고 있습니다.https://www.pakutaso.com/20200514129post-27432.htmlhttps://www.pakutaso.com/20230746191post-47726.html

미리보기하면 이런 느낌입니다.

### Emissive Color 용으로 합체

가짜 Specular에 대해 Power로 대비를 강하게 해서 하이라이트 부분이 떠오르게 하고 Multiply로 50만큼 높은 밝기를 부여했습니다. 이는 하이라이트가 특히 DOF를 적용한 상태에서 아름답게 Bloom이 들어가 반짝반짝 빛나도록 조정한 것입니다. 또한, 거기에 앞서 언급한 구체 내부 색상과 에지 색상을 겹쳐서 EyeAdaptationInverse로 노출을 보정하여 완성✨

????여담: 굴절과 DOF가 궁합이 안 맞나?

원래는 굴절의 구성도 이런 식으로 만들고 있었는데…

PostProcessVolume의 Depth of Field 항목 내 Focal Distance에 값을 입력하면 굴절 효과가 상당히 변해버립니다.

Focal Distance에 값을 입력하지 않을 경우 이런 느낌입니다.

그래서 굴절 효과를 포기했습니다. 이에 대한 대처 방법이 있을까요?

 

 



 

 

 

 

에반 언리얼5 이펙트 그룹과정[26년초 시작] : https://cafe.naver.com/unrealfx/20727

KUPAFX Stylized 유니티 이펙트 취업과정 : https://cafe.naver.com/unrealfx/21249

트리키 언리얼+후디니 활용 게임 VFX 연출과정 : https://cafe.naver.com/unrealfx/25629

 

max님의 쌩기초 메쉬활용 이펙트과정 1달특강 : https://cafe.naver.com/unrealfx/24469

eVan텍스쳐 단품과정 : https://cafe.naver.com/unrealfx/24468

rak 유니티 UI연출이펙트 : https://gamefx.co.kr/bbs/page.php?hid=Rak_intro