Skip to content

Gem Match Template: Match-3-Spiel im Browser umbauen

Gem Match Template: Match-3-Spiel im Browser umbauen

Gem Match ist eine der fünf Spielvorlagen in Zugo: ein Match-3-Puzzle auf Canvas mit echten Kaskaden, steigendem Kombo-Faktor, begrenztem Zugbudget und einem Punktziel, das sich beim Erreichen selbst erhöht. Das Klonen kostet keine Credits, die erste spielbare Fassung ist damit gratis.

Danach folgen die Mechanik, wie sie tatsächlich programmiert ist, die Steuerung auf drei Geräteklassen, die Änderungen mit einem Satz und die ehrliche Obergrenze eines Browserspiels aus dem Baukasten.

Wie spielt sich Gem Match?

Es ist die klassische Fassung des Genres. Sie tauschen zwei benachbarte Steine, damit drei oder mehr gleiche in einer Reihe stehen, die Treffer verschwinden, die darüberliegenden Steine fallen nach, und wenn beim Fallen eine neue Reihe entsteht, läuft die Kaskade mit wachsendem Faktor weiter.

Das Feld ist acht mal acht groß und kennt sechs Steinarten. Beide Zahlen wiegen schwerer, als sie aussehen. Weniger Arten machen das Spiel beliebig, mehr Arten verwandeln das Feld in Rauschen, in dem kein Zug mehr auf einen Blick lesbar ist.

Begrenzt wird nicht durch eine Uhr, sondern durch Züge, und das macht Gem Match zu einem ruhigen Spiel: Sie dürfen nachdenken, so lange Sie wollen. Eine Runde startet mit 25 Zügen und einem Punktziel von 1500. Wird das Ziel erreicht, füllt sich das Zugbudget auf und die Vorgabe steigt, die Schwierigkeit wächst also mit dem Können statt mit der Zeit.

Auf dem Bildschirm stehen vier Dinge: Punkte, Bestwert, verbleibende Züge und der Kombo-Faktor. Findet das Spiel keinen gültigen Zug mehr, mischt es das Feld selbstständig neu. Nach ein paar Sekunden ohne Eingabe erscheint ein Hinweis auf einen möglichen Zug, und auf dem Titelbildschirm spielt sich das Spiel selbst vor.

Womit lässt es sich steuern?

Die Steuerung ist bewusst dreifach ausgelegt, damit dieselbe Datei mit Maus, Finger und Tastatur funktioniert.

Gerät Eingabe Was passiert
Maus Drücken und auf das Nachbarfeld ziehen Tauscht zwei Steine
Tastatur Pfeiltasten oder W, A, S, D, dann Leertaste oder Enter Bewegt die Auswahl, bestätigt den Tausch
Handy oder Tablet Antippen und Richtung Nachbar wischen Tauscht zwei Steine
Alle Geräte Kein Zug mehr vorhanden Das Feld mischt automatisch neu

Die Wischgeste ist die, die Sie wirklich prüfen sollten. Match-3 wird viel häufiger am Handy gespielt als am Rechner, und auf schmalen Bildschirmen werden die Felder klein. Was mit der Maus präzise wirkt, geht mit dem Daumen daneben. Veröffentlichen Sie und öffnen Sie das Ergebnis auf einem echten Telefon, bevor Sie das Spiel für fertig erklären.

Erklärt wird nichts in Worten, und das ist richtig so. Match-3 unterrichtet sich beim ersten Tausch selbst, ein Anleitungsbildschirm verzögert nur den Moment, wegen dem jemand das Spiel geöffnet hat.

Wofür lohnt sich so ein Spiel überhaupt?

Der häufigste sinnvolle Einsatz ist nicht der Verkauf, sondern die Beigabe. Ein kleines Spiel auf der Firmenseite hält Menschen länger da als jede Bildergalerie, und es lässt sich in Firmenfarben und mit eigenen Symbolen versehen.

Konkret funktioniert das gut auf einem Messestand, wo Vorbeigehende eine Runde spielen, während sie warten. Ebenso im Adventskalender einer Marke, in der Pause einer Online-Schulung oder als Beigabe zu einer Produkteinführung, bei der die Spielsteine die eigenen Produkte sind.

Der zweite sinnvolle Einsatz ist das Lernen. Wer verstehen will, wie Spielbalance funktioniert, hat hier ein vollständiges, laufendes System mit wenigen Stellschrauben. Feldgröße, Anzahl der Steinarten und Zugbudget wirken sofort und sichtbar, und man braucht keine Zeile Code, um das auszuprobieren.

Was Gem Match nicht ist: der Anfang eines Spielestudios. Für ein Spiel, das Geld verdienen soll, fehlen Speicherstand, Konten, Werbeplätze und Käufe, und jedes dieser Themen ist ein eigenes Projekt. Was ein Builder bei Spielen leistet und was nicht, steht in Kann KI ein Spiel bauen?.

Was ändern Sätze im Chat wirklich?

Spiele werden mit denselben schlichten Sätzen umgebaut wie Websites, nur geht es hier um Balance und Gefühl. Deshalb brauchen Sie mehr Durchgänge, und zwischen jedem Durchgang muss gespielt werden.

  1. Thema: „Ersetze die Edelsteine durch Obst, warme Farben, heller Hintergrund." Ein Satz verändert das gesamte Erscheinungsbild.
  2. Feldgröße: „Mache das Feld sieben mal sieben statt acht mal acht." Die Größe verändert die Schwierigkeit, weil sie die Zahl der möglichen Züge verändert.
  3. Anzahl der Steinarten: „Nutze fünf Arten statt sechs." Das ist der schnellste einzelne Hebel für leichter oder schwerer.
  4. Zughaushalt: „Starte mit dreißig Zügen und gib bei jeder Kaskade ab drei Treffern einen Zug zurück."
  5. Siegbedingung: „Statt eines Punktziels sollen fünfzehn rote Steine gesammelt werden." Das sind zwei bis drei Änderungen, weil Anzeige und Rundenende mitziehen.

Ändern Sie eine Sache und spielen Sie danach. Match-3 reagiert ungewöhnlich empfindlich auf Balance, ein einzelner Wert verschiebt das Gefühl einer ganzen Runde, und beurteilen lässt sich das nur im Spiel. Jeder neue Build wird vorher in einer Sandbox geöffnet, eine misslungene Änderung kostet also 3 Credits und eine Minute statt eines Abends vor einem schwarzen Bildschirm.

Was kostet der Umbau in Credits?

Das Klonen einer Spielvorlage ist kostenlos, weil eine fertige Seite kopiert und kein Modell aufgerufen wird. Die erste spielbare Runde kostet damit gar nichts.

Aktion Credits Wofür
Spiel in ein Projekt klonen keine Kopie eines fertigen Spiels, keine KI
Eine Änderung im Chat 3 Thema, Feld, eine Balanceregel
Frischer Build 6 Wenn Neubauen sauberer ist als Korrigieren
Änderung im Hi-Fi-Modus 6 Doppelter Satz
Build im Hi-Fi-Modus 12 Doppelter Satz

Free bringt 5 Credits mit, das genügt für den Klon und eine Änderung, also für das eigene Thema auf dem Spielfeld. Pro kostet 25 $ im Monat und bringt 200 Credits, das sind ungefähr 66 Änderungen, Business kostet 99 $ im Monat mit 800 Credits.

Rechnen Sie bei einem Spiel mit mehr Durchgängen als bei einer Website. Eine Seite ist fertig, wenn sie sich gut liest, ein Spiel ist fertig, wenn es sich gut anfühlt, und das findet man nur durch Ausprobieren. Ein neues Thema plus ein Balancedurchgang landet meist zwischen acht und zwanzig Änderungen und passt damit bequem in einen Monat Pro.

Was sollten Sie nicht ohne Grund entfernen?

Drei Bestandteile wiegen mehr, als ihre Größe vermuten lässt, und ihr Verlust wird fast immer bereut.

Der erste ist der sich selbst spielende Titelbildschirm. Ein Spiel, das im Hintergrund vorführt, wie es funktioniert, überzeugt deutlich besser als ein Standbild, weil Vorbeischauende die Regel verstehen, bevor sie sich entscheiden. Gestalten Sie den Titel gern um, aber lassen Sie das Spiel darunter laufen.

Der zweite ist der Hinweis nach ein paar Sekunden Untätigkeit. Er zeigt einen gültigen Zug und rettet still die Person, die gerade keinen sieht. Ohne ihn wirkt das Spiel schwerer, ohne interessanter zu werden.

Der dritte sind Bildschirmwackler und Kombo-Banner. Sie existieren, weil ein Treffer ohne Rückmeldung sich anfühlt, als wäre nichts passiert. Nachjustieren ist sinnvoll, gerade am Handy, ersatzloses Streichen hinterlässt ein Spiel, das technisch funktioniert und sich tot anfühlt. Wie ein Feld mit fallenden Blöcken dieselbe Frage anders löst, zeigt die Blockfall-Vorlage.

Wo liegt die ehrliche Grenze?

Zugo baut 2D-Spiele, die im Browser laufen, und Gem Match zeigt gut, wo die Decke hängt.

Ton ist nicht enthalten. Musik und Effekte lassen sich ergänzen, aber Audio im Browser hat eigene Regeln, unter anderem die, dass vor der ersten Berührung nichts abgespielt werden darf. Behandeln Sie das als kleines Projekt, nicht als Einzeiler.

Der Fortschritt wird nicht gespeichert. Der Bestwert lebt im Arbeitsspeicher der Sitzung und ist nach dem Neuladen weg, Level werden nirgends abgelegt. Dauerhafter Fortschritt, Profile oder eine Bestenliste bedeuten Datenbank und Anmeldung, also Supabase zusätzlich zum Spiel.

Und es gibt keine Vermarktung: keine Werbeplätze, keine Käufe im Spiel. Die Vorlage ist ein vollständiges Spiel, keine Spieleplattform. Sobald echte Konten und echtes Geld dazukommen, endet die Vorlagenbearbeitung und ein Produkt mit Fahrplan beginnt. Wer stattdessen ein Match-3 von Grund auf beschreiben will, findet den Weg in Match-3-Spiel mit KI erstellen.

Wie fangen Sie an?

Öffnen Sie die Galerie, wechseln Sie zu den Spielen, suchen Sie Gem Match und spielen Sie in der Vorschau eine ganze Runde, bevor Sie irgendetwas klonen. Vorschau und Klon sind beide kostenlos, alle fünf Spielvorlagen auszuprobieren kostet also nur Zeit.

Arbeiten Sie danach in dieser Reihenfolge: Thema, Feldgröße und Steinanzahl, Zughaushalt, Siegbedingung. Zuerst das Aussehen zu machen ist verlockend und meist Verschwendung, weil eine spätere Balanceänderung die Hälfte davon entwertet.

Das Spiel liegt auf zugo.dev, Startguthaben inklusive. Nach dem Veröffentlichen bekommen Sie eine Adresse, die Sie an Freunde schicken können, und deren Rückmeldung ist die einzige, die über die Balance wirklich etwas aussagt.

← Alle Beiträge