Blob Wars - Rundenbasiertes Strategiespiel - Strategie Spiel

Bitte verwende Three.js, um ein **mobile-first-Spiel** mit dem Thema "**Blob Wars: Jelly Tactics**" zu generieren. Bitte lies zuerst die folgenden detaillierten Spielentwurfsanforderungen und generiere dann den entsprechenden Code: ### 1. Assets & Umgebung * **Visueller Stil**: "Niedliches 3D-isometrisch". Die Szene sollte helle, gesättigte Farben verwenden (Zuckerbäcker/Cartoon-Palette). * **Die Blobs**: * Verwende `SphereGeometry` oder eine leicht abgeflachte Kugel. * Material: `MeshPhysicalMaterial` mit etwas Transmission/Rauheit, um wie **Gummi-Gelee** oder weichen Plastik auszusehen. * **Schlüsselmerkmal**: Jeder Blob muss zwei große, komische Augen (weiße Kugeln mit schwarzen Pupillen) haben, die auf die Kamera oder den Gegner blicken. * **Animation**: Implementiere eine einfache "Quetsch-und-Streck"-Idle-Animation mit `Math.sin()` auf der Mesh-Skala, um sie lebendig/atmend aussehen zu lassen. * **Das Spielfeld**: * Ein 6x6 oder 8x8 Raster aus isometrischen Kacheln (Schwebende-Plattform-Stil). * Kachelfarben: Schachbrettmuster (z.B. Hellgrün und Dunkelgrün, um das Grasgefühl des Screenshots nachzuempfinden, oder stilisierte Plastikkacheln). * Hintergrund: Ein einfacher Farbverlauf-Himmel (Blau bis Cyan) oder eine verschwommene Low-Poly-Landschaft. * **Leistung**: Verwende einfache Geometrien. Vermeide komplexe Schatten; verwende ein Richtungslicht und Umgebungslicht. Geometrien nach Möglichkeit wiederverwenden. ### 2. Audio-Anforderungen * **BGM**: Ein verspielter, "hinterhältiger", aber niedlicher Track mit Pizzicato-Streichern, Holzblöcken und einer Tuba. (Denke an "Verstecken-und-Suchen"-Musik). * **Soundeffekte**: * **Auswahl**: Ein hohes "Pop!" oder "Blub". * **Bewegen (Klonen)**: Ein feuchter Quetsch-Sound. * **Springen**: Ein Cartoon-Feder-"Boing"-Sound. * **Infektion (Gegner umwandeln)**: Ein schneller "Ch-ch-ch-change"- oder magischer Schimmer-Sound, wenn sie die Farbe ändern. * **Gewonnen/Verloren**: Ein Fanfarenstoß oder eine traurige Posaune. ### 3. Gameplay-Schleife (Die "Ataxx"-Mechaniken) * **Spieltyp**: Rundenbasiertes Strategiespiel (Spieler Rot vs. KI Blau). * **Bewegungslogik**: * **Auswählen**: Tippe auf einen Blob, um ihn auszuwählen. Valide Züge auf dem Raster hervorheben. * **Reichweite 1 (Angrenzend)**: Wenn der Spieler auf ein angrenzendes Feld zieht, wird der Blob **KLONIERT** (das Original bleibt, ein neuer entsteht). * **Reichweite 2 (Springen)**: Wenn der Spieler zwei Felder weit zieht, **SPRINGT** der Blob (das Original verschwindet, der Blob bewegt sich auf das neue Feld). * **Kampflogik (Infektion)**: * Nach dem Landen werden alle angrenzenden Felder (alle 8 Richtungen) geprüft. * Alle feindlichen Blobs, die an die Landeposition angrenzen, werden sofort **konvertiert** und wechseln die Farbe zur des Spielers. * **Gewinnbedingung**: Das Spiel endet, wenn das Spielfeld voll ist oder ein Spieler keine Blobs mehr hat. Gewonnen hat die Seite mit der höheren Anzahl an Blobs. ### 4. Mobile Steuerung & Interaktion * **Kamera**: Feste isometrische Ansicht (OrthographicCamera ist für diesen Stil vorzuziehen). Stelle sicher, dass das Board innerhalb der Breite eines vertikalen Mobilbildschirms passt. * **Eingabe**: * **Raycasting**: Implementiere präzise Raycaster-Logik für `touchstart` (Mobilgerät) und `click` (Desktop). * **Visuelles Feedback**: * Wenn ein Blob ausgewählt wird, sollte er aufgeregt auf- und abhüpfen. * Kacheln für gültige Züge sollten hervorgehoben werden (z. B. gelb leuchten). * **UI**: Zeige einen "Punktestand Rot" und einen "Punktestand Blau" oben auf dem Bildschirm an (große Schriftart, auf Mobilgeräten gut lesbar). * Füge eine "Neustarten"-Schaltfläche in einer sicheren UI-Zone (unten oder obere Ecke) hinzu. * **Touch-Optimierung**: Stelle sicher, dass die Trefferbereiche der Kacheln großzügig genug für Finger sind. Verhindere Scrollen/Zoomen der Webseite, um den Canvas stabil zu halten. Erstelle ein Jump ’n’ Run-Spiel im Stil von Super Mario Bros., das im Weltraum spielt, mit der folgenden Spezifikation: **Spieltitel:** Cosmic Leap **Szenario:** - Der Spieler steuert einen Astronauten auf einer Serie schwebender Plattformen, Asteroiden und Raumstationssegmenten. - Gegner umfassen außerirdische Kreaturen und feindliche Roboter. - Hintergrund: Tiefraum mit Sternen, fernen Galaxien und gelegentlichen vorbeiziehenden Kometen. **Kernmechaniken:** 1. **Springen und Schweben:** Halte die Sprungtaste gedrückt, um kurz zu schweben (begrenzt durch eine Schwebe-Energieanzeige). 2. **Sammelbare Objekte:** - **Sternenmünzen:** 100 Münzen geben ein Extraleben. - **Energiekristalle:** Temporärer Geschwindigkeitsschub oder Unverwundbarkeit. - **Sauerstofftanks:** Stellen Schwebe-Energie wieder her. 3. **Checkpoints:** Jedes Level hat 2 Checkpoints; bei einem Tod wird vom letzten Checkpoint neu gestartet. **Level-Struktur:** - Level 1: Asteroidenfeld – instabile Plattformen, die brechen können. - Level 2: Verlassene Raumstation – bewegliche Plattformen, Laserhindernisse. - Level 3: Gravitationswirbel – wechselnde Schwerkraftrichtungen. - Finales Level: Mutterschiff-Boss – besiege den außerirdischen Kommandanten. **Steuerung:** - `Pfeiltasten` oder `WASD` für Bewegung. - `Leertaste` zum Springen/Schweben. - `Shift` für Sprint (verbraucht Sauerstoff schneller). **Technische Anforderungen:** - Verwende HTML5 Canvas für das Rendering. - Implementiere eine einfache Physik-Engine für Sprünge und Kollisionen. - Das Spiel sollte in modernen Browsern laufen. **Visueller Stil:** - Pixelart, 16-Bit-Ästhetik. - Farbpalette: überwiegend Dunkelblau, Lila, Neon-Akzente. **Bonus-Funktion:** - Ein verstecktes Level, das durch das Sammeln aller Münzen in Level 2 freigeschaltet wird. Gib den vollständigen JavaScript-/HTML-Code für das Spiel aus.