Fallstudie: Low High Head
Ein interaktives 3D-WebGL-Erlebnis, das mit dynamischen LOD-Übergängen, Vertex-Morphing und benutzerdefinierten Shadern experimentiert.
Projektübersicht
Das Low High Head-Projekt ist ein akademisches WebGL-Experiment, das dynamische Rendering-Schwellenwerte und individuelle Shader-Interaktionen untersucht. Die Anwendung wurde mit Three.js entwickelt und morphiert ein 3D-Kopfmodell in Echtzeit dynamisch zwischen Low-Poly- und High-Poly-Auflösungen. Dabei wird getestet, wie sich Lichtausbreitung, Vertex-Strukturen und benutzerdefinierte spekulare Highlights bei unterschiedlichen Mesh-Geometrien verhalten.
Durch das direkte Rendern der Rohmodelldaten im Browser stellt das Projekt interaktive Parameter bereit, um den Leistungsaufwand zu analysieren und Vertex-Morphing-Gleichungen über Tausende von Polygonen hinweg auszuwerten.
Zentrale technische Schwerpunkte
- Dynamisches Vertex-Morphing: Entwicklung benutzerdefinierter GLSL-Vertex-Shader zur flüssigen Interpolation von Koordinatenzuordnungen zwischen separaten Low-Poly- und High-Poly-Vertex-Puffern.
- Three.js-Beleuchtung & Schatten: Konfiguration von Echtzeit-Schattenkarten-Kaskaden und spekularen Reflexionsdurchgängen, um zu testen, wie sich die Ausbreitung von gerichtetem Licht an unterschiedliche Oberflächendichten anpasst.
- Performance-Benchmarking: Untersuchung von GPU-Pipeline-Overhead, Draw-Call-Häufigkeit und Browser-Garbage-Collection-Mustern beim Hot-Swapping schwerer Geometrie-Sets.