Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

114
1

description

siggraph 2010 uncharted 2

Transcript of Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Page 1: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

1

Page 2: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

2

Page 3: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

3

Page 4: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

You play as Drake, the loveable rogue. Check out this link for more character development: http://www.penny-arcade.com/comic/2009/10/19/.

4

Page 5: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

5

Page 6: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

6

Page 7: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

7

Page 8: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

8

Page 9: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

9

Page 10: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

The best implementation of skin in realtime that I’ve seen is the NVIDIA Human Head demo.

10

Page 11: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

When you look at the render on the left vs. an actual picture of Doug Jones, there is a certain fleshiness that is hard to explain. That’s what I like about the NVIDIA technique. On some level, it just “feels” like skin.

11

Page 12: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Obviously, movies can go much farther than we can in realtime. We’ll catch up eventually…I hope.

12

Page 13: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

This next section with show lots of pictures using Lazarevic from U2. Note that these tests are in Rendermonkey, not the game engine.

13

Page 14: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

14

Page 15: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Lazaravic with standard dot(N,L) lighting.

15

Page 16: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

16

Page 17: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

The NVIDIA technique divides light into diffuse light that gets absorbed and immediately retransmitted, versus light that bounces around inside the skin for a while before exiting. Not that the SSS light is more red-ish.

17

Page 18: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

18

Page 19: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Their approach uses essentially 6 layers of blur.

19

Page 20: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

The first layer is essentially no blur. This simulates light that gets absorbed and immediately retransmitted.

20

Page 21: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

The use weights for all 5 lightmaps to simulate the light that bounces inside the skin.

21

Page 22: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

22

Page 23: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

23

Page 24: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

The left side is a standard dot(N,L) and the right is with the NVIDIA skin shading.

24

Page 25: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Key point: The normals that point towards the light tend to look more cyan-ish and the normals that point away tend to be more red-ish.

25

Page 26: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Comparison of pure dot(N,L) diffuse to the NVIDI SSS technique.

26

Page 27: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Their approach looks great, but is very expensive in both memory.

27

Page 28: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

28

Page 29: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Instead of using 5 gaussian blurs, we’ll try to approximate that with a single 12-tap blur. It’s not as good, but much, much cheaper.

29

Page 30: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Check the ShaderX7 chapter for more detail.

30

Page 31: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

31

Page 32: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

32

Page 33: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

33

Page 34: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

34

Page 35: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

35

Page 36: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

36

Page 37: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

37

Page 38: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

38

Page 39: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

39

Page 40: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

40

Page 41: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Notice how using different normals for R/G/B seems to cause some blue spottiness.

41

Page 42: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

That’s because you have cases where the blue diffuse is near 1 and the red diffuse is near 0.

42

Page 43: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Another approach is to do a diffuse calculation for the Geometry and Normal Mapped normals, and lerp between them taking more red from the Geometry normal and more Green/Blue from the normal mapped normal.

43

Page 44: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

44

Page 45: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

45

Page 46: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

46

Page 47: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

47

Page 48: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

48

Page 49: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

49

Page 50: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

50

Page 51: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

51

Page 52: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

52

Page 53: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

53

Page 54: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

54

Page 55: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

55

Page 56: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

56

Page 57: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

57

Page 58: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

58

Page 59: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

59

Page 60: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

60

Page 61: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Sometimes, in cutscenes, the shots get pretty close, so we need the quality.

61

Page 62: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

You spend most of normal gameplay staring at the back of Drake’s neck, so a separate pass for SSS was not worth the cost.

62

Page 63: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

63

Page 64: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

64

Page 65: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

65

Page 66: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

66

Page 67: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

67

Page 68: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

68

Page 69: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

69

Page 70: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

70

Page 71: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

71

Page 72: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

72

Page 73: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

73

Page 74: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

74

Page 75: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

75

Page 76: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

76

Page 77: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

77

Page 78: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

78

Page 79: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

79

Page 80: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

80

Page 81: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

81

Page 82: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

82

Page 83: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

83

Page 84: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

The left shot is one of the first released screenshots before a lot of the tech got in. The one on the right is what we shipped. The one on the left has lots of hacks that we eventually took out, such as that orange glow around Drake’s skin.

84

Page 85: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

85

Page 86: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

86

Page 87: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

87

Page 88: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

88

Page 89: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

89

Page 90: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

90

Page 91: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

91

Page 92: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Notice that the NVIDIA demo has a harsh falloff. It looks great if you do everything else right, which is why that demo is the gold standard for skin in realtime.

92

Page 93: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

93

Page 94: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Since he looks fleshy, you would think that he has blurry maps.

94

Page 95: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

95

Page 96: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

96

Page 97: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

In the demo, they have extremely detailed maps and they use the lighting model to soften it.

97

Page 98: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

IMO what makes skin look right is how light bleeds around the normals. If you paint soft maps with no detail in the normals, it just looks flat.

98

Page 99: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Notice that there is more detail in the shot on the right. For U2, we really cranked the detail in the maps and the strength of the normals and then let the lighting model soften it.

99

Page 100: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

100

Page 101: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

101

Page 102: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

102

Page 103: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

103

Page 104: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Don’t bake too much AO into your diffuse maps.

104

Page 105: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

105

Page 106: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

You get HDR lighting from having high dynamic range in your LIGHTING. I see a lot of games that have all the tech for HDR lighting, but it still looks flat. The reason 99% of the time is that they have too much black in their textures. For an example of a game doing a really good job of managing their textures, check out Mirror’s Edge.

106

Page 107: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

107

Page 108: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

108

Page 109: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

109

Page 110: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

110

Page 111: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

Go through the cutscenes again and look for Drake’s tongue. You’ll see what I mean.

111

Page 112: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

I’m a big fan of custom lighting models (i.e. beyond Blinn-Phong). Btw, doing proper Linear-Space Lighting is more important than everything in this presentation combined.

112

Page 113: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

113

Page 114: Hable uncharted2(siggraph%202010%20 advanced%20realtime%20rendering%20course)

114