이 글은 WebGL 시리즈에서 이어지는 글입니다. 첫번째 글은 기초부터 시작하기이며 이 전 글은 3D 카메라입니다.

이 사이트에서 전반적으로 이야기한 것이지만, WebGL에서 모든 것은 100% 여러분에게 달려 있습니다. gl_Position과 같은 몇 개의 미리 정해진 이름을 제외하면 WebGL의 대부분 요소들의 이름은 프로그래머인 여러분들에 의해 정의됩니다.

그래도 몇가지 일반적으로 사용하는 명명 규칙이 있습니다. 특히 행렬과 관련해서는 말이죠. 저도 누가 제일 먼저 이런 이름을 생각했는지는 모릅니다. 저같은 경우는 NVidia의 표준 Annotation과 Semantic 을 보고 배웠습니다. 예전에는 특정한 이름을 사용하여 셰이더가 좀 더 다양한 상황에서 동작하도록 했기 때문에 조금 더 포멀한 편입니다. 지금은 그런 상황은 아니지만, 기본적으로는 이러한 방식을 아직 사용하고 있습니다.

제가 기억하는 몇 가지는 아래와 같습니다.

• 월드(world) 행렬 (또는 모델(model) 행렬)

  모델의 정점을 월드 공간으로 변환하는 행렬입니다.

• 카메라(camera) 행렬

  카메라를 월드 공간에 배치하는 행렬입니다. 조금 다르게 말하면, 이는 카메라의 월드 행렬입니다.

• 뷰(view) 행렬

  월드 공간에 있는 모든 것들을 카메라 앞으로 가져다 놓는 행렬입니다. 뷰 행렬을 카메라 행렬의 역행렬입니다.

• 투영(projection) 행렬

  절두체 공간 또는 직교 공간을 클립 공간으로 변환하는 행렬입니다. 다르게 생각하면, 이 행렬은 여러분이 사용하는 행렬 계산 라이브러리에서 perspective 또는 ortho/orthographic 함수를 사용했을때 반환되는 행렬입니다.

• 지역(local) 행렬

  씬그래프를 사용할때, 지역 행렬은 그래프의 특정 노드를 다른 노드에 곱하기 전에 적용되는 행렬입니다.

셰이더에서 위의 행렬 중 여러개를 조합해 사용할 때, 셰이더 내부에서는 오른쪽 방향으로곱해지기는 하지만 일반적으로 오른쪽에서 왼쪽으로 나열합니다. 예를 들어:

worldViewProjection = projection * view * world

행렬에 관해 일반적으로 적용되는 다른 두 가지는 역행렬을 취하는 것과

viewMatrix = inverse(cameraMatrix)

전치(transpose) 입니다.

worldInverseTranspose = transpose(inverse(world))

위의 것들을 안다면 다른 사람의 셰이더를 살펴볼 때, 무슨 의미인지 바로 이해할 수 있거나 또는 비슷한 이름의 행렬들을 찾아볼 수 있을겁니다. 그러면 아마도 실제로 그 셰이더가 어떠한 작업을 수행하는지 알 수 있을 겁니다.

이제 다음으로 애니메이션에 대해 배워봅시다..