Flappy Bird kennen wahrscheinlich alle. Der Prototyp eines Casual Games wurde 2013 vom vietnamesischen Entwickler Dong Nguyen als Mobile App für Android und iOS veröffentlicht, war ein sensationeller Erfolg und zog unzählige ähnliche Spiele nach sich.

Flappy Bird ist dabei ein sehr simples Spiel. Gesteuert wird die Spielfigur am Smartphone durch Tippen auf eine beliebige Stelle des Touchscreens. Das eignet sich ideal zur Umsetzung am Arduino, da neben dem Display nur ein Pushbutton benötigt wird.

Meine einfache Implementierung entspricht vom Verhalten her sicher nicht 1:1 dem Original, aber der Programmcode ist einfach zu verstehen und kann leicht an eigene Bedürfnisse (Schwierigkeitsgrad, Erweiterung um Buzzer für Soundeffekte) angepasst werden.

Hardware-Anforderungen

Das Das Projekt stellt minimale Anforderungen an die Hardware, mit einem Arduino Uno R3 (oder kompatiblem Klon), einem kleinen OLED Display mit SSD1306-Controller und einem Pushbutton ist man schon dabei.

Für den Nachbau werden folgende Komponenten benötigt:

und die folgende Teile, die in jedem Arduino Starter Kit enthalten sind:

  • Arduino UNO R3 (oder kompatibel) mit Breadboard
  • Push-Buttonsfür die Steuerung
  • Ein paar Kabel zur Verbindung der Komponenten

Verkabelung am Breadboard

KomponenteArduino Pin
OLED SDAA4
OLED SCLA5
OLED VCC5V
OLED GNDGND
Push ButtonD2 und GND

Der Arduino Sketch und ein paar Anmerkungen

Den kompletten Quellcode findest du gut dokumentiert hier auf Github https://github.com/adidax/oled-flappy-bird-arduino/tree/main

Mit einem Arduino Uno R3 (oder kompatibel) und bei korrektem Aufbau der Schaltung am Breadboard sollte der Sketch ohne Änderungen funktionieren. Solltest du ein anderes Arduino Modell oder eine andere Belegung der Pins verwenden, dann sind eventuell kleine Anpassungen notwendig.

Der Sketch ist zwar gut dokumentiert, hier aber trotzdem ein paar kurze Anmerkungen zur Struktur.

Gleitkommafrei durch Skalierung

Wie schon beim ähnlichen Projekt Retro Racer werden auch hier alle Koordinaten am Spielfeld um den Faktor 10 hochskaliert und mit dem Datentyp int gespeichert. Damit können aufwändige Gleitkomma-Berechnungen vermieden werden, aber Spielmechaniken wie eine Änderung der Spielposition um 0,5 Pixel pro Frame sind trotzdem möglich. Das Display hat im Programmcode also nicht 128×64, sondern 1280×640 Pixel. Vor der Darstellung auf dem Display werden die Werte dann durch 10 geteilt, um diese auf die Koordinaten des OLED umzurechnen.

Fixe Framerate für gleichmäßigen Spielablauf

Damit das Spiel auf dem Arduino gleichmäßig läuft, wird versucht mit einer festen Bildwiederholrate von 25 FPS zu arbeiten. Das heißt: Die loop()-Funktion berechnet und zeichnet nur dann ein neues Frame, wenn mindestens 40 Millisekunden seit dem letzten vergangen sind:

const int FRAME_TIME = 40; // 40 ms per frame = 25 FPS
if (millis() - lastFrameTime < FRAME_TIME) return;
lastFrameTime = millis();Code-Sprache: JavaScript (javascript)

Das verhindert Timing-Probleme und sorgt dafür, dass Bewegung und Spielgeschwindigkeit stets konstant bleiben, unabhängig davon, wie schnell der Mikrocontroller gerade rechnet. Sollte die Berechnung und Ausgabe eines Frames länger als 40ms dauern, dann kommt es aber natürlich trotzdem zu Unregelmäßigkeiten im Ablauf. Das dürfte hier aber nicht der Fall sein.

Spielfigur fliegt bei Knopfdruck

Die Steuerung ist einfach. Pro Frame erhöht sich die Sinkgeschwindigkeit der Spielfigur um den Wert von GRAVITY und der Vogel bewegt sich nach unten. Wird der Pushbutton gedrückt, dann steigt der Vogel um den Wert von JUMP_STRENGTH und bewegt sich nach oben.

        // Wenn Button gedrückt, negative Beschleunigung (nach oben) addieren
        if (digitalRead(BUTTON_PIN) == LOW) {
            velocity = JUMP_STRENGTH;
        }
        velocity += GRAVITY; // Schwerkraft anwenden (positiver Wert = nach unten)
        velocity = constrain(velocity, -50, 50); // Begrenzung, damit Spielfigur nicht zu schnell fällt oder steigt

        // Position des Spielers berechnen
        birdY += velocity;Code-Sprache: JavaScript (javascript)

So entsteht das typische “Flap”-Gefühl mit steigender und fallender Bewegung.

Gnädige Kollisionsabfrage: 

Die Spielfigur ist rund, die Hitbox zur Kollisionsabfrage aber rechteckig. Daher habe ich bei der Berechnung der möglichen Kollision einen kleinen Spielraum von 2px berücksichtig.

if ((birdY - 2 * SCALE_FACTOR) < pipes[i].height || 
    (birdY + 2 * SCALE_FACTOR) > pipes[i].height + PIPE_GAP)Code-Sprache: HTML, XML (xml)

Damit fühlt sich das Spiel deutlich fairer an, die Spielfigur kann auch an einem Rohr „anstreifen“, ohne sofort eine Kollision zu melden.

Vorbereitung der Spielgrafik

Da das OLED-Display nur Schwarz-Weiß-Grafiken unterstützt, müssen Bilder in ein passendes Bitmap-Format umgewandelt und im Programmcode eingebunden werden. Dafür habe ich das kostenlose Online-Tool Image2CPP verwendet.

Schritt-für-Schritt-Anleitung für eigene Grafiken:

  1. Lade das gewünschte PNG-Bild hoch.
  2. Stelle die Bildgröße passend zur benötigten Pixelgröße ein (z. B. 10×8 Pixel für ein Auto).
  3. Wähle als Ausgabeformat → Arduino Code.
  4. Kopiere den generierten PROGMEM-Code in das Arduino-Projekt.
  5. Nutze display.drawBitmap(x, y, bitmap, width, height, SSD1306_WHITE); zur Anzeige des Bildes.

Diese Methode ermöglicht es, eigene Icons oder Sprites für das Spiel zu erstellen und ins Flash-Speicher (PROGMEM) des Arduino zu laden. Dabei muss man aber immer beachten, dass der Speicherplatz des Arduino sehr begrenzt ist :)

Spielprinzip und Steuerung

  • Die Spielfigur (ein Vogel) fliegt von links nach rechts durch das Bild. Die Flughöhe des Vogels verringert sich laufend durch die Schwerkraft, der Spieler kann über den Drucktaster einen Flügelschlag auslösen, welcher die Flughöhe wieder erhöht.
  • Gleichzeitig bewegen sich die Rohre als Hindernisse auf den Vogel zu. Die Spielfigur muss durch die Lücken in den Rohren gesteuert werden.
  • Kollidiert der Spieler mit einem Hindernis, ist das Spiel vorbei.
  • 3 Sekunden nach Game over wird die Highscore-Liste angezeigt.
  • Ein Druck auf eine beliebige Taste startet das Spiel neu.

Was mir am Projekt gefällt

Wie schon beim Retro Racer sieht man auch bei dieser Flappy Bird Variante, wie man klassische Spielideen mit einfachster Hardware und etwas Programmcode nachbauen kann und damit ein vollständiges, unterhaltsames Spiel entsteht. Die Kombination aus Spielphysik, Animation und einfachster Steuerung macht Flappy Bird zum perfekten Arduino-Projekt, egal ob zum Lernen, Lehren oder einfach zum Spaß.

Den kompletten Quellcode findest du gut dokumentiert hier auf Github https://github.com/adidax/oled-flappy-bird-arduino/tree/main

Tagged on:                         

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Time limit is exhausted. Please reload the CAPTCHA.

Diese Seite verwendet Akismet, um Spam zu reduzieren. Erfahre, wie deine Kommentardaten verarbeitet werden..

Datenschutz-Übersicht
Makerblog.at

Diese Website verwendet Cookies, damit wir dir die bestmögliche Benutzererfahrung bieten können. Cookie-Informationen werden in deinem Browser gespeichert und führen Funktionen aus, wie das Wiedererkennen von dir, wenn du auf unsere Website zurückkehrst, und hilft unserem Team zu verstehen, welche Abschnitte der Website für dich am interessantesten und nützlichsten sind.

Unbedingt notwendige Cookies

Unbedingt notwendige Cookies sollten jederzeit aktiviert sein, damit wir deine Einstellungen für die Cookie-Einstellungen speichern können.

Analyse

Diese Website verwendet Google Analytics, um anonyme Informationen wie die Anzahl der Besucher der Website und die beliebtesten Seiten zu sammeln.
Dieses Cookie aktiviert zu lassen, hilft uns, unsere Website zu verbessern.