유니티 엔진에서 UV 거리를 통한 파형 구현 과정

저작물 참고 필자도 해당 내용을 공부하고 있는 입장으로 주로 오픈 문서, 포럼, AI 질의 응답을 활용하여 관련 내용을 공부하였습니다. 따라서 틀린 내용이 있을 수 있습니다. 다만, 타인(AI 등)의 저작물을 침해하지 않도록 순서, 과정, 스크린샷, 코드 등 다른 저작물을 활용 또는 포함하지 않았으며, AI 등 인터넷 자료는 오로지 기술 원리 이해의 목표로만 활용하고, 본 게시글에 언급된 과정, 흐름, 본문, 게시한 코드는 AI의 복붙 없이 모두 필자가 사전에 알고 있는 그래픽스 기술과 인터넷 상에 공개된 개념을 통해 모두 직접 시도하며 직접 작성하였음을 밝힙니다. 부득이하게 어떤 자료를 인용하는 경우는 링크로 출처를 남기고 인용합니다.

이번 게시글에서는 쉐이더에서 원형 파형 모양을 내 보고자 한다. 이 경우 거리 함수를 사용하면 되는데, 기본 형태는 아래와 같다.

일단 위 코드는 거리에 따른 색상을 나타낸 것인데, 당연하게도 중앙이 검은색, 바깥으로 갈수록 흰색이 되는 것을 알 수 있다. 주기적으로 나타내기 위해서 sin 함수를 적용하면 된다.

sin 함수를 적용하되 주기를 주기 위해서 3.14 * 2 * 5 를 곱해 어느정도의 주기가 보이게끔 하고, 범위는 0~1로 고정하였다.

결과 값에 abs를 해주면 위와 같은 결과를 볼 수도 있다.

sin 내부에 _Time.y 를 빼주면 물결이 나오는 것 처럼 움직이는 효과를 낼 수 있다.

여기에 약간의 노이즈를 추가해줄 수 있는데,

float2 subtract_uv = center_uv - IN.uv; float angle =( atan2(subtract_uv.y, subtract_uv.x) + 3.14 )/ (3.14 * 2); float2 angle_to_sin = float2(sin(angle * 3.14 * 2),cos(angle * 3.14 * 2));

먼저 이전 게시글의 극좌표계 계산하던 것과 동일하다. 각도를 먼저 구해주고 각도를 0~1로 정규화한다. 그리고 이를 노이즈 함수에 같이 넣어 sin 의 주기에 변화를 주면 되는데, 그냥 0~1 값을 그대로 sin 내부에 넣으면 나중에 계산 상황에 따라 끊기는 상황이 발생할 수 있기 때문에 0~1~0 주기로 부드럽게 넘어갈 수 있도록

부드러운 계산이 가능하도록 angle을 sin, cos 에 각각 넣어 주기 0~ 2파이 범위를 반복할 수 있도록 구현해 두었다.

그리고 랜덤 함수를 사용해서 기존 주기 표시 + 시간 흐름 + 각도에따른 왜곡(다만 거리가 멀어질수록 강해지도록) 을 모두 연산해주면 아래와 같은 모습이 나온다.

이 때 여기서, 흰색 부분이 실제 텍스처 영역이기 때문에 (보통), 1.0 에서 빼주어 반전해주면 시각 착시 때문인지, 검은 영역이 압도적으로 늘어나되 흰색이 너무 굵게 차지한다. 이를 해결하기 위해 pow 로 조금 더 극단적으로 좁혀주고, 마지막으로 다른 퍼를린 랜덤 텍스처 (여기서는 거리에 따라 난수가 달라지도록 하였다.)를 곱해주어 중간 중간 끊김 효과를 내었다.

필요에 따라 2진처리를 통해 임의 임계 값을 넘지 못한 경우 discard 해준다.

이런 모양으로 흘러가는 모습이 완성된 것을 볼 수 있다...