lecture 4: 3d rendering pipeline (i) prof. hsien-hsin sean lee school of electrical and computer...
TRANSCRIPT
![Page 1: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/1.jpg)
Lecture 4: 3D Rendering Pipeline (I)
Prof. Hsien-Hsin Sean LeeSchool of Electrical and Computer
EngineeringGeorgia Institute of Technology
![Page 2: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/2.jpg)
Interactive Game Loop
Game Input(Keyboard,
Mouse)
PhysicsStrategy, AI
RenderTriangles
(one frame)
Exit?
CleanupStates
30 to 60 frames per second
![Page 3: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/3.jpg)
3D Graphics Rendering Pipeline
• Geometry Pipeline– Processing Vertices– Mainly floating-point operations
• Rasterization Pipeline– Processing Pixels– Mainly dealing with Integer
operations
Geometry Processing
xy
z
xy
z
xy
z
xy
z
xy
z
x
y
Rasterization Processing
x
y
![Page 4: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/4.jpg)
3D Graphics Rendering Pipeline
• Geometry Pipeline– Processing Vertices– Mainly floating-point operations
• Rasterization Pipeline– Processing Pixels– Mainly dealing with Integer operations– MMX was originally designed to
accelerate this functionality
Geometry Processing
xy
z
xy
z
xy
z
xy
z
xy
z
x
y
Rasterization Processing
x
y
MMX ISAMMX ISA
![Page 5: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/5.jpg)
3D Graphics Rendering Pipeline
• Geometry Pipeline– Processing Vertices– Mainly floating-point operations– SSE/SSE2 were designed for this
part• Rasterization Pipeline
– Processing Pixels– Mainly dealing with Integer operations– MMX was originally designed to
accelerate this functionality
Geometry Processing
xy
z
xy
z
xy
z
xy
z
xy
z
x
y
Rasterization Processing
x
y
MMXMMX ISAISASSE/SSE2 ISASSE/SSE2 ISA
![Page 6: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/6.jpg)
Fixed Function 3D Graphics Pipeline
• Geometry Pipeline– Processing Vertices– Mainly floating-point operations– SSE/SSE2 were designed for this
part• Rasterization Pipeline
– Processing Pixels– Mainly dealing with Integer operations– MMX was originally designed to
accelerate this functionality
Geometry Processing
xy
z
xy
z
xy
z
xy
z
xy
z
x
y
Rasterization Processing
x
yPerformed by (GP)GPU
![Page 7: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/7.jpg)
3D Coordinates
• Left-handed system is more common for graphics viewing space
• Camera or viewer position can be set up using 3D API
+z
+x
+y
Right-Handed System
+z
+x
+y
Left-Handed System
![Page 8: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/8.jpg)
Geometry Format ─ Vertex Coordinates
(X1, Y1, Z1)
(X2, Y2, Z2)
(X3, Y3, Z3)
+Z
+X
+Y
X1
Z1
Y1
![Page 9: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/9.jpg)
Geometry Format ─ Vertex Normals
(NX1, NY1, NZ1)
(NX2, NY2, NZ2)
(NX3, NY3, NZ3)
+Z
+X
+Y
![Page 10: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/10.jpg)
Geometry Format ─ Vertex Colors
(R1, G1, B1, A1)
(R2, G2, B2, A2)
(R3, B3, B3, G3)
+Z
+X
+Y
![Page 11: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/11.jpg)
Triangle-based Geometry Representation
V5V4
V3
V2
V1
V1V2
V3V4
V5
V6V7
V8
V9
V5V4
V1V1
V3
V2
Triangle List(note the vertex order)
Triangle Strip Triangle Fan
![Page 12: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/12.jpg)
Specifying a 3D object
• Vertex ordering is critical
V1
V2 V3
V4
V5
V6V7Triangle list{v1, v3, v2},{v1, v5, v3},{v5, v6, v3},{v4, v3, v6},{v1, v7, v6},{v1, v6, v5}
Triangle strip{v5, v3, v1, v2},{v5, v6, v3, v4},{v7, v6, v1, v5}
![Page 13: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/13.jpg)
V8
Specifying a 3D object
• Vertex ordering is critical• We will discuss normal computation later in this lecture
V1
V2 V3
V4
V6V7Triangle list{v1, v2, v7},{v2, v8, v7},{v2, v3, v4},{v2, v4, v8},{v4, v7, v8},{v4, v6, v7}
Triangle strip{v1, v2, v7, v8},{v3, v4, v2, v8},{v6, v7, v4, v8}
![Page 14: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/14.jpg)
3D Rendering Pipeline
Clip
ping
Pers
pect
ive D
ivide
View
port
Tran
sfor
m
Rast
eriza
tion
Proj
ectio
n Tr
ansf
orm
Wor
ld T
rans
form
View
Tra
nsfo
rm
Ligh
ting
Back
face
Cul
ling
![Page 15: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/15.jpg)
Transformation Pipeline• World Transformation
– Model coordinates World coordinates
• View Transformation– World coordinates Camera space
• Projection Transformation – Camera space View Plane
• These are a series of matrix multiplications
![Page 16: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/16.jpg)
World Transformation
• Translation• Rotation• Scaling
+x
+z
+y
World origin
World Coordinates
Local model coordinates
Local model coordinates
![Page 17: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/17.jpg)
View Transformation
+x
+z
+y
World origin
World Coordinates
+y
+x
+z
• Camera position• Look vector
![Page 18: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/18.jpg)
Projection Transformation• Set up camera internals
• Set up – Field of View (FOV)– View frustum – View planes
• Will discuss later
![Page 19: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/19.jpg)
Homogeneous Coordinates• Enable all transformations to be done
by “multiplication” – Primarily for translation (See next few
slides)
• Add one coordinate (w) to a 3D vector
• Each vertex has [x, y, z, w]– W will be useful for perspective projection– W should be 1 in a Cartesian Coordinate
System
![Page 20: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/20.jpg)
Transformation 1: Translation (Offset)
+x
+z
+y
+x
+z
+y
(x, y, z)
(xt, yt, zt)
![Page 21: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/21.jpg)
Translation Matrix
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
⋅=
1TTT
0100
0010
0001
]z,1y,x,[],1z,y,x[
zyx
ttt
![Page 22: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/22.jpg)
Transformation 2: Scaling
+x
+z
+y
+x
+z
+y
![Page 23: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/23.jpg)
Scaling Matrix
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
⋅=
1000
0R00
00R0
000R
]z,1y,x,[],1z,y,x[z
y
x
rrr
![Page 24: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/24.jpg)
Transformation 3: Rotation
+x
+z
+y
+y
+x
+z
![Page 25: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/25.jpg)
2D Rotation
+x
+y
+x
+y
(x, y)
(x’, y’)
+x
+y
(x, y)
⎥⎥⎥
⎦
⎤
⎢⎢⎢
⎣
⎡−⋅=
100
0cossin
0sincos
]y,1x,[],1y',x'[ èè
èè
Rotate along which axis?
![Page 26: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/26.jpg)
3D Rotation Matrix
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡−
⋅=
1000
0100
00cossin
00sincos
]z,1y,x,[],1z',y',x'[èè
èè
Rotation along Z axis
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡ −
⋅=
1000
0cos0sin
0010
0sin0cos
]z,1y,x,[],1z',y',x'[θθ
θè
Rotation along Y axis
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
−⋅=
1000
0cossin0
0sincos0
0001
]z,1y,x,[],1z',y',x'[èè
èèRotation along X axis
![Page 27: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/27.jpg)
Non-Commutative Property (1)
1. Counter-clockwise 90o along y
2. Clockwise 90o along x
+x
+z
+y
+x
+z
+y
1. Clockwise 90o along x
2. Counter-clockwise 90o along y
![Page 28: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/28.jpg)
Non-Commutative Property (1)
+x
+z
+y
+x
+z
+y
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
−
−
=
⎥⎥⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢⎢⎢
⎣
⎡
−⋅
⎥⎥⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢⎢⎢
⎣
⎡
−−
−−−
1000
0001
0100
0010
1000
0)2
cos()2
sin(0
0)2
sin()2
cos(0
0001
1000
0)2
cos(0)2
sin(
0010
0)2
sin(0)2
cos(
ππ
ππ
ππ
ππ
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
−−
=
⎥⎥⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢⎢⎢
⎣
⎡
−−
−−−
⋅
⎥⎥⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢⎢⎢
⎣
⎡
−1000
0010
0001
0100
1000
0)2
cos(0)2
sin(
0010
0)2
sin(0)2
cos(
1000
0)2
cos()2
sin(0
0)2
sin()2
cos(0
0001
ππ
ππ
ππ
ππ
(x’’, y’’, z’’) = (-z, -x, y)
(x’’, y’’, z’’) = (-y, -z, x)
![Page 29: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/29.jpg)
Non-Commutative Property (2)
1. Translation by (x, y, z)2. Scale by 2 times
+x
+z
+y
1. Scale by 2 times2. Translation by (x, y, z)
+x
+z
+y
![Page 30: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/30.jpg)
Non-Commutative Property (2)
+x
+z
+y
+x
+z
+y
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
=
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
⋅
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
1
000
000
000
1000
000
000
000
1
0100
0010
0001
RzTzRyTyRxTx
Rz
Ry
Rx
Rz
Ry
Rx
TzTyTx
(x’’, y’’, z’’) = (x*Rx+Rx*Tx, y*Ry+Ry*Ty, z*Rz+Rz*Tz)
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
=
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
⋅
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
1
000
000
000
1
0100
0010
0001
1000
000
000
000
TzTyTx
Rz
Ry
Rx
TzTyTx
Rz
Ry
Rx
(x’’, y’’, z’’) = (x*Rx+Tx, y*Ry+Ty, z*Rz+Tz)
Offsets were scaled as well
![Page 31: Lecture 4: 3D Rendering Pipeline (I) Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology](https://reader037.vdocuments.mx/reader037/viewer/2022110207/56649d205503460f949f40bf/html5/thumbnails/31.jpg)
Non-Commutative Property• Ordering matters !
• Be careful when performing matrix multiplication