Ciel45's 게임 개발 블로그

이번엔 코딩을 통해 실제로 텍스쳐를 입혀볼 것이다. 먼저 디스크에 저장된 이미지 파일을 메인 메모리에 로드해야하는데, 처음이면서도 가장 어려운 부분이다.다행히도 이걸 손쉽게 할 수 있게 해주는 라이브러리가 있다. stb라는 라이브러리로, 헤더 파일 하나로만 이루어진 매우 가벼운 라이브러리이다.https://github.com/nothings/stb/blob/master/stb_image.h stb/stb_image.h at master · nothings/stbstb single-file public domain libraries for C/C++. Contribute to nothings/stb development by creating an account on GitHub.github.com stb_..

텍스쳐의 좌표는 앞선 포스팅에서 설명한 바와 같이 (0, 0) ~ (1, 1) 사이의 값을 가진다. 그런데 프로그래머가 고의로든, 실수로든 0 미만 / 1 초과의 좌표값을 할당했다면, 그 부분은 어떻게 처리해줘야 할까? 이때의 처리 방식을 정해주는 것이 Texture Wrapping이다.  OpenGL이 제공해주는 옵션들은 다음과 같다.  GL_REPEAT텍스쳐를 여러개 이어붙인 것처럼 처리한다.좌표로 (1.5, 1.5)를 주었다면, 3x3 이미지 중 우측 상단의 이미지의 가운데의 텍셀을 떼올 것이다.횡스크롤 게임의 배경 등에 사용되는 방식이다. 처음과 끝을 자연스럽게 이어지도록 해서 반복시키면 가로로 긴 맵이어도 배경 리소스가 많이 필요하지 않기 때문.GL_MIRRORED_REPEATGL_REPEAT랑..

이전 포스팅에서 Nearest Filtering, Linear Filtering을 다뤘었다. Linear Filtering의 경우 Nearest Filtering보다 더 깨끗한 화면을 제공해주기는 하지만, 그래도 Minification 발생시 지저분해보이는 것은 여전하다. 원래 aliasing(왜곡)은 Minification에서 가장 두드러질 수밖에 없다. 한 픽셀 안에 정말 많은 텍셀이 우겨들어간다면, Linear Filtering도 의미가 없어지기 때문이다.  이렇게 골칫거리인 Minification 문제를 해결하기 위한 것이, Mipmap이다. Mipmap이란, 미리 텍스쳐 이미지를 축소하여 모아놓은 것이다.여기서 축소란, resolution을 줄였다고 생각하면 된다.  원래 Minification..

텍스쳐는 오브젝트에 붙일 수 있는 일종의 스티커라고 이야기할 수 있다. 일반적으로 2D 이미지 파일을 사용한다.(일부 경우에는 3D 텍스쳐를 쓰기도 한다. (언리얼 엔진의 volumetric fog 등))  텍스쳐는 위와 같이 (0,0) ~ (1,1) 범위의 좌표계를 사용하며, 보통 x축을 S, y축을 T라고 표현한다. 또한 텍스쳐는 이미지 파일이기 때문에 그 자체로도 픽셀을 가지는데, 이를 텍셀(texel)이라고 칭한다.후술하겠지만, 이 텍셀로 인해 골치아픈 일이 많이 발생한다. 텍스쳐를 오브젝트에 칠할 때는, 우선 모델의 각 버텍스에 텍스쳐 좌표를 지정해준다.예를들면 삼각형 모양의 모델이 존재하고, 각 버텍스의 텍스쳐 좌표가 (0, 1), (1, 0), (0, 0)이라고 하자. Vertex Shade..

키보드/마우스를 통해 카메라를 조작하며 물체를 볼 수 있는, 일종의 뷰어 프로그램을 만들 것이다.  카메라를 다루기 전에, GLFW가 받은 인풋을 먼저 처리하는 것은 Window가 될 예정이다. 따라서 Window 클래스에 대해 먼저 살펴보고자 한다.  현재 Window 클래스는 다음과 같다. (이론적인 내용 없는 단순 코딩이므로 접어둠)더보기Window.h:#pragma once#include #include #include class Window{public: /* (생략) */ bool* getsKeys(){return keys;} // 키보드 입력 현황 GLfloat getXChange(); // 마우스 위치의 x축 변화 GLfloat getYChange(); // 마우스 위치의 y축 변화 ..

지난 포스팅에서 ModelView Matrix를 통해 물체의 버텍스의 좌표를 Object Space에서 View Space로 바꾸는 것까지 하였다. 이번엔 View Space 기준 좌표를 Clip Space 기준 좌표로 변환할 것이며, Projection Matrix가 이 역할을 해준다.  우선 배경 설명을 먼저 하자면, 그래픽스에서 카메라의 Projection은 주로 두 가지 타입으로 나뉜다.하나는 Perspective, 하나는 Orthographic이다. 유니티 엔진을 다뤄보신 분들이라면 익숙할 것이다. Orthographic은 주로 2D 어플리케이션에서 사용되고, Perspective는 주로 3D 어플리케이션에서 사용된다. 간단히 말하자면 Perspective는 원근감을 반영한 것, Orthogra..

카메라에 대한 포스팅을 적기 전, 이 두가지 행렬에 대한 글을 적고자 한다. ModelView Matrix는 물체의 버텍스의 좌표를 Object Space에서 View Space로 바꿔준다.이는 물체 자체를 중심으로 하는 좌표계에서, 카메라를 원점으로하는 좌표계로 바꿔준다는 의미이다. 앞선 포스팅에서 T * R * S 로 Model Matrix를 만들어, 이를 통해 물체를 움직인 바가 있었다.https://ciel45.tistory.com/89 [OpenGL] Model Matrix를 통한 물체 조작(Translate, Rotate, Scale)이번엔 지난 번에 만들었던 삼각형을 조작해볼 것이다.기본적으로 물체에 대한 조작은 선형 변환으로 이루어진다. 위키백과에 선형 변환을 검색하면 임의의 벡터에 대하여..

프로그래머가 GPU로 넘겨주는 것은 버텍스에 관한 정보이지만, GPU가 만들어내는 최종 결과물은 각 픽셀에 대한 정보이다. 따라서 GPU의 임무는 서로 떨어져있는 버텍스들을 이어 도형(폴리곤)들을 만든 뒤, 그 폴리곤을 픽셀의 집합으로 만드는 것이다.픽셀의 집합으로 만든다는 것은, 곧 폴리곤을 픽셀로 채운다는 이야기이다. 이렇게 폴리곤을 픽셀의 집합으로 바꾸는 과정을 Polygon Rasterization이라고 한다.  여기에 사용되는 메커니즘이 바로 Bilinear Interpolation이다.한국어로 하면 이중 선형 보간인데, 말 그대로 선형 보간을 이중으로 하는 것이다.  위 이미지가 버텍스 3개로 이루어진 폴리곤이라 가정하고, vA, vB, vC 버텍스의 컬러가 각각 빨강, 초록, 파랑이라고 하자..

이번엔 지난 번에 만들었던 삼각형을 조작해볼 것이다.기본적으로 물체에 대한 조작은 선형 변환으로 이루어진다. 위키백과에 선형 변환을 검색하면 임의의 벡터에 대하여... 임의의 스칼라에 대하여... 이런 식으로 길게 설명이 되어있는데, 그냥 단순히 말하자면 앞에 행렬을 곱하는 것이다. 물체가 가지는 벡터(버텍스의 위치)에 행렬들을 곱해서, 그 벡터를 변화시키는 것이 선형 변환이라고 할 수 있다. 지금까지 삼각형을 그릴 때  vShader 내부에서 gl_Position = vec4(pos,  1.f); 를 사용하여 각 버텍스의 좌표를 그대로 넣어줬었다. 이번엔 이 vec4(pos,  1.f)의 앞에 적절한 행렬을 곱하여, 삼각형을 움직이고, 회전시키고, 크기를 조정해볼 것이다.그림으로 나타내면 다음과 같다...

쉐이더를 사용하기에 앞서 렌더링 파이프라인에 대해 설명하자면,렌더링 파이프라인은 GPU 내부에서 화면을 렌더링하기 위해 돌아가는 시퀀스이다. GPU는 내부적으로 Vertex를 인풋으로 받아서, Pixel을 아웃풋으로 뱉어낸다.그 중간 과정에서 렌더링 파이프라인이 돌아가며, 핵심 과정은 다음과 같다. Vertex Processor: 버텍스를 인풋으로 받아, 버텍스 정보들을 처리한다. 주로 버텍스들의 위치 정보를 선형변환을 통해 Object-Space에서 Clip-Space로 변환한다.Primitive Assembler : 버텍스들을 이용해 폴리곤(primitive)들을 만든다.Rasterization : 폴리곤을 픽셀의 집합으로 만든다.Fragment Processor : 각 픽셀들의 최종 결과를 처리한다..