Realtime Procedural 3D

met shader functies

Published
december 14, 2020

Inigo Quilez deelde onlangs zijn heel impressionant shader werk. Een shader is een verzameling van code met functies die uitgevoerd wordt door de GPU of grafische kaart en berekend welke kleuren de pixels krijgen in een beeld dat wordt getoond op het scherm. Inigo Quilez creëerde aan de hand van een shader een 3D gezicht van een ‘selfie girl’ inclusief animaties en achtergrond, en dat enkel aan de hand van wiskundige functies.

inigo quilez selfie girl

Bekijk de real-time versie op https://www.shadertoy.com/view/WsSBzh

Alle 3D vormen zijn opgebouwd met wiskundige functies. Zogenaamde SDF of sign distance functions. Deze functies worden uitgevoerd aan de hand van een raymarching algoritme, dat deze uitvoerd voor elke pixel op het camera beeld. Zo is de vorm van het hoofd opgebouwd uit een bol die overlapt met een tweede vervormde bol. Beide functies vormen dan een nieuwe functie waarbij telkens het minimum in afstand tot het camera punt wordt genomen. Om een mooie overgang te bekomen worden de harde overgangen in de functie uitgesmooth.

Daarnaast zijn de oogkassen bijvoorbeeld 2 bollen die uit de vorm van het gezicht gehaald worden. De oogleden en tanden zijn dan weer opgebouwd aan de hand van een torus en de wenkbrauwen en lippen aan de hand van een deel van een parabolische curve. Alles gecombineerd zorgen slechts een 900 tal lijnen code voor het uiteindelijke resultaat. In de video hieronder legt Inigo Quilez in detail uit hoe alles is opgebouwd.

Voor meer info omtrent de techniek van sign distance functies is het zeker interessant om het youtube kanaal van Inigo Quilez te bekijken. https://www.youtube.com/c/InigoQuilez/videos