
Ein Strichmännchen mit Two-Bone-IK animieren
Prozedurale Animation auf dem HTML-Canvas: ein IK-Solver in zehn Zeilen aus dem Kosinussatz, Gangzyklen, Füße ohne Rutschen, Keyframe-Spuren mit Easing, Squash and Stretch und Verlet-Haare.
Zum Artikel →Notizen aus der Entwicklung der kleinen interaktiven Szenen auf dieser Website – prozedurale Animation, Echtzeit-3D und die Tricks, die sie lebendig wirken lassen.

Prozedurale Animation auf dem HTML-Canvas: ein IK-Solver in zehn Zeilen aus dem Kosinussatz, Gangzyklen, Füße ohne Rutschen, Keyframe-Spuren mit Easing, Squash and Stretch und Verlet-Haare.
Zum Artikel →
Eine Summe aus Sinuswellen als einzige Quelle der Wahrheit, Normalen per finiter Differenzen, Gischt auf den Wellenkämmen per onBeforeCompile, ein Schiff, das ohne Physik hebt, stampft und rollt – und Nebel, Regen und Blitze, die den Sturm verkaufen.
Zum Artikel →
Prozedurales Gelände rund um einen gewundenen Bach, ein lichtbrechendes Wasserband, 25.000 instanzierte Grashalme mit Wind-Patch per onBeforeCompile, Bäume aus Blattkarten, Klick-zum-Gehen per Raycast auf den Boden sowie Bloom und Color Grading.
Zum Artikel →Jeder Artikel dreht sich um eine Szene, die du auf unserer Website ausprobieren kannst: die Strichmännchen-Seite (jetzt Stickman Spear Run, ein Runner, in dem du springst und mit dem Speer zustößt – das Bewegungslabor ist als zweiter Modus dabei), Sturm voraus und Waldspaziergang. Genre-Listen und Empfehlungen findest du in unseren Guides.