How to create Physical based shader by UDK.

1. UDK로 물리 기반 셰이더 만들기
아이덴티티 게임즈
테크니컬 아티스트
김동석

2. 발표자 소개 / 차례 / 일러두기

3. 발표자 소개
• 김동석
– 1999년 3D 모델러로 게임 바닥에서 밥벌이 시작
– 아이닉스 소프트, 넥슨, 네오위즈를 거쳐~
– 현재 아이덴티티 게임즈에서 TA로 열심히 밥벌이
하고 있습니다!
3

4. 네, 아이덴티티 게임즈는 그 유명한
• 남자들의 수영장을 가진, 그곳입니다!
4

5. 차례
1. 일러두기
2. 물리 기반 셰이더 (Physical Based Shader)의 정의
3. 물리 기반 셰이더의 구조
4. 물리 기반 셰이더를 만들기 위한 전제
5. UDK로 물리 기반 셰이더 만들기
5

6. 일러두기
• 이 발표는 tri-Ace, Lazarov, Sébastien Lagarde의 PBS를 바탕으로
합니다.
• 물리적으로 정확한 셰이더는 아닙니다.(물리 기반 셰이더라며!)
6

7. 물리 기반 셰이더( PYSICAL BASED SHADER)의 정의
이러쿵 저러쿵 풀어보는

8. 물리 기반 셰이더라니? (1)
• 기존의 실시간 셰이더들은 물리적으로 부정확한 부분이 많았습니다.
– 어두운 Diffuse map을 써야 한다던가
– Ambient Light가 단색이라던가
– Specular가 엄청 약하거나, 혹은 강하거나
8

9. 물리 기반 셰이더라니? (2)
• 기존의 실시간 셰이더들은 물리적으로 부정확한 부분이 많았습니다.
– Fresnel 효과가 잘못 들어가있거나
– Reflection에 대한 고려가 전혀 없거나
– 조명이 엄청 약한데도 엄청 밝은 셰이더라던가
9

10. 그럼 예전 셰이더들이 물리랑은 상관 없는거야?
• 기존 셰이더들이 생략을 좀 많이 했을 뿐입니다.
– Lambert diffuse 셰이딩은 표면이 완벽하게 빛을 반사한다고
가정합니다.
– 거울의 반사율도 90%!
• Phong 셰이딩은 현실 세계의 Specular를 재현하지 못합니다.
– 원형 물체에선 괜찮지만 평평한 면에선 실제 스페큘러를 표현하지
못합니다.
– 언제나 동그랗게 맺히는 하이라이트~
10

11. 물리 기반 셰이더는 뭐가 다른데?
• 물리 기반 셰이더는 생략된 물리 현상들을 좀더 많이 구현한
셰이더입니다.
– Oren-nayar
– Blinn-Phong Specular
– 미세표면
– Fresnel 효과
– Image Base Light
– 에너지 보존 법칙
11

12. 모든 표면은 거칠다! MICROFACET BRDF
실제 세계의 물리 효과들 1

13. 실제 세계의 물리 효과들 1- Microfacet BRDF (1)
• Microfacet theory(미세표면 이론)은 물리 기반 셰이더의 근간
– 물체의 표면은 매우 작은, 완전 반사가 일어나는 편평한 표면의 집합
13

14. 실제 세계의 물리 효과들 1- Microfacet BRDF (2)
• 예전 셰이더들은 물체의 모든 표면이 완전 반사를 한다고 가정하고
만들어 졌습니다.
14

15. 실제 세계의 물리 효과들 1- Microfacet BRDF (3)
• 그럼 표면이 거칠면?
15

16. 실제 세계의 물리 효과들 1- Microfacet BRDF (4)
• Specular의 모양도 바뀝니다!
16

17. 모든 표면은 반짝인다!
실제 세계의 물리 효과들 2

18. 실제 세계의 물리 효과들 2 - 모든 표면은 Specular가 있다! (1)
• 셰이더라고 그러지만 사실은 반사 모델
– BRDF라는 말도 양방향 ‘반사’ 분포 함수
18

19. 실제 세계의 물리 효과들 2 - 모든 표면은 Specular가 있다! (2)
• 카메라에 편광 필터를 사용해서 사진을 찍어 보신분은 아시겠지만
좀더 색이 풍부하게 나옵니다.
– 이게 표면에서 반사되는 난반사를 줄여줘서 - Specular를 줄여줘서 -
본래의 색을 더 풍부하게 보이게 해주는 원리 입니다.
• 즉, 편광 필터를 사용해서 찍은 사진들은 물체의 Diffuse 부분만을
얻어낸 것으로, 포토샵으로 원래 사진에서 디퓨즈 부분만 빼면
Specular만 남은 이미지를 얻을 수 있습니다.
19

22. 실제 세계의 물리 효과들 2 - 모든 표면은 Fresnel이 있다! (1)
• 스넬의 법칙(Snell’s Law)
– 두 매질이 마주하는 경계면에서 임계각을
넘으면 전반사가 일어난다.
• 즉, 우리가 익히 아는 Specular 반사는 특정
각도에서만 일어납니다.
22

23. 실제 세계의 물리 효과들 2 - 모든 표면은 Fresnel이 있다! (2)
• Fresnel의 법칙(Fresnel Effect)
– 표면의 반사량은 관찰자의 시점과 표면이
이루는 각도에 영향을 받는다.
– 표면을 바라보는 각도가 물체의 전반사가
일어나는 고유 각도, 즉 Critical
Angle(임계각)에 이르면 Fresnel 효과를
경험 할 수 있게 됩니다.
23

24. • 마루도 얕은 각도에서 보면 거울
처럼 반사가 일어납니다.
• 우리가 흔히 아는 Fresnel은
진정한 Fresnel이 아닌겁니다!

25. • 마루도 얕은 각도에서 보면 거울
처럼 반사가 일어납니다.
• 우리가 흔히 아는 Fresnel은
진정한 Fresnel이 아닌겁니다!

26. 실제 세계의 물리 효과들 2 - 모든 표면은 Fresnel이 있다! (3)
• 우리 주변 물체들의 IOR
• 나무, 돌 같은 Specular가 없는 것처럼 보이는 재질들은 얕은
각도에서 전반사가 일어납니다.
26
재질 IOR(Index Of Refraction)
진공 1.0
공기 1.0002926
유리 1.5
유리, 나무, 돌, 콘크리트 3 ~ 4 (14 ~ 30도)
플라스틱 5 ~ 8
금속 20 ~ 100

27. 실제 세계의 물리 효과들 2 - 빛을 받는 물체의 표면도 그림자가 진다!
• Fresnel 때문에 Specular가 잘 안보인다는 설명은 뭔가 부족
– 유리와 벤젠의 IOR은 같지만 Specular는 다르게 보임
27

28. 빛은 모든 방향에서 온다!
실제 세계의 물리 효과들 3

29. 실제 세계의 물리 효과들 3 - Image Based Lighting (1)
• 기존의 셰이더는 Ambient Light를 그냥
단색으로 처리하는 경우가 대부분
29

30. 실제 세계의 물리 효과들 3 - Image Based Lighting (2)
• 실제 세계에선 그늘진 부분에서도 난반사에 의한 조명이 발생
30

31. 실제 세계의 물리 효과들 3 - Image Based Lighting (3)
• Image Based Lighting(IBL)은
단색으로 이뤄지던 주변광을 사진이나
이미지를 통해 여러 색을 갖게 만들어
주는 것.
– 이것은 Diffuse 부분만이 아닌
Specular와 Reflection 양쪽에 영향을
주며, 표면의 거칠기에 따라 반사되는
주변광의 모양이 바뀝니다.
31

32. 실제 세계의 물리 효과들 3 - Image Based Lighting (4)
• Specular와 Reflection
32

33. 에너지 보존 법칙 - 들어온 것보다 나가는 것이 많을 수
없다!
실제 세계의 물리 효과들 4

34. 실제 세계의 물리 효과들 4 - 에너지 보존 법칙 (1)
• 뉴턴 역학계에 속해있다면 모든 물리 현상은 에너지
보존 법칙을 따릅니다.
– 방출되는 에너지는 입력되는 에너지와 같거나 작다.
– 무한동력이 존재하지 않는 이유죠.
34

35. 실제 세계의 물리 효과들 4 - 에너지 보존 법칙 (2)
• 빛도 마찬가지!
– 입사되는 빛보다 반사되는 빛의 양이 많을 수 없다!
35
에너지 보존 법칙 무시 에너지 보존 법칙 적용

36. 정리 하자면…
• PBS는 이런 실제 세계의 물리 효과들을 표현합니다.
– Microfacet BRDF
• 모든 표면에 존재하는 Specular
• 모든 표면에 존재하는 Fresnel
• 표면 특유의 거칠기에 따른 미세표면 Shadowing과 Maksing
– IBL(Image Based Lighting)
• 실제 세계의 난반사를 시뮬레이션 하는 IBL
• 표면의 거칠기에 따라 변형되는 주변광의 모양
– 그리고 마지막으로 이런 모든 물리적 현상을 에너지 보존 법칙에
따라 표현합니다.

37. 물리 기반 셰이더의 구조
게임으로 나온 PBS의 비교

38. 기본적인 셰이더의 구조
• 셰이더는 크게 두 부분으로 구성
– Directional Light 부분
– Ambient Light 부분
• 각 부분은 다시 세가지 반사 성분으로 이루어 짐
– Diffuse
– Specular
– Reflection
• 기존 셰이더들은 Reflection 성분을 제외하고 구성된 경우가 많고,
특히 Ambient Light 부분은 Diffuse만 고려
38

39. 물리 기반 셰이더의 구조
• PBS 역시 다음과 같은 식으로 구성 됩니다.
– (Directional Light) + (Ambient Light)
• Directional Light는 다음과 같이 구성 됩니다.
– (디퓨즈 부분) + (스페큘러 부분) + (반사 부분)
• 디퓨즈 부분
– (디퓨즈 맵) * (디퓨즈 셰이딩) * (노멀라이징 식)
• 스페큘러 부분
– (Normalizing Term) * (Specular Term) * (Fresnel Term) * (Visibility Term)
• 반사 부분
– 큐브맵을 사용해서 표면 거칠기에 따른 표현 정도를 결정합니다.
39

40. Diffuse Albedo Equition (1)
• 이 식은 PBS의 Directional 부분의 디퓨즈 라이트 부분과 스페큘러
라이트 부분 입니다.
40

41. Diffuse Albedo Equition (2)
41

42. PBS들의 비교
지금까지 게임에 쓰인

43. Tri-Ace의 PBS (1)
• 2010년 Siggraph에서 제안 되었으며 게임에 적용 가능한 최초의
PBS에 대한 발표 입니다.
43

44. Tri-Ace의 PBS (2)
• (Visibility Term)*(Specular Normalizing) =
0.0397436n+0.0856832로 간략화 됩니다.
44

45. Tri-Ace의 PBS (3)
• Specular normalizing과 사전 정의 Ambient
Lighting
45

46. Lazarov의 PBS (1)
• 2011년 Siggraph에서 발표된, Call of Duty - Black ops에서 쓰인
셰이더 입니다.
46

47. Lazarov의 PBS (2)
• Distribution Term
– Beckmann Specular (m = 거칠기)
– Blinn - Phong Sepcular in logarithmic encoding of the specular
power (n = Specular Power)
47

48. Lazarov의 PBS (2)
• Distribution Term
– Beckmann Specular (m = 거칠기)
– Blinn - Phong Sepcular in logarithmic encoding of the specular
power (n = Specular Power)
48

49. Lazarov의 PBS (3)
• Fresnel Term
- 원래 Schlick의 식에서 Cspec은 F0로 옆의 식을 사용한 Fresnel
계수
- n = IOR. Lazarov의 Fresnel에선 Specular Color로 간략화
• Visibility Term
49

50. Lazarov의 PBS (4)
• Reflection과 Ambient Light를 위한 IBL
50

51. 다른 PBS들
• Far cry3 에서 사용된 PBS는 Lazarov의 PBS에 Diffuse 부분에 대한
normalizing과 Visibility Term의 간략화가 이뤄진 PBS입니다.
• Sébastien Lagarde의 PBS는 Lazarov의 PBS에 좀더 정밀한 IBL과
이를 위해 새로운 normalizing 식을 도출 해 낸 것입니다.
51

52. UDK용 PBS!
이것들을 짬뽕해서 제안하는

53. 제안하는 PBS
𝐿 𝑃𝐵𝑆 = 𝐿 𝑑𝑖𝑟𝑒𝑐𝑡𝑖𝑛𝑎𝑙 + 𝐿 𝑎𝑚𝑏𝑖𝑒𝑛𝑡
𝐿 𝑑𝑖𝑟𝑒𝑐𝑡𝑖𝑜𝑛𝑎𝑙 = 𝑅 𝑑𝑖𝑓𝑓 + (𝐹𝑆𝐺× 𝑉(𝑙, 𝑣, ℎ) ×
𝐷 ℎ
4
) + 𝐼𝐵𝐿 𝑟𝑒𝑓
𝐿 𝑎𝑚𝑏𝑖𝑒𝑛𝑡 = 𝑅 𝑑𝑖𝑓𝑓 + (𝑆𝑝𝑒𝑐 𝑎𝑚𝑏𝑖𝑒𝑛𝑡 × 𝐺𝑙𝑜𝑠𝑠) + 𝐼𝐵𝐿 𝑟𝑒𝑓
𝑅 𝑑𝑖𝑓𝑓 = 𝑐 𝑑𝑖𝑓𝑓 × 1 − 𝑐 𝑠𝑝𝑒𝑐 × { 𝑙 ∙ 𝑛 + 𝐼𝐵𝐿 𝑚𝑖𝑛−1}
𝐹𝑆𝐺 = 𝑐 𝑠𝑝𝑒𝑐 + (1 − 𝑐 𝑠𝑝𝑒𝑐)𝑒−6ℎ∙𝑣

54. 제안하는 PBS (계속)
𝑉 𝑙, 𝑣, ℎ =
1
( 𝑛 ∙ 𝑙 1 − 𝑎 + 𝑎)( 𝑛 ∙ 𝑣 1 − 𝑎 + 𝑎)
𝑎 =
2𝛼𝑝 + 1
8
, 𝛼𝑝 = 8192 𝐺𝑙𝑜𝑠𝑠
, 𝐺𝑙𝑜𝑠𝑠 𝑖𝑛 [0, 1]
𝐷 ℎ
4
=
𝛼𝑝 + 2
8
(𝑛 ∙ ℎ) 𝛼𝑝

55. 𝜋 or Not 𝜋
• Diffuse Term에서
1
𝜋
이 없는 이유
–
1
𝜋
은 Lambertian BRDF 식에 원래 포함되어 있는 부분
– 실제 세계에서 빛을 계산 할때 radiometric하게 빛을 측정
– 게임 라이트는 그렇지 않음!
• Specular Term에서
1
𝜋
이 없는 이유
– Blinn-Phong이나 Phong NDF BRDF모델은 SH기반
– 게임의 Specular는 빛을 받는 부분에서만 계산. 즉, SH 성분은 계산 하지 않음
• 요컨데, 게임에서 쓰이는 조명 시스템은 복사광을 계산하지 않기 때문에 실제
BRDF식에서 존재하는
1
𝜋
을 사용하지 않습니다!
55

56. 물리 기반 셰이더를 만들기 위한 전제
UDK에서

57. PBS를 위한 전제
• PBS를 위해선 엔진이 3가지를 지원해야 합니다.
– Gamma-Correct Rendering
– High Dynamic Range Rendering
– Tone mapping
– UDK는 이 세가지를 모두 지원합니다.
• High Dynamic Range(HDR) Rendering
– UDK의 HDR 랜더링된 이미지는 포스트 프로세스 버퍼에서 접근
가능합니다.
– 어차피 톤 맵도 포스트 프로세스니 상관 없습니다.
– 문제는 Gamma-Correct Rendering인데...
57

58. 빌어먹을 감마 코렉션…
58

59. 텍스쳐 읽을때
- D3DSAMP_SRGBTEXUTRE
랜더타겟에다 쓸때
- D3DRS_SRGBWRITEENABLE

60. 다음 텍스쳐는 어떻게 설정해줘야 할까요?
• 디퓨즈 맵
• 노멀 맵
• 스페큘러 맵
60

61. 정답
61
sRGB Linear sRGB?

62. UDK의 sRGB 옵션
• UDK는 기본적으로 임포트 되는 모든
텍스쳐가 리니어 컬러 스페이스에서
작업되어 저장된 것으로 상정합니다.
• 그렇기 때문에 외부 프로그램에서 그린
이미지와 똑같이 출력을 하려면 UDK로
임포트 하는 과정에서 역sRGB 보정을 해서
이미지를 밝게 만들어야 합니다.
62

63. 그럼 Specular map은?
• 당연히 노멀맵처럼 Linear gamma space여야 합니다.
– 그런데 전 sRGB를 사용했습니다. 왜?
– 너무 어둡거든요!
• 옆의 그림을 보시면 이해가 빠르실겁니다.
– 아스팔트랑 알콜의 스페큘러가 구분이 되십니까?
63

64. Gamma Correction에 대해 정리 하자면…
• UDK에선 입력되는 텍스쳐의 색 공간이 어떻든 무조건 리니어 감마
스페이스에서 제작한 것으로 상정하고 저장한다!
• UDK에선 그래픽 버퍼에서 최종 랜더링을 그릴때 무조건 sRGB로
색공간 변화를 해준다!
• 그래서 입력된 텍스쳐와 같은 결과를 얻으려면 역sRGB를 취해 밝게
저장 해야 한다!
• 즉, 디퓨즈 맵은 그냥 보통 작업하듯이 작업 하면 되고, 스페큘러
맵은 IOR 컬러의 역sRGB로 색공간 변화 준 것으로 작업 한다!
64

65. UDK로 PBS 만들기
이제 진짜로 만들어 봅시다!

66. 일단 Normalmap부터 만들어 봅시다.
• Blinn-Phong 모델을 사용하면
DXT1으로 압축된 Normalmap이
문제가 됩니다.
– UDK에선
TC_NormalmapUncommpressed
방식으로 압축 하면 됩니다만
해상도가 떨어집니다.
– 해상도를 유지하면서 블록 압축
현상을 피하고 싶었습니다.
66
Uncompressed DXT1

67. 그래서 약간의 처리를 해줍니다.
67
• 6 instructions가 들긴 합니다만
노멀맵의 해상도도 유지하면서 DXT1
압축에 의한 노이즈도 없애 줍니다.
• 심지어 텍스쳐 메모리 차지하는 용량도
DXT1과 차이가 없습니다!

68. 그래서 약간의 처리를 해줍니다.
68
• 6 instructions가 들긴 합니다만
노멀맵의 해상도도 유지하면서 DXT1
압축에 의한 노이즈도 없애 줍니다.
• 심지어 텍스쳐 메모리 차지하는 용량도
DXT1과 차이가 없습니다!

69. 큐브맵 LOD 접근하기 (1)
• IBL과 표면 거칠기에 따른 반사를
큐브맵의 Mipmap을 통해
처리한다고 말씀 드렸습니다.
– 그런데 UDK에서 어찌 Mipmap에
접근 하누?
– UDK의 머테리얼 에디터도 결국은
HLSL코드 입니다.
– 한번 불러와진 텍스쳐는
HLSL변수로 선언되어 있습니다.
이런 식으로요!
69

70. 큐브맵 LOD 접근하기 (2)
70

71. 큐브맵 LOD 접근하기 (3)
• 이렇게 하면 이런게 됩니다.
71

72. Diffuse Term
72

73. Distribute Term
73

74. Fresnel & Visibility Term
74

75. Ambient Term
75

76. PBS의 활용법
만든건 써먹어야지!

77. SpecualrMap과 GlossinessMap
• - Specular Map
– 하이라이트의 색
– 하이라이트 강도
– 주변 환경(EnvCube)의 반사 세기
– Fresnel 효과 정도
– Diffuse Map의 밝기
• Glossiness Map
– 하이라이트가 맺히는 면적
– 하이라이트 강도
– 주변 환경의 반사 선명도
– 표면의 거칠기
77

78. Specular 면적에 따른 강도의 변화
• 하이라이트가 넓게 - Glossiness가
낮으면
– 맺히는 하이라이트의 강도는
자동으로 줄어듭니다.
• 하이라이트가 좁게 - Glossiness가
높으면
– 맺히는 하이라이트의 강도가
높아집니다.
78

79. SpecularMap의 제작
• 비금속류(녹슨 금속, 얼음, 물, 나무, 돌, 천 등)
– RGB(0, 0, 0) ~ RGB(75, 75, 75)
– UnrealColor(0.0, 0.0, 0.0) ~ (0.08, 0.08, 0.08)
• 고광택 마감제가 칠해진 표면(플라스틱, 니스가 칠해진 나무,
폴리에스테르 가죽 등)
– RGB(90, 90, 90) ~ RGB(143, 143, 143)
– UnrealColor(0.1, 0.1, 0.1) ~ (0.28, 0.28, 0.28)
• 금속류(페인트가 칠해진 철, 알루미늄, 구리, 청동, 백금 등)
– RGB(155, 155, 155) ~ RGB(255, 255, 255)
– UnrealColor(0.3, 0.3, 0.3) ~ (1, 1, 1)
79

80. http://seblagarde.wordpress.com/2012/04/30/
dontnod-specular-and-glossiness-chart/

81. Glossiness Map의 강도에 따른 Specular
81

82. Specular와 Glossiness의 강도에 따른 주변 환경 반사 값 변화 (1)
82

83. Specular와 Glossiness의 강도에 따른 주변 환경 반사 값 변화 (2)
83

86. CONCLUSION
마지막 장입니다!

87. PBS는 이런 겁니다.
• PBS는 실제 세계의 물리 효과들을 표현합니다.
– 모든 표면에 존재하는 Specular
– Fresnel
– 표면 거칠기에 따른 미세표면 Shadowing과 Masking
– IBL(Image Based Lighting)
– 에너지 보존 법칙

88. PBS의 장점과 단점
• 장점
– 적은 텍스처 리소스로 거의 모든
재질을 표현 할 수 있음
– 아티스트가 조절할 부분이 적음
– 다양한 조명 환경에서의 안정적
결과물
– 하나의 셰이더만 있으면 되므로
Differed Renderer에도 적합
– 적용하는데 특별한 신기술이 필요
없음
• 단점
– 아티스트에게 개념을
이해시키기 힘듦
– WYSWYG을 위한 별도의
장치가 필요
– 큐브맵을 자동으로 만들어줄
장치가 필요
– 리얼한 장면만 만들 수 있음

89. PBS는…
• 제작이 좀 난해 하지만 충분히 시도할 가치가 있는 도전이라
생각합니다.
89

90. 질문사항은…
• Jalnaga@eyedentitygames.com 으로 메일 주시거나~
• 트위터 @jalnaga나
• http://jalnaga.net에 메시지를 남겨 주시면 성심 성의껏 답변
드리겠습니다.
90

91. 끝!