게임 개발을 위한 렌더링 기법 한성환

게임 개발을 위한 렌더링 기법

민커뮤니케이션MAD 팀 한성환

2010.05.26

목차

ShadingBase RenderingAdvanced Rendering렌더링 관련 최적화

Shading

Flat ShadingGouraud ShadingPhong Shading

Flat Shading

Flat Shading

Gouraud Shading

Phong Shading

목차

ShadingBase RenderingAdvanced Rendering렌더링 관련 최적화

Base Rendering(Gouraud Shading)

Feature ( 특징 )DiffuseSpecular장단점

Feature(Gouraud Shading)

점단위의 Color 계산 두점 사이의 컬러값 선형보간

Diffuse

점의 Normal 방향

Light 방향 내적

Material Dif-fuse

Light Diffuse

Diffuse 문제 Light Diffuse Color ( 255, 255, 0 ) Material Diffuse Color ( 0, 0, 255 ) 무슨 컬러가 나올까요 ~?

LightDiffuse * MaterialDiffuse * 내적(Normal,LightDir)

R = 255 * 0 * 내적수치 ; G = 255 * 0 * 내적수치 ; B = 0 * 255 * 내적수치 ; Color( R, G, B ) -> Color( 0, 0, 0 )

Specular

점의 Normal 방향

Light 방향 캐릭터 시점 Half Vector 내적 ( Half,

Normal )

Base Rendering 장단점

작업이 쉽다 .모든 그래픽

카드에 지원이 가능하다 .

퀄리티가 부족하다 .

장점 단점

Base Rendering 의 보완책은…Phong ShadingSpecular 는 점단위에 의지 하지

않도록 작업

Pixel Shader 1.4 = Phong Shading

Normalize()

Pixel 단위 Normal 수치 선형 보간

우리에게 필요한 것은 ~!!

Phong Shading 은 Pixel Shader 2.0 이상 부터 지원

목차

ShadingBase RenderingAdvanced Rendering렌더링 관련 최적화

Advanced Rendering

Environment Map-ping

- Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering

T&L 에 있는 것 전부 NormalMap

T&L Shader

Sphere Mapping #1

SphereMapping #2 카메라 시점 Vertex 의 Normal TEXTURETRANSFORM-

FLAGS -

D3DTSS_TCI_CAMERASPACENORMAL

- Normal (-1~1) -> UV (-1~1)

텍스쳐 행렬 - D3DTS_TEXTURE0 - UV (-1~1) -> UV (0~1)

x = ( (x) * 0.5 + 0.5 );

y = ( -(y) * 0.5 + 0.5 );

0.0, 1.0

0.7, 0.7

1.0, 0.00.0, 0.0 0.5, 0.0

0.35, 0.35

0.0, 0.5

-1.0, 0.0

0.0, -1.0

0.0, 0.5 0.5, 0.5 0.75, 0.5 1.0, 0.5

0.5, 0.0

0.5, 1.5

0.85, 0.15

0.5, 0.75

0.67, 0.67

Advanced Rendering

Environment Map-ping

- Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering

T&L 에 있는 것 전부 NormalMap

T&L Shader

RimLight #1 ( SphereMapping )

RimLight #2

RimLight 원리 ( T&L 용 )

카메라 공간에서의 Normal 수치를 가지고 텍스쳐를 입힘

Sphere Mapping Sphere Texture 를 조작 D3DTSS_COLOROP 는 D3DTOP_ADD

사용

Advanced Rendering

Environment Map-ping

- Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering

T&L 에 있는 것 전부 NormalMap

T&L Shader

Cube Mapping #1

Cube Mapping #2

왜곡 현상이 덜 하다 . 여러방향에서 Environment map-

ping 을 볼수 있다 .

Sphere Mapping 과 비교

( 하지만 시각적으로 인지하기 어려움 .)

Cube Mapping #3

Sphere Mapping 과 비교

Cube Mapping #4

왜곡 현상이 덜 하다 . 여러방향에서 Environment map-

ping 을 볼수 있다 . Texture Size 가 크다 . 실시간으로 만드는 것이 비교적 쉽다 .

Sphere Mapping 과 비교

( 하지만 시각적으로 인지하기 어려움 .)

Cube Mapping #5

실시간 생성

Advanced Rendering

Environment Map-ping

- Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering

T&L 에 있는 것 전부 NormalMap

T&L Shader

Toon Shading #1 Light 방향 Vertex 의 Normal TEXTURETRANSFORM-

FLAGS -

D3DTSS_TCI_CAMERASPACENORMAL

텍스쳐 행렬 - D3DTS_TEXTURE0

Toon Shading #2

Toon Shading #3 T&L 의 Texture 방식의 Feature - Shading 용 텍스쳐로 여러 느낌가능 . - Diffuse Color 를 Phong Shading 비슷하게 할

수 있음 .

- Phong Shading 느낌의 Specular 는 불가능 - Line 이 곡선이 아닌 직선으로 생김

Advanced Rendering

Environment Map-ping

- Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering

T&L 에 있는 것 전부 NormalMap

T&L Shader

Edge Rendering #1

One Pixel 짜리 선 생성 메쉬 내부에서 선 생성 메쉬 외부에서 생성되는 외각선 Pixel Shader 를 사용하여 Pixel 에

기입

종류

Edge Rendering #2

WIREFRAME Render

Z bias Anti-Aliasing

Sphere Mapping 응용

RimLight 와 반대되는 Image 를 사용함 .

One Pixel 선 생성 메쉬 내부에서 선 생성(Silhouette Edge Rendering)

Edge Rendering #3Surface Angle Silhouetting

Edge Rendering #4

Normal 방향으로 스케일된 Mesh 를 Render

미리 계산된 Normal Mesh 를 생성

Mesh 생성시 정점을 Merge 시켜줌

메쉬 외부에서 선 생성

Edge Rendering #5NormalMesh 를 그대로 사용할 경우

문제점같은 위치에 있는 점이지만 Merge 되어 있지 않은 상태

( 노멀값이 다른 상태 )

Edge Rendering #6

Laplician Filter - ColorBuffer - Z Buffer - Normalmap

Pixel Shader 를 이용

Advanced Rendering

Environment Map-ping

- Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering

T&L 에 있는 것 전부 NormalMap

T&L Shader

Glow #1 좌우로 늘린 후 상하로

늘린다 . GPU 부하와 Quality Texture Size Pixel Move Count

- 512- 3

칸

Glow #2

Glow #3

Advanced Rendering

Environment Map-ping

- Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering

T&L 에 있는 것 전부 NormalMap

T&L Shader

Fur Rendering #1

ALPHA TEST

여러층의 Mesh

구현 방법 예제 ) 완다와 거상

Fur Rendering #2

면을 평평한 각도로 보면 어색함이 표시

추가 Ren-dering 필요 .

값 비싼 Al-pha Test 필요

단점

Advanced Rendering

Environment Map-ping

- Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering

T&L 에 있는 것 전부 NormalMap

T&L Shader

NormalMap #1 Use Shader

High Quality

Graphic Card 의 가격하락과 성능향상 ( Pixel Shader 지원 카드 대중화 )

Specular 하나만으로도 충분한 효과 발휘

NormalMap #2

Advanced Rendering

Environment Map-ping

- Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering

T&L 에 있는 것 전부 NormalMap

메르메르에서 쓰이는 연마효과

T&L Shader

메르메르에서 쓰이는 연마효과이미지의 조합으로 연마효과를 만듬 .Ambient 수치를 변경Specular 수치 변경특정 Texture 를 흐르게 작업 .

(Flow Tex-ture)

연마효과 (Flow Texture 셋팅방법 )

RenderTarget 을 이용하여 Flow Texture 2 장을 대칭되게 움직여 랜덤한 이미지 생성

새로 생성한 이미지를 Sphere Mapping 과 같은 원리로 작업 .

컬러도 customizing 가능하도록 작업 .

목차

ShadingBase RenderingAdvanced Rendering렌더링 관련 최적화

렌더링 관련 최적화 DIP Calls

( DrawIndexedPrimitive ) VB Change Texture Changes State Changes sets DrawPrimitiveUP Alpha Tex Index Buffer

( < 500DIP )

( < 500 )

( < 200 )

( < 200 )

속도 향상을 위한 텍스쳐 제작 Texture 는

가능하다면 1장으로 해결

( 단점 - 제작시간이 오래 걸림 . )

Texture 사이즈를 최대한 작게 제작

DDS 포맷 사용

기술적으로 Tex-ture 를 합치는 기능을 만들어 준다 .

옵션에 Texture 사이즈 변경 기능 추가

그래픽 팀 프로그램 팀

DDS 구조 (DXT1)

(16Pixel) 4Byte * 16 = 64Byte

최고와 최저 수치의 Color 를 얻어옵니다 .

( 최고 , 최저 Pixel) 2Byte * 2 = 4Byte

각 Pixel 에 Index 사용으로 2Bit 를 할당합니다 .

(16Pixel) 2Bit * 16 = 32Bit -> 4Byte

(1Pixel) ARGB = 32Bit = 4Byte

(1Pixel) RGB = 16Bit = 2Byte

2Bit 는 0, 1, 2, 3 으로 4 개의 값을 가질수 있습니다 .

최고 최저

1001

3020

11

112

23

3

4Byte(Color) + 4Byte(Index) =8Byte 사용 (16Pixel)

보간보간

DDS 사용 예 Opaque Texture - DXT1

Hard Alpha Tex-ture

- DXT1, DXT3

Soft Alpha Tex-ture

- DXT5

이름을 사용한 Alpha 구별 Opaque Texture - 기존 이름을 사용한다 .

Hard Alpha Texture - 이름 뒤에 _a 를 추가로 붙인다 . ( DXT5

예외 )

Soft Alpha Texture - 이름 뒤에 _a, _a1, _a2 를 추가로

붙인다 . - DXT5 일 경우만 적용

왜 SoftAlpha 는 a, a1, a2 으로 나눴을까 ?

AlphaTest 를 쓰면 OK

하지만… .

Alpha Texture 의 위험성 남발 할 경우 느리다 .

Q & A

궁금하신 부분이 있으시다면 !!

감사합니다