게임 클라이언트 프로그래머

6 분 소요

1. 벡터 대수

  • 벡터의 기하학적 표현 방법과 수치적 표현 방법을 배운다.
  • 벡터에 대해 정의되는 연산들과 그 연산들의 기하학적 응용 방법을 배운다.
  • DirectXMath 라이브러리의 벡터 관련 함수들과 클래스들에 익숙해진다.

1.1 벡터

벡터(vector)는 크기, 방향을 모두 가진 수량(quantity)을 가리키는 말이다. 크기(magnititude)와 방향(direction)을 모두 가진 수량을 좀 더 공식적으로 벡터값 수량(vector-valued quantity)이라고 부름.

벡터값 수량의 예시

  • 힘 (force: 특정한 방향과 세기(strength)로 가해짐)
  • 변위 (displacement: 한 입자의 최종 이동 방향 및 거리)
  • 속도 (빠르기와 방향)

벡터는 힘, 변위, 속도를 나타내는 데 사용된다. 또한 3차원 게임에서 플레이어가 바라보는 방향, 다각형이 향한 방향, 광선의 이동 방향, 한 표면에서 광선이 반사되는 방향 등 순수 방향을 나타낼 때에도 사용한다.

  • 벡터를 기하학적으로 나타내어보자.

시각적으로 방향이 있는 선분, 즉 지향 선분(directed line segment)으로 나타낸다. image-20260803194548293

  • 선분의 길이는 벡터의 크기, 끝의 화살표는 방향을 의미한다.
    • 위치를 바꾸어도 벡터의 크기와 방향은 바뀌지 않으므로 벡터가 그려진 위치는 중요하지 않다.
  • 두 벡터가 길이가 같고 같은 방향을 가리키면 상동(equal)이다.
    • 벡터를 다른 곳으로 이동(translation)해도 그 벡터의 의미는 변하지 않는다.
  • 가령 그림의 벡터 $u$와 $v$는 길이가 같고 가리키는 방향도 같으므로 상동이다.
    • 벡터 자체는 위치와 상관이 없으므로, 그저 개미가 어느 방향으로 얼마나 나아가는지를 나타낼 뿐이다.

1.1.1 벡터와 좌표계

컴퓨터는 벡터들을 기하학적으로 다루지 못하기 때문에 벡터들을 수치적으로 지정할 방법이 필요하다.

꼬리가 좌표계 원점과 일치하도록 v를 이동한다. 꼬리가 원점과 일치하도록 이동된 벡터를 가리켜서 “표준 위치에 있다”고 말한다. image-2 0260803195351898

공간에 하나의 3차원 좌표계를 도입하고, 모든 벡터를 그 꼬리가 그 좌표계의 원점과 일치하도록 이동하는 것이 그 방법이다.

한 좌표계에 상대적인 좌표로 지정된 벡터. image-20260803195531813

이러면 하나의 벡터를 그 머리(화살표 끝)의 좌표로 규정하여서 $v = (x, y, z)$꼴로 표기할 수 있게 된다. 이를 통해 3차원 벡터를 컴퓨터 프로그램 내에서 부동소수점 값 세 개로 표현이 가능해진다.

같은 벡터 $v$라도 기준계에 따라 좌표가 다르다. image-20260803195638496

여기서 $A$를 기준으로 한 벡터의 $v$좌표, $B$를 기준으로 한 $v$의 좌표가 다르다는 점을 주목하자. 물이 끓는 점이 섭씨로는 100도, 화씨로는 212도로 각각 다르게 표기되지면 결국 물리적 온도는 무관하게 일정하다. 마찬가지로 화살표 선분에 내포된 벡터의 방향, 크기는 변하지 않고, 좌표계에 따라 바뀌는건 벡터를 표현하는 좌표 뿐이다. 3차원 컴퓨터 그래픽에선 여러가지 기준계를 쓰는 경우가 많으므로, 벡터를 다룰 때엔 주어진 벡터의 좌표가 어떤 기준계에 상대적인지 기억해야 하며, 한 기준계에서의 벡터 좌표를 다른 기준계로 변환하는 방법도 알아야 한다.

1.1.2 왼손잡이 좌표계 대 오른손잡이 좌표계

왼쪽은 왼손잡이 좌표계, 오른쪽은 오른손잡이 좌표계로 양의 z축의 방향이 반대 방향이다. image-20260803200034649

Direct3D는 왼손잡이 좌표계를 사용한다.

1.1.3 기본적인 벡터 연산들

벡터의 좌표 표현을 이용해 벡터의 상등, 덧셈, 스칼라 곱, 뺄셈을 정의할 수 있다.

예 1.1

$u = (1, 2, 3)$, $v = (1, 2, 3)$,$ w = (3, 0, -2)$, $k = 2$라고 하자. 그러면

  1. $u + w = (1, 2, 3) + (3, 0, -2) = (4, 2, 1)$이고,
  2. $u = v$이고,
  3. $u - v = u + (-v) = (1, 2, 3) + (-1, -2, -3) = (0, 0, 0) = 0$이고,
  4. $kw = 2(3, 0, -2) = (6, 0, -4)$이다.

기본적인 벡터연산이므로 자세한 내용은 생략

1.2 길이와 단위 벡터

벡터의 크기(길이)는 이중 수직선으로 표기함. 예를 들어 $u$의 크기는 $ u $ 이다.

$|u| =\sqrt{x^2+y^2+z^2}$ -> 피타고라스 정리를 생각하면 편하다.

벡터를 순수하게 방향을 나타내는 용도로 사용할 경우 벡터 길이가 중요치 않다. 방향 전용 벡터를 만들기 위해 벡터의 길이를 단위 길이(1)로 맞춰주면 편리하다. 단위 길이에 맞춘 벡터를 단위 벡터(unit vector)라고 부르고, 이 과정을 정규화(normalization)라고 부른다.

전혀 어렵지 않다. 그저 각 성분을 벡터의 크기로 나누면 된다.

$\hat{u} = \frac{u}{|u|} = (\frac{x}{|u|}, \frac{y}{|u|}, \frac{z}{|u|})$

1.3 내적

내적은 스칼라 값이 결과로 나오는 벡터 곱셈의 일종으로 매우 단순한 연산이다.

$u=(u_x,u_y,u_z)$, $v=(v_x,v_y,v_z)$라고 할 때 내적은 다음으로 정의된다. $u \cdot v = u_xv_x+u_yv_y+y_zv_z$ 그냥 단순하게 x끼리, y끼리, z끼리 곱하고 다 더하면 된다.

식만 놓고 봤을땐 딱히 기하학적인 의미가 보이지 않을 수 있다. 여기서 코사인을 적용하면 관계를 찾아낼 수 있다.

$u \cdot v = |u| |v| \cos\theta$

여기에 나온 $\theta$는 $u$와 $v$사이의 $0 \le \theta \le \pi$를 만족하는 각도이다. 즉 두 벡터의 내적은 두 벡터 사이 각도의 코사인값을 벡터 크기로 비례한 것이다.

그럼 몇 가지 유용한 속성을 꺼낼 수 있다.

  1. 만약 $u \cdot v = 0$이면 $u \perp v$이다. (쉽게 말하면 직교한다.)
  2. 만약 $u \cdot v > 0$이면 두 벡터사이 각도 $\theta$는 90도 보다 작다. (예각이다)
  3. 만약 $u \cdot v < 0$이면 두 벡터사이 각도 $\theta$는 90도 보다 크다. (둔각이다)

1.3.1 직교화

벡터 집합들이 모두 단위 길이고 각각 전부 직교인 경우, 그런 벡터 집합을 정규직교(orthonormal) 집합이라고 부른다. 정규 직교에 가깝지만 완전히 정규직교는 아닌 경우 직교화(orthogonalization)를 통해 정규직교벡터 집합으로 만든다.

2차원 직교화 예시 image-20260803212234762

벡터 집합 ${v_0, v_1}$을 직교화 해서 정규 직교 집합 ${w_0, w_1}$을 얻는걸 보여주는 그림이다. $w_0 = v_0$으로 시작해서 벡터 $v_1$이 $w_0$과 직교가 되도록 만든다. 이를 위해, $w_0$의 방향으로 작용하는 부분을 $v_1$에서 뺀다.

$w_1 = v_1 - proj_{w_0}(v_1)$

이러면 서로 직교인 벡터들의 집합인 ${w_0, w_1}$이 만들어진다 마지막으로 $w_0$, $w_1$을 정규화해서 단위 길이로 만들면 정규직교 집합이 완성된다.

1.4 외적

외적은 내적과 달리 벡터가 결과로 나온다. 또한 2차원 벡터들에 대해선 정의되지 않으며 3차원 벡터에 대해서만 정의된다. 두 3차원 벡터 $u$, $v$의 외적을 취하면 $u$, $v$ 모두에 직교인 또 다른 벡터 $w$가 나온다. $w$는 $u$, $v$와 직교이다.

$w = u × v = (u_yv_z - u_zv_y, u_zv_x - u_xv_z, u_xv_y - u_yv_x)$

ex) $u = (2, 1, 3), v = (2, 0, 0)$ 일때, $w = u \times v$와 $z = v \times u$를 계산하고 $w$가 $u$와 $v$에 직교임을 확인해보자. \(\begin{aligned} w &= u \times v\\ &= (2, 1, 3) \times (2, 0, 0)\\ &= (1 \cdot 0 - 3 \cdot 0 , 3 \cdot 2 - 2 \cdot 0 , 2 \cdot 0 - 1 \cdot 2)\\ &= (0, 6, 2) \end{aligned} \begin{aligned} z &= v \times u \\ &= (2, 0, 0) × (2, 1, 3) \\ &= (0·3 - 0·1, 0·2 - 2·3, 2·1 - 0·2) \\ &= (0, - 6, 2) \\ \end{aligned}\)

순서를 바꾸면 방향이 뒤집힌다는 것을 알 수 있다. image-20260803225936574

1.4.1 2차원 유사 외적

벡터 $u$의 2차원 유사 외적을 구하면 $u$에 직교인 $v$가 나온다 image-20260803230006102

특수한 경우를 빼고는 2차원에선 두 벡터에 수직인 벡터가 존재하지 않는다. 하지만 하나의 2차원 벡터 $u = (u_x, u_y)$에 수직인 벡터 $v$는 얼마든 구할 수 있다. 그림은 2차원 유사 외적을 나타낸 것으로 그림에서 보듯이 $v = (-u_y, u_x)$이다.

1.4.2 외적을 이용한 직교화

그람-슈미트 직교화 공정을 이용해 벡터 집합 직교화를 하는 방법을 알아보았었다. 3차원의 경우엔 정규 직교에 매우 가깝지만 수치 정밀도 오차가 누적되며 완전한 정규 직교가 아닌 벡터 집합 ${v_0, v_1, v_2}$를 직교화 하는 또 다른 공정이 있다.

외적을 이용한 직교화 과정 image-20260803230459571

  1. $w_0 = \frac{v_0}{|v_0|}$으로 설정한다
  2. $w_2 = \frac{w_0 \times v_1}{|w_0 \times v_1|}$로 설정한다
  3. $w_1 = w_2 × w_0$으로 설정한다. $w2 ⊥ w0$이고 $||w2||=||w0||= 1$이므로 $||w2 × w0|| = 1$이다. 따라서 이 마지막 단계에서는 더 이상의 정규화가 필요하지 않다. 이제 벡터 집합 ${w_0, w_1, w_2}$는 정규 직교이다.

1.5 점

벡터는 위치(position)을 서술하지는 않는다, 하지만 3차원 그래픽 프로그램에서는 공간 내의 어떤 위치를 지정할 수 있어야 한다. 3차원 기하 구조의 위치, 3차원 가상 카메라의 위치 등을 지정해야 한다.

원점에서 한 점으로 나아가는 위치 벡터는 주어진 좌표계에 상대적인 그 점의 위치를 완전히 서술한다. image-20260803230945680

그러므로 벡터를 위치 표시에 사용해버린다. 특정 좌표계를 기준으로 표준 위치에 있는 벡터를, 3차원 공간 내의 위치를 나타내는 데 사용한다. 이를 위치벡터라고 부른다. 벡터 방향, 크기는 중요치 않고 그저 머리 끝이 가리키는 좌표만이 중요하다.

하지만 부작용이 있는데, 점에 대해서는 의미가 없는 벡터 연산을 점(위치 벡터)에 적용하는 실수를 저지를 수도 있게 된다. 기하학적으로 두 점의 합은 말이 되지 않지만, 공식상으로는 적용이 가능하기 때문이다.

(a) 두 점의 차 $q - p$는 $p$에서 $q$로의 벡터로 정의된다. (b) 점 $p$에 벡터 $v$를 더한 것은 $p$의 위치를 $v$만큼 옮겨서 얻는 점 $q$로 정의된다. image-20260803231556183

그러나 점에 대해서도 의미 있게 적용할 수 있는 벡터 연산이 없지는 않다. 예를 들어서 두 점의 차 $q-p$를 $p$에서 $q$로 가는 벡터라고 정의할 수 있다. 또한 점 $p$더하기 벡터 $v$를 $p$의 위치를 $v$만큼 옮겼을 때 (변위) 도달하는 점 $q$라고 정의할 수도 있다.

업데이트:

참고