【UE5】래디얼 블러를 구현하자! -Niagara 편-

????소개

두 번째 이전 글에서 라디얼 블러를 만들었습니다. 

그리고 지난번에는, 만든 라디얼 블러를 자작 작품에組み込むために, 시퀀서를 사용하는 방법에 대해 썼습니다. 

이번에는 시퀀서를 사용하지 않고 Niagara에 직접 블러를組み込む 방법에 대해 작성합니다.

!환경은 UE 5.7입니다. 순전히 자작 제작에 포함할 목적으로, 실제 게임 개발에서 쓸 수 있는 방법인지 의심스럽습니다. 실제 개발에서는 프로그래머에게 상담하세요????

???? 머티리얼 파라미터 컬렉션 준비

시퀀서를 사용하는 것과 마찬가지로, 포스트 프로세싱의 값을 Material Parameter Collection을 통해 애니메이션화해야 하므로, 이전 글을 참고해 준비하세요. 완전히 동일한 절차로 OK입니다.

???? 폭발 텍스처 준비

폭발이 아니어도 상관없지만, 블러를 적용할 대상으로 폭발 텍스처를 사용해 보았습니다. 이는 Unity 공식 자료로 CC0 라이선스이므로 빌려 사용하고 있습니다. https://unity.com/ja/blog/engine-platform/free-vfx-image-sequences-flipbooks

다양한 텍스처를 DL할 수 있지만, 이번에는 「爆発02」を 사용했습니다. DL한 후 콘텐츠 브라우저에 넣어두세요.

???? 머티리얼을 준비하세요

콘텐츠 브라우저에서 새로 머티리얼을 생성하고 텍스처를 그래프 내부로 넣습니다. 머티리얼의 기본 설정은 아래와 같이 설정했습니다.

- Blend Mode　 ：TranslucentGrayTransmittance（반투명）

- Shading Model：Unlit（라이팅을 받지 않음）

나머지는 이미지처럼 노드를 구성하세요.

- Particle Color는 Niagara에서 색상을 부여하기 위해

- Depth Fade는 지면에 박히는 모습을 완화하기 위해 (소프트 파티클)

Scalar Parameter ”Fade Distance”는 돌출을 완화하는 페이드의 폭을 지정합니다.

!マテリアルのことは何もわからん！という人は、こちらを読んでみてください????https://zenn.dev/kurie/books/b9d72e741d2db6

????Niagara에 통합하기

텍스처와 머티리얼이 준비되었습니다! 그럼 Niagara에서 이펙트에 블러를 적용해 보겠습니다.

????Niagara System을 생성합니다

콘텐츠 브라우저에서 새 Niagara System을 만듭니다.

그러면 템플릿을 선택하는 대화상자가 표시되므로, 빈 상태로 만듭니다.

????시스템 설정하기

빈 상태로 만들었기 때문에 아직 에미터가 없는 상태입니다. System을 선택하세요.

폭발을 「1회만 재생하고 끝나는」 효과로 만들기 위해 Loop Behavior를 Once로, Loop Duration으로 재생 시간을 1.5초 정도로 설정했습니다.

????폭발 에미터 추가

에미터를 만듭니다. 이것도 최소한의 구성 상태로 최소한의 설정을 하는 것이 더 이해하기 쉽다고 생각하므로, 오른쪽 클릭해서 Add mini.mal emitter로 컴팩트한 에미터를 하나 만듭니다.

먼저 Sprite Renderer에서 폭발 재질을 설정하고, 사용하는 폭발 텍스처가 Flipbook이므로 Sub Image Size에서 가로와 세로 분할 수를 지정합니다.

파티클이 아직 하나도 생성되지 않았으므로, Emitter Update 그룹의 「+」 버튼에서 Spawn Burst Instantaneous를 추가하세요. 기본 설정으로 파티클 1개만 생성합니다.

파티클의 기본 설정을 위해 Initialize Particle 모듈을 선택하고, Lifetime(수명)을 1초로 설정하고, 표시 위치(Position Offset)를 약간 위로 이동시키며, 크기(Sprite Size)를 크게 합니다.

폭발이 표시되지만, Flipbook 애니메이션이 적용되지 않은 상태이므로 Particle Update 그룹의 「+」 버튼에서 Sub UVAnimation 모듈을 추가하고, 경고를 해소하기 위해 Sprite Renderer를 선택합니다.

이제 폭발이 재생됩니다✨

다만, 엉덩이가 갑자기 사라지므로 페이드아웃을 넣기 위해 Scale Color 모듈을 추가하고, 커브 애니메이션을 설정하기 위해 Scale Alpha 오른쪽 끝 풀다운에서 Float from Curve로 변경합니다.

중간에 키를 눌러 그림처럼 페이드아웃을 넣으세요.

이로써 폭발 에미터가 완성되었습니다✨

???? 블러 에미터 추가

폭발 에미터와 마찬가지로 Add mini.mal emitter로 추가합니다.

Emitter State에서 Life Cycle Mode를 Self로 하고 Loop Behavior를 Once로 설정하여 1회만 재생되도록 합니다. 추가로 Loop Duration도 0.5로 설정하여 재생 시간을 짧게 합니다.

폭발 에미터와 마찬가지로 Spawn Burst Instantaneous를 추가하여 1개만 생성합니다.

Initialize Particle 모듈에서 파티클의 수명을 0.5로 설정합니다. 에미터의 생존 시간과 함께 종료되도록 값을 맞췄습니다.

이번에 블러의 강도를 애니메이션화하는 것은 에미터의 Loop Duration에 의존하게 되므로, Emitter의 Loop Duration을 변경할 때마다 Particle의 Lifetime을 변경하는 것은 번거롭습니다. 따라서 [Emitter] CurrentLoopDuration을 참조하도록 하면 편리합니다.

여기 포인트인데, Renderer 그룹의 Sprite Renderer는 삭제하고, 대신 Component Renderer를 추가합니다. 파티클이 아닌 다양한 것을 다룰 수 있는 만능 타입입니다. 이걸로 포스트 프로세싱까지 추가할 수 있습니다.

Component Type 드롭다운에서 PostProcessComponent를 선택하세요. 그러면 경고가 표시되며, 파티클이 사라져도 포스트 프로세스 효과가 계속 남아 있을 수 있다는 주의가 나오지만, 자율 제작용이므로 신경 쓰지 않아도 OK!

자, 포스트 프로세스 액터와 동일한 항목이 많이 표시되어 있으므로, Post Process Materials에서 블러의 머티리얼을 설정합니다.

그 외에, Priority에서 포스트 프로세싱이 적용되는 우선도를 적당히 높여두는 게 좋을 거예요.

????Radial Blur 모듈을 직접 만드는 법

포스트 프로세스를 설정하는 것만으로는 부족하고, Niagara 내에서 Material Parameter Collection에 값을 넣어 블러의 강도에 애니메이션을 적용하기 위해 모듈을 만듭니다.

Local Modules 패널의 Modules 그룹 오른쪽 끝에 있는 「＋」에서 새 모듈을 추가하여 RadialBlur라고 명명했습니다. 그러면 자동으로 모듈을 편집하는 패널이 열립니다.

!나중에 열고 싶을 때는 Local Modules 패널 내에서 모듈을 더블클릭하거나, 에미터에 이 모듈을 추가해 두었다면 거기서 더블클릭해도 편집 화면으로 이동할 수 있습니다.

먼저, 이 모듈을 Emitter Update 그룹에서 처리할 수 있도록 Module Usage Bitmask의 풀다운에서 Emitter Update Script에 체크를 넣습니다.

이제 그래프 내에서 이 그림처럼 구성하면 되지만, Blueprint에 익숙하지 않으면 어떻게 하면 이 결과가 나오는지 모를 거라 생각해서 계속 설명하겠습니다.

먼저 Map Get 노드의 출력 핀에 있는 「＋」 버튼을 눌러 Material Parameter Collection을 추가합니다. 이 모듈에서 마테리얼 파라미터 컬렉션의 에셋 자체를 설정할 수 있도록 하기 위함입니다.

또한 「＋」 버튼으로 Float를 추가합니다.

이 모듈에서 블러의 강도를 제어하기 위한 매개변수이므로 BlurStrength라는 이름으로 했습니다. 그리고 추가로, 이 Niagara System 자신의 위치를 가져오기 위해 [Engine] [Owner] Position을 추가합니다.

다음으로 Set Scalar Parameter와 Set Vector Parameter의 2개의 노드를 추가합니다. 그리고 이 부분이 초보자 살인자처럼 느껴지는데, MaterialParameterCollection 등 관련 출력 핀에서 마우스 왼쪽 드래그 & 드롭으로 노드 검색을 하지 않으면, 원하는 노드를 찾지 못하는 경우가 있습니다. (내가 다른 방법을 모르는 것일 수도 있지만…)

이런 식으로 실행의 흰색 선을 연결해 두세요.

マテリアルパラメータコレクションのブラーの強さと中心位置の２つのパラメータの名前を図のように入力して、Float 値の出力も繋げておきます。

Position으로 가져오는 것이 Vector3 타입인 것 같아서, 이를 Material Parameter Collection에서 다루기 위해 Vector4로 하지 않으면 제대로 되지 않아서 Convert 노드를 추가합니다.

Position의 입력 핀을 펼쳐 보겠습니다. 그 후, 적절한 Float 값을 주기 위해 입력 핀에 float를 추가합니다.

출력 핀 측에 Vector4를 추가합니다.

XYZW의 입출력을 그림처럼 연결합니다. 이렇게 하면 Vector4가 됩니다. (더 스마트한 방법이 있으면 알려주세요!)

이렇게 하면 Niagara의 원점 좌표를 가져와 Vector4로 Material Parameter Collection의 BlurCenter 파라미터에 전달합니다.

이로써 모듈이 완성되었습니다✨ 잊지 말고 Apply Scratch를 누르세요.

????자작 모듈 사용하기

では Emitter Update 그룹의 「＋」에서 방금 만든 RadialBlur 모듈을 추가합니다.

!검색란에 나타나지 않는다고요! 모듈을 새로 생성한 후 첫 번째 단계인 Module Usage Bitmask 설정을 잊지 않았는지 확인해 보세요.

블러용 Material Parameter Collection 에셋을 슬롯에 설정합니다. 그리고 파라미터 BlurStrength 를 커브 애니메이션으로 제어하고 싶으므로 Float from Curve 로 변경하고, 그림과 같은 커브 애니메이션을 적용해 보세요.

Niagara의 프리뷰에서 블러가 적용되어 있으면 OK입니다✨

!생각 방식으로는, NiagaraSystem에서 폭발 파티클을 생성하면서, 포스트 프로세스 컴포넌트도 생성해 포스트 프로세스 머티리얼을 렌더링하고, 게다가 그 머티리얼의 블러 강도 파라미터를 변경하기 위해 머티리얼 파라미터 컬렉션의 값 자체도 같은 NiagaraSystem에서 변경하고 있습니다…라는 느낌입니다.

????레벨에 놓여 체크!

레벨에 NiagaraSystem을 배치하고, Niagara에서 스페이스키를 여러 번 눌러 폭발을 재생해 보세요. 제대로 폭발 이펙트의 원점 위치를 중심으로 블러가 적용됩니다ね✨

이렇게 해서 3개의 기사에 걸쳐 라디얼 블러의 적용 방법을 설명했습니다.

학생들을 비롯해 작품에 블러를 넣고 싶어도 넣는 방법을 모르는 사람이 많을 것 같아서 기사로 만들고 싶어졌고, 친한 TA 친구와 이것저것 함께 시도하면서 썼는데, 저 자신은 Sequencer도 Niagara도 모르는 게 많아서 더 좋은 방법의 조언 등이 있으면 꼭 알려주세요!

 

 



 

 

 

 

에반 언리얼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