Tutorials

Diese Seite enthält mehrere Tutorialreihen, die unterschiedliche Arbeitsabläufe zur Entwicklung verschiedener Arten von Webspielen vorstellen.

2D-Breakout-Spiel mit reinem JavaScript

In diesem Schritt-für-Schritt-Tutorial implementieren Sie einen einfachen Breakout-Klon mit reinem JavaScript. Dabei lernen Sie die Grundlagen der Verwendung des <canvas>-Elements kennen, um grundlegende Spielmechaniken wie das Rendern und Bewegen von Bildern, die Kollisionserkennung, Steuerungsmöglichkeiten sowie Gewinn- und Verlustzustände umzusetzen.

2D-Breakout-Spiel mit Phaser

In diesem Schritt-für-Schritt-Tutorial implementieren Sie denselben Breakout-Klon wie in der vorherigen Tutorialreihe, diesmal jedoch mit dem HTML-Spieleframework Phaser. Dabei lernen Sie neben grundlegenden Spielmechaniken auch die Grundlagen und Vorteile der Arbeit mit Frameworks kennen.

2D-Labyrinthspiel mit Geräteausrichtung

Dieses Tutorial zeigt, wie Sie mit HTML ein 2D-Labyrinthspiel erstellen. Dabei werden Grundlagen wie die Kollisionserkennung und das Platzieren von Sprites auf einem <canvas> behandelt. Das mit dem Framework Phaser entwickelte Mobilspiel nutzt die APIs für Geräteausrichtung und Vibration, um das Spielerlebnis zu verbessern.

2D-Plattformspiel mit Phaser

Diese Tutorialreihe zeigt, wie Sie mit Phaser ein einfaches Plattformspiel erstellen. Sie behandelt Grundlagen wie Sprites, Kollisionen, Physik, sammelbare Gegenstände und mehr.