GLSL03

Shadertoy Conversion to TouchDesigner

쉐이더 토이 터치디자이너로 (GLSL TOP)

처음 shadertoy 코드를 복사해오면 에러가 뜨면서
분홍색과 파란색 에러 체크 박스가 뜬다. 

에러를 하나하나 보면서 수정해보도록 하자. 

쉐이더 토이 코드 위에는 'Shader Inputs'라는 창이 숨겨져 있는데. 
열어보면 아까 에러 떴던 코드들이 눈에 보인다. 

우선, 이것들을 수정하도록 한다. 

iTime -> float iTime; 으로 가장 상단에 선언해준다.

에러가 현격히 줄어들게 된다. 

iResolution -> iResolution은 해상도를 설정해주는 것이다. 

이를 해결하는데는 두 가지 방법이 있다.
첫 번째는 설정되어있는 해상도를 사용하는 것과.
두번째는 직접값을 설정해주는 것이다. 

첫 번째 방법이 더 이용하기 쉬우니 첫 번째 방법으로 해결한다. 

위처럼 코드를 작성해주면 error가 사라진 것을 확인 할 수 있다.
uTDOutputInfo.res.zw는 glsl에서 설정된 resolution값을 가져오게 된다. 

* #define이란?

프로그램에서 여러 번 사용되는 상수값을 고정적으로 정해두는 것.
매크로로 불리기도 함. 

ex) #define PI 3.14 (함수도 사용 가능.)

iChannel0 -> iChannel0은 주로, 이미지를 가져온다. 
touchdesigner는 이미지를 가져오는 내장함수를 제공한다. 

여기에서는 sTD2DInputs을 사용한다. 

pixel shader 오류는 모두 잡아냈다.
하지만, 'ERROR: No definition of main in fragment shader'가 뜬다. 

이 에러는 main함수가 정의되지 않아서이다. 
main 함수를 정의해주자. 

(중간에 코드가 잘 안작동해서 새로 고침. 하지만, process는 바뀐게 없어서 유지해두었다.)
위에 코드 같은 경우. feedBack을 사용했다.
shaderToy에서 buffer에 코드가 있는 경우 feedback 오퍼레이터를 사용한다.

아래 링크에는 GLSL_TOP과 관련된 자료를 찾아볼 수 있다. 

https://docs.derivative.ca/Write_a_GLSL_TOP

* cubemap 사용하기 

projection operator로 cubemap 형태로
image파일을 전환하는게 가능하다.

https://docs.derivative.ca/Write_a_GLSL_TOP

3D PipeLine 

GLSL material(vertex shader, pixel shader) 

vertex shader - 3D 모델의 vertex의 집합.
pixel shader - 화면에 출력할 최종 색상을 정함. 

vUV 
텍스처 픽셀 좌표 
texture co-ordinates of the pixel (built-in)

gl_FragCoord 
화면과 상관관계를 가진 픽셀 좌표 
contains the window-relative coordinates of the current pixel 

phong material을 수정하여, GLSL material 코드를 작성할 수 있다.
위에 보이는 빨간 박스를 눌러야 GLSL 오퍼레이터가 나타난다. 

material 적용은 geometry 오퍼레이터에 render에 drag해두면 된다.

https://docs.derivative.ca/Write_a_GLSL_Material