비 내리는 모습 첫 번째
게임에서 비에 대해서 여러 가지 표현방식이 존재한다.
실제로 비가 내리는 듯하게 파티클을 이용하여 월드나 레벨에 뿌려주는 방법, 카메라 렌즈에 비가 내리는 2D 이미지를 흘려주는 방법 등이 존재한다. 그리고 이번에는 Screen의 UV를 이용하여 렌즈에 빗물이 맺혀 있는 효과를 내보고자 한다.
비가 내리는 효과의 특징을 찾아보자.
하단에 첨부한 이미지는 비가 오는 날, 창문에 물방울이 맺혀 그 부분이 왜곡되어 보인다. 사실 이 효과는 인간의 눈으로는 확인하는 것이 불가능하지만, 우리는 영상매체나 현실에서 이런 광경들을 자주 접하여 이런 이미지나 현상만 보아도 '아! 비 오는 날이구나' 식으로 인지하게 된다.
화면(스크린) 또한 Texture를 샘플링 할 때와 같이 UV를 가지게 된다. 그리고 이 UV는 숫자로 표현할 수 있고, 이 숫자에 값을 변경해줌으로써 왜곡을 만들어 낼 수 있다.
왜곡을 만들어 내는 값을 아티스트가 가장 쉽고 직관적으로 얻을 수 있는 방법이 바로 Texture를 이용하는 것인데, Texture를 구성하는 데이터(RGBA) 또한 숫자이기 때문이다.
간단하게 Normal 맵을 이용하여 표현하면 이렇다.
애니메이션을 넣어보자.
이제 남은 것은 이 왜곡시키는 값을 실시간으로 변하도록 만든다.
몇 가지 효과를 더 붙여서 완성하게 되면 이런 노드가 된다.
이 노드를 설명하기 전에 우선 이 효과를 만드는 데 사용한 Texture를 각 채널별로 설명하면 좋을 것 같다.
- RG 채널 : 화면의 UV에 직접적으로 왜곡을 주려고 한다.
- B 채널 : 물방울이 맺혀서 왜곡되는 현상에 불규칙성과 움직임을 표현하고자 한다.
- Alpha 채널 : 멈춰있을 물방울과, 움직일 물방울을 검은색(0), 흰색(1)로 표현한다.
이 효과를 얻기 위해 사용한 Texture를 보면 이렇다.
B 채널을 자세히 보면, Time 함수로 나누어, 나머지 값을 얻는데, 이렇게 하면 하단에 첨부한 GIF 이미지와 같은 효과를 얻을 수 있다.
Alpha 채널 또한 하단의 이미지와 같은 결과를 얻기 위하여 가공되어 있다.
카메라의 렌즈와 같은 효과를 얻기 위하여 Post-Processing으로 적용해 주면 전체 화면에서 얻을 수 있고, 그냥 이미지로 이용하면 창문 같은 배경 오브젝트로 이용할 수 있다.
다음번에는 흐르는 창문에 빗방울이 흐르는 것을 추가해 보자.
2/2 글 링크 : https://asatala.tistory.com/129
'Unity > Rendering&Shader' 카테고리의 다른 글
| [SHADER] UV Vertex Animation (0) | 2024.01.10 |
|---|---|
| [RENDERING] Screen Pos UV (0) | 2024.01.09 |
| [SHADER] 2D Pixel Automatically create outline color (0) | 2023.11.21 |
| [SHADER LAB] Shader Model Features (0) | 2023.11.21 |
| [RENDERING][TEST] Rendering layer (0) | 2023.11.12 |