Das kannst du danach
Du baust ein kleines Jump-and-Run, korrigierst unerreichbare Plattformen und machst die Steuerung auf dem Handy bedienbar.
Das übernimmt die KI
Claude erzeugt HTML, CSS und JavaScript aus deinen Spielregeln. Ob ein Sprung erreichbar ist und sich gut anfühlt, prüfst du in der laufenden Fassung.
Dein Werkzeug: Claude
Ein Claude-Zugang mit Vorschau beziehungsweise Artifacts und ein Browser. Speichere funktionierende Fassungen, bevor du größere Änderungen ausprobierst.
Werkzeug öffnen Offizielle Hilfe
Funktionen, Kontingente und Preise können sich ändern. Prüfe den Zugang direkt beim Anbieter.
Die Aufträge führst du im genannten Werkzeug aus. Die Klickübungen hier zeigen vorbereitete Beispiele und senden keine Daten an einen KI-Dienst.
KI-Funken
Dein erstes Ergebnis mit dem Werkzeug
Erzeuge einen spielbaren Prototyp
Ein Level mit wenigen Plattformen reicht. Das Ziel ist, dass du dich bewegen, springen, scheitern und neu starten kannst.
- Öffne Claude und sende den Spielauftrag.
- Öffne das erzeugte Artifact in der Vorschau. Falls nötig, bitte ausdrücklich um eine spielbare HTML-Vorschau.
- Spiele das Level und lade die HTML-Datei als Sicherung herunter.
Erstelle ein spielbares Jump-and-Run als einzelne HTML-Datei mit eingebettetem CSS und JavaScript. Eine Figur, fünf erreichbare Plattformen, Ziel rechts. Pfeiltasten bewegen, Leertaste springt. Bei Absturz Neustart am Anfang, bei Ziel klare Erfolgsmeldung. Ein Neustartknopf. Keine externen Bilder oder Bibliotheken. Zeige es als spielbares Artifact.// Kurz prüfen
Was soll nach dem ersten Prompt vorliegen?
Wähle eine Antwort.
Nicht ganz. Schau dir die andere Antwort noch einmal an. Das KI-Ergebnis ist ausführbarer Code.
Richtig. Das KI-Ergebnis ist ausführbarer Code.
KI-Werkstatt
Gezielt verbessern und weiterarbeiten
Verbessere das Sprunggefühl
Ein konkreter Test ist hilfreicher als „mach es besser“. Beschreibe, von welcher Plattform du wohin springen möchtest.
- Notiere eine unerreichbare Stelle oder einen zu harten Absprung.
- Lass genau dieses Problem korrigieren und die maximal erreichbare Sprungweite berücksichtigen.
- Spiele das ganze Level erneut, einschließlich Neustart und Ziel.
Die dritte Plattform ist vom Ende der zweiten aus nicht erreichbar. Prüfe Sprunggeschwindigkeit, Schwerkraft und horizontalen Abstand. Passe diese Stelle mit Sicherheitsabstand an. Ergänze eine kurze Toleranz nach Verlassen einer Kante. Behalte Gestaltung und übrige Regeln.// Vorher / Nachher
Was verändert die gezielte Korrektur?
Die Figur erreicht die nächste Plattform selbst beim spätesten Absprung nicht.
Vorbereiteter Vergleich, keine Live-Ausgabe des Werkzeugs.
KI-Regie
Den Ablauf erweitern und selbst nutzen
Mache das Spiel auf dem Handy bedienbar
Ein kleiner Bildschirm braucht echte Touch-Bedienung. Verkleinerte Tastaturhinweise helfen dort nicht.
- Lass große Links-, Rechts- und Sprungtasten ergänzen.
- Teste gleichzeitiges Laufen und Springen auf einem echten Touch-Gerät.
- Prüfe Hoch- und Querformat und sichere die spielbare Fassung vor dem Teilen.
Ergänze Touch-Steuerung mit großen Tasten für links, rechts und springen. Laufen und Springen müssen gleichzeitig möglich sein. Verhindere ungewolltes Seitenscrollen nur im Spielbereich. Das Spielfeld passt sich kleinen Displays an, ohne den Level unspielbar zu machen.// Kurz prüfen
Wie beschreibst du eine unfaire Stelle?
Wähle eine Antwort.
Richtig. Ein reproduzierbarer Fall lässt sich gezielt korrigieren.
Nicht ganz. Schau dir die andere Antwort noch einmal an. Ein reproduzierbarer Fall lässt sich gezielt korrigieren.
Was ist hängen geblieben?
// Kurz prüfen
Welcher Test ist für Touch besonders wichtig?
Wähle eine Antwort.
Richtig. Das Spiel braucht mehrere Eingaben gleichzeitig.
Nicht ganz. Schau dir die andere Antwort noch einmal an. Das Spiel braucht mehrere Eingaben gleichzeitig.
Dein eigener Versuch
Wende den Ablauf jetzt auf eine kleine eigene Aufgabe an. Prüfe das tatsächliche Ergebnis im Werkzeug anhand der Kriterien dieser Anleitung. Die vier Klickübungen bestätigen deinen Lernstand auf dieser Seite, nicht die erfolgreiche Ausführung im externen Dienst.
Weitere Übungen zum Thema programmieren