Topics in Computer
Graphics
Spring 2010
Application
Shading
Maps
Height map (Grey scale)
Base texture (RGB)
Normal map
(normal encoded RGB)
Normal Map & Height Field
Normal Map
 Normal vector encoded as rgb
 [-1,1]3 [0,1]3: rgb = n*0.5 + 0.5
 RGB decoding in fragment shaders
 vec3 n = texture2D(NormalMap, texcoord.st).xyz * 2.0 – 1.0
 In tangent space, the default (unit) normal points in
the +z direction.
 Hence the RGB color for the straight up normal is (0.5,
0.5, 1.0). This is why normal maps are a blueish color
 Normals are then used for shading computation
 Diffuse: n•l
 Specular: (n•h)shininess
 Computations done in tangent space
Tangent Space
 In order to build this Tangent Space, we need to define
an orthonormal (per vertex) basis, which will define
our tangent space.
 Tangent space is composed of 3 orthogonal vectors (T,
B, N)
 Tangent (S Tangent)
 Bitangent (T Tangent)
 Normal
 One has to calculate a tangent space matrix for every
single vertex
Tangent Space
 Suppose a point pi in world coordinate system for
whose texture coordinates are (ui, vi)
 Writing this equation for the points p1, p2 and p3,
defining the triangle :
p1 = u1.T + v1.B
p2 = u2.T + v2.B
p3 = u3.T + v3.B
Tangent Space
 p2 - p1 = (u2 - u1).T + (v2 - v1).B
p3 - p1 = (u3 - u1).T + (v3 - v1).B
6 eqns, 6 unknowns
 (v3 - v1).(p2 - p1) = (v3 - v1).(u2 - u1).T + (v3 - v1).(v2 - v1).B
- (v2 - v1).(p3 - p1) - (v2 - v1).(u3 - u1).T - (v2 - v1).(v3 - v1).B

(u3 - u1).(p2 - p1) = (u3 - u1).(u2 - u1).T + (u3 - u1).(v2 - v1).B
- (u2 - u1).(p3 - p1) - (u2 - u1).(u3 - u1).T - (u2 - u1).(v3 - v1).B

(v3 - v1).(p2 - p1) - (v2 - v1).(p3 - p1)
T = --------------------------------------(u2 - u1).(v3 - v1) - (v2 - v1).(u3 - u1)

(u3 - u1).(p2 - p1) - (u2 - u1).(p3 - p1)
B = --------------------------------------(v2 - v1).(u3 - u1) - (u2 - u1).(v3 - v1)
T,B: (unit)
vectors in
object space
TBN Matrix Per Vertex
 Use the averaged face normal as the vertex normal
 Do the same for tangent and bitangent vectors
 Note that the T, B vectors might not be orthogonal to
the normal vector
 Use Gram-Schmidt to make sure they are orthonormal
Coordinate Transformation
 o v x  Tx
Tangent space  o v   T
to object space  o y   y
 v z  Tz
Bx
By
 T v x  Tx
Object space to  T  
tangent space  T v y   Ty
 v z  Tz
 
Bx
By
Bz
Bz
N x   T vx 
 
N y   T v y 
N z   T v z 
Nx 
N y 
N z 
1
 o v x   Tx
o  
 v y    Bx
 o vz   N x
  
Ty
By
Ny
Tz   o v x 
 
Bz   o v y 
N z   o v z 
This reference (http://jerome.jouvie.free.fr/OpenGl/Lessons/Lesson8.php) is correct
TyphoonLabs is not right.
What is mat3 (v1,v2,v3)?!
It turns out to be “blue”
 (v1x v1 y

We deduce m at3  (v2 x v2 y
 (v3 x v3 y

v1z ) 

v2 z ) 
v3 z ) 
This is the matrix that
converts object space to
tangent space
Reference
 http://www.opengl.org/sdk/docs/tutorials/TyphoonLabs/Chapt





er_4.pdf
http://www.ozone3d.net/tutorials/bump_mapping.php
http://www.paulsprojects.net/tutorials/simplebump/simplebum
p.html
http://www.terathon.com/code/tangent.html
http://www.blacksmithstudios.dk/projects/downloads/tangent_matrix_derivation.php
http://jerome.jouvie.free.fr/OpenGl/Lessons/Lesson8.php