겜돌이의 개발일지

앞서 이 포스팅은 홍정모의 그래픽스 Part2를 수강하고 작성한 내용입니다. 강의의 세부 코드는 첨부하지 않고, 결과와 이론 위주로 포스팅했습니다. 개요 까맣게 칠해져있는 화면이 있다. 이전에 레이트레이싱을 응용해서 그렸던 (https://gamedoridori.tistory.com/293) 삼각형을 이번엔 레스터화를 응용해 그려볼 것이다. 이전에는 시점에서 모든 픽셀 방향으로 Ray를 쏴 충돌한 오브젝트를 그려줬다. 하지만 이런 방법은 모든 픽셀을 순회해야 하고, 충돌한 오브젝트마다 거리를 비교해줘야 한다는 점에서 느리다. 따라서 이번엔 레스터화를 사용한다. 레스터화는 반대로 물체의 vertex에서 시점방향으로 Ray를 쏴준다. 그리고 스크린에 충돌한 지점을 기준으로 삼각형을 그리고, 각 픽셀이 삼각형..

앞서 이 포스팅은 홍정모의 그래픽스 Part1을 수강하고 작성한 내용입니다. 강의의 세부 코드는 첨부하지 않고, 결과와 이론 위주로 포스팅했습니다. 개요 투명한 구를 그리고자 한다. 아직 투명한 물체를 어떻게 렌더링할 지 코드가 작성되지 않았기 때문에 까맣게만 뜨는 모습이다. 투명한 물체에서의 빛의 굴절 투명한 구를 바라봤을 때, 구에 들어갈 때 한 번, 구에서 나올 때 한 번, 총 두 번 빛의 굴절이 일어나게 된다. 이때 굴절이 얼마나 일어나는지는 다음 과정을 통해 구할 수 있다. 벡터 d가 구로 들어갈 때 이전 강의에서처럼 전반사되는 경우도 있고, 지금처럼 매질이 다른 경우 벡터 t 방향으로 꺾이기도 한다. 굴절된 빛을 t라고 하자. 공기중에서 유리로 빛이 들어가면 밀도가 빽빽해지므로 -n 방향으로 ..

앞서 이 포스팅은 홍정모의 그래픽스 Part1을 수강하고 작성한 내용입니다. 강의의 세부 코드는 첨부하지 않고, 결과와 이론 위주로 포스팅했습니다. 개요 위 이미지의 구에 반사 효과를 주고자 한다. 반사 효과를 넣게 되면 아래 배경도 비춰질 것이고, 옆의 구 또한 비춰질 것이다. 반사 효과 어떤 충돌 지점 hit가 있을 때, d는 관측 지점에서 hit까지 오는 벡터이고 n은 hit에서의 노말벡터라고 하자. 우리가 구해야 하는 것은 d가 hit에 도달한 뒤, 같은 각도로 반사되는 벡터 r인데, r은 2m -d로 구할 수 있다. m을 구하는 방법은 -d의 n 위로의 그림자 벡터를 구하고, d와 그림자 벡터를 더하면 m을 구할 수 있다. 위 과정을 거치면 r 벡터를 구할 수 있고, hit 지점에서 다시 r 방..

앞서 이 포스팅은 홍정모의 그래픽스 Part1을 수강하고 작성한 내용입니다. 강의의 세부 코드는 첨부하지 않고, 결과와 이론 위주로 포스팅했습니다. 개요 위와 같은 화질 낮은 이미지가 있다. 구의 이미지가 계단식으로 많이 깨지는 것을 볼 수 있다. 슈퍼샘플링을 사용하면 이런 계단 현상을 완화할 수 있다. 다만, 슈퍼샘플링에는 더 많은 Ray 연산이 들어가기 때문에 당연하게도 렌더링 속도가 느려진다. 따라서 실시간 그래픽스파이프라인에서는 슈퍼샘플링보다는 블러를 사용해 계단 현상을 해결하는 경우도 있다고 한다. 원리 원래라면 관찰자에서 픽셀로 하나의 Ray만 쏴서 컬러를 결정하지만, 슈퍼샘플링에서는 여러 Ray를 쏴주고, 이 Ray에서 충돌한 색깔의 평균값으로 픽셀의 색깔을 결정하게 된다. Ray를 쏘는 방..

앞서 이 포스팅은 홍정모의 그래픽스 Part1을 수강하고 작성한 내용입니다. 강의의 세부 코드는 첨부하지 않고, 결과와 이론 위주로 포스팅했습니다. 개요 텍스처링이란, 픽셀의 색깔을 정할 때 색깔을 단순히 다른 이미지의 색깔에서 가져오는 방법이다. 정교한 3차원 모델을 쓰는 것 보다, 단순한 vertex에 그냥 이미지를 덧씌운게 더 사실적으로 보일 수가 있기에 텍스처링을 자주 사용한다. 덧씌울 때에는 uv좌표를 interploation하면서 사용하는데, 앞서 포스팅한 무게중심좌표계를 알고 있다면 uv좌표 보간 과정을 더 쉽게 이해할 수 있다. DirectX에서는 uv좌표의 좌상단이 (0, 0), 우하단이 (1, 1)이 된다. 텍스쳐 좌표에서 어떤 색깔 값을 가져오는 과정을 샘플링(Sampling)이라고 ..

앞서 이 포스팅은 홍정모의 그래픽스 Part1을 수강하고 작성한 내용입니다. 강의의 세부 코드는 첨부하지 않고, 결과와 이론 위주로 포스팅했습니다. 개요 삼각형에 색깔을 넣고자 한다. 현재에는 파란색으로만 색칠되어 있는데, 왼쪽 아래부터 꼭짓점부터 시계 방향으로 각각 빨간색, 초록색, 파란색으로 설정한 뒤 그 사이는 색깔들을 보간해서 나타내고자 한다. 그렇다면 빨간색 꼭지점에 가깝다면 빨간색의 비율이 높을 것이고, 파란색 꼭짓점에 가깝다면 파란색 비율이 높을 것이란 추측을 할 수 있는데, 삼각형 내부 P의 색깔은 어떻게 결정해줘야 할까? 무게 중심 좌표계(Barycentric coordinates) 삼각형의 각 꼭지점에서 내부의 점 P에 선을 그으면 작은 삼각형 3개를 만들 수 있다. 위 그림에서 A1을..

앞서 이 포스팅은 홍정모의 그래픽스 Part1을 수강하고 작성한 내용입니다. 강의의 세부 코드는 첨부하지 않고, 결과와 이론 위주로 포스팅했습니다. 개요 광원과 구에 의해서 생기는 그림자를 아래 사각형에 그려줘야 한다. 그림자 여기서는 물체에서 다시 광원으로 Ray를 쏴주는 방식으로 구현한다. 관측지점에서 각각 픽셀의 월드좌표에 Ray를 쏴주면 제일 먼저 충돌한 오브젝트를 찾을 수 있다. 그 충돌 지점에서 다시 광원방향으로 ShadowRay를 쏴준다. ShadowRay의 시작점은 충돌지점(hit.pos), 방향은 광원 방향(light.pos - hit.pos)이 될 것이다. 이때 충돌지점에서 바로 시작하면 자신과 충돌했다고 판별할 수 있으니 시작 위치를 광원 방향으로 조금 당겨준다. 여기서 다른 물체와 ..

앞서 이 포스팅은 홍정모의 그래픽스 Part1을 수강하고 작성한 내용입니다. 강의의 세부 코드는 첨부하지 않고, 결과와 이론 위주로 포스팅했습니다. 개요 앞선 강의에서는 구를 그렸는데, 이번에는 삼각형을 그려보고자 한다. 구를 그릴 때와 같이, 삼각형을 그릴 때는 Ray가 삼각형 내부를 지나가는지 지나가지 않는지 확인하는 작업이 필요하다. 이를 IntersectRayTriangle 함수라고 하고, 매개변수로 활용하는 정보는 다음과 같다. orig : Ray의 시작점 dir : Ray의 방향인 v0, v1, v2 : 삼각형의 세 좌표 또한 매개변수를 레퍼런스로 받아 저장해줘야하는 정보는 다음과 같다. point : Ray와 삼각형의 충돌 지점 faceNormal : 삼각형의 법선 벡터 t : Ray에서 p..

앞서 이 포스팅은 홍정모의 그래픽스 Part1을 수강하고 작성한 내용입니다. 강의의 세부 코드는 첨부하지 않고, 결과와 이론 위주로 포스팅했습니다. 개요 현재까지의 레이트레이싱은 각 픽셀에서 z축 방향으로(vec(0.0f, 0.0f, 1.0f 방향으로) 빛을 쏴줬기 때문에 원근감이 없다. 위의 구 3개는 반지름이 모두 같지만 파란색이 제일 뒤, 초록색이 가운데, 빨간색이 제일 가까이에 있다. 위 그림에는 2개의 문제점이 있는데 1. 원근감이 없기 때문에 세 구의 크기가 같아 보인다. 2. 파란색 구가 제일 뒤에 있고, 빨간색 구가 제일 앞에 있지만 렌더링할 때 이를 고려하지 않아서 초록색이 파란색, 빨간색이 초록색과 파란색에 가려지게 된다. 이 2가지 문제점을 해결해 볼 것이다. 원근감 주기 위에서 말한..

앞서 이 포스팅은 홍정모의 그래픽스 Part1을 수강하고 작성한 내용입니다. 강의의 세부 코드는 첨부하지 않고, 결과와 이론 위주로 포스팅했습니다. 개요 퐁 쉐이딩(Phong reflection model)은 1975년 Bui Tuong Phong가 발표한 기술로, 광원에 따라 물체를 Ambient, Diffuse, Specular로 나눠 그리는 방법이다. 최근에는 훨씬 더 발전했기 때문에, 퐁 쉐이딩으로 물체를 그리는 것보다 더 실감 나게 그릴 수 있는 기술들이 많이 나왔다고 한다. Ambient ambient는 조명에 영향을 받지 않는 그 물체의 단순한 색상을 나타낸다. 따라서 조명이 없어도 ambient의 색깔이 기본적으로 나오게 되는데, 그래서 물리적인 사실과는 거리가 있다는 것을 숙지해야 한다...