다음과 같은 효과를 만들어 보자
먼저 Package Manager에서 Universal RP를 설치한다.
Project Window에서 Create > Rendering > Universal Render Pipeline > Pipe Line Asset을 생성한다.
PipelineAsset과 PipelineAsset_Render이 생성된다.
PipelineAsset을 눌러보면 Renderer List에 PipelineAsset_Render가 ForwardRendererData로 들어가 있다.
3D Grahpics에 사용되는 Renderer이기 때문에 지워주고 2D Renderer를 생성하자
Create > Rendering > Universal Render Pipeline > 2D Renderer
이렇게 생성된 Renderer는 PipelineAsset의 Renderer List에 넣어준다.
이제 프로젝트에 Render Pipeline을 적용하면 된다.
ProjectSettings > Graphics > Scriptable Render Pipeline Settings에 위에서 만든 Pipeline을 넣어준다.
2D Shader를 사용하기 위한 설정은 끝났고,
실제 사용할 쉐이더를 만든다.
Create > Shader > 2D Renderer에서 2D Light를 사용하지 않으므로 Sprite Unlit Graph를 생성한다.
이렇게 생성한 쉐이더에 오른쪽 클릭으로 Material을 생성한다.
Material의 Shader는 자동으로 앞에서 생성한 2D 쉐이더가 들어간다.
본격적으로 쉐이더 그래프를 작성해보자
1) 기본적인 Texture Rendering
가장 먼저 Texture2D MainTex를 생성하고,
Sample Texture 2D를 통해 Texture를 RGBA로 변환하여 Sprite의 Color로 넣어준다.
2) 노이즈 생성
Simple Noise를 생성하고, Texture의 Alpha와 Multiply해주어 Texture 영역만 노이즈를 적용한다.
그리고 Combine을 이용해 Texture의 RGB와 Multiply 결과물의 Alpha를 결합한다.
3) 노이즈 영역 마스킹
스프라이트 위에 생기는 노이즈영역만 그려주게 해보자
Simple Noise의 Out을 Step Node의 Edge에 연결하고, Vector1(Fade)을 추가하여 In에 넣어준다.
Vector1의 값보다 작은(어두운) 영역만 그려진다.
중간 결과
세로로 갈라지는 듯한 느낌이 든다.
자연스러운 모양을 내기 위해 Simple Noise에 들어가는 UV에 다른 좌표계를 입력한다.
Position을 생성하여 Object Space로 UV에 넣어준다.
그리고 노이즈의 크기 조절을 위해 Vector1(Scale)을 하나 추가하여 Scale에 넣어준다.
4) Glow 효과 넣기
좀 더 멋있게 테두리 효과를 넣어보자
Sprite위에 그려지는 Noise의 외곽선을 따서 색깔을 입혀주면 된다.
4-1) Subtract로 앞서 만든 Step Node에 들어가는 Fade value보다 아주 조금 작은 값을 만든다.
4-2) 새로운 Step Node를 만들어서 이전과 동일한 Simple Noise를 Edge로 받고, Subtract 값을 In에 넣어준다.
4-3) 처음 Step Node에서 방금 만든 Step Node를 Subtract하면 테두리가 나온다.
4-4) 기존 Out과 Add한다.
5) Sprite Alpha 적용
마지막으로 Sprite의 Alpha값을 받아 외곽선이 Sprite가 그려지는 영역에만 나타나도록 해보자
기존 Alpha값을 그대로 앞서 만든 외곽선과 Multiply해서 넣어준다.
처음 사용해본 Shader Graph인데 생각보다 간단하고, 보기 좋은 효과를 쉽게 만들 수 있을 것 같다.
참고 1) Get started with 2D Shader Graph in Unity - Dissolve Tutorial - https://www.youtube.com/watch?v=5dzGj9k8Qy8
참고 2) Unity Doc Shader Graph | 6.9.2 - https://docs.unity3d.com/Packages/com.unity.shadergraph@6.9/manual/index.html