water technology-of-uncharted-gdc-2012
TRANSCRIPT
![Page 1: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/1.jpg)
Carlos Gonzalez OchoaGraphics Programmer – Naughty Dog
Doug HolderFx Artist – Naughty Dog
Water Technology of Uncharted
1
![Page 2: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/2.jpg)
Contributors
Eben CookMichal IwanickiRyan Broner Vincent MarxenJacob Minkoff
Matt MorganJerome DurandPeter FieldJunki SaitaMarshall Robin
2
![Page 3: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/3.jpg)
Action and Adventure
Not a “water” game
3
Uncharted is an action adventure game. Game play is combat and exploration. Itʼs not about water gameplay
There are tons of environments: Jungle, temples, cities, caverns, ruins, etcIn each we generally add some water element. puddles, streams, rivers, pools, lakes, and lastly the oceanWater has been a major design element and we have improved it through the series
![Page 4: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/4.jpg)
4
![Page 5: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/5.jpg)
well, not always...
4
![Page 6: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/6.jpg)
5
![Page 7: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/7.jpg)
Water in many forms
6
![Page 8: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/8.jpg)
From small to large bodies of water
7
![Page 9: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/9.jpg)
Interaction with the water. Clothes get wet
8
![Page 10: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/10.jpg)
Slow and hard to navigate
Fast moving
9
![Page 11: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/11.jpg)
10The game has a very particular art style and the water had to be able to match it
Water has to moveHas to look better
![Page 12: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/12.jpg)
Previous work... lots of it
Crysis, Kameo, Resistance, Bioshock, Halo and many, many othersPerfect storm, Cast Away, Poseidon, Surf’s Up,...Tech demosScientific visualizationSIGGRAPH, IEEE, I3D papers
11
We saw lots of reference work in games, films and other scientific papers. The work in Scientific visualization was key for the work in flow
![Page 13: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/13.jpg)
river level
12
Complex refraction/reflection model Flow: Scroll uvs (per pixel/vertex) of normal map by a vector field Refraction: depth based jitter and coloring Foam movement using a threshold operation on a gradient field Churn: further depth based coloring.Use foam texture to modulate water depth, blend again. Pseudo-volumetric effect All parameters are artist controlled!
![Page 14: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/14.jpg)
river level
12
Complex refraction/reflection model Flow: Scroll uvs (per pixel/vertex) of normal map by a vector field Refraction: depth based jitter and coloring Foam movement using a threshold operation on a gradient field Churn: further depth based coloring.Use foam texture to modulate water depth, blend again. Pseudo-volumetric effect All parameters are artist controlled!
![Page 15: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/15.jpg)
Reflection w/ jitter
Bumped Normal
GeometricNormal
Depth distance
Depth color attenuation by distance to bg
Waveheight
Foam modulated by wave height
Churn color and depth color mixed by wave height
§ = Refraction w/ jitter
Shader
Flow
13The water shading uses already used ideas:Use a bump map to jitter the normal of the surface.Use a fresnel term using the jittered normal to blend between a refraction and reflection contribution.
In addition, we use other ideas to modulate the coloring of each contributionWe add foam that get lit on top of the reflection and refraction. We can also choose to mix the foam w/ the refraction, this can create muck
We use churn to simulate a volumetric effect
Refraction. We color the refraction depending on the distance between the surface of the water and the background The depth coloring can be a linear or exponential function The depth coloring can be affected by churn. We take one channel of the foam texture to blend between the depth coloring and the "churn" coloring. As the foam moves (which it also gets modulated by the waves), the coloring changes with the waves and the foam scrolling
The reflection can also be added on top the refraction instead of just blended.All fresnel coefficients, start-end are artist controlled
![Page 16: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/16.jpg)
Water shader by layers
14
![Page 17: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/17.jpg)
Reflection - no bump
15
![Page 18: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/18.jpg)
Reflection - with bump
16
![Page 19: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/19.jpg)
Refraction
17
The reflection and refraction are blended using a fresnel coefficient
![Page 20: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/20.jpg)
Reflection - depth based color - no bump
18
Depth based function is used to blend a base color and the refraction color. Here no jittering is applied.
![Page 21: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/21.jpg)
Reflection - depth based color - with bump
19
The jitter factor is also modulated by the depth
![Page 22: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/22.jpg)
Soft shadows
20
![Page 23: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/23.jpg)
Foam - modulated by wave’s amplitude
21
Foam and churn which add a texture above and belowThe foam is also moving by the flow
![Page 24: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/24.jpg)
Specular lighting
22
![Page 25: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/25.jpg)
Final
23
![Page 26: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/26.jpg)
Flow
Reflection w/ jitter
Bumped Normal
GeometricNormal
Depth distance
Depth color attenuation by distance to bg
Waveheight
Foam modulated by wave height
Churn color and depth color mixed by wave height
§ = Refraction w/ jitter
24
We will look into how we moved the normal maps, this is the key of the water shader
![Page 27: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/27.jpg)
Flow shaderVector field used to advect mesh propertiesUV scrollingDisplacement
Shader based on scientific visualization work:N. Max, B. Becker, “Flow Visualization using Moving Textures”, 96F. Neyret. “Advected Textures”, 03
25
The flow shader was originally created by C. Gonzalez-Ochoa at ND for Uncharted 1.
![Page 28: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/28.jpg)
0
1
0 1 2 3 4 5
Blend value
time
Texture 1Texture 2
0
1
UV distance movement
time
26
Here is an example of flow using a vertex shader to compute the blend values for triangles (instead of pixels).
Remember, to scroll in the right direction the uvs should move OPPOSITE to the intended direction
![Page 29: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/29.jpg)
0
1
0 1 2 3 4 5
Blend value
time
Texture 1Texture 2
0
1
UV distance movement
time
26
Here is an example of flow using a vertex shader to compute the blend values for triangles (instead of pixels).
Remember, to scroll in the right direction the uvs should move OPPOSITE to the intended direction
![Page 30: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/30.jpg)
27
We can use several other effects besides using the basic flow. Here we use a second fetch (feedback) to give extra fluidity
![Page 31: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/31.jpg)
Blend between two “flow” textures, one offset in phase by τ/2
Ways to improve it:Offset the placement after each cycleOffset uv starting position to minimize distortionOffset in space the phaseUse texture feedback (ping back) to get extra motion
28
There are many ways to improve flow. Since the texture moves in cycles of Tau seconds, the improvements come from where the texture starts moving from (1 and 2 above) The offset in space, is when using flow on a vertex shader and we want each pixel to blend at a different rate. Be careful because one does not want to big discontinuities across the whole texture.
![Page 32: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/32.jpg)
Flow shader half3 result, tx1, tx2; half s = .1; // small value float timeInt = (g_time) / (interval * 2); float2 fTime = frac(float2(timeInt, timeInt + .5)); float2 flowUV1 = uv - (flowDir/2) + fTime.x * flowDir.xy; float2 flowUV2 = uv - (flowDir/2) + fTime.y * flowDir.xy;
tx1 = FetchTexture(flowUV1); tx2 = FetchTexture(flowUV2); tx1 = FetchTexture(flowUV1 + s*tx1.xy); //[optional] Fetch 2nd tx2 = FetchTexture(flowUV2 + s*tx2.xy); //time for extra motion result = lerp(tx1,tx2, abs((2*frac(timeInt))-1);
29This is the most basic flow shader.
There are many ways to improve it. By adding an offset to where the texture starts:
float2 offset1 = float2(floor(timeInt) .1);float2 offset2 = float2 (floor(timeInt + .5) * .1 + .5);
flowUV2 = uv + offset1 - (flowDir/2) + fTime.x * flowDir,xy;flowUV2 = uv + offset2 - (flowDir/2) + fTime.y * flowDir.xy;
-----------Offset the uv starting position to minimize distortion. One wants the uv coordinates to have less distortion (that mean their displacement is 0) when the blend is at its maximum.
float timeInt = (g_time) / (interval * 2); float2 fTime = frac(float2(timeInt, timeInt + .5)); float2 flowUV1 = uv - (flowDir/2) + fTime.x * flowDir.xy + .5 * flowDir.xy; float2 flowUV2 = uv - (flowDir/2) + fTime.y * flowDir.xy + .5 * flowDir.xy;
-----------
You can spread around where the phase changes, this is easy to do if the flow is done on a pixel shader (not on triangles)float timeInt = (g_time) / (interval * 2);float offsetPhase = phaseScale * FetchPhaseTexture(u,v); // texture goes from 0..1 float2 fTime = frac(offsetPhase + float2(timeInt, timeInt + .5)); ------------You can think on many other ways to use flow.
Scientific visualization results can be handy to do cool shader effects.
![Page 33: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/33.jpg)
Easy to authorND Maya tool Dir, velocity Foam, phase
Flow gives playersa direction to whereto go.
Start
End
sunken ruins level30
This is the Maya tool used in all the Uncharted games. The tool uses splines to define the direction and color maps to control the magnitude of the velocities. Also,we can generate foam maps, and phase (for displacement).Later we will talk more about the basic flow displacement
![Page 34: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/34.jpg)
sunken ruins level31
![Page 35: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/35.jpg)
Each vertex moves ona circular pattern at adifferent phase φ
Flow based displacement
x1’=x1+cos(αt + φ1)y1’=y1 +sin(αt +φ1)
Global axis
Flow directionx2’=x2+cos(αt + φ2)
y2’=y2 +sin(αt +φ2)
32
Flow can also be used for displacement.In the case of U1, I encoded flow into the vertices. And we could do displacement in the SPU's.In addition to a vector field, we encoded a a phase field over the mesh.Every vertex moves in a anisotropic scaled circle.
So if we set the phase field nicely spaced not only in the direction of flow, but also perpendicular to it, we can get some interesting waves.Of course these waves will not be as dramatic nor complex as the one in U3
![Page 36: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/36.jpg)
Each vertex moves ona circular pattern at adifferent phase φ
Flow based displacement
x1’=x1+cos(αt + φ1)y1’=y1 +sin(αt +φ1)
Flow direction
Local axis
x2’=x2+cos(αt + φ2)y2’=y2 +sin(αt +φ2)
32
Flow can also be used for displacement.In the case of U1, I encoded flow into the vertices. And we could do displacement in the SPU's.In addition to a vector field, we encoded a a phase field over the mesh.Every vertex moves in a anisotropic scaled circle.
So if we set the phase field nicely spaced not only in the direction of flow, but also perpendicular to it, we can get some interesting waves.Of course these waves will not be as dramatic nor complex as the one in U3
![Page 37: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/37.jpg)
Each vertex moves ona circular pattern at adifferent phase φ
Flow based displacement
x1’=x1+cos(αt + φ1)y1’=y1 +sin(αt +φ1)
RotatedLocal axis
Circular Motionx2’=x2+cos(αt + φ2)
y2’=y2 +sin(αt +φ2)
32
Flow can also be used for displacement.In the case of U1, I encoded flow into the vertices. And we could do displacement in the SPU's.In addition to a vector field, we encoded a a phase field over the mesh.Every vertex moves in a anisotropic scaled circle.
So if we set the phase field nicely spaced not only in the direction of flow, but also perpendicular to it, we can get some interesting waves.Of course these waves will not be as dramatic nor complex as the one in U3
![Page 38: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/38.jpg)
33
![Page 39: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/39.jpg)
Flow
Useful for lots of other effects
Clouds, sand, snow, psychedelic effects...
See Keith Guerrette’s GDC 2012 talk“The Tricks Up Our Sleves....”
34We have used flow for sand moving on top of the dunes, the psychedelic effects in U3, cloud movement.FX artists even use it for fire and trails
![Page 40: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/40.jpg)
Water good enough for
What is next?
35
![Page 41: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/41.jpg)
early 2009 idea
“What if we have a ship in a storm... and we turn it 180 degrees and sink it?
Wouldn’t that be awesome?” Jacob Minkof Lead Designer
36
Simple displacement mesh with a shader will not be enough for this idea
![Page 42: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/42.jpg)
The cruise ship
37Nor for this rough ocean
![Page 43: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/43.jpg)
Ship graveyard
38This one was crazy. There is so much detail that we needed to capture on the ocean. All the action on the ship graveyard would be close to the water.We would smoothly transition from a calm ocean to a stormier and stormier ocean
![Page 44: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/44.jpg)
*
39
![Page 45: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/45.jpg)
* Thanks, we truly appreciate the challenge
*
39
![Page 46: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/46.jpg)
OceanRender challengesOpen ocean, big waves (100 meters+)
Waves drive boats and bargesAnimation loops were considered but not used
Swimming40
Initially designers thought about using a can animation for the cruise boat(silly designers, we can do better)One problem was that once we are on the boat is hard to read the scale of the waves. We are high on the boat and the camera attached to the player smooths out the waves.To compensate we have to exaggerated the amplitude of the waves to read as a storm.
![Page 47: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/47.jpg)
Wave SystemProceduralParametricDeterministic
LOD
Ocean
41
![Page 48: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/48.jpg)
Procedural
Simulation = too expensive Perlin like noise = not that good visually
42
Procedural geometry and animation are good if we can find a good model. Simulation would be too expensive to compute (even in SPUs) and hard to control by designers Perlin noise results are not that great visually, tend to look very artificial The FFT technique is great, but the parameters are hard to control and tweak by artists. Also is hard to get right.
![Page 49: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/49.jpg)
ParametricEvaluate at any point in R2 domain
F(<u,v>, t, parameters) → <x,y,z>
Vector displacement, not a heightfield
43
Since we would have an ocean any point should be able to be computed. The ocean was not restricted to a fixed grid and had to be compatible with other parametric equations. This way we could do a compositing wave system
It’s important to note we are generating a vector displacement. One would need a super fine mesh to have by sharp wave peaks with a heightfield. Its easier with a vector displacement, one does not need a fine mesh for it.
![Page 50: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/50.jpg)
DeterministicEvaluate at any point in R2 space and time
F(<u,v>, t, parameters) → <x,y,z>
Needed for cutscenes and multiplayer
44
For FMA scenes we needed to be able to rewind the ocean, so we cannot "advance" the state. So our system is statelessOur system is completely stateless
![Page 51: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/51.jpg)
WavesGerstner waves
- Simple but not enough high frequency detail
- Can only use few [big swells] before it’s too expensive
45
So all these requirements force us to certain techniques to use to evaluate waves. So the easiest ones are the Gerstner waves. These are the workhorse of waves, any one uses them. However, they get expensive to evaluate to get a good number (20+) of them.
The FFT technique is the most realistic one. But is hard to get the right parameters, the artists have to spend lot of time searching for the “correct” valuesWe also found some tiling artifacts when one has small grid resolutions (64 side)
![Page 52: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/52.jpg)
WavesGerstner waves
- Simple but not enough high frequency detail
- Can only use few [big swells] before it’s too expensive
FFT Waves - Tessendorf “Simulating Ocean Water”, 1999
+ Realistic, more detail
- Spectrum of frequencies - hard for artists to control½ Tiling visual artifacts at low resolution grids
46So all these requirements force us to certain techniques to use to evaluate waves.So the easiest is Gerstner waves. The work horse of waves, any one uses them. However, they get expensive to evaluate to get a good number (20+) of them.FFT again the most realistic ones. But as we said, hard to get right parameters. We found some tiling artifacts
![Page 53: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/53.jpg)
Wave ParticlesYuksel, House, Keyser, SIGGRAPH 2007
Waves from point sources
Ours -> Don’t use point sourcesInstead, in a toroidal domain place a random distribution of particles to approximate the chaotic motion of open water
Random positions and velocities within a some speed bounds
→ Yields a tileable vector displacement field
http://www.cemyuksel.com/research/waveparticles/
47
This is the main idea to get our open ocean waves. It's easy to implement and to optimize. See the Wave Particle paper for more details
![Page 54: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/54.jpg)
β=0β=.5β=1
48
![Page 55: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/55.jpg)
49
![Page 56: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/56.jpg)
Wave Particles+ Intuitive for artists to control
+ No tiling artifacts
+ Fast! Good for SPU vectorization [Optimization by Michal Iwanicki]
+ Deterministic in time. No need to move particles New position is derived from initial position, velocity and time
50
![Page 57: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/57.jpg)
Composition of displacement grids at different scales ≈ octaves
51
![Page 58: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/58.jpg)
Composition of displacement grids at different scales ≈ octavesCan also be translated over time
Fade out by distance
52
![Page 59: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/59.jpg)
Wave field Gerstner waves (x4)
Wave particles (1 grid used x4)
=
+
53
At this point , the displacement field, evaluates 4 gerstner waves plus 4 wave-particle grids per vertex
![Page 60: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/60.jpg)
Flow grid: Encode flow, foam, amplitude multipliers in a grid
Base grid with flow curves
54
![Page 61: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/61.jpg)
Flow grid: Encode flow, foam, amplitude multipliers in a grid
Flow vectors (direction and magnitude)
Flow grid: Encode flow, foam, amplitude multipliers in a grid
55
![Page 62: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/62.jpg)
Flow grid: Encode flow, foam, amplitude multipliers in a grid
Wave amplitude
56
![Page 63: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/63.jpg)
Wave’s amplitude
modulates foam
57
The foam modulation is outputed as a vertex color when we generate the final mesh
![Page 64: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/64.jpg)
58
![Page 65: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/65.jpg)
59
![Page 66: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/66.jpg)
Hey, we need this!
59
![Page 67: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/67.jpg)
Gerstner waves (x4)
Wave particles (x4)
Big wave
Addition of simpler waves
=
+
+
60
In addition to the previous waves, we add a custom artist wave.
This type of wave will be used for the crash wave scene and to also keep the player from swimming away from the game play area
![Page 68: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/68.jpg)
Big wave - Orient a square region Π over domain
uv
<x,y> → <u,v>Π
61
The wave is quite easier to construct. We need to reparametrize a rectangular domain over the plane. The rectangle can be though as the base of a NURBS patch. We can use the (u,v)->(0..1, -1..1) domain or the normalized one(0..1, 0..1), depending where is the center. The u is used to parameterize a Bspline curve. The v we extrude the curve and tapper it.
The subdomain can be scaled and translate over time to animate the wave
![Page 69: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/69.jpg)
Big wave - Create a Bspline curve oriented in the u direction
uv
<x,y> → <u,v>
62
![Page 70: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/70.jpg)
uv
Big wave - Extrude the Bspline along v direction63
![Page 71: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/71.jpg)
uv
y = ½ (cos(2πv-π)+1) · bspline(u)
Big wave - Taper on the sides64
![Page 72: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/72.jpg)
uv
y = cos(π(2v - ½)) · bspline(u,t)
Big wave - Translate, scale region or curve over time65
![Page 73: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/73.jpg)
66
![Page 74: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/74.jpg)
67
![Page 75: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/75.jpg)
68
This is a partial formula of the whole wave system. The bspline is a uniform, non-rational bspline. We could have used a Bezier but it requires more code.
The grid(u,v) function returns a scalar value given the u,v, coordinates. In this case, we have a multiplier for the wave scale
![Page 76: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/76.jpg)
LOD
Many ways to create the water mesh
Screen projected grid → aliasing artifactsQuasi projected grid → issues handling large displacements
69
![Page 77: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/77.jpg)
Irregular Geometry Clipmaps
Based on: Losasso, Hoppe, “Geometry Clipmaps: Terrain Rendering Using Nested Regular Grids” SIGGRAPH 04
Modified for water rendering
70
The irregular geometry clipmaps have different way to partition the rings and the blocks.
![Page 78: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/78.jpg)
Irregular Geometry Clipmaps
Different splits to fix T-joints across ring levelsDynamic blending between levelsPatches lead to better SPU utilization
71
![Page 79: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/79.jpg)
72
As the camera moves, the rings will move quads from one side to the other.
Any point in a ring will always be sampled from the same place. This way, we don’t have any jittering and aliasing problems
![Page 80: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/80.jpg)
Ring 1
Ring 2
Ring 3
Ring 3
...
73
![Page 81: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/81.jpg)
74
![Page 82: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/82.jpg)
75
![Page 83: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/83.jpg)
76
![Page 84: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/84.jpg)
77
![Page 85: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/85.jpg)
78
![Page 86: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/86.jpg)
79
![Page 87: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/87.jpg)
80
![Page 88: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/88.jpg)
81
![Page 89: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/89.jpg)
SingleRing
82
![Page 90: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/90.jpg)
NormalPatches
FixerPatches
83
![Page 91: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/91.jpg)
84
This is the general patch divisions. On a ring there are 16 patches. The lowest level ring would have an additional patch in the center
![Page 92: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/92.jpg)
Splits will alwaysavoid T-joints with next ring
Fixer patches give “space” between this and previous ring
85
![Page 93: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/93.jpg)
T-corner fixes
Skipped indices
Border triangulation fixing
Ring 1
Ring 2
86
![Page 94: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/94.jpg)
Border blending
Vertex blending area
Ring 1
Ring 2
87
![Page 95: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/95.jpg)
T-joint fixes Vertex blending
88
![Page 96: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/96.jpg)
Culling
Cull out patches that are outside frustum
Frustum-bbox test
89
2 pass culling. First we generate bounding boxes with some extra slack from 4 corners and perform a quick intersection test.
After we generate the displaced surface, we have a tighter bbox, and can perform another intersection test.
![Page 97: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/97.jpg)
90
![Page 98: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/98.jpg)
91
Video of the ocean clipmap rendering. In wireframe is easier to see how the clipmap levels are rendered
![Page 99: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/99.jpg)
Into the lion’s den
92
Although we are inside the ballroom, we can see out the ocean. Furthermore the waves are moving the boat, so the chandeliers are being driven indirectly by the waves.
To heighten the drama we are closer to the water level
![Page 100: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/100.jpg)
93
![Page 101: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/101.jpg)
Use portals to show patches seen from windowsFor waves intersecting ballroom:Use box aligned with ballroom to clamp down vertices
Culling
94
Another problem is that the ballroom is too low to the water line and we had clipping issues with big waves. The solution is simple, test the points to a box, oriented to the ballroom, and push the vertices down
![Page 102: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/102.jpg)
So something happens to the ship...
95
There is a sequence in U3, the Drakes goes from the top of the cruise-ship to the cargo hold. At the cargo hold, Drake does what he does best: destroy everything
![Page 103: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/103.jpg)
96
The ocean system is used in all the water in this sequence, we just change the shader and parameters.
![Page 104: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/104.jpg)
96
The ocean system is used in all the water in this sequence, we just change the shader and parameters.
![Page 105: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/105.jpg)
97
![Page 106: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/106.jpg)
97
![Page 107: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/107.jpg)
and we come back to the ballroom
98
![Page 108: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/108.jpg)
Ballroom●Intersection with water
99
![Page 109: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/109.jpg)
100
We could only render one ocean at a time, so we constantly had to change between all the different water elements in the cruiseship.
We would switch parameters and shader of the water. At some points between 2 frames.
The skylight section (the ballroom tilted 90 degrees) is technically the most difficult section of the whole game. We needed to render water outside, and could be seen from above and below. Also there would be a flooding stage.
We had to limit the movement of the boat to one plane, so we could clip the water using a simple plane. At some point we thought of using a curved glass, but we ran out of time.
![Page 110: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/110.jpg)
Above and below water lineOcean waves lapping on the windows
Flood
100
We could only render one ocean at a time, so we constantly had to change between all the different water elements in the cruiseship.
We would switch parameters and shader of the water. At some points between 2 frames.
The skylight section (the ballroom tilted 90 degrees) is technically the most difficult section of the whole game. We needed to render water outside, and could be seen from above and below. Also there would be a flooding stage.
We had to limit the movement of the boat to one plane, so we could clip the water using a simple plane. At some point we thought of using a curved glass, but we ran out of time.
![Page 111: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/111.jpg)
See Eben Cooks’ GDC 2012 talk“Creating the Flood Effects in U3”
Above and below water lineOcean waves lapping on the windows
Flood
100
We could only render one ocean at a time, so we constantly had to change between all the different water elements in the cruiseship.
We would switch parameters and shader of the water. At some points between 2 frames.
The skylight section (the ballroom tilted 90 degrees) is technically the most difficult section of the whole game. We needed to render water outside, and could be seen from above and below. Also there would be a flooding stage.
We had to limit the movement of the boat to one plane, so we could clip the water using a simple plane. At some point we thought of using a curved glass, but we ran out of time.
![Page 112: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/112.jpg)
Skylight scene
skylight [top down view]101
![Page 113: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/113.jpg)
Skylight scene
Cull out patches that are outside frustumFrustum-bbox test
skylight [top down view]101
![Page 114: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/114.jpg)
Skylight scene
Cull out patches that are outside frustumFrustum-bbox test
skylight [top down view]
Cull out patches outside skylightPlane-bbox test
101
![Page 115: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/115.jpg)
Skylight scene
Cull out patches that are outside frustumFrustum-bbox test
These ones still remain
skylight [top down view]
Cull out patches outside skylightPlane-bbox test
101
![Page 116: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/116.jpg)
Skylight scene
For rendering use shader discard operation to do plane clipping For evaluation clamp down points inside ballroom bbox
skylight
102
The culling using the shader was simple a plane culling
![Page 117: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/117.jpg)
Skylight scene (90 degree cruise-ship)
Fake underwater fog with a polygon “curtain” driven by the water movement (Eben’s Cook hack)
103
Faking the underwater fog was more complicated. Eben Cook did an awesome job figuring out a way to realize the effect without multipasses.He used a polygon skirt that is driven by the waves and it covers the back of the glass. The skirt shader simulates the fog effect of water.
![Page 118: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/118.jpg)
104
![Page 119: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/119.jpg)
104
![Page 120: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/120.jpg)
105
![Page 121: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/121.jpg)
105
![Page 122: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/122.jpg)
106
![Page 123: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/123.jpg)
Floating objectsSample points and best fit a plane for orientationOn intersection areas, multiply down amplitude
107
Depending on object, we can sample some points and best fit a plane to orient the object
![Page 124: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/124.jpg)
Attaching objectsSample points and best fit a plane for orientationOn intersection areas, multiply down amplitude
Amplitude multiplier
1
0108
![Page 125: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/125.jpg)
Sample points along length of the boatDon’t sample all waves (filter out high frequencies) Use a spring to allow movement of bow
point setaverage & normal
Average of points and normals
Cruise ship
109
![Page 126: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/126.jpg)
Player swimmingCamerasFloating objectsCollision probes
Point queries
p
?
110
Sampling a vector displacement field is not as trivial as a heightfield.
![Page 127: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/127.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 128: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/128.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>
1
p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 129: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/129.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>
1
p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
1
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 130: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/130.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>
1
p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
1
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 131: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/131.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>
1
p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
1
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 132: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/132.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>
1
p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
12
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 133: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/133.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
2
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 134: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/134.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
2
2
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 135: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/135.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
2
22
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 136: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/136.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
2
22
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 137: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/137.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
2
22
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 138: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/138.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
2
22 3
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 139: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/139.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
3
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 140: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/140.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
3
3
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 141: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/141.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
3
33
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 142: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/142.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
3
33
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 143: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/143.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
3
33
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 144: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/144.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
3
334
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 145: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/145.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
4
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 146: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/146.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
4
4
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 147: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/147.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
4
4
4
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 148: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/148.jpg)
p
Point queries Cameras, player query:given point p <u,v> find water position r <u, y, v>
Ryan Broner’s search method Similar to the Secant method, but use displacement in a R2→R3 map
query <u,v>p
result <u,v>+<x,y,z>q
projection <u,v>+<0,y,0>s
?
r final result position
4
4
4
r
111
We use a search method to the wave field instead of building a mesh and then do some form of ray casting.
![Page 149: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/149.jpg)
112
![Page 150: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/150.jpg)
Mesh computationFor each ring, run an SPU job to handle patches (i % 3):
J1: (0,3,6,9,12,15)J2: (1,4,7,10,13,[16])J3: (2,5,8,11,14)
Minimize ring level computationDouble buffer mesh output
0 1 2
3 4
5 76
8 9 10
11 12
13 14 15
16
113
The job distribution per SPU is in round-robin order.
A job consists on a set of patches (indexed using a modulus 3) on a particular ring.
![Page 151: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/151.jpg)
PPU
SPUjob 1
Main memory Buffer for meshes allocated per level
SPUjob 2
SPUjob n
…
Wave evaluation
Mesh indices and fixes
Mesh buffer (double buffered)
114
Since each job will create a perfectly seemed mesh, there is no need to stitch back the mesh.
The final mesh of the ocean, consists on multiple meshes
![Page 152: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/152.jpg)
SPUs
PPU
kick jobs
Wave particles water point surface queries Clipmap
Clipmap
Clipmap
Rain
Rain
Rain
water rayqueries
… …
Camera calculation wait jobs renderbarrier
115
We only have to be careful with time. The clipmaps need the wave particles at a particular time.
We only need a single wave-particles job. This job generates a displacement grid.
To synchronize the jobs we put a barrier to wait for the wave-particles job to have finished generating its mesh.
![Page 153: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/153.jpg)
PerformanceOcean 0.9 ms wave particles 0.1 ms water query (point and ray) 8.0 ms tessellation + wave displacement 5 SPUs average 7 rings = 21 jobs~2.7 ms rendering average 50+ visible patches1 Mb double buffer memory
116
![Page 154: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/154.jpg)
117
![Page 155: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/155.jpg)
Now, go and make some water
Questions?
Now, go and make some water
Questions?
118
![Page 156: Water technology-of-uncharted-gdc-2012](https://reader033.vdocuments.site/reader033/viewer/2022061521/55829263d8b42ac9798b53a7/html5/thumbnails/156.jpg)
119
This is a shot of the first pond we generated for U1. This was out test bed for flow, foam and interaction of Drake’s clothes