Techniken für die Spieleentwicklung

Diese Seite listet wesentliche Kerntechniken für alle auf, die Spiele mit offenen Webtechnologien entwickeln möchten.

2D-Kollisionsdetektion

Algorithmen zur Erkennung von Kollisionen in 2D-Spielen hängen von der Art der Formen ab, die kollidieren können (z.B. Rechteck zu Rechteck, Rechteck zu Kreis, Kreis zu Kreis). In der Regel verwenden Sie eine einfache generische Form, die das Objekt umgibt, bekannt als "Hitbox". Auch wenn die Kollision nicht pixelgenau sein mag, sieht es gut genug aus und ist performant über mehrere Objekte hinweg. Dieser Artikel gibt einen Überblick über die gängigsten Techniken zur Bereitstellung der Kollisionsdetektion in 2D-Spielen.

3D-Kollisionsdetektion

Dieser Artikel bietet eine Einführung in die verschiedenen Begrenzungsvolumentechniken, die zur Implementierung der Kollisionsdetektion in 3D-Umgebungen genutzt werden. Folgeartikel werden Implementierungen in spezifischen 3D-Bibliotheken behandeln.

3D-Spiele im Web

Für reichhaltige Spielerlebnisse im Web ist die Waffe der Wahl WebGL, das auf HTML-canvas gerendert wird. WebGL ist im Grunde OpenGL ES 2.0 für das Web — es ist eine JavaScript-API, die Werkzeuge zur Verfügung stellt, um reichhaltige interaktive Animationen zu erstellen und natürlich auch Spiele. Sie können dynamische 3D-Grafiken mit JavaScript generieren und rendern, die hardwarebeschleunigt sind.

Async-Skripte für asm.js

Jedes mittelgroße oder große Spiel sollte asm.js-Code als Teil eines asynchronen Skripts kompilieren, um dem Browser die maximale Flexibilität zur Optimierung des Kompilierungsprozesses zu geben. In Gecko ermöglicht die asynchrone Kompilierung der JavaScript-Engine, das asm.js vom Hauptthread getrennt zu kompilieren, während das Spiel geladen wird, und den generierten Maschinencode zu cachen, sodass das Spiel bei nachfolgenden Ladevorgängen nicht erneut kompiliert werden muss (beginnend mit Firefox 28). Um den Unterschied zu sehen, ändern Sie javascript.options.parallel_parsing in about:config.

Audio für Web-Spiele

Audio ist ein wichtiger Bestandteil eines jeden Spiels; es fügt Feedback und Atmosphäre hinzu. Web-basiertes Audio entwickelt sich schnell weiter, aber es gibt immer noch viele Browserunterschiede, die es zu beachten gilt. Oft müssen wir entscheiden, welche Audioteile für die Spielerfahrung unerlässlich sind und welche zwar nett, aber nicht zwingend erforderlich sind, und entsprechend eine Strategie entwickeln. Dieser Artikel bietet einen detaillierten Leitfaden zur Implementierung von Audio für Web-Spiele und untersucht, was derzeit auf möglichst vielen Plattformen funktioniert.

Implementieren von Steuerungen mit der Gamepad-API

Dieser Artikel betrachtet die Implementierung eines effektiven, plattformübergreifenden Steuersystems für Webspiele mit der Gamepad-API, das es ermöglicht, Ihre Webspiele mit Konsolenspiel-Controllern zu steuern. Es wird ein Fallstudien-Spiel vorgestellt — Hungry Fridge, erstellt von Enclave Games.

Implementierung von Spielsteuerungsmechanismen

Einer der Hauptvorteile von HTML5 als Plattform für die Spieleentwicklung ist die Möglichkeit, auf verschiedenen Plattformen und Geräten auszuführen. Das Vereinheitlichen von Unterschiede zwischen den Geräten bringt zahlreiche Herausforderungen mit sich, insbesondere, wenn es darum geht, passende Steuerungen für verschiedene Kontexte bereitzustellen. In dieser Artikelreihe zeigen wir Ihnen, wie Sie beim Erstellen eines Spiels vorgehen können, das sowohl auf Touchscreen-Smartphones, mit Maus und Tastatur als auch mit weniger verbreiteten Mechanismen wie Gamepads gespielt werden kann.

Scharfer Pixel-Art-Look mit image-rendering

Dieser Artikel beschreibt eine nützliche Technik, um Ihren Canvas/WebGL-Spielen einen scharfen Pixel-Art-Look zu verleihen, selbst auf hochauflösenden Monitoren.

Überblick über Kacheln und Kachelkarten

Kachelkarten sind eine sehr beliebte Technik in der 2D-Spielentwicklung, bei der die Spielwelt oder Kartenebene aus kleinen, gleichmäßig geformten Bildern, den sogenannten Kacheln, aufgebaut wird. Dies führt zu Leistungs- und Speichervorteilen — große Bilddateien, die komplette Kartenebenen enthalten, werden nicht benötigt, da sie aus kleinen Bildern oder Bildausschnitten mehrfach zusammengesetzt werden. Diese Artikelreihe behandelt die Grundlagen der Erstellung von Kachelkarten mit JavaScript und Canvas (obwohl dieselben hochrangigen Techniken in jeder Programmiersprache verwendet werden könnten).

WebRTC-Datenkanäle

Die WebRTC (Web Real-Time Communications) API ist vor allem für ihre Unterstützung von Audio- und Video-Kommunikation bekannt, bietet jedoch auch Peer-to-Peer-Datenkanäle an. Dieser Artikel erklärt mehr darüber und zeigt Ihnen, wie Sie Bibliotheken nutzen können, um Datenkanäle in Ihrem Spiel zu implementieren.