Arduino-Quiz mit ESP32 und Smartphones

Aus MediaWiki
Zur Navigation springen Zur Suche springen



Arduino-Quiz mit ESP32 und Smartphones






ESP32-Quiz: Professionelle Abschlussversion für ein WLAN-basiertes Smartphone-Quiz



Kurzbeschreibung

  1. Das Projekt ist ein digitales Quizspiel mit einem ESP32 als zentraler Spielsteuerung.
  2. Der ESP32 erstellt ein eigenes lokales WLAN.
  3. Zwei Spieler:innen verbinden ihre Smartphones mit diesem WLAN.
  4. Beide öffnen das Spiel im Browser.
  5. Eine App ist nicht nötig.
  6. Internet ist nicht nötig.
  7. Beide Spieler:innen bekommen gleichzeitig dieselbe Frage angezeigt.
  8. Jede Frage hat genau 4 Antwortmöglichkeiten.
  9. Ein Spiel besteht aus genau 10 Fragen.
  10. Pro Frage haben die Spieler:innen 10 Sekunden Zeit.
  11. Die schnellste richtige Antwort bekommt den Punkt.
  12. Nach 10 Fragen erscheint der Endstand.



Beste technische Lösung

  1. Die beste Variante ist ein ESP32 oder ESP32-S3 als lokaler WLAN-Server.
  2. Der ESP32 arbeitet als Access Point.
  3. Die Smartphones verbinden sich direkt mit dem ESP32-WLAN.
  4. Die Spieloberfläche läuft als Webseite im Browser.
  5. Die Spiellogik läuft zentral auf dem ESP32.
  6. Der Timer läuft ebenfalls zentral auf dem ESP32.
  7. Dadurch entscheidet nicht das Handy, sondern der ESP32 über Punkte, Zeit und Reihenfolge.
  8. Diese Lösung ist stabiler und einfacher als Bluetooth oder USB-C.
  9. Diese Lösung ist günstiger und näher an Arduino als eine Raspberry-Pi-Variante.



Warum keine andere Hauptvariante?

  1. Ein klassischer Arduino Uno ist ungeeignet, weil er kein eingebautes WLAN hat.
  2. Bluetooth ist für Smartphones im Schulprojekt zu fehleranfällig und oft app-abhängig.
  3. USB-C zwischen Smartphone und Mikrocontroller ist technisch zu kompliziert und nicht zuverlässig auf allen Geräten.
  4. Ein Raspberry Pi wäre leistungsfähiger, aber aufwendiger einzurichten.
  5. Für ein Schulprojekt mit Arduino-Charakter ist der ESP32 die beste Balance aus Kosten, Einfachheit, Leistung und Erweiterbarkeit.



Endgültige Spielregeln

  1. Zwei Spieler:innen spielen gegeneinander.
  2. Beide verwenden jeweils ein Smartphone.
  3. Beide sehen immer dieselbe Frage.
  4. Ein Spiel besteht aus 10 Fragen.
  5. Jede Frage hat 4 Antwortmöglichkeiten.
  6. Für jede Frage läuft ein 10-Sekunden-Timer.
  7. Die schnellste richtige Antwort innerhalb der 10 Sekunden bekommt 1 Punkt.
  8. Falsche Antworten geben 0 Punkte.
  9. Wer zu spät antwortet, bekommt 0 Punkte.
  10. Wenn beide falsch antworten, bekommt niemand einen Punkt.
  11. Wenn niemand innerhalb von 10 Sekunden richtig antwortet, bekommt niemand einen Punkt.
  12. Nach Ablauf der Zeit oder nach der ersten richtigen Antwort wird die Frage beendet.
  13. Danach erscheint kurz die Lösung.
  14. Anschließend startet die nächste Frage.
  15. Nach 10 Fragen wird der Endstand angezeigt.
  16. Die Person mit den meisten Punkten gewinnt.
  17. Bei Gleichstand kann optional eine Zusatzfrage gespielt werden.



Spielablauf auf dem Smartphone

  1. Spieler:in verbindet sich mit dem WLAN des ESP32.
  2. Spieler:in öffnet im Browser die Adresse http://192.168.4.1.
  3. Spieler:in wählt auf der Startseite:
  4. Spieler 1 oder Spieler 2
  5. optional einen Spielernamen
  6. Ein:e Spieler:in oder die Lehrkraft wählt:
  7. Fach
  8. Schwierigkeitsgrad
  9. konkretes Quiz
  10. Danach startet das Spiel.
  11. Beide Smartphones zeigen gleichzeitig Frage 1.
  12. Beide Smartphones zeigen vier Antwortbuttons.
  13. Der Countdown läuft von 10 Sekunden herunter.
  14. Nach der Antwort erscheint eine Rückmeldung.
  15. Nach Frage 10 erscheint der Endstand.



Auswahlmöglichkeiten im Spiel

  1. Fach, zum Beispiel:
  2. Mathematik
  3. Geografie
  4. Medienbildung
  5. Ernährung
  6. Deutsch
  7. Englisch
  1. Schwierigkeitsgrad:
  2. leicht
  3. mittel
  4. schwer
  1. konkretes Quiz, zum Beispiel:
  2. Multiplikation bis 10
  3. Hauptstädte Europas
  4. Sicher im Internet
  5. Gesunde Ernährung
  6. Wortarten
  7. Englisch-Vokabeln



Mindestvoraussetzungen

  1. 1x ESP32 oder besser ESP32-S3.
  2. 2x Smartphone mit WLAN und Browser.
  3. 1x Laptop oder PC zum Programmieren.
  4. 1x passendes USB-Datenkabel.
  5. Installierte Arduino IDE.
  6. Eingerichtete ESP32-Unterstützung in der Arduino IDE.
  7. Stromversorgung über Laptop, Netzteil oder Powerbank.
  8. Grundkenntnisse in Arduino oder Bereitschaft, mit KI schrittweise zu arbeiten.
  9. Ein funktionierender Beispielcode als Startpunkt.
  10. Vorbereitete Beispielquizze.



Empfohlene Einkaufsliste

Material Menge Empfehlung Zweck
ESP32-S3 Dev Board 1 pro Quizstation ESP32-S3 oder ESP32 DevKit WLAN, Webserver und Spielsteuerung
USB-Datenkabel 1 bis 2 Auf Datenfähigkeit achten Programmierung und Stromversorgung
Powerbank 1 5V USB-Ausgang Mobiler Betrieb ohne Laptop
Smartphones 2 Android oder iPhone Spielgeräte
Laptop oder PC 1 Mit Arduino IDE Programmierung
Buzzer optional einfacher Piezo-Buzzer Tonsignal bei Antwort oder Spielende
rote und grüne LED optional mit Widerständen sichtbare Rückmeldung am Spielgerät
kleines Gehäuse optional Karton, Holz oder 3D-Druck Schutz und Präsentation



Was die Lehrkraft im Vorfeld beachten muss

  1. Den ESP32 vor dem Projekttag mindestens einmal erfolgreich programmieren.
  2. Die Arduino IDE auf allen benötigten Geräten installieren.
  3. ESP32-Boardpaket in der Arduino IDE einrichten.
  4. Den richtigen USB-Treiber prüfen.
  5. Mehrere USB-Kabel testen, weil viele Kabel nur Ladekabel sind.
  6. WLAN-Verbindung mit zwei Smartphones vorher testen.
  7. Prüfen, ob die Smartphones ein WLAN ohne Internet akzeptieren.
  8. Den Hinweis Kein Internet erklären, da er bei dieser Lösung normal ist.
  9. Einen funktionierenden Grundcode bereithalten.
  10. Mindestens ein Beispielquiz vorbereiten.
  11. Ersatz-ESP32 oder Ersatzkabel bereithalten.
  12. Gruppenrollen festlegen.
  13. Zeit für technische Probleme einplanen.
  14. Datenschutz beachten: Es müssen keine echten Namen verwendet werden.
  15. Empfehlenswert sind neutrale Namen wie Team Rot und Team Blau.
  16. Vorher entscheiden, ob Schüler:innen eigene Quizfragen schreiben oder vorgegebene Quizsets bearbeiten.
  17. Vorher entscheiden, ob nur die Lehrkraft oder auch Spieler:innen das Quiz auswählen dürfen.



Empfohlene Projektstruktur

  1. Phase 1: ESP32 startet ein WLAN.
  2. Phase 2: Smartphone öffnet eine einfache Webseite.
  3. Phase 3: Eine Frage mit vier Antworten wird angezeigt.
  4. Phase 4: Zwei Spieler:innen werden unterschieden.
  5. Phase 5: Punktestand wird gespeichert.
  6. Phase 6: 10-Sekunden-Timer wird eingebaut.
  7. Phase 7: Schnellste richtige Antwort gewinnt.
  8. Phase 8: 10 Fragen werden nacheinander gespielt.
  9. Phase 9: Fach, Schwierigkeit und Quiz werden auswählbar.
  10. Phase 10: Neue Quizsets werden ergänzt.



Technischer Ablauf einer Frage

  1. Der ESP32 lädt die aktuelle Frage.
  2. Der ESP32 speichert die Startzeit.
  3. Beide Smartphones holen denselben Spielstand vom ESP32.
  4. Beide Smartphones zeigen dieselbe Frage und dieselben vier Antworten.
  5. Der Countdown startet bei 10 Sekunden.
  6. Spieler:innen tippen auf eine Antwort.
  7. Das Smartphone sendet Antwort, Spieler-ID und Frage-ID an den ESP32.
  8. Der ESP32 prüft:
  9. Ist die Frage noch aktiv?
  10. Ist die Antwort innerhalb der 10 Sekunden eingegangen?
  11. Ist die Antwort richtig?
  12. Gab es bereits eine richtige Antwort?
  13. Wenn die Antwort richtig und am schnellsten ist, bekommt diese Person den Punkt.
  14. Danach wird die Frage geschlossen.
  15. Beide Smartphones zeigen das Ergebnis.
  16. Nach kurzer Anzeige startet die nächste Frage.



Wichtige Fairness-Regel

  1. Die Zeitmessung muss auf dem ESP32 stattfinden.
  2. Die Smartphones dürfen nicht selbst über Punkte entscheiden.
  3. Entscheidend ist, welche gültige Antwort zuerst beim ESP32 ankommt.
  4. Ganz exakt gleichzeitig ist bei WLAN technisch nie garantiert.
  5. Für ein Schulprojekt mit zwei Geräten ist diese Lösung aber fair genug.
  6. Wichtig ist, dass beide Smartphones dieselbe Frage-ID verwenden.
  7. Alte Antworten zu früheren Fragen müssen ignoriert werden.



Datenstruktur für Quizsets

<syntaxhighlight lang="cpp"> const int QUESTIONS_PER_GAME = 10; const int ANSWERS_PER_QUESTION = 4; const unsigned long QUESTION_TIME = 10000;

struct Question { 

 const char* question;
 const char* answers[ANSWERS_PER_QUESTION];
 int correct;

};

struct Quiz { 

 const char* subject;
 const char* difficulty;
 const char* title;
 Question questions[QUESTIONS_PER_GAME];

}; </syntaxhighlight>



Erklärung der Datenstruktur

  1. QUESTIONS_PER_GAME legt fest, dass ein Spiel genau 10 Fragen hat.
  2. ANSWERS_PER_QUESTION legt fest, dass jede Frage genau 4 Antwortmöglichkeiten hat.
  3. QUESTION_TIME legt fest, dass jede Frage 10 Sekunden dauert.
  4. Question beschreibt eine einzelne Frage.
  5. Quiz beschreibt ein vollständiges Quiz.
  6. Die richtige Antwort wird als Zahl gespeichert:
  7. 0 = Antwort A
  8. 1 = Antwort B
  9. 2 = Antwort C
  10. 3 = Antwort D



Beispielquiz: Multiplikation bis 10

<syntaxhighlight lang="cpp"> Quiz multiplicationEasy = { 

 "Mathematik",
 "leicht",
 "Multiplikation bis 10",
 {
   {"Was ist 2 x 3?", {"4", "5", "6", "8"}, 2},
   {"Was ist 4 x 5?", {"15", "20", "25", "30"}, 1},
   {"Was ist 6 x 6?", {"30", "32", "36", "42"}, 2},
   {"Was ist 7 x 8?", {"48", "54", "56", "64"}, 2},
   {"Was ist 9 x 3?", {"21", "24", "27", "30"}, 2},
   {"Was ist 5 x 5?", {"20", "25", "30", "35"}, 1},
   {"Was ist 8 x 2?", {"12", "14", "16", "18"}, 2},
   {"Was ist 10 x 7?", {"60", "65", "70", "75"}, 2},
   {"Was ist 3 x 9?", {"24", "27", "30", "33"}, 1},
   {"Was ist 4 x 4?", {"12", "14", "16", "18"}, 2}
 }

}; </syntaxhighlight>



Beispielquiz: Hauptstädte Europas

<syntaxhighlight lang="cpp"> Quiz capitalsEasy = { 

 "Geografie",
 "leicht",
 "Hauptstaedte Europas",
 {
   {"Was ist die Hauptstadt von Deutschland?", {"Paris", "Berlin", "Madrid", "Rom"}, 1},
   {"Was ist die Hauptstadt von Frankreich?", {"Berlin", "Paris", "Rom", "Wien"}, 1},
   {"Was ist die Hauptstadt von Italien?", {"Mailand", "Rom", "Neapel", "Turin"}, 1},
   {"Was ist die Hauptstadt von Spanien?", {"Barcelona", "Madrid", "Sevilla", "Valencia"}, 1},
   {"Was ist die Hauptstadt von Oesterreich?", {"Graz", "Linz", "Salzburg", "Wien"}, 3},
   {"Was ist die Hauptstadt der Schweiz?", {"Zuerich", "Genf", "Basel", "Bern"}, 3},
   {"Was ist die Hauptstadt von Tschechien?", {"Brno", "Prag", "Wien", "Berlin"}, 1},
   {"Was ist die Hauptstadt von Norwegen?", {"Stockholm", "Oslo", "Helsinki", "Kopenhagen"}, 1},
   {"Was ist die Hauptstadt von Griechenland?", {"Athen", "Rom", "Sofia", "Tirana"}, 0},
   {"Was ist die Hauptstadt von Portugal?", {"Madrid", "Porto", "Lissabon", "Rom"}, 2}
 }

}; </syntaxhighlight>



Einfache Erweiterbarkeit

  1. Ein neues Quiz wird als neuer Quiz-Block ergänzt.
  2. Jedes Quiz muss genau 10 Fragen haben.
  3. Jede Frage muss genau 4 Antworten haben.
  4. Die richtige Antwort muss als Zahl von 0 bis 3 eingetragen werden.
  5. Danach wird das neue Quiz in die Quizliste eingetragen.

<syntaxhighlight lang="cpp"> Quiz quizzes[] = { 

 multiplicationEasy,
 capitalsEasy

};

int quizCount = sizeof(quizzes) / sizeof(quizzes[0]); </syntaxhighlight>



Beispiel: Neues Quiz mit KI erstellen lassen

  1. Die Schüler:innen können KI nutzen, um neue Quizsets vorzubereiten.
  2. Die KI sollte eine klare Struktur bekommen.
  3. Die Ergebnisse müssen fachlich geprüft werden.
  4. Besonders bei Hauptstädten, historischen Daten oder Fachwissen muss die Lehrkraft oder die Gruppe kontrollieren, ob die Antworten stimmen.



KI-Prompt für ein neues Quizset

Erstelle ein Arduino-C++-Quizset für einen ESP32-Quizcode. Das Quiz soll genau 10 Fragen enthalten. Jede Frage soll genau 4 Antwortmöglichkeiten haben. Die richtige Antwort soll als Index von 0 bis 3 angegeben werden. Fach: Mathematik. Schwierigkeitsgrad: leicht. Titel: Multiplikation bis 10. Formatiere das Ergebnis exakt nach dieser Struktur:

Quiz quizName = { 

 "Fach",
 "Schwierigkeitsgrad",
 "Titel",
 {
   {"Frage?", {"Antwort A", "Antwort B", "Antwort C", "Antwort D"}, richtigeAntwort}
 }

};



Empfohlene technische Umsetzung

  1. Der ESP32 liefert eine HTML-Seite aus.
  2. Die Seite enthält HTML für Struktur.
  3. Die Seite enthält CSS für Gestaltung.
  4. Die Seite enthält JavaScript für automatische Aktualisierung.
  5. Die Seite fragt regelmäßig den Spielstatus beim ESP32 ab.
  6. Der ESP32 stellt dafür einfache Adressen bereit:
  7. / für die Startseite.
  8. /status für den aktuellen Spielstand.
  9. /answer für eingehende Antworten.
  10. /select für die Auswahl von Fach, Schwierigkeit und Quiz.
  11. /start zum Starten eines Spiels.
  12. /reset für ein neues Spiel.



Warum regelmäßige Statusabfrage statt komplizierter App?

  1. Die Smartphones brauchen keine Installation.
  2. Der Browser reicht.
  3. Die Technik ist für Schüler:innen verständlicher.
  4. Fehler lassen sich leichter finden.
  5. Der Code bleibt überschaubar.
  6. Für zwei Spieler:innen ist diese Lösung ausreichend schnell.
  7. Später kann man die Statusabfrage durch WebSockets ersetzen.



Benutzeroberfläche auf dem Smartphone

  1. Große Buttons.
  2. Klare Schrift.
  3. Wenige Elemente.
  4. Gut sichtbarer Countdown.
  5. Punktestand oben.
  6. Frage in der Mitte.
  7. Vier Antwortmöglichkeiten darunter.
  8. Farbrückmeldung nach Antwort:
  9. Grün = richtige schnellste Antwort.
  10. Rot = falsch.
  11. Gelb = Zeit abgelaufen oder zu langsam.
  12. Blau = nächste Frage startet.



Projektablauf Schritt für Schritt



Schritt 1: ESP32 einrichten

  1. Arduino IDE installieren.
  2. ESP32-Boardpaket installieren.
  3. ESP32 per USB anschließen.
  4. Richtiges Board auswählen.
  5. Richtigen Port auswählen.
  6. Testprogramm hochladen.
  7. Seriellen Monitor öffnen.
  8. Prüfen, ob der ESP32 reagiert.



Schritt 2: WLAN-Grundfunktion testen

  1. ESP32 soll ein WLAN mit dem Namen Quiz-Spiel erstellen.
  2. Smartphone verbindet sich mit Quiz-Spiel.
  3. Browser öffnet http://192.168.4.1.
  4. Eine einfache Testseite erscheint.
  5. Erst wenn das funktioniert, wird das Quiz ergänzt.



Schritt 3: Einfache Quizfrage anzeigen

  1. Eine Frage wird im Code gespeichert.
  2. Vier Antworten werden angezeigt.
  3. Ein Klick auf eine Antwort wird an den ESP32 gesendet.
  4. ESP32 meldet richtig oder falsch zurück.



Schritt 4: Zwei Spieler:innen ergänzen

  1. Spieler:in 1 meldet sich als Spieler 1 an.
  2. Spieler:in 2 meldet sich als Spieler 2 an.
  3. Der ESP32 speichert zwei Punktestände.
  4. Beide Smartphones sehen denselben Spielstand.



Schritt 5: 10-Sekunden-Timer ergänzen

  1. Beim Start jeder Frage wird die Startzeit gespeichert.
  2. Antworten sind nur 10 Sekunden gültig.
  3. Nach 10 Sekunden wird die Frage geschlossen.
  4. Die nächste Frage startet automatisch oder nach kurzer Ergebnisanzeige.



Schritt 6: Schnelligkeitsregel ergänzen

  1. Der ESP32 prüft jede Antwort sofort.
  2. Die erste richtige Antwort gewinnt.
  3. Danach wird die Frage geschlossen.
  4. Spätere Antworten werden ignoriert.
  5. Beide Smartphones erhalten dieselbe Rückmeldung.



Schritt 7: 10 Fragen ergänzen

  1. Das Quiz erhält genau 10 Fragen.
  2. Nach jeder Frage wird die Fragenummer erhöht.
  3. Nach Frage 10 endet das Spiel.
  4. Endstand und Sieger:in werden angezeigt.



Schritt 8: Auswahlmenü ergänzen

  1. Fachauswahl anzeigen.
  2. Schwierigkeitsauswahl anzeigen.
  3. Quiztitel anzeigen.
  4. Ausgewähltes Quiz speichern.
  5. Spiel mit diesem Quiz starten.



Schritt 9: Neue Quizsets ergänzen

  1. Vorhandenes Quiz kopieren.
  2. Fach ändern.
  3. Schwierigkeitsgrad ändern.
  4. Titel ändern.
  5. 10 neue Fragen eintragen.
  6. Jeweils 4 Antworten eintragen.
  7. Richtige Antwort als 0, 1, 2 oder 3 eintragen.
  8. Quiz in die Quizliste aufnehmen.
  9. Spiel testen.



Schritt 10: Präsentation vorbereiten

  1. Erklären, was ein ESP32 ist.
  2. Erklären, warum der ESP32 ein eigenes WLAN erstellt.
  3. Zeigen, wie die Smartphones verbunden werden.
  4. Quiz live spielen.
  5. Code-Struktur kurz erklären.
  6. Eigene Erweiterungen vorstellen.
  7. Schwierigkeiten und Lösungen benennen.



Differenzierung im Unterricht

  1. Anfänger:innen ändern nur Fragen und Antworten.
  2. Fortgeschrittene ändern Farben, Titel und Layout.
  3. Stärkere Schüler:innen ergänzen neue Quizsets.
  4. Sehr starke Schüler:innen programmieren Auswahlmenüs.
  5. Expert:innen ergänzen Highscore, Admin-Seite oder QR-Code.
  6. Kreative Schüler:innen bauen Gehäuse, Logo oder Präsentationsmaterial.



Mögliche Erweiterungen

  1. QR-Code zur Spielseite.
  2. Buzzer am ESP32.
  3. LEDs für richtige und falsche Antwort.
  4. Highscore-Liste.
  5. Zufällige Reihenfolge der Fragen.
  6. Zufällige Reihenfolge der Antworten.
  7. Joker-Funktion.
  8. Teammodus.
  9. Admin-Seite für die Lehrkraft.
  10. Speicherung eigener Quizsets im Flash-Speicher.
  11. SD-Karten-Erweiterung für viele Quizdateien.



Nicht für die erste Version empfohlen

  1. Bluetooth-Login.
  2. USB-C-Login über Smartphone.
  3. App-Entwicklung.
  4. Datenbank auf externem Server.
  5. Internetpflicht.
  6. Benutzerkonten mit echten Namen.
  7. Komplexes Live-Streaming.
  8. Zu viele Spieler:innen gleichzeitig.
  9. Zu viele Animationen auf der Webseite.



Empfohlener Zeitplan für drei Projekttage

Projekttag Schwerpunkt Ergebnis
Tag 1 ESP32 einrichten, WLAN starten, Smartphone-Webseite öffnen Technische Grundverbindung funktioniert
Tag 2 Quizlogik, zwei Spieler:innen, Timer, Punkte Spielbare Grundversion funktioniert
Tag 3 Quizsets, Design, Tests, Präsentation Präsentierbares fertiges Quizspiel



Bewertungskriterien

  1. Das ESP32-WLAN funktioniert.
  2. Zwei Smartphones können sich verbinden.
  3. Die Webseite ist auf beiden Smartphones erreichbar.
  4. Beide Spieler:innen sehen dieselbe Frage.
  5. Jede Frage hat 4 Antwortmöglichkeiten.
  6. Der 10-Sekunden-Timer funktioniert.
  7. Die schnellste richtige Antwort bekommt den Punkt.
  8. Falsche oder verspätete Antworten geben keinen Punkt.
  9. Ein Spiel besteht aus genau 10 Fragen.
  10. Der Endstand wird korrekt angezeigt.
  11. Neue Quizsets können nachvollziehbar ergänzt werden.
  12. Die Gruppe kann ihr Projekt verständlich erklären.



Abschließende Empfehlung

  1. Die beste Variante ist eindeutig die WLAN-Lösung mit ESP32.
  2. Sie ist technisch realistisch.
  3. Sie ist kostengünstig.
  4. Sie braucht keine App.
  5. Sie funktioniert ohne Internet.
  6. Sie ist für Schüler:innen nachvollziehbar.
  7. Sie ist mit KI gut erweiterbar.
  8. Sie erlaubt Fachauswahl, Schwierigkeitsgrad und verschiedene Quizsets.
  9. Sie ermöglicht einen echten Schnelligkeitsmodus.
  10. Sie bleibt trotzdem einfach genug für ein schulisches Arduino-Projekt.
Abgerufen von „https://moocwiki.org/index.php?title=Arduino-Quiz_mit_ESP32_und_Smartphones&oldid=5896“