Überblick
Diese Fallstudie beschreibt die Entwicklung und Prüfung eines vollständig einbettbaren, interaktiven Mathematik-Übungsgenerators, der innerhalb eines Wix-HTML-iFrames ausgeführt werden kann. Ziel war es, ein browserbasiertes Lernwerkzeug zu entwickeln, mit dem Schülerinnen und Schüler Mathematikaufgaben generieren, Lösungswege üben, Antworten überprüfen, Hinweise anzeigen und vollständig ausgearbeitete Lösungen studieren können – ohne Backend-System, externe Skripte oder Tracking durch Drittanbieter.
Die endgültige Lösung wurde als eine einzige, eigenständige HTML-Datei entwickelt, die HTML, CSS und JavaScript enthält. Sie kann direkt in ein Wix-Element vom Typ „Code einbetten“ beziehungsweise in einen HTML-iFrame eingefügt und als interaktives Lern-Widget auf einer Wix-Website verwendet werden.
Projektziel
Das Hauptziel bestand darin, ein praktisches Mathematik-Lernwerkzeug zu entwickeln, das schnell und sicher in eine Wix-Website integriert werden kann. Das Tool sollte mehrere Prüfungsausschüsse, Bildungsstufen, Themen, Unterthemen und Schwierigkeitsgrade unterstützen und gleichzeitig für Schülerinnen und Schüler einfach zu bedienen sein.
Die Lösung wurde für Schülerinnen und Schüler, Lehrkräfte, Nachhilfelehrkräfte sowie Betreiber von Wix-Websites entwickelt, die ein interaktives Lernwerkzeug ohne komplizierte Einrichtung verwenden möchten.
Lösung
Der endgültige Code bietet direkt im Browser eine interaktive Umgebung zum Üben von Mathematik. Nutzerinnen und Nutzer können einen Prüfungsausschuss, eine Bildungsstufe, ein Thema, ein Unterthema und einen Schwierigkeitsgrad auswählen und anschließend eine zufällig zusammengestellte Mathematikaufgabe generieren.
Jede Aufgabe enthält eine klar formulierte Aufgabenstellung, Hinweise zu Formeln oder Lösungswegen, ein optionales Diagramm, einen Bereich für eigene Berechnungen und Notizen, eine Antwortüberprüfung, Hinweise sowie eine vollständig ausgearbeitete Musterlösung.
Die Anwendung enthält außerdem ein Fortschrittsfeld, das die Anzahl der Versuche, die richtigen Antworten, die Genauigkeit, die aktuelle Erfolgsserie, die Anzahl der generierten Aufgaben, das aktuelle Thema, den aktuellen Schwierigkeitsgrad, die Aufgaben-ID und die Varianten-ID anzeigt.
Da die Lösung vollständig eigenständig ist, benötigt sie weder eine Datenbank noch einen Server, ein Anmeldesystem, eine externe JavaScript-Bibliothek oder eine Einrichtung mit Wix Velo. Dadurch eignet sie sich für eine unkomplizierte Einbettung in Wix und eine schnelle Veröffentlichung.
Hauptfunktionen
Der Mathematik-Übungsgenerator umfasst eine interaktive Aufgabengenerierung, Filter für Prüfungsausschüsse und Themen, zufällig generierte Aufgaben- und Varianten-IDs, eine Antwortüberprüfung, Hinweise, ausgearbeitete Lösungen, Diagramme, einen Bereich für Schülernotizen, ein responsives Design sowie eine browserbasierte Fortschrittsverfolgung.
Das Tool unterstützt verschiedene Antworttypen, darunter Zahlenwerte, Geldbeträge, Prozentwerte, Wahrscheinlichkeiten, Algebra, Koordinaten und Antworten mit mehreren Zahlen.
Es erkennt außerdem gebräuchliche Einheiten wie cm, cm², cm³, km/h, m/s, kg, N, Nm, Grad und Währungen.
Während der Überprüfung vorgenommene Verbesserungen
Während der Tests wurden mehrere Verbesserungsmöglichkeiten identifiziert und umgesetzt, um den Code besser für die Einbettung in Wix und für die tatsächliche Nutzung durch Schülerinnen und Schüler geeignet zu machen.
Verbesserungsbereich | Festgestelltes Problem | Umgesetzte Lösung |
Antwortüberprüfung | Einige natürlich formulierte Antworten mit Einheiten wurden abgelehnt. | Die Antwortanalyse wurde erweitert, damit Einheiten wie km/h, m/s, cm³, Nm, kg, Grad und Währungen akzeptiert werden. |
Antwortpräfixe | Einige gültige Antworten mit Präfixen wurden abgelehnt, beispielsweise „k = 24“ oder „Beispiel: 2“. | Unterstützung für gebräuchliche Präfixe wie „Antwort =“, „k =“ und „Beispiel:“ wurde hinzugefügt. |
Mobile Eingabe | Das Antwortfeld verwendete auch bei algebraischen Antworten oder Texteingaben eine Dezimaltastatur. | Ein dynamischer Eingabemodus wurde hinzugefügt. Zahlenwerte verwenden eine Dezimaltastatur, während für Algebra- und Textantworten eine normale Texttastatur verwendet wird. |
Fortschrittsverfolgung | Der Fortschritt wurde nach dem Aktualisieren des iFrames oder der Seite zurückgesetzt. | Der lokale Browserspeicher wurde hinzugefügt, um Versuche, richtige Antworten, Erfolgsserien und die Anzahl der generierten Aufgaben zu speichern. |
Öffentliche Formulierung | Die Formulierung „1.000 Ausgangsaufgaben“ konnte missverständlich sein. | Die Formulierung wurde in „1.000 Aufgaben-IDs“ geändert, um eine klarere und genauere Darstellung zu gewährleisten. |
Ergebnisse der Codeprüfung
Vor der Verwendung des Codes in Wix wurden zwei Haupttests durchgeführt, um seine Zuverlässigkeit zu überprüfen.
Test 1: Syntax-, Seitenlade- und grundlegender Nutzerablauftest
Bei diesem Test wurde geprüft, ob die HTML-Datei korrekt geladen wird und ob der wichtigste Nutzerablauf wie erwartet funktioniert.
Testbereich | Was wurde geprüft? | Ergebnis |
JavaScript-Syntax | Es wurde geprüft, ob das Skript keine Syntaxfehler enthält, die seine Ausführung verhindern. | Bestanden |
Seitenaufbau | Die HTML-Datei wurde als eigenständige Anwendung geöffnet. | Bestanden |
DOM-Elemente | Es wurde geprüft, ob erforderliche Element-IDs fehlen. | Bestanden |
Aufgabengenerierung | Über die Benutzeroberfläche wurde eine Mathematikaufgabe generiert. | Bestanden |
Aufgabenbereich | Es wurde bestätigt, dass sich der Aufgabenbereich korrekt öffnet. | Bestanden |
Antwortüberprüfung | Eine Antwort wurde eingegeben und die Funktion zur Antwortüberprüfung ausgeführt. | Bestanden |
Konsolen- und Laufzeitfehler | Es wurde auf sichtbare JavaScript-Laufzeitfehler geprüft. | 0 Fehler gefunden |
Test 2: Vollständiger Kombinationstest des Generators
Bei diesem Test wurde der Aufgabengenerator für alle verfügbaren Kombinationen aus Bildungsstufe, Thema, Unterthema und Schwierigkeitsgrad geprüft.
Dieser Test war wichtig, da einige Fehler nur bei bestimmten Themenkombinationen auftreten können.
Testbereich | Ergebnis |
Insgesamt getestete Kombinationen | 380 |
Erfolgreich getestete Kombinationen | 380 |
Fehlgeschlagene Kombinationen | 0 |
Gesamtergebnis | Bestanden |
Eignung für die Einbettung in Wix
Der endgültige Code ist für Wix geeignet, da er als ein vollständiges HTML-Dokument bereitgestellt wird. Er kann über das Wix-Element „Code einbetten“ in einen HTML-iFrame eingefügt werden.
Die Anwendung ist innerhalb ihres eigenen Layouts responsiv. Die Höhe des Wix-iFrames sollte jedoch ausreichend groß eingestellt werden, damit Inhalte nicht abgeschnitten werden.
Wix-Einstellung | Empfehlung |
Einbettungstyp | Code einbetten / HTML-iFrame |
Breite | 100 % |
Höhe auf Desktop-Geräten | 900–1100 px |
Höhe auf Mobilgeräten | 1200–1500 px |
Scrollen | Aktivieren, wenn der Inhalt höher als der iFrame ist |
Backend erforderlich | Nein |
Wix Velo erforderlich | Nein |
Externe Skripte erforderlich | Nein |
Ergebnis
Das Endergebnis ist ein vollständiges, interaktives Mathematik-Übungswerkzeug, das in eine Wix-Website eingebettet und sofort verwendet werden kann.
Es bietet Schülerinnen und Schülern eine reibungslose Nutzererfahrung, unterstützt ein breites Spektrum an mathematischen Themen und führt sämtliche Funktionen direkt im Browser aus.
Ergebnisbereich | Resultat |
Eigenständige HTML-Anwendung | Funktionsfähig |
Eignung für Wix-iFrames | Geeignet |
Aufgabengenerierung | Funktioniert bei allen getesteten Kombinationen |
Antwortüberprüfung | Verbessert und funktionsfähig |
Mobile Benutzerfreundlichkeit | Verbessert |
Fortschrittsverfolgung | Über den lokalen Browserspeicher hinzugefügt |
Backend-Abhängigkeit | Keine |
Abschließendes technisches Ergebnis | Tests bestanden |
Code nach der Korrektur – DEMO
Fazit
Dieses Projekt zeigt, wie eine einzige, eigenständige HTML-Datei genutzt werden kann, um eine leistungsfähige und interaktive Lernerfahrung innerhalb von Wix zu erstellen.
Der Mathematik-Übungsgenerator kombiniert Aufgabengenerierung, Antwortüberprüfung, Hinweise, ausgearbeitete Lösungen, Diagramme, Fortschrittsverfolgung und responsives Design in einer einzigen einbettbaren Lösung.
Da das Tool leichtgewichtig, browserbasiert und unabhängig von externen Diensten ist, lässt sich der endgültige Code einfach veröffentlichen, unkompliziert warten und auf Bildungswebsites einsetzen, die mit Wix erstellt wurden.
Das Antwortfeld verwendete auch bei algebraischen Antworten oder Texteingaben eine Dezimaltastatur.
Es wurde ein dynamischer Eingabemodus hinzugefügt. Zahlenwerte verwenden eine Dezimaltastatur, während für Algebra- und Textantworten eine normale Texttastatur verwendet wird.
Fortschrittsverfolgung
Der Fortschritt wurde nach dem Aktualisieren des iFrames oder der Seite zurückgesetzt.
Der lokale Browserspeicher wurde hinzugefügt, um Versuche, richtige Antworten, Erfolgsserien und die Anzahl der generierten Aufgaben zu speichern.
Öffentliche Formulierung
Die Formulierung „1.000 Ausgangsaufgaben“ konnte missverständlich sein.
Die Formulierung wurde in „1.000 Aufgaben-IDs“ geändert, um eine klarere und genauere Darstellung zu gewährleisten.
Ergebnisse der Codeprüfung
Vor der Verwendung des Codes in Wix wurden zwei Haupttests durchgeführt, um seine Zuverlässigkeit zu überprüfen.
Test 1: Syntax-, Seitenlade- und grundlegender Nutzerablauftest
Bei diesem Test wurde geprüft, ob die HTML-Datei korrekt geladen wird und ob der wichtigste Nutzerablauf wie erwartet funktioniert.
Testbereich | Was wurde geprüft? | Ergebnis |
JavaScript-Syntax | Es wurde geprüft, ob das Skript keine Syntaxfehler enthält, die seine Ausführung verhindern. | Bestanden |
Seitenaufbau | Die HTML-Datei wurde als eigenständige Anwendung geöffnet. | Bestanden |
DOM-Elemente | Es wurde geprüft, ob erforderliche Element-IDs fehlen. | Bestanden |
Aufgabengenerierung | Über die Benutzeroberfläche wurde eine Mathematikaufgabe generiert. | Bestanden |
Aufgabenbereich | Es wurde bestätigt, dass sich der Aufgabenbereich korrekt öffnet. | Bestanden |
Antwortüberprüfung | Eine Antwort wurde eingegeben und die Funktion zur Antwortüberprüfung ausgeführt. | Bestanden |
Konsolen- und Laufzeitfehler | Es wurde auf sichtbare JavaScript-Laufzeitfehler geprüft. | 0 Fehler gefunden |
Test 2: Vollständiger Kombinationstest des Generators
Bei diesem Test wurde der Aufgabengenerator für alle verfügbaren Kombinationen aus Bildungsstufe, Thema, Unterthema und Schwierigkeitsgrad geprüft.
Dieser Test war wichtig, da einige Fehler nur bei bestimmten Themenkombinationen auftreten können.
Testbereich | Ergebnis |
Insgesamt getestete Kombinationen | 380 |
Erfolgreich getestete Kombinationen | 380 |
Fehlgeschlagene Kombinationen | 0 |
Gesamtergebnis | Bestanden |
Eignung für die Einbettung in Wix
Der endgültige Code ist für Wix geeignet, da er als ein vollständiges HTML-Dokument bereitgestellt wird. Er kann über das Wix-Element „Code einbetten“ in einen HTML-iFrame eingefügt werden.
Die Anwendung ist innerhalb ihres eigenen Layouts responsiv. Die Höhe des Wix-iFrames sollte jedoch ausreichend groß eingestellt werden, damit Inhalte nicht abgeschnitten werden.
Wix-Einstellung | Empfehlung |
Einbettungstyp | Code einbetten / HTML-iFrame |
Breite | 100 % |
Höhe auf Desktop-Geräten | 900–1100 px |
Höhe auf Mobilgeräten | 1200–1500 px |
Scrollen | Aktivieren, wenn der Inhalt höher als der iFrame ist |
Backend erforderlich | Nein |
Wix Velo erforderlich | Nein |
Externe Skripte erforderlich | Nein |
Ergebnis
Das Endergebnis ist ein vollständiges, interaktives Mathematik-Übungswerkzeug, das in eine Wix-Website eingebettet und sofort verwendet werden kann.
Es bietet Schülerinnen und Schülern eine reibungslose Nutzererfahrung, unterstützt ein breites Spektrum an mathematischen Themen und führt sämtliche Funktionen direkt im Browser aus.
Ergebnisbereich | Resultat |
Eigenständige HTML-Anwendung | Funktionsfähig |
Eignung für Wix-iFrames | Geeignet |
Aufgabengenerierung | Funktioniert bei allen getesteten Kombinationen |
Antwortüberprüfung | Verbessert und funktionsfähig |
Mobile Benutzerfreundlichkeit | Verbessert |
Fortschrittsverfolgung | Über den lokalen Browserspeicher hinzugefügt |
Backend-Abhängigkeit | Keine |
Abschließendes technisches Ergebnis | Tests bestanden |
Code nach der Korrektur – DEMO
Was wurde in dieser Wix-Fallstudie entwickelt?
Diese Fallstudie behandelt die Entwicklung eines interaktiven Mathematik-Übungsgenerators speziell für Wix-Websites. Das Tool wurde als vollständige, eigenständige HTML-Datei mit HTML, CSS und JavaScript erstellt. Es kann in ein Wix-Element für Einbettungscode beziehungsweise ein HTML-iFrame eingefügt und direkt auf der Website verwendet werden – ohne Backend, Datenbank, Wix-Velo-Einrichtung oder externe Skripte.
Lernende wählen Prüfungsausschuss, Niveau, Thema, Unterthema und Schwierigkeitsgrad. Anschließend erzeugen sie zufällige Mathematikaufgaben, geben Antworten ein, notieren Rechenwege, erhalten Hinweise und öffnen ausgearbeitete Lösungen. Die Anwendung erfasst zudem Versuche, richtige Antworten, Genauigkeit, Erfolgsserie und Anzahl der erzeugten Aufgaben.
Wie wurde der Code vor der Verwendung in Wix getestet?
Der Code wurde in zwei zentralen Prüfungen getestet. Der erste Test konzentrierte sich auf den technischen Grundablauf: JavaScript-Syntax, Laden als eigenständige HTML-Datei, Verfügbarkeit aller benötigten DOM-Elemente, Erzeugen einer Aufgabe, Öffnen des Aufgabenbereichs, Eingabe einer Antwort und Verwendung der Antwortprüfung. Dabei traten weder Laufzeit- noch Konsolenfehler auf.
Der zweite Test prüfte das vollständige System zur Aufgabenerzeugung über sämtliche verfügbaren Kombinationen aus Niveau, Thema, Unterthema und Schwierigkeitsgrad. Insgesamt wurden 380 Kombinationen getestet; alle 380 wurden ohne einen einzigen Fehler bestanden. Damit wurde die zuverlässige Funktionsweise in allen verfügbaren Übungskategorien bestätigt.
Warum ist diese Lösung für Wix-Websites sinnvoll?
Diese Lösung eignet sich für Wix-Websites, weil sie ohne komplexe Einrichtung ein interaktives Lernwerkzeug bereitstellt. Website-Betreiber können die Anwendung über ein Wix-HTML-iFrame einbinden, den vollständigen Code einfügen und sie als Teil einer Bildungs-, Nachhilfe- oder Schulwebsite veröffentlichen.
Die gesamte Anwendung läuft im Browser und benötigt weder Server noch Datenbank, Anmeldesystem oder externe Software. Lernende üben Mathematik direkt auf der Seite, prüfen Antworten, erhalten Hinweise und lernen anhand ausgearbeiteter Lösungen. Der finale Code wurde zudem hinsichtlich mobiler Bedienbarkeit, Antwortvalidierung und Fortschrittsspeicherung optimiert und ist damit für reale Nutzer auf Desktop- und Mobilgeräten geeignet.