1. 게임 개발을 위한 렌더링 기법 민커뮤니케이션 MAD팀 한성환 2010.05.26

2. 목차 Shading Base Rendering Advanced Rendering 렌더링 관련 최적화

3. Shading Flat Shading Gouraud Shading Phong Shading

4. Flat Shading

5. Flat Shading

6. Gouraud Shading

7. Phong Shading

8. 목차 Shading Base Rendering Advanced Rendering 렌더링 관련 최적화

9. Base Rendering(Gouraud Shading) Feature (특징) Diffuse Specular 장단점

10. Feature(Gouraud Shading) 점단위의Color 계산 두점 사이의 컬러값 선형보간

11. Diffuse 점의 Normal 방향 Light 방향 내적 Material Diffuse Light Diffuse

12. 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 )

13. Specular 점의 Normal 방향 Light 방향 캐릭터 시점 Half Vector 내적 ( Half, Normal )

14. Base Rendering 장단점 작업이 쉽다. 모든 그래픽 카드에 지원이 가능하다. 퀄리티가 부족하다. 장점 단점

15. Base Rendering의 보완책은… Phong Shading Specular는 점단위에 의지 하지 않도록 작업

16. Pixel Shader 1.4 = Phong Shading 우리에게 필요한 것은~!! Normalize() Pixel 단위 Normal 수치 선형 보간 Phong Shading은 Pixel Shader 2.0이상 부터 지원

17. 목차 Shading Base Rendering Advanced Rendering 렌더링 관련 최적화

18. Advanced Rendering Environment Mapping - Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering T&L에 있는 것 전부 NormalMap T&L Shader

19. Sphere Mapping #1

20. SphereMapping #2 카메라 시점 Vertex의 Normal TEXTURETRANSFORMFLAGS - 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.5, 1.5 0.7, 0.7 0.85, 0.15 0.0, 0.5 0.5, 0.75 0.35, 0.35 0.67, 0.67 1.0, 0.0 0.0, 0.0 0.5, 0.0 -1.0, 0.0 0.5, 0.5 0.75, 0.5 1.0, 0.5 0.0, 0.5 0.0, -1.0 0.5, 0.0

21. Advanced Rendering Environment Mapping - Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering T&L에 있는 것 전부 NormalMap T&L Shader

22. RimLight #1 ( SphereMapping )

23. RimLight #2

24. RimLight원리 ( T&L용 ) 카메라 공간에서의 Normal 수치를 가지고 텍스쳐를 입힘 Sphere Mapping Sphere Texture 를 조작 D3DTSS_COLOROP 는 D3DTOP_ADD 사용

25. Advanced Rendering Environment Mapping - Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering T&L에 있는 것 전부 NormalMap T&L Shader

26. Cube Mapping #1

27. Cube Mapping #2 Sphere Mapping과 비교 왜곡 현상이 덜 하다. 여러방향에서Environment mapping을 볼수 있다. (하지만 시각적으로 인지하기 어려움.)

28. Cube Mapping #3 Sphere Mapping과 비교

29. Cube Mapping #4 Sphere Mapping과 비교 왜곡 현상이 덜 하다. 여러방향에서Environment mapping을 볼수 있다. Texture Size가 크다. 실시간으로 만드는 것이 비교적 쉽다. (하지만 시각적으로 인지하기 어려움.)

30. Cube Mapping #5 실시간 생성

31. Advanced Rendering Environment Mapping - Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering T&L에 있는 것 전부 NormalMap T&L Shader

32. Toon Shading #1 Light 방향 Vertex의 Normal TEXTURETRANSFORMFLAGS - D3DTSS_TCI_CAMERASPACENORMAL 텍스쳐 행렬 - D3DTS_TEXTURE0

33. Toon Shading #2

34. Toon Shading #3 T&L의 Texture방식의 Feature - Shading 용 텍스쳐로 여러 느낌가능. - Diffuse Color를 Phong Shading 비슷하게 할 수 있음. - Phong Shading느낌의Specular는 불가능 - Line이 곡선이 아닌 직선으로 생김

35. Advanced Rendering Environment Mapping - Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering T&L에 있는 것 전부 NormalMap T&L Shader

36. Edge Rendering #1 종류 One Pixel 짜리 선 생성 메쉬 내부에서 선 생성 메쉬 외부에서 생성되는 외각선 Pixel Shader를 사용하여 Pixel에 기입

37. Edge Rendering #2 One Pixel 선 생성 메쉬 내부에서 선 생성 (Silhouette Edge Rendering) Sphere Mapping 응용 RimLight와 반대되는 Image를 사용함. WIREFRAME Render Z bias Anti-Aliasing

38. Edge Rendering #3 Surface Angle Silhouetting

39. Edge Rendering #4 메쉬 외부에서 선 생성 Normal 방향으로 스케일된Mesh를 Render 미리 계산된 Normal Mesh를 생성 Mesh 생성시 정점을 Merge 시켜줌

40. Edge Rendering #5 NormalMesh를 그대로 사용할 경우 문제점 같은 위치에 있는 점이지만 Merge 되어 있지 않은 상태 (노멀값이 다른 상태)

41. Edge Rendering #6 Pixel Shader를 이용 Laplician Filter - ColorBuffer - Z Buffer - Normalmap

42. Advanced Rendering Environment Mapping - Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering T&L에 있는 것 전부 NormalMap T&L Shader

43. Glow #1 좌우로 늘린 후 상하로 늘린다. GPU부하와 Quality Texture Size Pixel Move Count - 512 - 3칸

44. Glow #2

45. Glow #3

46. Advanced Rendering Environment Mapping - Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering T&L에 있는 것 전부 NormalMap T&L Shader

47. Fur Rendering #1 구현 방법 예제) 완다와 거상 ALPHA TEST 여러층의Mesh

48. Fur Rendering #2 단점 면을 평평한 각도로 보면 어색함이 표시 추가 Rendering 필요. 값 비싼 Alpha Test 필요

49. Advanced Rendering Environment Mapping - Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering T&L에 있는 것 전부 NormalMap T&L Shader

50. NormalMap #1 Use Shader High Quality Graphic Card의 가격하락과 성능향상 ( Pixel Shader지원 카드 대중화 ) Specular하나만으로도 충분한 효과 발휘

51. NormalMap #2

52. Advanced Rendering Environment Mapping - Sphere Mapping - Cube Mapping Toon Shading Edge Rendering Rim Lighting Glow Fur Rendering T&L에 있는 것 전부 NormalMap 메르메르에서 쓰이는 연마효과 T&L Shader

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

54. 연마효과(Flow Texture 셋팅방법) RenderTarget을 이용하여 Flow Texture 2장을 대칭되게 움직여 랜덤한 이미지 생성 새로 생성한 이미지를 Sphere Mapping과 같은 원리로 작업. 컬러도 customizing 가능하도록 작업.

55. 목차 Shading Base Rendering Advanced Rendering 렌더링 관련 최적화

56. 렌더링 관련 최적화 DIP Calls ( DrawIndexedPrimitive ) VB Change Texture Changes State Changes sets DrawPrimitiveUP Alpha Tex Index Buffer ( < 500DIP ) ( < 500 ) ( < 200 ) ( < 200 )

57. 속도 향상을 위한 텍스쳐 제작 Texture는 가능하다면 1장으로 해결 ( 단점 - 제작시간이 오래 걸림. ) Texture 사이즈를 최대한 작게 제작 DDS 포맷 사용 기술적으로 Texture를 합치는 기능을 만들어 준다. 옵션에 Texture 사이즈 변경 기능 추가 그래픽 팀 프로그램 팀

58. DDS 구조 (DXT1) (1Pixel)ARGB = 32Bit = 4Byte 1 0 1 3 0 2 1 2 0 0 1 3 (16Pixel) 4Byte * 16 = 64Byte 1 3 1 2 최고 최저 보간 보간 최고와 최저 수치의 Color를 얻어옵니다. (1Pixel)RGB = 16Bit = 2Byte (최고,최저Pixel) 2Byte * 2 = 4Byte 4Byte(Color) + 4Byte(Index) = 8Byte 사용 (16Pixel) 각 Pixel에 Index사용으로 2Bit를 할당합니다. 2Bit는 0, 1, 2, 3으로 4개의 값을 가질수 있습니다. (16Pixel) 2Bit * 16 = 32Bit -> 4Byte

59. DDS 사용 예 Opaque Texture - DXT1 Hard Alpha Texture - DXT1, DXT3 Soft Alpha Texture - DXT5

60. 이름을 사용한 Alpha 구별 Opaque Texture - 기존 이름을 사용한다. Hard Alpha Texture - 이름 뒤에 _a 를 추가로 붙인다. ( DXT5 예외 ) Soft Alpha Texture - 이름 뒤에 _a, _a1, _a2 를 추가로 붙인다. - DXT5 일 경우만 적용

61. 왜 SoftAlpha는 a, a1, a2 으로 나눴을까? AlphaTest를 쓰면 OK 하지만….

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

63. Q & A

64. 감사합니다 궁금하신 부분이 있으시다면!!