이것저것

[UNITY] 텍스쳐 포맷 기초 이론 본문

[유니티] Unity3D/Unity Shader

[UNITY] 텍스쳐 포맷 기초 이론

Patch_JA 2019. 3. 16. 07:22
728x90
디지털 텍스쳐 포맷 이론




컬러에서 비트(bit)란 무엇일까?
컴퓨터는 모든 정보를 0과 1로밖에 처리를 못한다.
그래서 컬러도 0과 1로 구븐을 지어서 구분할수 있었는데.
켜졌다 꺼졌다를 체크하여 픽셀이 채워지는 방식이였다.

그렇다면 픽셀이란 무엇일까?
픽셀이라는 개념의 시초는 컴퓨터가 발명되기 이전 19세기 후반으로 거슬러 올라간다.
당시 그림을 점으로 찍어서 표현하여 점묘화기법을 만들었는데 여기서 픽셀 개념이 생겨졌다고 봐도 된다.


비트에 따른 컬러표현
bit
color
1 bit2 color
2 bit4 color
3 bit8 color
4 bit16 color
8 bit 256 color
16 bit65,536 color
24 bit16,777,216 color
32 bit16,777,216 color + alpha channel
위의 표를 보면 알수 있듯이 22 = 4, 24 = 16 식으로 2의 승수 사이즈로 가능하다.





1비트에서는 2개의 색상만 표현이 가능했다. 검정과 흰색으로만 표현을 했기 때문에
기본이 그린색으로된 모니터나 호박색인 모니터가 사용되었다.

2비트때는 4가지 색상 표현 및 4단계의 그레이 컬러를 사용하여 명암을 표현했다.

4비트부터는 16색표현으로 팔레트 (Indexed Color)가 추가되면서 디더링을 자주 사용하게 되었다.


팔레트란 무엇이고 디더링이란 무엇일까?

팔레트 : 어떠한 주소값 공간에 줄을 그어놓고 색상을 하나하나 대응시키는 방법
그래픽을 표현하는 프로그램마다 팔레트가 천차만별이였고 팔레트를 순간순간 바꿔
적은 색으로도 다양한 표현이 가능했었다.

디더링 : 제한된 색을 이용하여 음영이나 색을 나타내며 여러 컬러색을 최대한 맞추는 과정이라고 쓰여있다.
맨위 픽셀에서 설명했듯이 점묘화 기법이라고 봐도 무방할듯 하다.

  



8비트에서는 256색 표현이 가능하기 시작했으며, 대표적으로는 스타크래프트가 8비트를 활용하여 그래픽을 구현했다. 이때부터 더많은 디더링과 팔레트 애니메이션등을 이용했다.
starcraft paletteì ëí ì´ë¯¸ì§ ê²ìê²°ê³¼
 < 팔레트 애니메이션 >

팔레트 애니메이션이란?
한 팔레트 내에서 어떠한 주소값의 색상을 변경하는것! 
이렇게 하는것이 비용측면에서도 덜 필요하기때문에 많이 사용되었다.

사실상 255색이다?
실제 표현 가능한건 256가지의 색상이지만 프로그래머들은 0부터 시작하기 때문이라는.. 이야기로
사실상 0부터 시작하여 0~255가지의 색이 되었다.



16비트에서는 65,536색표현이 되면서 팔레트의 개념이 사라졌다! 대신 RGB가 등장하기 시작했다.
이때부터는 하이 컬러(High Color)라고도 불렸으며 R과 B에 5비트 G에 6비트를 할당하여 565컬러 또는 R5G6B5 라고도 부른다.
왜 R과 B는 5비트인데 G는 6비트죠?
가시광선에서 초록색의 영역이 넓기 때문이라고 한다..

바리에이션으로 RGB모두 비트로 표현하고 나머지 1비트를 투명여부로 표현하는 방법도 있다고 한다..


24비트에서는 16,777,216색표현이 되었고 이때부터는 트루 컬러(True Color)라고 불렸으며 888컬러 또는 R8G8B8 채널당 8비트가지게 되었다. 흔히 알고있는 0,0,0 은 검정 255,255,255는 흰색 으로 알고있던것이 24비트 컬러이다.


32비트에서도  4,294,967,296 억단위 색표현까지 늘면서 24비트 + 알파채널이 포함되었다.
R8G8B8A8 혹은 8:8:8:8 컬러라고 불리며 기본적으로 가장 많이 쓰이고 있다.
그렇다면 64비트 그 이상의 이미지도 존재 할까?
R16G16B16A16 혹은 16:16:16:16 라고 불리며 주로 TIF, RAW파일등으로 저장된다.
쓰이는곳으로는 HDR같은것에 쓰이며 색 깊이나 계조등이 정밀해지고 매끄러워진다는 것인데..
단점으로는 용량이 그만큼 엄청나진다..

HDR colorì ëí ì´ë¯¸ì§ ê²ìê²°ê³¼





게임용 텍스처 포맷

게임용 텍스쳐 포맷을 다루기전에 먼저 PC와 모바일 포맷을 나누어서 다룰 예정이다.
보통 게임에서 사용되는 용량중 대부분 차지하는 비율에 텍스쳐도 포함이 된다.
그래서 게임에 쓰이기 위해선 용량을 줄여야 하는데 이때 압축이라는 것을 해야한다.
하지만 압축을 한다라는것은 단순히 용량만 줄여지는것이 아니라 색상이 짤린다는것!
요즘은 엔진 자체에서도 플랫폼별로 포맷을 변경할수 있어서 엔진별 포맷방식을 확인해야한다.


[ PC ]

DDS(Direct Draw Surface)파일 포맷
MicroSoft사에서 만든 포맷방식이며 NVIDIA에서도 플러그인식으로 배포하는듯 하다.
DirectX 기반의 텍스쳐 맵을 나타내기 위해 사용되는 이미지 형식이며( jpg같은 파일이라 생각하면 된다. )다른 포맷에 비해 손실대비 압축률이 높고
호환이 좋아 대부분의 게임에서 사용한다.  픽셀을 하나씩 읽는게 아니라 블럭형식으로 읽고 그중에서도 원하는 색상만 뽑고 나머지는 조건만 읽는듯 하다.
* PC게임 대부분에서 사용 가능하다.
* DirectX의 Texture Format과 1:1로 대응하는 File Format이다.
* DirectX를 지원하는 모든 비디오 카드에서 굉장히 빠르게 사용 가능한 File Format이다.
* 2의 승수 사이즈만 가능하다.
* Mipmap / Cubemap 등 게임을 위한 기술들을 쓸 수 있다.
 
BC(Block Compression) 포맷
PC에서만 주로 쓰이는 고급 포맷이라고 한다.  텍스쳐 크기를 줄이기 위해 블록압축기법을 사용한다.
색상당 32bit 텍스처와 비교할때 블록 압축 텍스처는 최대 75% 압축으로 작아져 성능을 향상 시킬수 있다.
또한 블록 압축 텍스처들은 모두 4의 배수로 만들어져야 한다.
BC6H 및 BC7 텍스처 압축 형식은 압축된 텍스처 데이터를 저장하기위한 DDS파일 형식을 사용한다고 되어있다.
BC1~BC7까지 존재하며 BC3를 가장 많이 사용하고 있다고 한다. 




BC1
5:6:5 (R5G6B5)를 이용하여 3가지 성분으로 색상 데이터들을 저장한다.

BC2
RGB 데이터를 5:6:5:4 (R5G6B5A4)로 색상 데이터를 저장한다. ( 알파는 별도로 저장함 )

BC3
RGB데이터를 5:6:5:4 (R5G6B5A8)로 색상 데이터를 저장한다. ( 알파는 별도로 저장함 )

BC4
하나의 성분을 가지고 있는 성분 데이터 [ 하이트 맵 등 ]

BC5
두 개의 성분을 가지고 있는 성분 데이터 [ 노말 맵 등 ]
 




 

[ 모바일 ]

안드로이드 텍스쳐 포맷
 
1.압축 포맷

DXT계열 - NVIDIA Tegra칩 전용

PVRTC계열 - PowerVR칩 전용 (정사각형 텍스쳐만 지원)
IOS나 다른 몇몇개의 안드로이드폰에서 작동을 하는데 이것때문에 모든 텍스쳐의 크기가 정사각형이 되었다는 이야기가..

ATC계열 - Snapdragon칩 전용

ETC계열 - 안드로이드 기기 전 칩에서 사용 가능
RGB만 존재하고 RGBA가 없다.

ETC2계열 - 안드로이드 기기 전 칩에서 사용 가능
OpenGL ES3.0 이상에서만 지원한다.

ASTC계열 - 안드로이드 기기 / IOS 전 칩에서 사용 가능
OpenGL ES3.2 이상 기기부터 제대로 지원한다.
픽셀 블록당 압축 방식이 다르다.
  DXT í¬ë§·ì ëí ì´ë¯¸ì§ ê²ìê²°ê³¼

2.비압축 포맷
RGB 16bit
RGB 24bit
Alpha 8bit
RGBA 16bit
RGBA 32bit
완전 무압축 8888 사용한 텍스쳐 압축포맷을 지원하지않는 기기에 앱을 설치하면 이 포맷으로 읽어들인다.


IOS 텍스쳐 포맷
 
Android 2D íì¤ì² ì¤ë²ë¼ì´ë ì¤ì 

1.압축 포맷

PVRTC계열 - PowerVR칩 전용 (정사각형 텍스쳐만 지원)
일단 기본적으로 PVRTC압축을 사용하기 위해서는 텍스처의 해상도가 2의 지수승 정사각형이어야 한다는 제약이있고
제작할때부터 고려해야하는 점이 많다. 

ASTC계열 - 안드로이드 기기 / IOS 전 칩에서 사용 가능
OpenGL ES3.2 이상 기기부터 제대로 지원한다.
픽셀 블록당 압축 방식이 다르다.
 

1.비압축 포맷
RGB 16bit
RGB 24bit
Alpha 8bit
RGBA 16bit
RGBA 32bit


* 게임용 텍스처를 만들때 주의해야할 점
알파값이 필요없는 텍스처에서는 알파를 쓰지 말것!
용량만 두배로 늘어나며 비효율적인일이다!




FLOAT

float 흔히 프로그래머라면 알고있는 그것.. 부동 소수점이라는 뜻으로 '실수'를 말한다.

쉐이더에서 가장 기초가 되는것이기 때문에 반드시 알아야 한다.

픽셀포맷을 표기할때마다 매번 R5G6B5(31,63,31), R8G8B8A8(255,255,255,255) 식으로 숫자를

입력해야 하는 불편함을 없애기 위해 퍼센트로 0~1로 표기하는 단위이기도 하다.

간단하게 한줄 요약하자면 소수점이 존재하면 일단은 float이다.

혹시라도 유니티에서 1.0f 혹은 1f 등 소수점과 f가 붙어있는걸 보았다면 그것이 float이다.


float을 사용하여 색상을 나타낼수가 있는데 float3와 float4가 존재한다.

float3 ( R, G, B ) 값으로 float3(255.0f, 255.0f, 255.0f)를하면 결과값이 하얀색이 되고

float4 ( R, G, B, A ) 값으로 float (255.0f, 0.0f, 0.0f, 0.5f)를하면 결과값이 반투명한 빨간색이 된다.


Shader


쉐이더란 무엇일까? 를 검색해보면...


컴퓨터 그래픽스 분야에서 셰이더(shader)는 소프트웨어 명령의 집합으로 주로 그래픽 하드웨어의 렌더링 효과를 계산하는 데 쓰인다. 셰이더는 그래픽 처리 장치(GPU)의 프로그래밍이 가능한 렌더링 파이프라인을 프로그래밍하는 데 쓰인다.


위와같은 어려운말로 설명을 해준다... 

정답은 없지만 조금 더 쉽게 생각해서 아래와 같은 느낌으로 생각하면 된다.

1. 질감을 만드는것

2. 라이팅 계산

3. 표면의 후처리


원래는 프로그래머가 구현하던 분야라고 했지만 프로그래머의 똥같은 미적감각으로 인하여

프로그래머가 "에잇 그래픽 너가해!" 라며 쉽게 코드를 작성할수 있게 만들어놓은 언어가 있다. ( 과연..? )


HLSL - DX에서 사용되는 쉐이딩 언어

GLSL - OpenGL에서 사용되는 쉐이딩 언어

CG - NVIDA가 MS와 협력하여 개발한 쉐이딩 언어


세가지 언어의 문법이 조금씩 다르지만 HLSL만 열심히 배워도 다른 언어도

금방 익힐수 있다고 한다. 그외에도 노드 방식을 이용한 방법도 등장하고 했다.





Comments