기존에 결과 동영상만 올려놓았던 프로젝트 페이지 : https://88-it.tistory.com/21
GameProgramming Project - 유니티 Shader를 이용한 비와 물결 구현
많은 내용들이 있지만 정리하기에 벅참이 있기 때문에 관련 영상과 발표한 PPT 를 올려 놓겠습니다. 결과 동영상 1 : https://youtu.be/Sqs6AB1oXMw 낮 버전 결과 동영상 2 : https://youtu.be/uOzMHFREWpI 밤 버..
88-it.tistory.com
GameProgramming Project - 유니티 Shader를 이용한 비와 물결 구현 "비 오는 거리" -1 페이지 :
개발 배경 : 유니티 Shader를 이용한 개발 및 사실적인 이미지 표현
주제 : 비 오는 거리 ( 아래 현상 참고 )
- 가로수 길 배경, 물결, 비, 물의 파동, 반사, 물이 차오르는 애니메이션, 화면 일그러지는 효과 구현
< 물리적인 물의 파동 구현 >
Vertex shader로 구현해보고자 함.
sin ((v.vertex.x * v.vertex.x)+(v.vertex.z * v.vertex.z)) 위 방정식을 v.vertex.y, v.normal.z 적용
=> _Scale * sin(_Time.w * _Speed * _Fre + (v.vertex.x * v.vertex.x)+(v.vertex.z * v.vertex.z)
이 식에서_Speed 값이 음수가 되면 시간이 음수 값이 되면서 뒤로 감기면서 물결 파동 모양이 나옴.
외부 스크립트를 만들어서 공과 Plane이 충돌할 때에 값을 계산함.
충돌할 때에 Plane 좌표, 공의 좌표, 둘을 고려한 거리 값
_OffsetX, _OffsetZ : plane 위치 중 어디 위치에서 물결을 생성시킬지 중심 좌표 값
_Wave : col.rigidbody.velocity.magnitude (공의 속도)을 이용 -> 물결의 크기 조절
v.vertex.y += value * _Wave;
v.normal.z += value * _Wave;
Wave * 0.98f :시간이 지날수록 파동이 작아 지기 때문
최종 식 : _Scale * sin(_Time.w * _Speed * _Fre + (v.vertex.x * v.vertex.x)+(v.vertex.z * v.vertex.z) + (v.vertex.x * _OffsetX2) + (v.vertex.z * _OffsetZ2))
여러 충돌을 감지하기 위해서는 _OffsetX1, _OffsetZ1, _OffsetX2, _OffsetZ2 이런 식으로 구현
임의의 _Distance / _Ximpact, _Zimpact : 공의 좌표
(현재 모델 행렬.x- 공의 좌표.x), (현재 모델 행렬.y- 공의 좌표.y) 내적 시켜서 그 값이 Distance 보다 작을 동안만 파동을 발생시킴.이때에 Distance 값을 일정 단위 증가시켜 점점 멀리 퍼지는 파동의 특징을 살림.
투명시키고 실제 배경에서 적용해본 결과 :
< 물 반사 >
Reflection Probe란?
Unity 엔진상에서 Prob를 배치한 기준으로 주변의 오브젝트들을 캡쳐하여 CubeMap데이터로 저장하는 기능
이전 CubeMap Reflection은 따로 CubeMap 텍스처를 넣어서 반사 텍스처에 활용 했다면 이번엔 Reflection Probe로 주변 환경, Static오브젝트를 캡처한 CubeMap 텍스처를 반사 텍스처로 활용
float3 fWRV = WorldReflectionVector(IN, o.Normal).xyz;
float3 refcolor = 0.1*UNITY_SAMPLE_TEXCUBE(unity_SpecCube0, fWRV).rgb * unity_SpecCube0_HDR.r;
o.Emission = refcolor * rim * 2;
결과 동영상 : 그 결과, 물에 전봇대가 비치는 것을 확인할 수 있음.
< 물이 차오르는 애니메이션 >
float alpha;
if (noise.r >= _WaveLine)
alpha = 1;
else
alpha = 0;
o.Alpha = 0.2 * alpha;
_WaveLine에 1부터 시작하여 시간을 뺌.
< 카메라 일그러짐 효과 >
빗방울 때문에 시야가 일그러지는 것을 표현하고자 함.
위 방법을 적용하면 아래와 같은 결과 사진 :
관련 동영상 :
여기까지 길고 긴 과정이었습니다. 사실 많이 막힌 부분들이나 구현 과정을 더 상세하게 이야기하고 싶지만 너무 시간이 오래 걸릴 거 같아 예전에 정리한 PPT 토대로 정리해보았습니다. 봐주셔서 감사합니다.
댓글