본문 바로가기

Graphics/Unity

(4)
Color Blend Mode 개요Color 블렌딩은 원리 자체는 간단한 블렌딩 모드입니다.HSV를 사용해 색상에서 색조와 채도 값을 얻어 블렌딩에 사용하는 방식입니다. 베이스 색상에 블렌딩할 색상의 HSV 값 중 Hue 값과 Saturation 값만 가져와 섞어주는 것이죠.먼저 베이스 색상과 블렌딩할 색상의 RGB 값을 HSV로 바꿔줍니다. 그 다음 베이스 색상의 H와 S값을 블렌딩할 색상의 H와 S값으로 바꿔줍니다. 이제 Hue와 Saturation 값이 바뀐 HSV 값을 다시 RGB 값으로 변환해주면 컬러 블렌딩이 완료됩니다!  RGB값을 HSV 값으로 변환하기앞서 이야기했듯, 먼저 베이스 색상과 블렌딩할 색상 두가지 모두 HSV값으로 변환해줍니다. float3 RGBToHSV(float3 c){ float4 k = flo..
Chat GPT로 유니티 셰이더 만들기 (유니티 빌트인 렌더 파이프라인) 개요 요즈음 뜨거운 이슈인 Chat GPT를 통해 무엇을 해볼까 하다가, 셰이더를 만드는데에도 사용할 수 있을 지 문득 궁금해졌습니다. 백문이 불여일견이라고, 궁금증이 희미해지기 전에 바로 시도해보았습니다. 깜빡이는 간단한 셰이더 만들기 첫 번째로, 먼저 깜빡이는 간단한 셰이더를 Chat GPT에게 요청해보았습니다. 이전 시도에서는 깜빡이는 셰이더를 요청했을 때, 단순하게 Sin(Time) 값을 비교연산해 하얀색과 검정색을 반복하는 셰이더를 작성했는데 (심지어 비교연산도 if문을 통해 하고있었습니다), 이번 시도에서는 어떠한 효과를 원하는지 구체적으로 묻는 답변이 나왔습니다. 상세한 답변 덕분인지, 원하던 시간에 따라 값이 같이 변화하는 셰이더를 성공적으로 작성해냈습니다..
사각형 패턴 셰이더 만들기 (유니티 빌트인 렌더 파이프라인 - Vertex&Fragment 셰이더 사용) 개요 사각형 패턴 연출을 셰이더로 만들어보려고 하던 도중 아래 셰이더 코드를 찾아, 뜯어보며 만들어보기로 했습니다. Shadertoy www.shadertoy.com UV 회전 및 UV의 중앙점 옮기기 ··· fixed4 frag (v2f i) : SV_Target { fixed4 col = tex2D(_MainTex, i.uv); float2 uv = i.uv; uv -= 0.5; // UV 기준점(0,0)을 중앙으로 옮기기 // ----- UV 회전 - 회전 행렬을 사용 float rotation = radians(_Rotation); // 사각형의 각도, 라디안값으로 변환 (숫자 45를 각도 45도로) float2x2 m..
버텍스 포지션 기반으로 그라데이션을 적용해주는 유니티 셰이더 (유니티 빌트인 렌더 파이프라인 - Vertex&Fragment 및 Surface 셰이더 사용) 개요 유령 캐릭터를 만들면서, 캐릭터를 조금 더 '유령답게' 만들어주기 위해서 유령의 끝 부분을 그라디언트를 적용해 투명하게 하거나, 색을 그라데이션으로 적용할 수 있게 셰이더를 작업해야 했습니다. 다만 중요한 점은 '가볍게' 만들기였습니다. 회사 분께 조언을 받았는데, 방법은 크게 두가지로 정리되었어요. 캐릭터를 정면 프로젝션한 별도 UV 채널을 추가해서, 해당 UV를 기반으로 그라데이션을 만드는 방법 버텍스 데이터의 y좌표값을 활용해서 버텍스 컬러에 그라데이션을 적용하는 방법 '가볍게'라는 중점에 맞게, 별도 UV채널을 사용해 연산하는 첫 번째 방식보다는, UV채널을 추가하지 않고, 버텍스 셰이더에서 연산..