[📜일지] [개발일기] 3. 안개 연출하기

[codeCat(220.86)]

안개 효과를 게임에서 사용하기로해서 개발하는 동안 생긴 문제와 그 해결법을 담은 글입니다.

게임에서 안개 효과를 쓰기로 한 이유는

1. 뒷배경과 캐릭터, 상호작용 가능한 오브젝트를 안개를 받냐 / 안받냐로 시각적으로 구분할 수 있게 한다.

2. 뒷배경 사이에서도 안개를 받는 정도에 차등을 둬서 좀더 공간감을 살린다(뒤에 있을수록 안개의 영향을 강하게 받음)

3. 분위기를 좀 살려보자

요 세가지입니다.

처음에는 그냥 파티클 이펙트로 안개를 만들어서 뿌리는 방법을 생각했지만,

안개들의 배치등을 전체적으로 컨트롤 하기 힘들어서 너무 안개가 뭉쳐나오거나 빈곳이 생겨서 퀄리티가 떨어지는게 문제였습니다.

그래서 요렇게 포스트 프로세싱을 이용해서 Fog효과를 만들기로 했습니다.

그런데 여기서 생긴 문제가 안개를 받는 영향의 정도를 z축 위치를 통해 알아내기로 했지만 이 Z축 위치를 저장하는 DepthBuffer를 읽어오는데 문제가 생깁니다.

유니티 렌더링 순서는 아래처럼 불투명한 오브젝트 그리기(Opaques) -> DepthBuffer를 저장하는 DepthTexture 만들기(Copy Depth) -> 반투명한 오브젝트 그리기(Transparents) 입니다.

게임에서 사용하는 스프라이트들은 DepthTexture가 이미 그려진 이후인 반투명한 오브젝트를 그릴때 그리기 때문에, 포스트 프로세싱 단계에서 안개를 만들때 DepthTexture를 읽어와도 DepthTexture는 텅텅 비어있는 상태기 때문에 Z축 값을 읽어올 수 없었습니다..

그래서 스프라이트들을 강제로 불투명한 오브젝트를 그릴때 그리게 하는 방법을 생각했습니다.

이 경우 정상적으로 Depth 값을 쓰고, 읽을 수 있었지만

붙투명 오브젝트를 그릴때 겹치는 경우 z축상 뒤에있는 물체를 그리지 않기때문에

알파값을 낮춰서 그려도 뒤에있는 물체를 그리는게 아니라 아래처럼 그냥 투명한 텅빈 공간이 나오게됩니다.

반투명 오브젝트를 그리는 큐에 넣으면 요렇게 그려지게 됩니다

저희게임에 반투명한 스프라이트가 들어갈 때가 있기때문에 강제로 불투명 그리기 큐에 넣는 방법은 쓸 수 없었습니다.

그래서 따로 커스텀 Depth Texture를 만드는 패스를 만들기 위해 유니티에서 DepthTexture를 그리는 코드를 보고 있었는데

유니티에서 DepthTexture를 만들때 _CameraDepthAttachment 라는 텍스쳐에 미리 Z버퍼를 저장해 두고,

이걸 샘플링해서 DepthTexture를 만든다는 걸 알게됬습니다.

그래서 DepthTexture가 아닌 _CameraDepthAttachment 텍스처를 읽어서 z버퍼 값을 사용할수 있지않을까? 라고 생각했고

요렇게 사용해본 결과 깊이값을 읽어오는데 성공했습니다!

// 설명이 부족했어서 추가하자면, DepthTexture를 만든 이후에도 _CameraDepthAttachment에는 계속 Z버퍼 값을 저장합니다.

그래서 반투명한 오브젝트를 그리는 큐에서도 Z버퍼 값을 쓰고, 그 값을 읽을 수 있던거였어요!

float depth = tex2D(_CameraDepthAttachment, i.uv).r;

드디어 이 깊이값을 이용해서 안개의 영향을 차등으로 받게 만들 수 있었습니다.

왼쪽의 건물은 안개의 영향을 전혀 받지않고, 오른쪽의 두 빌딩은 z축 거리에 따라 안개값을 차등으로 받는걸 볼 수 있습니다.

[아이고이아(121.180)]

분위기 좋네 ㅎㅎ

[다크마초(pigbigpig)]

좋아여

[익명(112.214)]

이거슨 조선사이버펑크물이구나

[리슬링?(lucid74)]

ㅆㅅㅌㅊ

[퀼트(mok9181)]

[서폿은블츠(hoho3153)]

저런거 어디가서 배우는거임 ?? 구글링 겁나해서 찾는건가?? 대단해!!!

[codeCat(223.38)]

네 구글이랑 유튜브에서 주로 공부합니다