본문 바로가기

Graphics

(27)
변수 Variables Summary After making clear how the shader stages are put together and the rough outline of shaderlab outside of the actual shader code, lets talk about what variables our shader needs to function and how we add them to our code. This includes the variables www.ronja-tutorials.com Ronja 님의 허락을 받고 번역한 튜토리얼입니다. 원문은 위 링크에서 확인하실 수 있습니다. 몇몇 부분은 생략·추가하였습니다. 의역과 오역이 넘쳐날 수 있으니 편하게 봐주시고 잘못된 부분은 ..
타일별로 크기 조절이 되는 셰이더 만들기 (유니티 빌트인 렌더 파이프라인 - Vertex&Fragment 셰이더 사용 / 언리얼 메테리얼 사용) 개요 '텍스처를 타일링해 반복시키고, 반복된 각각의 텍스처가 그대로 크기 조절이 되도록' 만드는 방법이 있는지 친구에게 질문을 받았습니다. UV만 조금 건드리면 될 것 같은데... 먼저 어떻게 만들어야 하는지 러프하게 생각해봅니다. 👀 대략적인 동작 방식 그리기 일반적으로 텍스처가 타일링 될 때의 그래프는 위 이미지의 왼쪽과 같습니다. UV에 Tiling값으로 3이 곱해져, UV가 0~1일 때 텍스처가 하나(0~1, 텍스처의 좌표), 1~2일 때 텍스처가 하나, 마지막으로 2~3일 때 텍스처가 하나 반복되는 식입니다. (UV 및 텍스처 좌표 x, y는 편의를 위해 통칭함) 그렇게 Tiling 값에 따라..
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..
HLSL HLSL HLSL? Hlsl is the language the “juicy” parts of unity shaders are written in. The parts that contain custom logic and eventually decide what is drawn where on screen. It’s the language Microsoft designed to work with their Direct3D API to write gpu p www.ronja-tutorials.com Ronja 님의 허락을 받고 번역한 튜토리얼입니다. 원문은 위 링크에서 확인하실 수 있습니다. 몇몇 부분은 생략·추가하였습니다. 의역과 오역이 넘쳐날 수 있으니 편하게 봐주시고 잘못된 부분은 알려주시면 감사하겠습..
유니티 셰이더 구조 Structure Shader Structure When talking about shaders I want to start at explaining the rough outline of how shaders are set up so we can understand how to customize them. Most modern shaders have a variable pipeline that consists out of at least a vertex shader and www.ronja-tutorials.com Ronja 님의 허락을 받고 번역한 튜토리얼입니다. 원문은 위 링크에서 확인하실 수 있습니다. 몇몇 부분은 생략·추가하였습니다. 의역과 오역이 넘쳐날 수 있으니 편하게 봐주시고 잘못된 부분은 ..
버텍스 포지션 기반으로 그라데이션을 적용해주는 유니티 셰이더 (유니티 빌트인 렌더 파이프라인 - Vertex&Fragment 및 Surface 셰이더 사용) 개요 유령 캐릭터를 만들면서, 캐릭터를 조금 더 '유령답게' 만들어주기 위해서 유령의 끝 부분을 그라디언트를 적용해 투명하게 하거나, 색을 그라데이션으로 적용할 수 있게 셰이더를 작업해야 했습니다. 다만 중요한 점은 '가볍게' 만들기였습니다. 회사 분께 조언을 받았는데, 방법은 크게 두가지로 정리되었어요. 캐릭터를 정면 프로젝션한 별도 UV 채널을 추가해서, 해당 UV를 기반으로 그라데이션을 만드는 방법 버텍스 데이터의 y좌표값을 활용해서 버텍스 컬러에 그라데이션을 적용하는 방법 '가볍게'라는 중점에 맞게, 별도 UV채널을 사용해 연산하는 첫 번째 방식보다는, UV채널을 추가하지 않고, 버텍스 셰이더에서 연산..