Portal Prefab 만들기

최근 팀에서 포탈을 제작하는 과정에서 한 팀원이 기능적인 부분은 거의 완벽하게 구현했지만, 이미지 처리 부분에서 애를 먹고 있었다. 기능적인 부분은 문제가 없었기에, 내가 쉐이더 그래프(Shader Graph)를 활용해 간단하게 해결할 수 있지 않을까 싶었다. 그래서 직접 테스트해 보며 적용해 보았다.

포탈 메시 준비

먼저, 포탈을 통해 반대편을 볼 수 있도록 메시(Mesh)를 준비한다. 이 메시가 포탈의 기본 형태가 될 것이다.

image-20250317163013761

카메라 및 테스트 오브젝트 배치

포탈을 구현하려면 실제로 반대편의 모습을 보여줄 수 있도록 카메라를 배치해야 한다. 포탈을 통해 보일 공간에 카메라를 두고, 그곳에서 보일 물체를 준비한다.

image-20250317163141273

셰이더 그래프 제작

다음으로, 포탈이 특정한 형태로만 보이도록 하기 위해 Shader Graph를 활용하여 셰이더를 제작한다.

  1. 새로운 Shader Graph를 생성한다.
  2. base Texalpha Tex 프로퍼티를 만들어 준다.
  3. 투명 처리를 위해 알파 텍스처(alpha Tex)를 활용하여, 포탈 외부는 투명하게 설정한다.

image-20250317164227483

Surface Type 변경

포탈을 투명하게 표현하려면 Graph Inspector에서 Surface TypeTransparent로 변경해야 한다. 이를 설정하지 않으면 알파 값이 적용되지 않는다.

image-20250317164258019

머터리얼 제작 및 적용

이제 방금 만든 Shader Graph를 기반으로 머터리얼을 제작하고, 필요한 텍스처를 할당한다.

  1. 새로운 머터리얼을 만든 후, 우리가 제작한 셰이더를 적용한다.
  2. base TexRender Texture를 넣어준다.
  3. alpha Tex에는 포탈의 형태를 결정할 알파 텍스처를 넣어준다.

image-20250317163724122

포탈 적용 결과

마지막으로, 처음 제작한 메시(Mesh)에 위에서 만든 머터리얼을 적용하면 포탈의 기본적인 형태가 구현된다.

이제 포탈을 통해 다른 공간이 보이는 효과를 구현할 수 있었다.

image-20250317163921177

이렇게 간단한 Shader GraphRender Texture를 활용하여 포탈을 구현할 수 있다.

추가적인 기능을 넣거나, 최적화를 진행하면 더욱더 현실감 있는 포탈 시스템을 만들 수 있으니, 필요에 따라 응용해 보면 좋을 것 같다.

댓글남기기