The Tricks Up Our Sleeves A Walkthrough of the Special FX of - - PowerPoint PPT Presentation

▶
the tricks up our sleeves
SMART_READER_LITE
LIVE PREVIEW

The Tricks Up Our Sleeves A Walkthrough of the Special FX of - - PowerPoint PPT Presentation

Nov 05, 2023 136 likes •1.23k views

The Tricks Up Our Sleeves A Walkthrough of the Special FX of Uncharted 3: Drakes Deception Keith Guerrette Lead Visual Effects Artist, Naughty Dog www.keithguerrette.com Mouse-over this icon to see my narration! Overview Evolution of our FX

slide-1
SLIDE 1

The Tricks Up Our Sleeves

A Walkthrough of the Special FX of Uncharted 3: Drake’s Deception

Keith Guerrette

Lead Visual Effects Artist, Naughty Dog www.keithguerrette.com Mouse-over this icon to see my narration!

slide-2
SLIDE 2

Overview

  • Evolution of our FX pipeline across the

Uncharted Franchise

  • Specific FX Challenges of Uncharted 3

(and the solutions that we came up with)

  • A few lessons we’ve learned, and plenty

we haven’t

slide-3
SLIDE 3

The Team

slide-4
SLIDE 4

Marshall Robin

Genius, FX Programmer Extraordinaire, and All-Round Cool Guy

slide-5
SLIDE 5

Marshall Robin

Genius, FX Programmer Extraordinaire, and All-Round Cool Guy

slide-6
SLIDE 6

EVOLUTION OF THE TOOLS

slide-7
SLIDE 7
slide-8
SLIDE 8

Uncharted 1 FX Pipeline

  • FX were hand-written

in a scripting language similar to LISP.

  • Shaders were hand

written in HLSL

slide-9
SLIDE 9
slide-10
SLIDE 10

Uncharted 2 FX Pipeline

  • Goals:
  • Artist friendly pipeline
  • Freedom and Power
  • Meet artistic

standards set by the top of the industry

slide-11
SLIDE 11
slide-12
SLIDE 12

Static Materials

slide-13
SLIDE 13

Static Materials

slide-14
SLIDE 14

Static Materials

slide-15
SLIDE 15

Static Materials

slide-16
SLIDE 16

Uncharted 2 FX Pipeline

  • Problems
  • Maya’s sprite engine

is terrible

  • We had to build our
  • wn controls,

functions, and better workflow

slide-17
SLIDE 17

Flipbook Materials

64 frames

512 x 512

32 frames

512 x 512

slide-18
SLIDE 18

Dynamic Materials

slide-19
SLIDE 19

Uncharted 2 Fire Material

slide-20
SLIDE 20
slide-21
SLIDE 21
slide-22
SLIDE 22

Uncharted 3 FX Pipeline

  • Goals:
  • Remove dependency
  • n Programmers
  • Improve efficiency of

workflow

  • Expose more control

the tools & artists

slide-23
SLIDE 23

Particle System & Emitter List Ramp & Attribute Controls Creation & Runtime Expression Controls Tons of other options, including:

Material Assignments, Spawn Methods, Custom Material Variables, Collisions, Sounds, Lights, Global Fields, UV Controls, Trails, Ribbons, etc

slide-24
SLIDE 24
slide-25
SLIDE 25
slide-26
SLIDE 26
slide-27
SLIDE 27
slide-28
SLIDE 28
slide-29
SLIDE 29

Uncharted 3 FX Pipeline

  • Current Readable Particles Attributes:
  • Ramp output (with custom V

inputs)

  • Position (world, local)
  • Velocity (world, local)
  • Age (particle)
  • Time (emitter)
  • Bouncecount
  • Timedelta
  • Bounce Count
slide-30
SLIDE 30

Uncharted 3 FX Pipeline

  • Current Particle Expression

Functions:

  • +-x/
  • Modulus
  • Random
  • Linstep & Smoothstep
  • Clamp
  • Magnitude
  • Sign
  • Sin & Cos
slide-31
SLIDE 31

Uncharted 3 FX Pipeline

  • Very powerful, math oriented

pipeline

  • Many different types of controls &

customizations

  • Fully supportive team of

programmers

  • Open communication
  • No Politics
  • Easy, understanding

discussions of priorities

slide-32
SLIDE 32

Uncharted 3 FX Pipeline

  • Any attribute in a shader can

be controlled at run-time

  • Up to 8 real-time inputs into

the shader, not including the vertex color and vertex opacity (12 Total)

slide-33
SLIDE 33

THE FX CHALLENGES OF UNCHARTED 3

slide-34
SLIDE 34

Challenge:

How do we utilize dynamic materials to create complex detail and motion within the particle system?

slide-35
SLIDE 35

Creating Motion in Particles

slide-36
SLIDE 36

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-37
SLIDE 37

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-38
SLIDE 38

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-39
SLIDE 39

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-40
SLIDE 40

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-41
SLIDE 41

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-42
SLIDE 42

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-43
SLIDE 43

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-44
SLIDE 44

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-45
SLIDE 45

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-46
SLIDE 46

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-47
SLIDE 47

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-48
SLIDE 48

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-49
SLIDE 49

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-50
SLIDE 50

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-51
SLIDE 51

Creating Motion in Particles

Prerequisite Knowledge: UV Math

slide-52
SLIDE 52

Creating Motion in Particles

Technique 1: Scrolling UV Distortion

slide-53
SLIDE 53

Creating Motion in Particles

Technique 1: Scrolling UV Distortion

slide-54
SLIDE 54

Creating Motion in Particles

Technique 1: Scrolling UV Distortion

slide-55
SLIDE 55

Creating Motion in Particles

Technique 1: Scrolling UV Distortion

slide-56
SLIDE 56

Creating Motion in Particles

Technique 1: Scrolling UV Distortion

  • Pros
  • Breaks the silhouette
  • Adds internal motion
  • Cons
  • It’s mostly non-directional motion and

ambiguous detail

slide-57
SLIDE 57

Creating Motion in Particles

Technique 2: Flow Technique

slide-58
SLIDE 58

Creating Motion in Particles

Technique 2: Flow Technique

slide-59
SLIDE 59

Creating Motion in Particles

Technique 2: Flow Technique

slide-60
SLIDE 60

Creating Motion in Particles

Technique 2: Flow Technique

slide-61
SLIDE 61

Creating Motion in Particles

Technique 2: Flow Technique

slide-62
SLIDE 62

Creating Motion in Particles

Technique 2: Flow Technique

slide-63
SLIDE 63

Creating Motion in Particles

Technique 2: Flow Technique

slide-64
SLIDE 64

Creating Motion in Particles

Technique 2: Flow Technique

slide-65
SLIDE 65

Creating Motion in Particles

Technique 2: Flow Technique

slide-66
SLIDE 66

Creating Motion in Particles

Technique 2: Flow Technique

slide-67
SLIDE 67

Creating Motion in Particles

Technique 2: Flow Technique

slide-68
SLIDE 68

Creating Motion in Particles

Technique 2: Flow Technique

slide-69
SLIDE 69

Creating Motion in Particles

Technique 2: Flow Technique

  • Pros
  • Extremely controllable awesome motion
  • Cons
  • Patterns of the motion are very visible (i.e.

not very random…)

  • Lots of negative space in the particle

(overdraw)

slide-70
SLIDE 70

BURNING DOWN A CHATEAU

slide-71
SLIDE 71
slide-72
SLIDE 72

Challenge:

How do we make an awesome fiery inferno covering the walls, floor, & ceiling, while running at 30 frames per second?

slide-73
SLIDE 73

Burning Down a Chateau

Prerequisite Knowledge: Z Depth Bias/Blending

slide-74
SLIDE 74

Burning Down a Chateau

Prerequisite Knowledge: Z Depth Bias/Blending

slide-75
SLIDE 75

Burning Down a Chateau

Prerequisite Knowledge: Z Depth Bias/Blending

slide-76
SLIDE 76

Burning Down a Chateau

slide-77
SLIDE 77

Burning Down a Chateau

slide-78
SLIDE 78

Burning Down a Chateau

  • Pros:
  • Less Particles = Less Overdraw = Better

Frame Rate

  • Cons:
  • All of the motion has to come from the

material

  • Texture resolution is important/visible
slide-79
SLIDE 79

CRASHING A CARGO PLANE

slide-80
SLIDE 80
slide-81
SLIDE 81

Challenge:

How do we make a realistic looking, thick, volumetric smokestack with enough broad and subtle motion to feel like its huge, but in the distance?

slide-82
SLIDE 82

Crashing a Cargo Plane

Prerequisite Knowledge: Dot Product Against a Normal Map

(0, 1, 0)

Light Vector

·

Dot Product

=

slide-83
SLIDE 83

Crashing a Cargo Plane

Prerequisite Knowledge: Dot Product Against a Normal Map

slide-84
SLIDE 84

Crashing a Cargo Plane

Prerequisite Knowledge: Dot Product Against a Normal Map

slide-85
SLIDE 85

Crashing a Cargo Plane

slide-86
SLIDE 86

Crashing a Cargo Plane

slide-87
SLIDE 87

Crashing a Cargo Plane

slide-88
SLIDE 88

Crashing a Cargo Plane

slide-89
SLIDE 89

Crashing a Cargo Plane

  • Pros:
  • Decent volumetric feel and motion
  • Tons of control over color, shape, motion, etc
  • Cons:
  • Requires A LOT of particles
  • Very expensive shader
slide-90
SLIDE 90

INTERACTING WITH THE DESERT

slide-91
SLIDE 91

Interacting with the Desert

slide-92
SLIDE 92

Challenge:

How do we make fluid, realistic sand interactions that consider the angle and direction of the sand dune?

slide-93
SLIDE 93

Interacting with the Desert

slide-94
SLIDE 94

Interacting with the Desert

slide-95
SLIDE 95

Interacting with the Desert

slide-96
SLIDE 96

Interacting with the Desert

slide-97
SLIDE 97

Interacting with the Desert

Projecting Particles into the World Normal Buffer Particle Texture Projected into Emissive Render Pass Projected into World Normal Buffer

slide-98
SLIDE 98

Interacting with the Desert

Sand Foot Prints

slide-99
SLIDE 99

Interacting with the Desert

Sand Foot Prints

slide-100
SLIDE 100

Interacting with the Desert

Sand Foot Prints

slide-101
SLIDE 101

Interacting with the Desert

Sand Foot Prints

slide-102
SLIDE 102

Interacting with the Desert

Sand Foot Prints

slide-103
SLIDE 103

Interacting with the Desert

slide-104
SLIDE 104

Interacting with the Desert

  • Pros:
  • @#$%ing awesome
  • Cons:
  • @#$%ing expensive
slide-105
SLIDE 105

RETROSPECTIVE

slide-106
SLIDE 106

Retrospective

  • Pros:
  • Incredible power and variety of controls and

tools to experiment with for new solutions

  • Open communication, experimentation, and

teamwork are our absolute greatest assets

slide-107
SLIDE 107

Retrospective

  • Cons
  • “With great power comes great responsibility”
  • We break the game all the time…locally.
  • Slow workflow from the vast amount of

control

slide-108
SLIDE 108

NAUGHTY DOG IS HIRING!

COMPANY EMAIL:

JOBS@NAUGHTYDOG.COM

RECRUITER EMAIL:

CANDACE_WALKER@NAUGHTYDOG.COM

TWITTER: @CANDACE_WALKER

slide-109
SLIDE 109

The Tricks Up Our Sleeves

A Walkthrough of the Special FX of Uncharted 3: Drake’s Deception

Keith Guerrette

Lead Visual Effects Artist, Naughty Dog www.keithguerrette.com