그래픽(기타) 21

(Unity shader)물 만들기 복습

srp에 들어있는 쉐이더그래프는 기능들 이름이 생각이 안나도 검색해서 어찌저찌 찾아쓸 수 있지마는(심지어 결과도 눈으로 바로 보이니까 얘가 뭐였는지도 기억남) 기존 레거시에서 돌아가는 쉐이더는 직접 코딩을 해야하기에(심지어 자동완성도 없다) 계속 복습하면서 상기를 시켜줘야 까먹지를 않을 것 같아서 오랜만에 다시 만져보기로 했다 그래도 감은 몸이 기억한다고, 예전에 써놨던거 보니까 착착 기억이 난다 복습용으로 만들 물은 1. 물이 찰랑거리게 보이도록 만든다 2. 특정 기준에 따라 물 안쪽, 혹은 반사된 풍경이 보이도록 만든다 3. 물 안쪽이 굴절되서 보이게 만든다 라는 목표로 구현할 것이다 뭔가 더 만져보고 싶긴한데 일단 재활이 먼저기도 하고 다른 할일도 있으니 기회가 될 때 더 상급의 기술이나 응용법을 ..

그래픽(기타) 2021.05.12

(SRP)파이프라인 에셋의 잔 버그들

파이프라인을 만지는데에 두가지 버그? 같은게 있었는데 무슨 버그인지랑 해결 방법을 써보려합니다 버전은 Unity 2019.4.16f1 버전을 사용했습니다 1. 렌더러 수정사항 적용안되는 버그 렌더러 파일을 만졌는데도 불구하고 변화가 없는 경우가 있습니다 심지어 다른 에셋들을 눌렀다가 다시 렌더러 파일로 돌아와보면 내가 방금 바꿔놓은 변경점이 하나도 안바뀐 모습을 볼 수 있습니다 이게 가끔 그러는거면 모르겠는데 생각보다 간간히 발생하는 버그라서 그냥 쓰기도 뭐 한데 이때 어떻게 해야하느냐 렌더러 에셋을 보면 저런식으로 펼칠 수 있게 되어있는데 펼쳐보면 해당 렌더러에서 만들어놓은 Renderer Feature 들이 나열되어있습니다 저 안에 들어가면 이런 식으로 해당 Renderer Feature 만 볼 수 ..

그래픽(기타) 2021.04.26

(SRP)벽 뒤 실루엣 심화

이전 글과 이어지는 내용입니다 gimchicchige-mukgoshipda-1223.tistory.com/36 (SRP)벽 뒤에 있을 때 실루엣이 나오는 효과 만들기 먼저 Project Settings → Graphics 에 들어가면 현재 적용된 파이프라인을 볼 수가 있습니다 저걸 이제 클릭해서 들어가게 되면 이렇게 기본으로 만들어져있는 렌더러가 끼워져있습니다. 이걸 이제 새 gimchicchige-mukgoshipda-1223.tistory.com 그냥 저렇게 단색으로 채워져있는 실루엣도 괜찮긴 하지만 실루엣을 다른 식으로 그려도 재밌겠죠 그래서 이번엔 한번 실루엣을 외곽선만 나오게끔 만들어보겠습니다 먼저, 실루엣으로 사용할 외곽선 셰이더를 만들어보겠습니다 외곽선 셰이더에 관한 내용은 gimchicch..

그래픽(기타) 2021.04.26

(SRP)벽 뒤에 있을 때 실루엣이 나오는 효과 만들기

먼저 Project Settings → Graphics 에 들어가면 현재 적용된 파이프라인을 볼 수가 있습니다 저걸 이제 클릭해서 들어가게 되면 이렇게 기본으로 만들어져있는 렌더러가 끼워져있습니다. 이걸 이제 새로 만들어서 끼워줄겁니다 먼저 렌더러 생성은 이런식으로 찾아가면 있습니다. 저는 CustomRenderer 라고 이름을 지어놓고 진행하겠습니다 만들어서 넣어줍니다 렌더러에 들어가보면 이런식으로 되어있는데요 벽 뒤에 가려져 있을 때의 처리를 추가로 해주기 위해 맨 아래에 있는 Add Renderer Feature 를 눌러줍니다 그럼 이렇게 메뉴들이 나오게 됩니다 Name을 원하는 이름으로 정하고, 적용할 레이어를 LayerMask 에서 선택합니다 저는 캐릭터만 실루엣이 나오게 하고 싶기 때문에 Ch..

그래픽(기타) 2021.04.25

유니티 SRP 셰이더 그래프 - 15

굴절을 만들어봅시다 사실 굴절은 투명이 아니라 물 아래쪽을 캡쳐한 걸 꾸겨서 보여주는 겁니다 그래서 굴절을 구현하기 위해선 먼저 물 아랫부분을 캡쳐를 해줘야하죠 그런 역할을 CameraOpaqueTexture가 해줍니다 사용방법은 이런식으로 블랙보드에 Texture2D를 만든 후, Reference에 _CameraOpaqueTexture 라고 적어줍니다 이러면 저 값에 자동으로 카메라를 캡쳐한 게 들어가게 됩니다. 실시간으로 계속 캡쳐를 해서 넣어주죠 이걸 샘플러를 통해 마스터노드에 연결시키면 됩니다 근데 뭔가 좀 이상하죠 작동은 잘 되고있는 게 맞는데, 이게 캡쳐한 결과를 또 캡쳐해서 그리고 또 캡쳐해서 그리고 하면서 거울속의 거울 같은 느낌으로다가 우리가 원하는 결과물이 안나오게 됩니다 우리가 원하는..

그래픽(기타) 2020.02.16

유니티 SRP 셰이더 그래프 - 14

1. 리플렉션 활용 리플렉션을 넣은 투구를 완성시켜봅시다 먼저 텍스쳐를 통해 리플렉션을 먹일 부분을 마스킹을 해봅시다 그리고 추가로 큐브맵에 노말맵도 입혀봅시다 노말맵을 가져와서 트랜스폼을 통해 오브젝트 좌표계로 바꿔서 큐브맵의 노말에 넣어줍니다(큐브맵에서 오브젝트 스페이스로 계산을 하기 때문에) 그리고 나온 샘플큐브맵 데이터를 마스킹할 텍스쳐와 곱해줍니다 그러면 텍스쳐에서 하얀 부분만 리플렉션이 먹은 결과물이 나오게 되겠죠 한번 결과물을 봅시다 이런식으로 결과물이 나오게 됩니다 그다음 텍스쳐맵도 추가해봅시다 위에서 큐브맵 마스크를 빼냈던 곳에서 이번엔 g값을 빼내서 사용합니다 g값은 ao맵? 인것같아요 생긴거보니까 암튼 저 값을 매핑한 텍스쳐랑 곱해서 알베도에 넣으면 텍스쳐 자체가 좀 어두운 톤이라 크..

그래픽(기타) 2020.02.12

유니티 SRP 셰이더 그래프 - 13

1. 2Pass 아웃라인 저번엔 프레넬로 아웃라인을 만들었었는데 이번엔 멀티패스를 사용해서 아웃라인을 만들어봅시다 1 - 멀티패스 사용하기 일단 멀티패스를 사용하는 방법이 SRP 환경에서는 좀 특이하게 되있습니다 셰이더 내부에서 패스를 여러개를 못써요 새로 바뀐 방법을 통해 패스를 추가해봅시다 Project 탭에서 + 누른 뒤, Rendering -> Universal Render Pipeline -> Pipeline Asset 을 생성해줍니다 생성을 하시면 생성한 파일 + 같은 이름의 Renderer 파일이 추가로 생성됩니다 안을 보시면 전체적인 렌더링 속성? 같은 걸 설정할 수 있게 되어있고, 맨 위에 Renderer List에 보면 파일 생성했을때 같이 생성된 렌더러 파일이 기본적으로 들어가 있는걸..

그래픽(기타) 2020.02.09

유니티 SRP 셰이더 그래프 - 12

오늘은 버텍스 셰이더를 합니다 와악 1. 버텍스 포지션 2. 마스킹 추가해보기 3. 노말 벡터 사용하기 1. 버텍스 포지션 지금까지 우리가 만졌던 셰이더는 픽셀셰이더로, 각 픽셀을 어떻게 그릴지를 컨트롤하는 셰이더였습니다 오늘 만지는 건 버텍스를 수정하는 버텍스 셰이더죠 여기있는 저 3개가 버텍스셰이더 관련 노드입니다 오늘은 저 3개중에서 Position을 만져봅시다 버텍스의 포지션 값은 일단 Position 노드를 통해 빼내올 수 있습니다 여기서 좌표계를 Object로 설정하면 Vertex Position에 기본적으로 꽂혀있는 값이 나옵니다 이걸 Vertex Position에 그냥 꽂으면 아무 변화가 없죠 하지만 저 값에다가 y를 1 더하면 어떻게될까요? 오브젝트의 위치는 그대로인데 그려지는 위치가 달..

그래픽(기타) 2020.02.07

유니티 SRP 셰이더그래프 - 11

NPR셰이더 2탄입니다 1. 음영 단계를 텍스쳐로 만들어버리기 저번엔 음영 나뉘는 걸 수학연산을 통해서 구현했었죠 이번엔 텍스쳐를 사용하여 나누는 방법을 사용할겁니다 일단 하프램버트를 준비합니다 그 다음 이런 식으로 단계가 나눠져있는 텍스쳐를 준비합니다 저 텍스쳐를 가지고 음영 단계를 나눌건데 옛날 UV 조절했을 때의 기억을 보자면 저 UV의 왼쪽 아래 부분이 (0,0)이고, 오른쪽 위가 (1,1) 이었죠? 그리고 텍스쳐를 보면 왼쪽으로 갈 수록 어두워지고, 오른쪽으로 갈수록 밝아집니다. 즉, UV의 x값이 커질수록 밝아지는 텍스쳐라는 것이죠 여기에서 그럼 UV에 위에서 만들었던 하프램버트값을 넣으면... 이런식으로, 어두운 쪽은 x가 낮아지니까 텍스쳐의 왼쪽(어두운쪽)이 칠해지고, 반대로 밝은 쪽은 텍..

그래픽(기타) 2020.02.04

유니티 SRP 셰이더 그래프 - 10

툰셰이더를 만들어봅시다(와아아아악!!!!) 1. NPR 2. 확 갈라지는 그림자 3. 아웃라인 - fresnel outline 1. NPR Non Photo Realistic의 약자로, 사실적이지 않은 기법? 그런 셰이더라 보면 됩니다 그중에 뭐 툰셰이더도 껴있고 그런것이죠 뭐 이런거라던가(오브라딘 호의 귀환) 이런거처럼요(소울워커) 간단하게 하나 구현해봅시다 dither 라는 노드를 사용할건데, 이게 어떻게 생겨먹었느냐 보면 이렇게 점들이 박혀있는게 알아서 만들어져 있는 노드입니다 in에다가는 대충 점의 크기? 그런 역할을 하는 것 같고, 아래에는 스크린 포지션이라고해서 내가 보는 화면 자체를 uv로 사용해서 화면 제일 왼쪽 아래가 (0,0), 맨오른쪽위가 (1,1)인 벡터입니다 z, w값은 프리뷰로도..

그래픽(기타) 2020.01.31