How Anisotropy Tangents Work with Normal Maps in glTF

In glTF 2.0, achieving realistic brushed metals, hair, and woven fabrics requires combining surface micro-detail from standard normal maps with directional highlights via the KHR_materials_anisotropy extension. This article breaks down how anisotropic tangent vectors interact mathematically with perturbed normal vectors in glTF shading pipelines. It explores coordinate space transformations, the re-orthogonalization process required to prevent rendering artifacts, and the step-by-step shader execution order.

The Tangent-Bitangent-Normal (TBN) Frame

glTF models define surface orientation using vertex attributes: a normal (NORMAL), a four-component tangent (TANGENT where the \(w\) component indicates handedness), and texture coordinates (TEXCOORD_0). These vectors form the orthonormal Tangent-Bitangent-Normal (TBN) basis matrix:

\[B = w \cdot (N \times T)\]

A standard normal map stores vector perturbations in tangent space. In the pixel shader, the sampled normal vector is mapped from the \([0, 1]\) range to \([-1, 1]\) and transformed by the TBN matrix to produce the final perturbed shading normal (\(N_{perturbed}\)).

The Role of KHR_materials_anisotropy

The KHR_materials_anisotropy extension modifies the specular highlight distribution by stretching the microfacet distribution (typically using an anisotropic GGX formulation) along a specific direction. This direction is driven by two main components:

  1. anisotropyStrength: Controls the ratio between the rough and smooth axes of the highlight.
  2. anisotropyRotation / anisotropyTexture: Defines a 2D directional vector in tangent space that rotates the primary tangent direction.

The anisotropic direction vector is initially defined relative to the surface's original tangent space. If an anisotropyTexture is present, its red and green channels represent a 2D directional offset \((x, y)\) on the tangent-bitangent plane.

Resolving the Interaction Between Normal Maps and Anisotropy

The primary technical challenge in glTF anisotropic shading is that standard normal mapping changes the normal vector at every pixel, which can break the orthogonality of the underlying tangent space. Anisotropic highlights rely strictly on an anisotropic tangent (\(T_{aniso}\)) and an anisotropic bitangent (\(B_{aniso}\)) that reside in the plane perpendicular to the active shading normal.

To maintain visual consistency and energy conservation, engines must follow a precise sequence of operations:

1. Derive the Tangent-Space Anisotropy Direction

Compute the initial 2D anisotropic orientation from the material parameters and texture:

\[\theta = \text{rotation}_{\text{material}} + \text{atan2}(\text{texture}.g, \text{texture}.r)\] \[v = \begin{bmatrix} \cos(\theta) \\ \sin(\theta) \end{bmatrix}\]

2. Rotate the Base Tangent Frame

Using the vertex tangent (\(T\)) and bitangent (\(B\)), form the initial un-normalized anisotropic tangent vector (\(T_{base}\)):

\[T_{base} = v_x \cdot T + v_y \cdot B\]

3. Perturb the Shading Normal

Evaluate the standard normal map using the original TBN matrix to obtain the perturbed shading normal \(N_{perturbed}\).

4. Gram-Schmidt Re-orthogonalization

Because \(N_{perturbed}\) no longer aligns with the geometric vertex normal, \(T_{base}\) is no longer orthogonal to the surface normal. To fix this, project \(T_{base}\) onto the tangent plane defined by \(N_{perturbed}\):

\[T_{aniso} = \text{normalize}(T_{base} - N_{perturbed} \cdot (N_{perturbed} \cdot T_{base}))\]

5. Generate the Final Anisotropic Bitangent

Calculate the secondary anisotropic direction using a cross product, respecting the original handedness:

\[B_{aniso} = \text{normalize}(\text{cross}(N_{perturbed}, T_{aniso}))\]

Visual Impact and Artifact Prevention

If a renderer fails to re-orthogonalize \(T_{aniso}\) against \(N_{perturbed}\), specular reflections will warp unnaturally across detailed surfaces. The highlights will look disconnected from micro-geometry features like seams, scratches, or grooves defined by the normal map.

Properly projecting the anisotropic tangent guarantees that highlights bend naturally around bumps and indentations, creating a cohesive visual interaction between fine geometric surface variation and directional specular reflections.