[Graphics] 그래픽스 기초

버텍스란?

struct Vertex {
    float x, y, z;       // 위치
    float r, g, b;       // 색
    float nx, ny, nz;    // 법선
    float u, v;          // 텍스처 좌표
};

3D 모델이나 장면에서 위치, 색, 법선, 텍스처 좌표 등의 정보를 담고 있는 점

다각형(주로 삼각형)을 구성하는 기본 단위, GPU는 이 버텍스 정보를 기반으로 화면에 물체를 렌더링함

 

버텍스 처리 과정

1. 버텍스 셰이더

- 버텍스 데이터를 입력받아 화면에 보이도록 변환 (ex. 모델 -> 월드 -> 카메라 좌표계)

 

2. 클리핑 및 정규화

- 화면 밖으로 나간 버텍스를 제거하고 정규화된 좌표로 변환

 

3. 래스터화

- 버텍스로 구성된 삼각형을 픽셀 단위로 변환

 

4. 프래그먼트 셰이더

- 각 픽셀의 최종 색을 계산 (텍스처, 조명 등 반영)

 

단순한 점이 아니라 모양 + 질감 + 조명

 

---

 

픽셀이란?

화면을 구성하는 가장 작은 단위

Picture Element, 이미지를 이루는 작은 점

 

픽셀의 구성 (색상 표현)

-  RGB or RGBA

 

픽셀과 해상도

해상도: 화면 또는 이미지에 포함된 픽셀의 수를 의미

 

픽셀 vs 버텍스

구분	픽셀(Pixel)	버텍스(Vertex)
정의	화면의 점	3D 모델의 꼭짓점
위치	2D 화면 공간	3D 모델 공간
역할	화면에 색을 찍는 단위	모델을 구성하는 기하 구조
처리 시점	프래그먼트 셰이더 이후	버텍스 셰이더에서 처리됨

 

---

 

왜 삼각형이 기본 도형인가?

수학적 단순함, 안정성, 처리 효율 등의 실용적인 이유

 

1. 항상 평면이다

- 세 점으로 이루어진 삼각형은 언제나 하나의 평면에만 위치

- 네 점 이상으로 만든 사각형은 비틀어지거나 평면에서 벗어날 수 있음 => 그래픽 오류 발생 가능

- 삼각형은 변형이나 왜곡 없이 안정적으로 렌더링할 수 있음

 

 

2. 간단한 수학적 연산

- 내부 보간이나 면적 계산, 조명 처리가 삼각형에서 수학적으로 간단함

- 버텍스 셰이더, 프래그먼트 셰이더에서 효율적 계산 가능

 

3. 복잡한 도형도 삼각형으로 나눌 수 있음

- 복잡한 모델은 모두 삼각형의 집합으로 변환 가능 (삼각 분할, Triangulation)

 

삼각형 외의 도형도 쓰이긴 하는데,

최종적으로 GPU 내부에서는 모두 삼각형으로 변환되어 처리된다

 

---

 

텍스처란?

3D 모델의 표면에 입히는 이미지

 

---

 

UV 좌표란?

2D 텍스처 이미지의 위치를 지정하는 좌표계

3D 모델의 표면과 2D 텍스처 이미지를 정확히 대응시키기 위해 사용하는 좌표

- 텍스처 이미지에서의 2D 좌표

- 일반적으로 0.0 ~ 1.0 사이의 실수

- X, Y 대신 U, V 사용 (3D 공간 좌표랑 혼동 방지)

 

모델링 소프트웨어는 모델의 각 버텍스에 UV 좌표를 지정

UV 언래핑을 통해 3D 모델을 평면으로 펼쳐 텍스쳐와 대응 시킴

GPU의 프래그먼트 셰이더는 UV 좌표를 사용해 텍스처에서 색상을 추출

 

UV(0.0, 0.0) -> 이미지의 왼쪽 아래

UV(1.0, 1.0) -> 이미지의 오른쪽 위

UV(0.5, 0.5) -> 이미지의 중앙

---

 

모델 좌표계 / 월드 좌표계 / 뷰 좌표계 / 클립 좌표계의 차이점은?

 

객체가 화면에 보이기까지 여러 단계의 좌표계 변환이 일어나는데, 각각의 좌표계는 다른 기준과 목적을 가지고 있음

단계	좌표계 이름	기준	설명
①	모델 좌표계 (Model Space)	객체 자체	모델링할 때 사용한 좌표계 (ex. 캐릭터 중심이 원점)
②	월드 좌표계 (World Space)	씬 전체	모델이 씬 안에서 어디에 있는지를 나타냄
③	뷰 좌표계 (View / Camera Space)	카메라	카메라를 기준으로 본 좌표 (카메라가 원점)
④	클립 좌표계 (Clip Space)	렌더링 준비	투영 행렬로 원근감 적용 후 정규화 전 좌표

 

모델 좌표계

- 모델 자체의 내부 좌표

- 기준점은 보통 (0, 0, 0)

- 모델링 소프트웨어에서 작업할 때 사용하는 기준

 

월드 좌표계

- 씬 전체 기준의 좌표

- 각 객체가 씬 안에서 어디에 배치되었는지를 나타냄

- 모델 변환(Model Matrix)으로 모델 좌표 -> 월드 좌표

 

뷰 좌표계

- 카메라가 원점인 좌표계

- 카메라 변환(View Matrix)을 적용하여 월드 좌표 -> 뷰 좌표로 변환

 

클립 좌표계
- 투영 행렬(Projection Matrix)을 통해 뷰 좌표에 원근감 부여

- 이 단계까지의 결과는 NDC에서 -1.0 ~ 1.0의 정규화된 공간으로 변환됨 (NDC, Normalized Device Coordinates 준비 단계)

- 래스터화 직전에 사용하는 좌표

- 동차 좌표 (homogeneous coordinates) - (x, y, z, w)

 

* w?

행렬로 투영같은 복잡한 변환을 하기 위해 도입된 수학적 장치

w는 원근감을 만듦

멀리 있는 물체일 수록 w가 커짐

=> NDC 좌표계에서 정규화되며, 멀어질 수록 작아 보임

 

Clip = Protection x View x Model x Vertex

 

NDC 좌표계
- 좌표가 -1 ~ 1로 정규화됨

- 클립 좌표계 기준 (x, y, z, w) => (x/w, y/w, z/w)

 

스크린 좌표

- 뷰포트 변환

- 픽셀 위치로 변환된 최종 좌표 (화면 렌더링용)

 

---

 

렌더링이란?

모델, 텍스처, 조명 등의 데이터를 이용해 최종 이미지를 생성하는 과정

-> 3D 씬을 계산해서 2D 화면에 그리는 것

 

정의: 3D 장면을 2D 이미지로 변환하는 과정

대상: 버텍스(점), 메시(형태), 텍스처(무늬), 조명, 그림자 등

결과: 우리가 화면에서 보는 실제 이미지 (픽셀 단위)

 

렌더링의 주요 흐름

1. 모델 데이터 준비

- 3D 객체, 버텍스, 텍스처 정보 등 로딩

 

2. 변환 (Transformation)

- 모델 - 월드 - 뷰 - 클립 - NDC - 스크린 좌표

 

3. 래스터화 (Rasterization)

- 삼각형을 픽셀 단위로 분해

 

4. 프래그먼트 셰이딩 (Fragment Shading)

- 각 픽셀의 색상, 텍스처, 조명 계산

 

5. 출력 (Framebuffer)

- 화면에 최종 이미지로 출력

 

* 모델링?

객체의 형태(모양)를 만드는 작업

- 버텍스

- 엣지 (두 버텍스를 연결한 선)

- 페이스 / 폴리곤 (3개 이상의 버텍스로 이뤄진 면, 보통 삼각형이나 사각형)

 

---

 

GPU와 CPU의 역할 차이

항목	CPU (중앙처리장치)	GPU (그래픽처리장치)
주 역할	범용 연산, 논리 처리, OS 제어 등	대규모 병렬 그래픽/수치 연산
최적화 방향	속도 + 복잡한 연산 처리 능력	병렬성 + 대량 데이터 처리
코어 수	소수의 강력한 코어 (4~16개)	수백~수천 개의 코어 (CUDA, Stream Processor 등)
예시 작업	물리 시뮬레이션, AI 판단, 게임 로직	화면 렌더링, 셰이더 계산, 딥러닝
메모리 접근	일반 RAM 사용	전용 VRAM 사용 (빠름)
처리 단위	하나하나 정밀하게	여러 개 동시에 대충 빠르게

 

---

 

쉐이더란?

GPU가 실행하는 작은 프로그램 (GLSL, HLSL 등으로 작성)

빛, 색상, 텍스처, 그림자 등 시각 효과를 계산하여 최종 이미지를 만들어냄

 

종류 역할 주요 작업

종류	역할	작업
버텍스 쉐이더	각 버텍스(정점) 처리	위치 변환, 조명 계산, UV 전달
프래그먼트 쉐이더 (또는 픽셀 쉐이더)	픽셀 단위 처리	최종 색상 계산, 텍스처 샘플링, 그림자 적용
지오메트리 쉐이더	버텍스 → 프리미티브 생성	선, 면 추가 생성 (옵션)
테셀레이션 쉐이더	메시 분할 제어	곡면을 더 정밀하게
컴퓨트 쉐이더	일반 병렬 연산	렌더링 외 GPU 연산 (딥러닝, 물리 등)

 

버텍스 쉐이더

- 각 버텍스를 입력으로 받아 변환

- 모델 좌표 -> 클립 좌표로 바꾸는데 사용

- 조명 계산, UV 전달도 가능

 

프래그먼트 쉐이더

- 각 픽셀에 어떤 색을 칠할지 계산

- 텍스처 샘플링, 빛 반사, 그림자, 투명도 등을 담당

 

지오메트리 쉐이더

- 버텍스 그룹(점, 선, 삼각형)을 받아 새로운 도형을 생성 가능

 

테셀레이션 쉐이더

- 저해상도 메시를 자동으로 세밀하게 분할

- 고품질 곡면 표현에 사용

 

컴퓨트 쉐이더

- 전통적인 렌더링과 무관한 일반 연산(GPGPU) 처리용

 

---

 

FPS(Frame per Second)와 렌더링 성능의 관계

FPS는 초당 화면이 몇 번 그려지는지 나타내는 수치

렌더링 성능이 좋을 수록 FPS가 높고, 성능이 떨어지면 FPS도 같이 떨어짐

 

렌더링 성능

= 한 프레임을 얼마나 빠르게 계산할 수 있는가

 

FPS = 1 / 프레임 당 렌더링 시간(sec)

 

렌더링 성능에 영향을 주는 요소들

- 폴리곤 수

- 텍스처 해상도

- 조명/그림자 계산

- 셰이더 복잡도

- 후처리 효과

- 해상도

 

* VSync?

GPU의 렌더링 속도를 모니터 주사율에 맞춰 강제로 동기화하는 기술

화몇 찢어짐 현상 방지

Vertical Sync.. -> 수직 동기화

- GPU가 프레임을 빠르게 렌더링해도 다음 화면 주사 시점이 올 때까지 기다림

 

* DLSS

낮은 해상도로 실제 렌더링을 수행하고 AI로 고해상도 이미지를 예측하고 보간하는 기술

- 렌더링해야 할 픽셀 수를 줄이고

- 출력은 고해상도로 유지

=> 렌더링 부하 감소