🚀 Willkommen bei CodeFuchs!
CodeFuchs ist eine einfache Programmiersprache in deutscher Sprache, mit der du spielerisch programmieren lernen kannst.
Was kannst du damit machen?
- 📝 Text ausgeben und Benutzereingaben verarbeiten
- 🔢 Mit Zahlen und Variablen rechnen
- 🔀 Entscheidungen treffen mit Bedingungen
- 🔁 Dinge wiederholen mit Schleifen
- 📦 Eigene Funktionen schreiben
- 🐢 Bunte Bilder und Muster zeichnen
Die Oberfläche
- Code-Editor (links): Hier schreibst du deinen Code
- Ausgabe (oben rechts): Hier siehst du die Text-Ausgaben
- Grafik (unten rechts): Hier erscheinen deine Zeichnungen
- Hilfe (rechts): Zeigt Variablen und Befehle
💡 Tipp: Klicke auf "📚 Beispiele laden" um fertige Programme auszuprobieren!
Dein erstes Programm
Probiere diesen Code aus:
sag "Hallo Welt!"
sag "Ich lerne programmieren!"
Klicke dann auf den grünen "▶️ Ausführen" Button!
📝 Grundlagen
Ausgabe mit "sag"
Mit sag gibst du Text aus:
sag "Hallo!"
sag "Wie geht es dir?"
Eingabe mit "frage"
Mit frage kannst du den Benutzer nach Informationen fragen:
frage "Wie heißt du?" als name
sag "Hallo " + name + "!"
Das als name speichert die Antwort in einer Variable namens "name".
Kommentare
Kommentare beginnen mit # und werden nicht ausgeführt:
# Das ist ein Kommentar
sag "Das wird ausgeführt"
Rechnen
Du kannst mit Zahlen rechnen:
sag 5 + 3
sag 10 - 4
sag 6 * 7
sag 20 / 4
Operatoren: + (Plus), - (Minus), * (Mal), / (Geteilt)
Text verbinden
Mit + kannst du Texte zusammenfügen:
vorname ist "Max"
nachname ist "Mustermann"
sag vorname + " " + nachname
🔢 Variablen
Variablen sind wie Boxen, in denen du Werte speichern kannst.
Variable erstellen
Mit ist weist du einer Variable einen Wert zu:
alter ist 12
name ist "Anna"
groß ist wahr
Variable verwenden
punkte ist 0
punkte ist punkte + 10
sag "Du hast " + punkte + " Punkte"
Datentypen
- Zahlen: 42, 3.14, -5
- Text: "Hallo" (in Anführungszeichen)
- Wahrheitswerte: wahr oder falsch
💡 Tipp: Variablennamen sollten aussagekräftig sein: alter statt x
Beispiel
frage "Wie alt bist du?" als alter
frage "Wie heißt du?" als name
sag name + " ist " + alter + " Jahre alt"
nächstesJahr ist alter + 1
sag "Nächstes Jahr bist du " + nächstesJahr
📋 Listen (Arrays)
Listen speichern mehrere Werte in einer einzigen Variable. Perfekt für Sammlungen!
Liste erstellen
# Leere Liste
meineListe ist []
# Liste mit Werten
zahlen ist [1, 2, 3, 4, 5]
namen ist ["Anna", "Max", "Lisa"]
sag zahlen # Ausgabe: [1, 2, 3, 4, 5]
Auf Elemente zugreifen
Der Index startet bei 0 (nicht bei 1)!
farben ist ["rot", "grün", "blau"]
sag farben[0] # Ausgabe: rot
sag farben[1] # Ausgabe: grün
sag farben[2] # Ausgabe: blau
Elemente ändern
farben ist ["rot", "grün", "blau"]
farben[1] ist "gelb"
sag farben # Ausgabe: [rot, gelb, blau]
Listen-Funktionen
| Funktion | Beschreibung |
|---|
länge(liste) | Anzahl der Elemente |
anhängen(liste, wert) | Wert am Ende hinzufügen |
entfernen(liste) | Letztes Element entfernen |
entfernen(liste, index) | Element an Position entfernen |
enthält(liste, wert) | Prüft ob Wert enthalten ist |
finde(liste, wert) | Position des Wertes (-1 wenn nicht gefunden) |
Beispiel: Durch Liste iterieren
zahlen ist [10, 20, 30]
summe ist 0
i ist 0
solange i < länge(zahlen) dann
summe ist summe + zahlen[i]
i ist i + 1
ende
sag "Summe: " + summe # Ausgabe: 60
🔀 Bedingungen
Mit Bedingungen kannst du deinem Programm beibringen, Entscheidungen zu treffen.
Wenn-Dann-Sonst
alter ist 15
wenn alter >= 18 dann
sag "Du bist volljährig"
sonst
sag "Du bist minderjährig"
ende
Vergleichsoperatoren
| Operator | Bedeutung | Beispiel |
|---|
| = | Gleich | x = 5 |
| != | Ungleich | x != 0 |
| > | Größer als | x > 10 |
| < | Kleiner als | x < 20 |
| >= | Größer oder gleich | x >= 18 |
| <= | Kleiner oder gleich | x <= 100 |
Verschachtelte Bedingungen
punkte ist 85
wenn punkte >= 90 dann
sag "Note: Sehr gut!"
sonst
wenn punkte >= 75 dann
sag "Note: Gut"
sonst
sag "Note: Befriedigend"
ende
endeLogische Verknüpfungen
Mit und / oder kannst du mehrere Bedingungen kombinieren:
alter ist 15
wenn alter > 10 und alter < 18 dann
sag "Du bist ein Teenager"
ende
⚠️ Wichtig: Vergiss nicht das ende am Schluss!
🔁 Schleifen
Schleifen wiederholen Code automatisch mehrmals.
Wiederhole X mal
Führt Code eine bestimmte Anzahl aus:
wiederhole 5 mal
sag "Hallo!"
ende
Mit Zähler
zähler ist 1
wiederhole 10 mal
sag "Runde " + zähler
zähler ist zähler + 1
ende
Solange-Schleife
Wiederholt Code, solange eine Bedingung wahr ist:
zahl ist 1
solange zahl <= 10 dann
sag zahl
zahl ist zahl + 1
ende
Beispiel: Einmaleins
frage "Welche Reihe? (1-10)" als reihe
ergebnis ist 0
wiederhole 10 mal
ergebnis ist ergebnis + reihe
sag reihe + " x " + ergebnis / reihe + " = " + ergebnis
ende
⚠️ Vorsicht: Bei solange-Schleifen darauf achten, dass die Bedingung irgendwann falsch wird, sonst läuft die Schleife endlos!
📦 Funktionen
Funktionen sind wiederverwendbare Code-Blöcke mit einem Namen.
Funktion definieren
funktion grüße()
sag "Hallo!"
sag "Schön dich zu sehen!"
ende
grüße()
Mit Parametern
Parameter sind Werte, die du der Funktion übergibst:
funktion grüße(name)
sag "Hallo " + name + "!"
ende
grüße("Anna")
grüße("Max")Mehrere Parameter
funktion addiere(a, b)
summe ist a + b
sag a + " + " + b + " = " + summe
ende
addiere(5, 3)
addiere(10, 7)
Rückgabewerte
Mit zurück gibt eine Funktion einen Wert zurück:
funktion multipliziere(x, y)
zurück x * y
ende
ergebnis ist multipliziere(6, 7)
sag "6 x 7 = " + ergebnis
Praktisches Beispiel
funktion istGerade(zahl)
rest ist zahl - (zahl / 2 * 2)
wenn rest = 0 dann
zurück wahr
sonst
zurück falsch
ende
ende
wenn istGerade(8) dann
sag "8 ist gerade"
ende💡 Tipp: Funktionen helfen dir, deinen Code zu organisieren und nicht immer wieder das Gleiche zu schreiben!
🐢 Turtle-Grafik
Mit der Turtle (Schildkröte) kannst du Bilder und Muster zeichnen!
Grundbefehle
| Befehl | Was passiert |
|---|
| vorwärts(100) | Bewegt die Turtle 100 Pixel vorwärts |
| rückwärts(50) | Bewegt die Turtle 50 Pixel rückwärts |
| links(90) | Dreht die Turtle 90° nach links |
| rechts(90) | Dreht die Turtle 90° nach rechts |
Quadrat zeichnen
wiederhole 4 mal
vorwärts(100)
rechts(90)
ende
Farben
Du kannst Farben als deutsche Farbwörter oder als Hex-Codes angeben:
farbe("rot") # Einfach!
vorwärts(100)
farbe("grün") # Oder...
farbe("#00FF00") # ...als Hex-Code
rechts(90)
vorwärts(100)Verfügbare Farbwörter:
rot orange gelb grün blau lila pink braun schwarz weiß grau himmelblau türkis gold violett rosa
Weitere: hellgrün, dunkelgrün, hellblau, dunkelblau, hellgrau, dunkelgrau, hellrot, dunkelrot, cyan, magenta, marine, beige, silber
Stift heben/senken
vorwärts(50)
stiftHoch() # Nicht mehr zeichnen
vorwärts(50) # Bewegt sich, zeichnet aber nicht
stiftRunter() # Wieder zeichnen
vorwärts(50)
Formen
# Kreis
kreis(50)
# Quadrat
quadrat(100)
Langsames/Animiertes Zeichnen
Mit langsam() siehst du der Turtle beim Zeichnen zu:
# Animation aktivieren (Geschwindigkeit: 5 Pixel/Frame)
langsam(5)
wiederhole 4 mal
vorwärts(100)
rechts(90)
ende
Der Parameter bei langsam() bestimmt die Geschwindigkeit: kleinere Werte = langsamer, größere = schneller.
Beispiel: Buntes Muster
wiederhole 8 mal
farbe("#FF0000")
vorwärts(100)
rechts(45)
farbe("#0000FF")
kreis(30)
ende💡 Tipp: Experimentiere mit verschiedenen Winkeln und Wiederholungen, um coole Muster zu erstellen!
📚 Befehls-Referenz
Ein- und Ausgabe
| Befehl | Beschreibung | Beispiel |
|---|
| sag | Text ausgeben | sag "Hallo" |
| frage ... als | Benutzereingabe | frage "Name?" als n |
Variablen
| Befehl | Beschreibung | Beispiel |
|---|
| ... ist ... | Variable zuweisen | x ist 42 |
Kontrollstrukturen
| Befehl | Beschreibung |
|---|
| wenn ... dann ... ende | Bedingung |
| wenn ... dann ... sonst ... ende | Bedingung mit Alternative |
| wiederhole X mal ... ende | Zählschleife |
| solange bedingung dann ... ende | Bedingungs-Schleife (dann optional) |
Funktionen
| Befehl | Beschreibung |
|---|
| funktion name() ... ende | Funktion definieren |
| funktion name(a, b) ... ende | Funktion mit Parametern |
| zurück wert | Wert zurückgeben |
| name() | Funktion aufrufen |
Turtle-Befehle
| Befehl | Beschreibung |
|---|
| vorwärts(pixel) | Vorwärts bewegen |
| rückwärts(pixel) | Rückwärts bewegen |
| links(grad) | Nach links drehen |
| rechts(grad) | Nach rechts drehen |
| farbe("rot") | Farbe setzen (Farbwort oder Hex) |
| kreis(radius) | Kreis zeichnen |
| quadrat(größe) | Quadrat zeichnen |
| stiftHoch() | Stift anheben (nicht zeichnen) |
| stiftRunter() | Stift absetzen (zeichnen) |
| langsam(speed) | Animiert zeichnen (speed = Pixel/Frame) |
Mathe-Funktionen
| Funktion | Beschreibung | Beispiel |
|---|
| zufallsZahl(max) | Zufallszahl von 0 bis max-1 | zufallsZahl(10) → 0-9 |
| wurzel(zahl) | Quadratwurzel | wurzel(16) → 4 |
| abs(zahl) | Absolutwert | abs(-5) → 5 |
Operatoren
Arithmetik: + - * /
Vergleich: = != < > <= >=
Logik: und oder
🎮 Willkommen bei GameFuchs!
Mit GameFuchs kannst du eigene Spiele programmieren — direkt in deinem Browser!
Was du schon kannst
Du kennst bereits Variablen, Bedingungen und Schleifen aus CodeFuchs. GameFuchs baut genau darauf auf und gibt dir neue Befehle, mit denen du Figuren bewegen, Spielfelder erstellen und echte Spiele bauen kannst.
Dein erstes Spielfeld
Probiere diesen Code aus:
spielfeld(400, 300)
hintergrund("himmelblau")
figur ist neueFigur("fuchs")
setzeFigur(figur, 200, 150)Klicke auf Start und du siehst den Fuchs auf einem himmelblauen Spielfeld!
💡 Tipp: Alle CodeFuchs-Befehle (sag, wenn, wiederhole etc.) funktionieren auch im Game-Modus!
🖼️ Spielfeld & Figuren
Spielfeld erstellen
spielfeld(800, 600) # Breite, Höhe in Pixel
hintergrund("#87CEEB") # Hintergrundfarbe (Hex)Figuren erstellen & platzieren
figur ist neueFigur("fuchs")
setzeFigur(figur, 100, 200) # x, y Position
bewegeFigur(figur, 5, 0) # dx, dy (Richtung)
figurGröße(figur, 2) # Vergrößern (Faktor)Verfügbare Sprites
| Name | Beschreibung |
|---|
| "fuchs" | Fuchs-Figur |
| "robert" | Robert-Figur |
💡 Eigene Sprites: Mit dem 🎨 Sprite-Editor kannst du eigene Pixel-Art Figuren erstellen! Siehe Abschnitt "Sprite-Editor".
Befehls-Übersicht
| Befehl | Beschreibung |
|---|
| spielfeld(b, h) | Spielfeld erstellen |
| hintergrund(farbe) | Hintergrundfarbe setzen |
| neueFigur(name) | Neue Figur erstellen |
| setzeFigur(f, x, y) | Figur positionieren |
| bewegeFigur(f, dx, dy) | Figur bewegen |
| figurGröße(f, faktor) | Figur skalieren |
Figur-Eigenschaften
Jede Figur hat Eigenschaften, die du mit einem Punkt abrufen kannst:
held ist neueFigur("fuchs")
setzeFigur(held, 100, 200)
sag held.x # → 100
sag held.y # → 200| Eigenschaft | Beschreibung |
|---|
| .x | X-Position (horizontal) |
| .y | Y-Position (vertikal) |
| .breite | Breite der Figur |
| .höhe | Höhe der Figur |
| .sichtbar | Ob die Figur sichtbar ist |
🎨 Sprite-Editor
Mit dem Sprite-Editor kannst du eigene Pixel-Art Figuren erstellen und direkt in deinem Spiel verwenden!
Editor öffnen
Klicke auf den 🎨 Sprites Button in der Menüleiste. Die Ansicht wechselt zum Sprite-Editor.
Werkzeuge
| Werkzeug | Taste | Beschreibung |
|---|
| ⬚ Markieren | M | Bereich markieren und verschieben |
| ✏️ Stift | P | Pixel mit der aktuellen Farbe zeichnen |
| 🧽 Radierer | E | Pixel löschen (transparent machen) |
| 🪣 Fülleimer | F | Zusammenhängende Fläche füllen |
| 🔍 Pipette | I / Alt+Klick | Farbe eines Pixels aufnehmen |
| ╱ Linie | L | Gerade Linie ziehen (Klicken + Ziehen) |
| ▢ Rechteck | R | Rechteck-Umriss zeichnen (Klicken + Ziehen) |
| ◯ Kreis | C | Kreis-Umriss zeichnen (Klicken + Ziehen) |
| ▪ Gefülltes Rechteck | — | Ausgefülltes Rechteck zeichnen |
| ● Gefüllter Kreis | — | Ausgefüllten Kreis zeichnen |
💡 Markieren-Tool: Ziehe einen Bereich auf, dann klicke und ziehe innerhalb der Markierung um sie zu verschieben. Drücke Esc oder wechsle das Werkzeug um die Markierung zu bestätigen.
💡 Farbpipette: Drücke I um zur Pipette zu wechseln — nach dem Pick kehrt das vorherige Werkzeug automatisch zurück. Alternativ Alt+Klick direkt auf dem Canvas ohne Tool-Wechsel. Rechtsklick setzt die Sekundärfarbe.
Farben & Palette
| Aktion | Steuerung |
|---|
| Primärfarbe wählen | Linksklick auf Palette — schwarzer Rahmen |
| Sekundärfarbe wählen | Rechtsklick auf Palette — weißer Rahmen |
| Mit Sekundärfarbe zeichnen | Rechtsklick auf Canvas (außer Radierer) |
| Palette wechseln | Dropdown über der Palette — Klassisch, Pastel, Neon, NES, PICO-8, DB16, Solarized, Monokai, Gameboy, C64 |
| Eigene Farbe auswählen | Linksklick auf einen der 4 Slots im ✦ eigen-Bereich rechts |
| Eigene Farbe ändern | Doppelklick auf einen dieser Slots — öffnet den Farbwähler |
Das Farbfeld oben links zeigt beide Farben: Primär (vorne) und Sekundär (hinten). Die eigenen Farben bleiben beim Palette-Wechsel erhalten und werden gespeichert.
Canvas-Aktionen
| Aktion | Steuerung |
|---|
| Horizontal spiegeln | ↔ Button in der Werkzeugleiste |
Navigation
| Aktion | Steuerung |
|---|
| Zoomen | Mausrad oder +/− Buttons |
| Verschieben | Leertaste + Ziehen oder Mausrad drücken + Ziehen |
| Ansicht zurücksetzen | ↺ Button |
| Rückgängig | Strg + Z |
| Wiederholen | Strg + Y |
Sprite speichern
- Gib einen Namen ein (nur Kleinbuchstaben und Unterstriche, z.B. mein_held)
- Klicke auf 💾 Speichern
- Das Sprite erscheint in der Liste rechts
Sprite im Spiel verwenden
Verwende den Sprite-Namen direkt in deinem Code:
# Eigenes Sprite als Figur
held ist neueFigur("mein_held")
setzeFigur(held, 100, 200)Größen
Du kannst zwischen drei Größen wählen:
- 16×16 — Klein, gut für Items oder einfache Objekte
- 32×32 — Standard, ideal für Spielfiguren
- 64×64 — Groß, für detaillierte Sprites
💡 Tipp: Deine Sprites werden automatisch gespeichert und sind auch nach dem Neuladen der Seite verfügbar!
● Ungespeicherte Änderungen: Wenn du ein Sprite bearbeitet aber noch nicht gespeichert hast, erscheint ein ● hinter dem Namen in der Liste. Beim Wechsel zu einem anderen Sprite oder beim Schließen des Editors wirst du gefragt, ob du wirklich wechseln möchtest.
⚠️ Hinweis: Reservierte Namen wie fuchs oder robert können nicht überschrieben werden.
✏️ Level-Editor
Mit dem Level-Editor kannst du Spielfelder visuell gestalten — ohne Code tippen zu müssen. Platziere Figuren, Plattformen und Hintergrundfarben direkt per Maus.
Editor öffnen
Klicke auf den ✏️ Level Button in der Menüleiste. Die Ansicht wechselt zum Level-Editor.
Was du im Editor machen kannst
| Aktion | Beschreibung |
|---|
| Figur platzieren | Werkzeug „Figur" wählen, dann ins Spielfeld klicken |
| Plattform zeichnen | Werkzeug „Plattform" wählen, dann klicken und ziehen |
| Wand zeichnen | Werkzeug „Wand" wählen, dann klicken und ziehen |
| Element verschieben | Element anklicken und ziehen |
| Element löschen | Rechtsklick auf das Element |
| Hintergrundfarbe | Farbe oben im Canvas-Header auswählen |
| Spielfeldgröße | Voreinstellung oben im Canvas-Header wählen |
| Raster-Snap ein/aus | ⊞ Raster / · Pixel Button oben schaltet zwischen 20px-Raster und pixelgenauem Platzieren um |
| Rückgängig / Wiederholen | ↩ / ↪ Buttons unten links |
Werkzeuge
| Werkzeug | Was es macht |
|---|
| ▩ Plattform | Begehbare Plattform — Figur landet darauf von oben |
| ▦ Wand | Undurchdringliche Wand — blockiert Bewegung von allen Seiten (schraffiert dargestellt) |
| 🦊 Figur | Spielfigur oder Objekt aus dem Sprite-Katalog platzieren |
▶ Schnell testen: Drücke einfach Start während der Level-Editor offen ist. Das Spiel startet automatisch im Vollbild und der Editor öffnet sich nach dem Stopp wieder — mit allen Elementen unverändert.
Figuren-Rollen
Jede Figur im Editor kann eine Rolle bekommen. Die Rolle bestimmt, welcher Code automatisch generiert wird:
| Rolle | Funktion |
|---|
| Spieler | Steuerung per Pfeiltasten oder WASD wird generiert |
| Gegner | Bewegt sich, trifft den Spieler und zieht Leben ab |
| Sammel-Item | Kollision mit Spieler gibt Punkt und blendet Item aus |
| Ziel | Kollision mit Spieler beendet das Spiel mit „Gewonnen!" |
| Portal | Kollision wechselt zu einem anderen Level (siehe Multi-Level) |
| Spawner | Markiert eine Startposition in einem Level — der Spieler erscheint hier beim Eintritt |
| Keine | Figur wird platziert, aber kein Code generiert |
Werfen
Bei der Spieler-Rolle kannst du Werfen aktivieren. Der Spieler wirft dann mit der Leertaste ein Objekt. Im generierten Code heißen die Variablen wurf und wurfAktiv — die kannst du im eigenen Code direkt nutzen.
Multi-Level
Über den + Level Button in der Level-Leiste kannst du mehrere Level erstellen. So funktioniert das System:
- Der Spieler aus Level 1 wird global mitgenommen — seine Leben und Variablen bleiben beim Level-Wechsel erhalten
- Jedes Level hat seine eigenen Gegner, Plattformen, Portale und Hintergründe
- Ein Portal in Level 1 kann auf einen Spawner in Level 2 zeigen — der Spieler erscheint dann genau dort
- Es gibt nur eine einzige spielSchleife für alle Level. Dein eigener Code läuft global und gilt für alle Level
- Level-spezifische Logik steht in wenn _aktuellesLevel = 2 dann ... ende Blöcken — so kannst du selbst Level-eigene Trigger bauen
💡 Eigener Level-Wechsel: Du kannst Level auch per Code wechseln:
_naechstesLevel ist 2 — wechselt zum nächsten Frame zu Level 2.
Zum Beispiel für einen Timer: wenn spielZeit() > 30 dann _naechstesLevel ist 2 ende
↔️ Sprite spiegeln: Bei der Rolle Spieler gibt es die Option „Sprite bei Links/Rechts spiegeln". Ist sie aktiv, dreht der Sprite automatisch um wenn der Spieler die Richtung wechselt — ohne extra Code. Für Plattformer ist diese Option standardmäßig aktiviert.
Wie der Level-Editor mit dem Code zusammenarbeitet
Der Editor liest deinen Code und erkennt automatisch:
- Spielfeldgröße (spielfeld())
- Hintergrundfarbe (hintergrund())
- Figuren (neueFigur(), setzeFigur())
- Plattformen (plattform())
- Rollen aus dem # @editor Metadaten-Kommentar
Wenn du im Editor etwas änderst, wird der Setup-Block deines Codes automatisch aktualisiert. Dein eigener Code innerhalb der spielSchleife bleibt erhalten.
Vorlagen
Über den 📋 Vorlagen Button kannst du fertige Spielvorlagen laden. Manche Vorlagen (z.B. Space Invaders, Ausweich-Spiel) enthalten komplexe eigene Spielmechaniken und sind bewusst nicht mit dem Level-Editor kompatibel.
⚠️ # @no-editor
Wenn dein Code die Zeile # @no-editor enthält, ist der Level-Editor gesperrt. Das schützt Spielmechaniken vor unbeabsichtigtem Überschreiben.
Entferne diese Zeile aus dem Code, wenn du den Editor dennoch nutzen möchtest — aber achte darauf, dass manche Spielmechaniken danach nicht mehr funktionieren könnten.
💡 Tipp: Starte mit einer Vorlage die den Level-Editor unterstützt (z.B. Jump'n'Run oder Fang-Spiel) und passe dann das Spielfeld nach deinen Vorstellungen an!
🔄 Steuerung & Spielschleife
Was ist eine Spielschleife?
Ein Spiel läuft in einer Endlosschleife: Jede Runde (Frame) wird geprüft, welche Tasten gedrückt sind, dann werden Figuren bewegt und alles neu gezeichnet. Das passiert ca. 60 mal pro Sekunde!
Spielschleife erstellen
spielfeld(400, 300)
hintergrund("#87CEEB")
held ist neueFigur("fuchs")
setzeFigur(held, 200, 150)
spielSchleife
wenn tasteGedrückt("ArrowRight") dann
bewegeFigur(held, 3, 0)
ende
wenn tasteGedrückt("ArrowLeft") dann
bewegeFigur(held, -3, 0)
ende
endeTastennamen
| Taste | Name |
|---|
| Pfeiltasten | "ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight" |
| Leertaste | " " |
| Buchstaben | "a", "b", ... "z" |
Klick-Erkennung
wenn figurGeklickt(held) dann
sag "Du hast den Fuchs angeklickt!"
ende
💡 Tipp: Denke in Frames! Jeder Durchlauf der Spielschleife ist ein einzelnes Bild.
⚡ Physik & Kollision
Schwerkraft
Mit schwerkraft() fallen Figuren nach unten — wie in einem echten Jump&Run!
spielfeld(400, 300)
held ist neueFigur("fuchs")
setzeFigur(held, 200, 50)
schwerkraft(held, 0.5)
spielSchleife
wenn tasteGedrückt(" ") dann
figurSprung(held, 10)
ende
endeSpringen
| Befehl | Beschreibung |
|---|
| schwerkraft(figur, stärke) | Schwerkraft aktivieren |
| figurSprung(figur, kraft) | Figur springen lassen |
| figurAmBoden(figur) | Prüft ob Figur am Boden ist |
Kollision
wenn kollidiert(held, gegner) dann
sag "Getroffen!"
spielEnde("Game Over!")
ende| Befehl | Beschreibung |
|---|
| kollidiert(a, b) | Prüft Kollision zwischen zwei Figuren |
| rechteckKollision(x1,y1,b1,h1, x2,y2,b2,h2) | Prüft Rechteck-Kollision |
| spielEnde(text) | Spiel beenden mit Nachricht |
Plattformen
plattform(100, 250, 200, 20) # x, y, breite, höhe
plattform(350, 180, 150, 20)
| Befehl | Beschreibung |
|---|
| plattform(x, y, b, h) | Plattform erstellen |
| entfernePlattform(id) | Plattform entfernen |
✨ Formen, Sound & Partikel
Formen zeichnen
zeichneRechteck(50, 50, 100, 60, "#FF6347")
zeichneKreis(200, 150, 40, "#4169E1")
zeigeText("Punkte: 42", 10, 20, 18, "#FFFFFF")| Befehl | Beschreibung |
|---|
| zeichneRechteck(x, y, b, h, farbe) | Rechteck zeichnen |
| zeichneKreis(x, y, r, farbe) | Kreis zeichnen |
| zeigeText(text, x, y, größe, farbe) | Text auf Spielfeld anzeigen |
Sound
spieleSound("collect") # Einsammel-Sound
spieleSound("jump") # Sprung-SoundPartikel-System
Erzeuge visuelle Effekte wie Explosionen, Funken oder Konfetti!
# Vordefinierte Effekte
partikel(400, 300, "explosion") # Explosion
partikel(200, 100, "funken") # Funken-Effekt
partikel(300, 200, "konfetti") # Konfetti
partikel(150, 300, "rauch") # Rauch
partikel(400, 400, "feuer") # Feuer
partikel(250, 150, "sterne") # Sterne
partikel(500, 300, "wasser") # Wasser-Spritzer
# Eigener Partikel-Effekt
partikelEffekt(x, y, anzahl, tempo, dauer, größe, farbe)
partikelEffekt(300, 200, 50, 4, 60, 5, "#FF00FF")
| Befehl | Beschreibung |
|---|
| partikel(x, y, typ) | Partikel-Effekt erzeugen |
| partikelEffekt(x, y, n, v, d, s, f) | Eigener Effekt (Anzahl, Tempo, Dauer, Größe, Farbe) |
| partikelLöschen() | Alle Partikel entfernen |
Verfügbare Effekt-Typen:
explosion — Orange/gelbe Explosionfunken — Goldene Funkenrauch — Aufsteigender Rauchkonfetti — Buntes Konfettifeuer — Aufsteigende Flammensterne — Glitzernde Sternewasser — Wasser-Spritzer
💡 Tipp: Kombiniere Formen und Figuren für Punkte-Anzeigen, Lebensbalken oder Hintergründe. Partikel-Effekte machen Treffer und Sammel-Aktionen spektakulärer!
Snake mit Arrays bauen
Snake baust du mit zwei Listen für Segmentpositionen. Index 0 = Schwanz, letzter Index = Kopf:
# Schwanz → Kopf (Index 0 = Schwanz, letzter = Kopf)
segX ist [8, 9, 10]
segY ist [10, 10, 10]
# Bewegung pro Schritt:
# 1. Schwanz entfernen (Index 0)
entfernen(segX, 0)
entfernen(segY, 0)
# 2. Neuen Kopf hinten anfügen
anhängen(segX, segX[länge(segX) - 1] + dx)
anhängen(segY, segY[länge(segY) - 1] + dy)
# Kollision mit eigenem Körper prüfen
letzterIdx ist länge(segX) - 1
kopfX ist segX[letzterIdx]
kopfY ist segY[letzterIdx]
i ist 0
solange i < letzterIdx dann
wenn segX[i] = kopfX und segY[i] = kopfY dann
spielEnde("Treffer!")
ende
i ist i + 1
endeDas komplette Beispiel findest du unter Beispiele → GameFuchs → Snake (Arrays).
📚 GameFuchs Befehls-Referenz
Spielfeld & Hintergrund
| Befehl | Beschreibung |
|---|
| spielfeld(breite, höhe) | Spielfeld erstellen |
| hintergrund(farbe) | Hintergrundfarbe setzen |
Figuren
| Befehl | Beschreibung |
|---|
| neueFigur(name) | Neue Figur erstellen |
| setzeFigur(figur, x, y) | Figur positionieren |
| bewegeFigur(figur, dx, dy) | Figur bewegen (relativ) |
| figurGröße(figur, faktor) | Figur skalieren |
| figurGeklickt(figur) | Prüft ob Figur angeklickt wurde |
| figur.x / figur.y | Position der Figur abfragen |
| figur.breite / figur.höhe | Größe der Figur abfragen |
| figur.sichtbar | Sichtbarkeit der Figur abfragen |
Spielschleife & Steuerung
| Befehl | Beschreibung |
|---|
| spielSchleife ... ende | Spielschleife starten |
| tasteGedrückt(taste) | Prüft ob Taste gedrückt |
| spielEnde(text) | Spiel beenden |
Physik
| Befehl | Beschreibung |
|---|
| schwerkraft(figur, stärke) | Schwerkraft aktivieren |
| figurSprung(figur, kraft) | Figur springen lassen |
| figurAmBoden(figur) | Prüft ob Figur am Boden |
| kollidiert(a, b) | Kollision zwischen Figuren |
| rechteckKollision(...) | Rechteck-Kollision prüfen |
| plattform(x, y, b, h) | Plattform erstellen |
| entfernePlattform(id) | Plattform entfernen |
Zeichnen
| Befehl | Beschreibung |
|---|
| zeichneRechteck(x, y, b, h, farbe) | Rechteck zeichnen |
| zeichneKreis(x, y, r, farbe) | Kreis zeichnen |
| zeigeText(text, x, y, größe, farbe) | Text anzeigen |
Sound
| Befehl | Beschreibung |
|---|
| spieleSound(name) | Sound abspielen |
Partikel
| Befehl | Beschreibung |
|---|
| partikel(x, y, typ) | Partikel-Effekt (explosion, funken, rauch, konfetti, feuer, sterne, wasser) |
| partikelEffekt(x, y, anzahl, tempo, dauer, größe, farbe) | Eigener Partikel-Effekt |
| partikelLöschen() | Alle Partikel entfernen |