3D Client Programmer

설명

blog.naver.com/PostView.nhn?blogId=daehuck&logNo=220449224224&parentCategoryNo=&categoryNo=&viewDate=&isShowPopularPosts=false&from=postView

설명 

blog.naver.com/PostView.nhn?blogId=daehuck&logNo=220450852220&parentCategoryNo

Unity에서의 설명

docs.unity3d.com/560/Documentation/Manual/PostProcessing-ScreenSpaceReflection.html

이 기술은 쉽게 말하면 2D 영상을 3D 영상인 것 처럼 보여주는 기술이다.

페이스북 3D 사진과 같은 기술이라고 보면 된다.

페이스북 3D 사진에서 Depth Map을 만드는 것은 딥러닝으로 동작하지만, 3D인 것 처럼 보이게 하는 것은 바로 이 기술이다.

blog.naver.com/PostView.nhn?blogId=choics79&logNo=221384647999

알고리즘의 이해를 위한 참고 사이트 및 자료

gyutts.tistory.com/175

graphics.cs.brown.edu/games/SteepParallax/

graphics.cs.brown.edu/games/SteepParallax/mcguire-steepparallax.pdf

참고 사이트 : http://www.byclb.com/TR/Tutorials/volume_rendering/Index.aspx

1. Bounding Box

3D World에서 교차 검사는 매우 중요한 이슈이다. 게임을 예로 들자면, 캐릭터끼리 충돌 검출도 해야하고 마우스 Picking도 해야되고 타격 판정도 해야된다. 이외에도 많이 사용되고 있다.

그래서 캐릭터 모델의 특정 범위, 지형 구조물 등에 충돌 판정을 위한 박스나 단순한 모양의 Bounding Volume을 씌운다.

그렇게 복잡한 메쉬끼리 교차 검사를 하는 것이 아니라 단순한 Volume들 끼리 교차 검사를 하는 것이다.

가장 많이 쓰이는 모양이 box이고, 이 box에는 2가지의 종류가 있다.

2. AABB (Axis-Aligned Bounding Box)

기저 축에 정렬된 충돌 박스로 박스를 이루는 면의 노말 벡터들이 곧 X, Y, Z 축과 일치하는 모양이다.

모델을 이루는 다각형의 X, Y, Z 좌표의 최소 최대를 각 박스의 버텍스로 생성한다.

따라서 회전함에 따라 크기가 계속 변하게 된다.

축에 일치된 모양이기 때문에 AABB끼리의 충돌 검출은 매우 간편하다.

3. OBB (Oriented Bounding Box)

AABB와 마찬가지로 박스를 이루는 세 면은 서로 수직이지만 해당 면의 노말 벡터가 X, Y, Z와 일치하지 않는 박스이다.

X, Y, Z와 일치하지 않기 때문에 AABB보다 충돌 검출의 시간 복잡도는 높지만 충돌 박스가 XYZ 좌표를 기준으로 최대, 최소로 계속 변하는 AABB보다 항상 좀 더 fit한 바운딩 박스를 만들 수 있다.

출처 : http://hoodymong.tistory.com/8

Dithering (디더링)

- 요약

디더링은 해당 픽셀에 요청된 색상이 컴퓨터의 지원 컬러에 없는 색상이면, 다른 색상들을 섞어서 비슷한 색상으로 대체하기 위해 컴퓨터 프로그램에 의해 시도되는 것이다. (오디오 쪽에서는 노이즈를 이용한 방법이 있다....)

- 심화

컴퓨터 그래픽스에 있어서 (흑백 표시 장치나 단색 프린터로) 그레이의 음영변화, 또는 (컬러 표시 장치나 컬러 프린터로) 추가색의 음영 변화의 착각을 생성할 때 사용디는 수법이다. 혼합에서는 어느 이미지의 영역을 여러 가지 패턴으로 착색된 도트의 집합으로서 처리한다. 인쇄 이미지에 가까운 것을 하프톤이라하고, 약간 점묘화법으로 그려진 그림과 비슷하다. 혼합은 각각의 효과를 평균화한다든지 묶어서 하나의 음영 또는 색이라고 인식하도록 인간의 눈이 갖는 성질을 이용하고 있다. 하나의 영역 내의 흰 점과 검은 점과의 비율에 따라서 그 영역은 전체로서 그레이로 보인다. 마찬가지로 붉은 점 중에 흰 점을 섞으면 핑크와 비슷한 색조가 된다. 혼합은 컴퓨터 그래픽스에 현실감을 가한다든지, 해상도가 낮을 때 곡선이나 직선에 나타나는 날카로운 부분을 매끄럽게 하는 데 사용된다. 제한된 수의 색상들을 섞어서 다양한 색을 만들거나 현재 팔래트에 존재하지 않는 컬러를 컬러 패턴으로 대체하여 유사한 컬로로 표현하는 기법으로 포토샵에는 디더링을 조절하는 옵션으로 Diffusion과 Pattern이 있다.

- Diffusion : 색상간의 경계를 자연스럽게 흩어 주는 방법

- Pattern : 이미지를 삼베 같은 패턴으로 거칠게 만드는 방식

                                                  (24bit Color)                           (8bit Color)

(Diffusion Dither)

(Pattern Dither)

출처 : http://kbp.kongju.ac.kr/cg_edu/cg1_data/5week_4.htm

출처 : http://www.realitymod.com/forum/f189-modding-tutorials/90244-pixel-bleeding-uv-spacing-texture-padding.html

What is Pixel Bleeding?

Pixel Bleeding is to put it as simple as possible, pixel colours on a 2D texture image bleeding into each other due to compression or the size of the texture being decreased, like in a MipMap (which BF2 and many other games use MipMaps so its quite important).

 

Pixel Bleeding itself can not really be avoided. It can be cut down slightly by using a better image format (if available, which in BF2's case the answer most of the time is no) or it can be cut down by using a better image compression tool, like for DDS images, instead of using the Photoshop DDS plugin, use the NVIDIA Texture Tools 2 which will give you a better compression result and will result in less pixel bleeding, but in most cases the difference is marginal.

However saving the texture in a better format or with a better compression tool on its own will not get rid of pixel bleeding, it will only reduce it. The best way to avoid Pixel Bleeding on your models/textures is to simply spacing out your UVs far enough so any bleeding that dose occur on the texture dose not show up on the model.


To demonstrate pixel bleeding I've crated this very simple box with a pyramid on top 

Here are some basic UVs I've quickly done with no spacing between the UVs:


Now I've made this texture up quickly which gives each face of the UV its own, unique colour that also matches the UVs and then compressed the texture as a .jpg, which is like a .dds but you can see the compression effects better.


Looking at the texture from here you will hardly be able to see any problems with it but when its applied to our model, you can see the pixel bleeding very clearly:
 
 

As you can see, each face is meant to have its own colour but for some reason on the edges of the faces a different colour is "bleeding" into the colour that is meant to be there.
Now if we take a look at our UVs a sec and we can see that the face that has green on the edge, is right next to a green part on the texture map.


If we zoom into the UV map a little more we can see that the green bit is "bleeding" over the edge of the UV its meant to be on and as such, is on the wrong part of our UV map and on the wrong face.


This here is the basic definition of Pixel Bleeding and what you want to try and avoid.....

Also as mentioned above, when a texture is made smaller, like in a mipmap, pixel bleeding becomes much worse so to demonstrate, I've resized the same texture above from a 256x256 texture to a 64x64 texture:


And as we can see, the bleeding is much worse now, as well as the other compression effects.
 
 



How to Avoid Pixel Bleeding

To Avoid Pixel Bleeding you just need to space out your UVs. So here is the same object as above, but this time, with its UVs spread out from each other like so:
NOTE: the more you can spread out your UVs the better. Also try to keep your UVs evenly spaced apart as possible, with setting yourself a general minimum distance between each UV that you shouldn't go under. The distance your UVs need to be apart really depends on your end texture size, with a smaller texture needing a bigger distance and a larger texture needing a smaller distance but really, you want to have a space of no less than 3 pixels when it translates to your final texture image. Also keep in mind your texture size may be down sized for performance reasons so you may not be able to have that huge 2048x2048 texture you where hoping for your pistol.


And here is the texture I've made for it, note that the texture colours for each face go outside the UVs:
 

Now if we look at our model with that texture on it, we can see that there is no sign of pixel bleeding on the edges of the UVs (although you can see a few artifacts from the compression on the pyramid and other places).
  

Which if we zoom into the UV with texture, we can see that pixel bleeding is still there on the texture, just that its now outside of our UVs 


Even when using a 64x64 px texture, pixel bleeding is still not a huge issue, although you can now slightly see it on the edges (as well as the artifacts have gotten much worse )
  



Other Things to Note

Even thou in this tutorial I say you must keep all your UVs spread out, this dose not mean you should not stitch up UVs, but this means you should only stitch up UVs that are of the same colour and want to share the basic same texture. So the corner of a wooden or metal box meet, you want to stitch up the both sides on that corner as they will be sharing the same texture, with the metal box also most likley sharing a scratch right down the corner on the stitch itself. But where you have two totally different materials on two faces, like for example, a glass window port hole on a tank surrounded by metal, you don't want to really stitch up the window to the metal as then you would have the colour of the metal bleed into the glass, and you don't want that so be smart when your stitching up or spacing out your UVs 



I hope you have learnt something from this tutorial and any questions don't be afraid to ask.

Cheers!