Signed Distance Fields

Signed Distance Fields

Short talk given at a UWaterloo CS Club's "Alt+Tab" short talks event.


Tristan Hume

July 03, 2018


  1. 5.

    Standard Text Rasterization — Raster all glyphs to texture with

    antialiasing at all required sizes — Render quads with texture coordinates pointing into the atlas Has to render glyph for every size! This makes pinch-zooming and text in 3D worlds slow or blurry.
  2. 6.

    Signed Distance Fields (SDFs) — The distance to the nearest

    point on the object's boundary — Negative on the inside of the object
  3. 7.

    Rendering Text with SDFs — Apply a smooth step function

    in a shader — Can add outline/glow to text by modifying mapping — Same texture can look good at a variety of sizes
  4. 8.

    Text in 3D worlds — Size of text on screen

    can change rapidly, poor fit for glyph atlases — Detailed in a 2007 paper by Chris Green at Valve
  5. 9.

    Problem: Rounded Corners — If text is rendered much bigger

    than SDF texture, corners get rounded — Solution: fancy tricks with multiple distance fields — The msdfgen project on Github can do this for you
  6. 10.
  7. 11.

    Ray Marching Distance Fields — Allows you to quickly ray

    trace distance fields — Fast enough to run in real time on a GPU fragment shader — Step as far as the distance field tells you is safe — Can compute normals using numerical slope
  8. 12.
  9. 13.

    ClayBook: What did you just see? — World stored as

    a signed distance field in 586MB 3D SDF texture — Fluid simulation done on GPU produces SDF every frame — Shape morphing done simply by linearly interpolating distance fields — Tracing cones through distance field for antialiasing and soft shadows — Use distance field information to approximate ambient occlusion
  10. 14.

    Modeling — Can use functions to calculate distance field as

    required — Inigo Quilez has a handy page with tons of these formulas — Unlike a 3D texture, doesn't take tons of space and can be evaluated accurately at any point
  11. 17.
  12. 18.

    3D Fractals! — People have figured out how to use

    derivatives of Mandelbrot-style iteration fractals as distance estimators. — Most famous are the Mandelbulb and Mandelbox
  13. 19.
  14. 20.