Sanyo의 개발 블로그

Synthetic Objects

카메라처럼 그래픽스에서 가상의 오브젝트를 Synthetic Object라고 부른다.

이 오브젝트들은 정점들(Vertices)와 Faces로 이루어져 있다.각 Vertex는,

position, normal, color, texture coord 등의 정보를 가지고 있고, 

Faces들은 vertex이 어떻게 연결되어 있는지를 알려주는 indicese 등의 정보를 가지고 있다.

생각

다음과 같은 모델을 어떻게 데이터로 표현해야 할까?

Color, Normal, texture등을 제외하고 각 Vertex가 위치 정보 (position)만 가지고 있다고 가정할 때,

3차원 공간이기에 각 vertex마다 x, y, z로 이루어진 3차원 벡터정보를 담고 있을 것이다.

근데 생각해봐야 하는 것이, 지금 면(Face)들이 사각형, 삼각형, 다각형도 있는데 이걸 어떻게 컴퓨터 구조로 표현해야 할지 고민해야 한다.

Polygon Mesh

먼저 첫번째로 Polygon Mesh 방식은 다음과 같이 Vertex list들을 정해놓고, 각 Face마다 Vertex의 position index 순서를 지정함으로써 그릴 수 있다. 근데 이 방법은 먼저 각 면이 삼각형인지 사각형인지 몇각형인지를 미리 알려줘야 한다는 단점을 안고 있다.

그리고 실제로는 권장하지 않는 방식인데, 그 이유는 GPU는 기본적으로 삼각형으로 모든 것을 처리하기 때문에, 위 구조로 디자인을 한다고 하더라도 내부적으로는 결국 모든 것이 삼각형으로 처리된다. 다각형을 삼각형으로 바꾸는 과정을 Tessellation이라고 한다.

이 방법으로 하게 되면 결국 내부적으로 계산을 한 번 더 하게 된다.

Triangulated Mesh

이번에는 미리 삼각형으로 분할해서 처리하는 방식이다. 위 예제와는 달리, 모든 Face를 삼각형으로 처리하면 큰 장점이 하나 있는데, 굳이 Face마다 데이터를 분할해서 나눌 필요가 없다. 어처피 삼각형이라면 3개를 단위로 읽어서 Face를 처리하면 되기 때문이다.

이렇게 Vertex list를 정의하지 않고 그냥 position들의 조합으로만 나타낼 수도 있다. 이렇게 하면 Face마다 사각형인지 다각형인지 삼각형인지를 고려할 필요가 없고, 그냥 3개씩 끊어서 처리하면 되니 훨씬 효율적이다.

위 그림에 나와있는 1, 2, 3번째 순서대로 하나의 삼각형, 그 다음 4, 5, 6번째가 또 다른 삼각형, 이런식으로 처리하게 된다.

하지만 이 방법은 메모리를 더 쓸 수 있다는 단점이 존재하는데, 이를 해결하기 위해서 Polygon Mesh와 연결해서,

이런식으로 구조를 변경할 수도 있다. 미리 Position list를 정의해두고, index로만 삼각형의 순서를 정해 놓는 방식이다.

참고로 OpenGL ES와 Direct X는 Triangulated Mesh 방법만 지원한다.

GPU 처리 과정

위와 같이 Vertex Array들을 정의했다면 이걸 CPU 메모리에서 GPU 메모리로 옮겨주는 과정이 필요하다.

CPU 메모리에서 VRAM으로 데이터를 넘기는 것은 꽤나 오랜 시간이 걸린다. 서로 독립적인 하드웨어이므로 이 과정을 최소화 해 줄 필요성이 있다.

이를 위해 OpenGL에서는 Buffer Object라는 것을 지원한다. 그 중 대표적으로 VBOs(Vertex Buffer Objects), IBO(Index Buffer Object)등이 있다.

VBOs와 IBO에 Vertex list와 index 정보를 저장하고 GPU에 한번에 넘겨주기만 하면, 다시는 오브젝트의 정보를 VRAM에 올릴 필요가 없어지게 된다.

OpenGL 코드는 나중에 알아볼 것이다.

Synthetic Camera

그래픽스에서는 현실 세계의 눈을 대신할 가상 카메라가 있다. 이를 Synthetic Camera라고 한다.

이 Synthetic Camera는 Perspective 모드와 Othographic모드가 있다. 위 사진은 Perspective 모드의 카메라를 나타낸 것이다.

과정을 간단하게 살펴보면, 3D 점 P에서 COP를 통과하는 선을 지나, Image plane과 닿는 곳이 2D 위치가 되는것이다. 두 모드에 대해서 각각 다뤄보겠다.

Perspective Mode

Perspective Projection

이렇게 Object가 있을때, 각 Vertex들과 COP를 연결한 Projector들과 plane이 만나는 점을 찾는 방식이다.

Othographic Projection

Orthographic 은 오히려 더 단순하다 그냥 Object와 plane을 연결해주면 된다. 근데 이때는 어떤 기준으로 연결하는지가 궁금할 수 있다. 그건 plane의 Normal Vector를 사용하면 될 것이다. 조금만 생각해보면 바로 이해가 될 것이다.

Clipping Planes

근데 그렇다고 해서 카메라를 바라보고 있는 물체(카메라에 인식되는)를 전부 그리는 것은 때때로는 불가능하거나 매우 비효율적일 수 있다.

그래서 있는 것이 Clipping planes이다.

이렇게 Front Clipping과, Back Clipping을 설정해서 Front Clipping plane부터 Back clipping plane까지만 그리도록 하고, 여기 안에 있는 물체들만 View plane에 그려주면 된다.

Extrinsic Parameters

외부 파라미터로는 우선 카메라의 포지션 (x, y, z) 그리고 Orientation (pitch, yaw, roll)이 있다. Orientation은 쉽게 말해 카메라 회전이라고 보면 된다. pitch는 끄덕, yaw는 도리, roll은 갸웃으로 생각하면 되는데, Synthetic Camera는 사람의 눈을 흉내낸 것이기에 직접 자기 눈으로 실험해보면 된다. 눈을 그대로 두고, 끄덕, 도리, 갸웃을 해보면 이해가 직관적으로 될 것이다.

FOV - Field Of View

게임을 할 때 정말 많이 들어보는 것인데, 말 그대로 시야각이다. 실제 현실세계의 카메라는 렌즈를 통해 시야각을 조정하지만 그걸 흉내내기 위해 만든 것이다.

zoom in, zoom out을 실행하기 위해 시야각, 혹은 크기를 조절한다. 이건 트릭에 가까운데 잘 생각해 보면, 물체를 카메라가 보고 있었다고 가정해보자. 여기서 만약 FOV, 즉 시야각을 줄이게 되면 view plane에 찍히는 값은 더 적어질 것이다. 근데 결국 view plane은 사용자의 화면 크기로 바뀌어서 그려지니, 결국 확대된 효과를 보는 것이다.

Orthographic에서는 원근감이 없으니, 그냥 view plane의 크기를 줄이면 해결될 것이다. 결국 둘 다 view plane의 크기를 줄이는 건 똑같다고 보면 된다.

Camera Viewport

아까 전, View plane이 사용자의 화면에 맞게 확대된다고 했지만 사실 코딩을 할 때 그렇게 되지 않도록 하고 싶을 수도 있다. 게임에서도 창모드를 지원하게 되면 특정 영역에만 게임이 표시되는 것처럼 view plane을 화면 어디에 얼마나 그릴지를 정할 수 있는데, 이게 바로 Viewport이다. Viewport는 그래서 x, y, width, height로 구성되어 있다.

Aspect Ratio는, Width와 Height의 비율을 의미한다. 대부분 모니터에서는 16:9를 사용할텐데, 이는 aspect ratio 16/9로 나타낼 수 있다.

현실 세계와 비슷하게 만들기

Model

최대한 현실과 같은 그래픽을 만들기 위해 현실을 모방하려고 노력해야 한다. 먼저, 모델링을 살펴보면 현실 세계에 있는 물체를 그래픽으로 표현하기 위해, Polygon을 사용하는 걸 볼 수 있다. 많은 수의 폴리건을 사용하게 되면 더 정교한 모델을 만들 수 있지만 그로 인해 발생하는 손해 또한 감수해야만 할 것이다.

Camera

모델을 만들었으면 이제 카메라를 구현해야 한다. 현실세계에서 우리는 눈을 통해 물체를 볼 수 있다. 이 눈을 모방한 것이 카메라라고 볼 수 있는데, View mode는 2가지가 있다. (Perspective, Orthographic)

Perspective는 원근법이 적용된 것이다. 인간의 눈과 유사한 것이라고 생각하면 되고, Orthographic은 원근감이 없는 것을 말한다. 그래서 거리와 상관없이 동일한 크기가 적용된다. 컴퓨터 구조상 존재하는 카메라 뿐 아니라 실제 카메라도 Orthographic을 제공하는 것이 있다.

Lights

현실세계의 빛은 정말 여러 종류가 있다. 이걸 다 구현하는 건 불가능하기 때문에 이와 유사하게 구현하기 위해서 몇개의 종류만 사용한다.

• Point light
• Directional light
• Spot light

Attributes

현실 세계에서 물체는 그저 구조만 존재하지 않는다. 재질, 굴곡, 색깔 등 다양하게 이루어져 있다. 이와 유사하게 구현하기 위해서, 많은 기법들을 사용한다.

위 내용들은 나중에 더 깊게 다뤄볼 것이다.

Rendering Pipeline

Rendering Pipeline은 컴퓨터 그래픽에서 데이터를 처리하는 순서, 과정이라고 생각하면 된다. Open GL에서는 다음과 같은 Rendering Pipeline이 있다.

Vertex processor

Vertex processor는 물체의 Vertices를 하나의 좌표계로 변환해준다. 이게 무슨 소리냐면 물체 그 자체의 정보는 고정되어 있지만 게임을 보면 물체는 계속 움직일 수도 있다. 그래서 미리 정해둔 특정 좌표계로 변환을 해서 물체가 원하는 위치에 갈 수 있도록 해 주는 것이다. 나중에 더 자세히 알아보겠다.

Clipping, Rasterization

Clipping은 소프트웨어적으로 구현할 수도 있지만 하드웨어가 지원해주기도 한다. Clipping은 쓸모 없는 것을 잘라낸다고 보면 된다. 오픈월드 게임을 생각해 보면 맵에 정말 수많은 오브젝트들이 있는데 안 보이는 것까지 전부 다 그려줄 필요는 없을 것이다. 

Rasterizer는 이 정보들을 실제 화면에 보여줄 정보들로 변환하는 과정을 진행한다. 즉, 픽셀로 변환해준다.

당연히도 모니터 픽셀은 한정되어 있기에 기존의 정보, 선들을 잘 유지하면서 변환하는 것이 중요할 것이다.

이렇게 생성된 픽셀 정보를 Fragment라고 부른다.

Fragment Processing

이제 이제 각 Fragment를 받아서 화면에 그리기 전, 각 Fragment의 색깔을 결정하는 작업이 남았다. 이때 이 색깔은 Texture에서 받아올 수도 있고, Vertex에 정보가 담겨져서 올 수도 있다. 위에는 설명을 안 했지만 Vertex Processor에서 Vertex를 반환할 때 색깔, Normal, 등등 여러가지 정보를 담아서 넘겨줄 수 있다.

또한, 빛 등 여러 요소들을 적용해서 색깔을 결정하는 단계이기도 하다.

이렇게 해서 나온 pixel들을 그려주면 끝이다.

Rendering Pipeline의 종류 & Shader

Fixed Rendering pipeline과 Programmable Rendering Pipeline이 있다. 요즘은 Fixed Rendering Pipeline은 거의 쓰지 않는다.

Fixed는 말 그대로 고정되어 있다는 뜻으로, 위 Rendering Pipeline의 Processor들을 변경할 수 없는 것을 말한다.

Programmable Rendering Pipeline은 자기 입 맛에 맞게 Programming을 해서 넣어줄 수 있어서 훨씬 많이 쓰는 방식이다.

이렇게 만든 Program을 Shader라고 한다.

컴퓨터 그래픽이란?

컴퓨터 그래픽이란, 컴퓨터를 이용해서 이미지를 제작하는 모든 작업을 말한다.

그래서, 영화, 게임, AI 등 여러 분야에서 사용되고 있으며, 영화에서 나오는 CG또한 Computer Graphics의 약자이다.

우리가 사진을 찍으면, 실물보다 훨씬 좋게 나올때가 많은데, 이 또한 인정하기 싫겠지만 카메라에 내장되어 있는 프로그램이 실제 사진을 보정하여 저장하기 때문이다.

이 섹션에서는 3D 그래픽에 대해 자세히 다룰 예정이다.

Global illumination vs Local illumination

3D 그래픽을 크게 2개로 구분하자면 Global illumination과 local illumination으로 나눌 수 있다.

Global illumination은 쉽게 말해, 영화에서 보는 CG, 현실 세계와 구분이 안 될 정도의 높은 퀄리티를 자랑한다.

Local illumination은 주로 게임이나, Mobile에서 사용되는데, 이는 실시간으로 빠르게 업데이트를 하기 위한 그래픽이다.

Global Illumination

Global illumination에서는 Ray tracing등을 적극 활용하여 최대한 현실세계와 유사한 Lighting을 만들어낸다. 현실세계에서의 빛은 물체에 반사되기도 하고, 흡수되기도 한다. 또한 어떤 물체에 반사된 빛이 다른 물체에 들어오기도 하는 등 연쇄 반응을 엄청나게 많이 일으킨다. 이 때문에 대낮에 불을 다 끄고 있더라도 미세한 광원이 들어오고 있다면 방 전체의 물체가 식별 불가능할 정도로 어둡지는 않은 것이다.

Global illumination은 이런 빛의 반사, 흡수 등을 최대한 현실세계와 유사하게 구현한다. 영화 CG를 만든다고 할 때, 30초짜리 CG로만 된 동영상을 만드려면 Rendering에만 엄청나게 많은 시간이 소요되는 것이 이 때문이다. 당연하게도 게임에서는 이 방식을 사용할 수가 없다.

Local Illumination

Local illumination에서는 이런 그래픽이 실시간으로 처리되는 것을 목표로 한다. 그래서 Global Illumination에 비해 많은 것들이 누락되어 있다. Phong reflection model 등을 사용하는데 이건 나중에 다룰 예정이다.

OpenGL

1992년에 생겨났고, Direct X와 같은 그래픽 라이브러리이다. 수많은 함수들을 제공하며, Graphic card를 사용할 수 있도록 한다. GPU 버전 마다 호환할 수 있는 Open GL version이 다른데, 이는 GPU 마다 제공할 수 있는 하드웨어가 제한되어 있기 때문이다. 게임이나 Blender와 같은 그래픽 디자이너 툴들은 대부분 OpenGL를 사용하고 있고, 그래픽 드라이버 업데이트에 최신 GPU를 호환할 수 있도록 해준다. 그래서 그래픽 드라이버를 꼭 업데이트를 해야 성능이 좋아지는 것이다.

OpenGL과 비슷한 것은, Direct X(Windows)와 Vulkan, Metal(Apple) 등이 있다. Direct X와 Metal은 각각 Windows와 Mac, Apple 제품에만 호환이 되고, Open GL과 Vulkan은 crosss platform으로 호환되고 있다.

Computer Graphics의 역사와 기초

기본 동작 시스템

기본 동작 시스템은 다음과 같다.

특정 데이터(이미지, 동영상, 3D model 등등)을 모니터에 그리기 위해서는 Buffer를 사용하게 된다. Frame Buffer는 비디오 디스플레이를 구동하는 비트맵이 담겨있는 RAM의 한 부분이다. 우리가 주로 사용하는 1920 x 1080 모니터는 1920 x 1080 픽셀을 가지고 있다. Frame buffer는 이 모든 픽셀의 색상값을 저장하는 버퍼이다. 버퍼가 전부 채워지면 화면에 그리는 방식으로 구성되어 있다. 사실 대부분은 Double Buffering을 사용한다. Frame Buffer가 2개 있다는 얘긴데 이건 다음에 설명하겠다.

역사

간단하게만 살펴보겠다.

1960년대에 생겨난 그래픽이다. 컴퓨터에 선을 직접 그려넣고 출력하는데 성공했다.

1970년대에는 이미지를 화면에 보여주게 된다. 

1980년대에는 더 현실감을 추가하는 기법이 발달하였다.

1990년대부터는 토이스토리와 같은 영화도 흥행하고, Texture Mapping등을 하드웨어가 지원하기 시작했다.

이후에는 그래픽 카드의 발달로 점점 더 상용화되고 PRT(Precomputed Radiance Transfer)등이 발달하였다. 이를 통해 게임에서도 Global illumination의 사용이 가능해졌다. Global Illumination을 미리 계산 하고, 계산된 것을 불러오는 방식으로 동작하는데, 이는 나중에 설명하겠다.

https://research.nvidia.com/labs/dir/edify-3d/

최근에는 이런식으로 3D 모델 또한 프롬프트로 생성할 수 있는 시스템이 정말 많아지고 있다.