WinCNT

서론아트 팀에서 포션이 움직이면 그 안의 액체가 흔들렸으면 좋겠다(…)는 리퀘스트가 있었다하지만 그것만을 위해 유체 역학을 넣을 실력도 없고, 성능을 생각하면 넣어서도 안 된다! 다행히도 셰이더와 스크립트로 적당히 그럴듯한 Liquid 셰이더를 구현할 수 있을 것 같아서 이쪽으로 진행해봤다레퍼런스는 아래의 유튜브 영상!https://www.youtube.com/watch?v=DKSpgFuKeb4 다른 비슷한 영상들도 많았지만 이쪽이 제일 좋아서 많이 참고했다특히 포션을 뒤집었을 때 액체가 위화감 없이 아래로 이동하는 부분이 특히 좋았다우선은 샘플 코드부터!이번에는 Shader와 그걸 보조하는 Script를 작성했다액체의 흔들림을 구현하기 위해서는 Delta Time이나 직전 프레임의 Transform 정..

서론높이 안개(Height Fog)를 구현한 건 좋은데 구조에 좀 불만이 있었다이대로라면 여러 귀찮은 점이 발생하므로 Global Shader Variable를 사용해 수정하기로 했다무엇이 문제인가?그 때는 셰이더가 하나여서 우선 Height Fog에 관련된 변수들을 전부 CBUFFER에 넣고 구현했다CBUFFER_START(UnityPerMaterial) //...생략... // Height Fog sampler2D _HeightFogNoise; float _HeightFogNoisePower; float _HeightFogNoiseSpeedX; float _HeightFogNoiseSpeedY; half4 _HeightFogColor;..

서론게임에서 사용되는 안개 효과는 여러 종류가 있는데, 그 중에 높이 안개(Height Fog)라는 것이 있다Exponential Height Fog User Guide 기본적으로는 이름 그대로 높은 고도에서 낮은 고도를 바라볼 때 보이는 구름과도 같은 안개를 구현한 효과이다그런데 이를 잘 활용하면 고도가 딱히 높지 않아도 발 밑에 안개를 형성해서, 늪지대나 불온한 분위기 등등 여러 응용이 가능해지기 때문에 아트 팀의 요망에 따라 구현하기로 했다왜 반투명 안 써요?그야 VR에서는 반투명이 특히나 더 무겁기 때문이지!Fog는 기본적으로 Lerp로 색 보간을 해서 구현하는 경우가 많기에 일반적으로는 반투명보다 가벼울 것이다Volumetric fog 같은 특정 영역에만 영향을 미치고 싶은 거면 이야기는 좀 다..

서론프로젝트에서 Visual Effect Graph(줄여서 VFX Graph)를 도입하자라는 제안이 있었다물론 아트 실력이 일천한 필자지만, 나중에 연관될 것은 분명했으므로 우선은 도입부터 해봤다(참고했던 사이트는 맨 밑에 정리)Visual Effect Graph(VFX Graph)란 뭐지?자세한 건 공식 문서Unity Visual Effect Graph 쉽게 말해 컴퓨터 셰이딩(즉 GPU)을 사용하는 업그레이드된 파티클 시스템이라고 할 수 있겠다(할 수 있나?)대부분의 연산을 GPU에서 하기 때문에 기존의 파티클 시스템보다 대량의 파티클을 처리할 수 있다는 장점이 있다 대신 물리 연산을 유니티 엔진의 Physics System을 사용하지 못 하고(Depth Buffer를 이용한다는 것 같다),GPU의 ..

서론예전에 다른 프로젝트에서 Dithering를 구현해본 적이 있다https://wincnt-shim.tistory.com/395 카메라와 오브젝트가 가까울 때 Dithering해서 반투명처럼 보이게 하는 셰이더 구현해보기!서론 이번에는 카메라와 오브젝트가 가까워졌을 때, 디더링을 통해 오브젝트를 반투명처럼 보이게 만드는 셰이더에 대해서 정리하고자 한다 특허에 대한 얘기를 듣기도 했고, 왜 이러한 이런wincnt-shim.tistory.com 그 때는 카메라와의 거리에 따라 Bayer Matrix 알고리즘을 이용한 디더링이었다하지만 이번에는 방식을 바꿔서 Alpha 값에 따라 Blue Noise를 통한 디더링를 구현하고자 한다!Bayer Matrix의 문제점들사실 Blue Noise 방식으로 변경한 건 ..

서론저번에 간단 Bar Gauge UI 셰이더를 만들었으나 태스크는 그게 끝이 아니었다이어서 만들어 볼 건 이런 느낌의 돌면서 채워지는 Gauge UI이걸 뭐라 부르는지는 몰라서 일단 Dial Gauge UI라고 부르기로 하면서 정리해봤다다 만들고 커밋한 후 Radial Gauge라고 부르는 게 더 맞다고 느꼈으나 뭘 어쩌겠어Dial Gauge UI Shader의 목표목표 자체는 Bar Gauge 때와 크게 다르지 않았다마찬가지로 Fill Amount를 조정하는 것만으로 게이지가 움직이도록 하면 됐다이번에도 Backgound가 있고, 조정된 위치에 Gauge의 텍스처가 있기에 별 다른 위치 조정이 없도록 하는 것은 같았지만, 회전하는 피벗은 조정하게 해야 한다는 이리저리 어려운 문제가…Dial Gauge..

서론 매우 슬프게도 VR에서는 Canvas나 관련 컴포넌트(Image 등)의 성능이 좀 많이 떨어진다 하지만 UI가 없는 건 아니라 열심히 구현해야 한다는 게 또 힘든 점 아무튼 이번에는 HP Bar 등의 Gauge UI! Alpha Test를 이용해서 일반적인 Qaud에 Gauge UI 셰이더를 만들어봤기에 정리해보고자 한다 Bar Gauge UI Shader의 목표 여기서 Bar Gauge란 HP 같은 상하, 혹은 좌우로 움직이는 UI를 말한다 이번 태스크의 목표는 머티리얼의 Fill Amount란 값을 조정하는 것만으로 움직이게 하는 것였다 일단 다음과 같이 Bar Gauge의 Backgound가 있고, 조정된 위치에 Bar Gauge의 텍스처도 있기 때문에 별 다른 위치 조정도 하지 않는 것도 중..

서론 그냥 일반적인 연출 표현 중 하나인 Vignette은 사실 VR에서 그 위상이 대단하다 그 이유는 바로 멀미 방지를 위해 Vignette이 주로 사용되기 때문!! (이런 Vignette를 따로 Tunneling Vignette라고 부르기도 한다) Vignette는 포스트 프로세싱으로도 구현이 가능하긴 하지만 매우 유감스럽게도 VR에서는 포스트 프로세싱의 사용을 최대한 피해야 하기 때문에… 현 프로젝트에서는 카메라의 바로 앞에 오브젝트를 두고 그 오브젝트에 구명을 뚫는 방식으로 구현하고 있다 하지만 현 프로젝트의 방식에도 문제가 있었으니… 현 방식의 문제점 ACNVR에서도 알 수 있듯이 멀미 방지를 위한 Vignette에는 구멍의 주변 부분이 그라데이션하게 반투명해지는 것을 알 수 있다 참고로 반투명..

서론 아웃라인을 구현에 스텐실을 사용한 적이 있었는데, 그 때 스텐실로 이리저리 가지고 놀다가 만들게 된 Magic Card에 대해서 간단히 정리해보고자 한다 참고로 Magic Card란 이런 걸 말한다(특히나 VR에서 자주 보인다) https://www.youtube.com/watch?v=3ustSanqxD0 오브젝트들 배치 가장 먼저 Magic Card의 오브젝트들을 배치하자 위의 유니티짱들은 Magic Card에 그려질 오브젝트들이고, 빨간색 Quad가 Magic Card의 범위이다 (액자 틀 같은 건 그 범위를 알기 쉽게 하기 위한 일반적인 오브젝트이다) 레이어 태그 설정 그 다음은 태그를 설정하자 Magic Card의 구현을 위해서는 Magic Card에 그려질 오브젝트들에 대한 태그(여기서는 ..

서론 현재 프로젝트는 배경에 대해서는 Only Light Map이기 때문에, 광원도 Directional Light만 존재하고 Additional Lights에 대해서 딱히 고려하고 있지 않았다 하지만 슬슬 PV를 만들 때가 됐을 때, Directional Light만 있으면 작업이 힘들어지는데 퀄리티도 떨어진다는 이야기를 들었다 그렇다면? 아예 PV용 리얼 타임 배경 셰이더를 새롭게 하나 만들면 되지 않을까?! 퍼포먼스를 신경 안 써도 된다니 최고다!!!! 그렇게 Additional Lights(Point Light, Spot Light)가 적용되는 PV용 리얼 타임 배경 셰이더를 만들게 되었다 이런 건 우선 디폴트 Lit를 확인해야…어? 왜 안 됨? 예전에 URP의 Lit에서 Additional Li..