Tutorial: Ein Three.js-Game in 40 Minuten erstellen
Kommentare

Ein Mini-Game im Browser, in 3-D und mit Sound – das sind ja gleich drei Dinge auf einmal. Aber unter Verwendung von three.js, WebAudio API und threex Extensions könnt ihr in gerade einmal 40 Minuten

Ein Mini-Game im Browser, in 3-D und mit Sound – das sind ja gleich drei Dinge auf einmal. Aber unter Verwendung von three.js, WebAudio API und threex Extensions könnt ihr in gerade einmal 40 Minuten genau das bewerkstelligen. Jerome Etienne hat dazu ein ausführliches Tutorial auf learningthreejs.com zusammengestellt – inklusive Video, Slides und Demo.

Grundlage bietet ein three.js Boilerplate, dessen Installation und Setup ausführlich erläutert werden. Threex, ein leichtgewichtigtes Extension-System für three.js, wird im Anschluss für Spaceships, Planeten und für die Bedienelemente genutzt. Die „Szenerie“ fertig will man dann die Elemente interagieren lassen, sprich mit dem Spaceship Planeten zerstören – für das entsprechende „Krawumm“ sorgt das WebAudio API.

Nach 40 Minuten solltet ihr unter der Schritt-für-Schritt-Anleitung von Etienne also ein HTML5-Spielchen mit 3-D-Effekten haben, das euch mit Kollisionen und Soundeffekten bespaßt. Und keiner wird glauben, dass ihr dafür nicht mal eine Stunde gebraucht habt.

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -