Battle Simulator - Ein Online-Strategiespiel

Hallo allerseits,

ich hab ein paar freie Tage damit verbracht, ein kleines Spiel zu programmieren. Es ist ein kurzweiliges Online-Strategie-Brett-Spiel für alle, denen Schach zu anstrengend und Wolfenstein 3D zu anspruchslos ist: Battle Simulator

Die Spielregeln sind nicht von mir und erinnern an die Regeln von Schach, nur sind sie einfacher:
* Beide Spieler machen abwechselnd einen Zug, man kann entweder eine Einheit auf ein anderes Feld setzen oder eine gegnerische Einheit angreifen

• Es gibt nur drei verschiedene Arten von Einheiten:
  • **Ritter **können sich ein Feld weit horizontal oder vertikal bewegen
  • **Bogenschützen **können sich zwei Felder weit in jede Richtung bewegen (auch diagonal)
  • **Bauern **können sich ein Feld weit in jede Richtung bewegen (auch diagonal)

• Die Einheiten haben jeweils eine unterschiedliche Durchschlagkraft und unterschiedliche Panzerung

• Anders als beim Schach werden gegnerische Einheiten nicht geschlagen sondern je nach eigener Schlagkraft und gegnerischer Panzerung in Mitleidenschaft gezogen

• Auch anders als beim Schach wird auch der Zustand der angreifenden Einheit in Mitleidenschaft gezogen, wenn sie sich in Reichweite der angegriffenen Einheit befindet

• Verschlechtert sich der Zustand einer Einheit durch einen Angriff, dann verringert sich ihre Schlagkraft und ihre Panzerung

• Für mehr Realismus sorgt hier ein kleiner Zufallsfaktor, so daß man den Ausgang eines Gefechts nie genau hervorsagen kann

• Erreicht der Zustand einer Einheit 0%, verschwindet sie vom Spielfeld

Trotz der einfachen Spielregeln ist ein strategisches und taktisches Spielen möglich. Letztendlich muß man die eigenen Einheiten so positionieren, daß sie den Gegner erreichen können, ohne selbst vom Gegner erreicht zu werden. Gleichzeitig muß man verhindern, daß der Gegner z.B. mit seinen Bogenschützen die eigenen, weniger beweglichen Ritter und Bauern, bedroht. Man muß also die unterschiedlichen Einheiten möglichst gut koordinieren.

Das Spielprinzip läßt sich praktischerweise auf so ziemlich alle Arten von Kriegsführung übertragen, habe ich irgendwann festgestellt. Die Einheiten entsprechen dann z.B. der Infanterie, Kavallerie und Artillerie. Oder Fußsoldaten, Streitwagen und Speerwerfer. So ist die Idee zum Battle Simulator entstanden. Momentan kann man sich zwischen 8 verschiedenen Simulationen entscheiden, weitere folgen demnächst. Vorschläge werden natürlich gerne entgegengenommen. Bisher handelt es sich um weitestgehend historische Schlachten, aber man kann auch gegen die Zombie-Invasion kämpfen.

Da es sich um ein Spiel für zwei Personen handelt, braucht man einen Gegner, in diesem Fall ist es eine relativ einfache KI. (Ich weiß nicht, ob das wirklich so heißt, aber ich meine den Algorithmus, der so tut, als würde er intelligente Entscheidungen treffen.) Ich hab mich an den bekannten Algorithmen aus der Schach-Programmierung orientiert, daher gibt es eine Evaluation und eine Suchfunktion. Die Evaluation bewertet einen aktuellen Spielstand und die Suche gibt den Zug zurück, der das beste Ergebnis erwarten läßt. Aus Performancegründen wird derzeit nur ein Zug in die Zukunft berechnet (also zwei Halbzüge bzw. Plys). Daher ist die KI leicht zu schlagen, wenn man sich ein bißchen Mühe gibt. Es gibt hier noch eine Menge Verbesserungspotential, ich habe schon einige Ideen, warte aber erstmal auf das Feedback.

Das Spiel ist übrigens nicht in C# geschrieben sondern in Javascript und AngularJS und CSS3. Es erfordert also einen halbwegs aktuellen Browser, und Javascript sollte natürlich aktiviert sein (es werden keine Daten geloggt oder gespeichert oder sonstwie erhoben). Da ich selbst kein Tablet besitze, würde mich mal interessieren, auf welchen Plattformen es wie gut funktioniert. Der Quelltext ist auch inklusive Kommentierung online einsehbar.

Hier noch ein Sceenshot:

Cool gemacht!
zur KI kannst du dir ja mal das angucken. Ist ne gute Grundlage. KI Programmierung

Übrigens:
Dein Spiel läuft im Opera-Browser garnicht.?

Hi thetruedon,

Dein Spiel läuft im Opera-Browser garnicht.?

Sollte eigentlich mit jedem Webkit-Browser funktionieren. Ich habs mit Opera 22 getestet. Vielleicht hast du im Opera JS deaktiviert?

Christian

Muss ich leider bestätigen. Im letzten noch voll funktionsfähigen Opera (12.17) läufts nicht.
Und das Design sieht am Anfang arg zerschossen aus, da sich eine Art Dialogbox direkt links oben in die Ecke legt. Diese kann man zwar wegdrücken und einige Sachen auswählen, aber zum Spielfeld kommt man nicht.

Hi Rabban,

danke für den Hinweis und den Screenshot. Ich hätte ja nicht gedacht, daß noch jemand mit einem Browser von vor 10 Versionen unterwegs ist...

Daher auch mein Hinweis:

Das Spiel ist übrigens nicht in C# geschrieben sondern in Javascript und AngularJS und CSS3. Es erfordert also einen halbwegs aktuellen Browser

In diesem Fall liegt es daran, daß Opera vor Version 15 CCS3 noch nicht (vollständig) unterstützt. Ich verwende z.B. vmin-Maßeinheiten, um ein quadratisches Spielfeld zu erstellen, daß immer die volle Breite oder Höhe einnimmt. Außerdem werden CSS3-Transformationen und -Animationen verwendet, damit man dem Spielverlauf besser folgen kann, und Webfonts für die Icons.

Auf einem Desktop-PC benötigt man daher mindestens einen der folgenden Browser:

• Firefox ≥ 19
• IE ≥ 9
• Chrome ≥ 20
• Safari ≥ 6
• Opera ≥ 15

Christian

Vielleicht einfach am Anfang eine Warnung drüberlegen, falls man keinen der unterstützten Browsern nutzt. Dann denkt man nicht, dass das Spiel "kaputt" ist.

Hallo allerseits,

ab jetzt gibt es eine Warnung, falls kein Javascript oder CSS3 unterstützt wird:

<div class="no-javascript-alert" ng-hide="true">
	<p>Sorry, <br/>Battle Simulator requires JavaScript</p>
</div>
<div class="no-css3-alert">
	<p>Sorry, <br/>Battles Simulator requires a browser that supports CSS3 Style Sheets</p>
</div>

.no-css3-alert,
.no-javascript-alert {
	background: #d2c7bf;
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}
.no-css3-alert {
	left: -100vmin;
	max-width: 0vmin;
	max-height: 0vmin;
	font-size: 0vmin;
}

Es wird also nur geprüft, ob die Viewport-Koordinaten aus CSS3 funktionieren. Alle verwendeten Features (Webfonts, Expressions usw.) oder alle verfügbaren Browserversionen abzufragen, würde irgendwie den Rahmen sprengen.

Christian

Update:

Für die bessere Darstellung im Internet-Explorer habe ich noch einmal die Grafik und das Layout überarbeitet.

Als nächstes kümmere ich mich um die bessere KI, denn einige Züge, die der Computergegner so macht, erscheinen nicht besonders gut durchdacht. Da muß wohl vor allem erstmal der Code etwas optimiert werden, denn die Berechnung und Bewertung der möglichen Züge ist relativ rechenintensiv. Das Ziel sollte sein, trotz der Beschränkungen von JavaScript mehr als 2 Spielzüge im voraus berechnen zu können, ohne daß der Spieler allzulange darauf warten muß.

Tips und Kritik nehme ich gerne hier im Thread entgegen.

Christian

Hier noch ein Bild:

Ich finde die Idee gut und auch die Umsetzung, mir sind aber die Regeln nicht klar. Ich kann nicht vorhersagen, was passiert, wenn ich mit einer Einheit eine andere Angreife.

Das ist ja z.B. auch bei Risiko so, aber hier kann ich wenigstens am Würfelwurf nachvollziehen, warum ich gerade verloren habe. Ein bisschen Zufall ist ja gut, aber ich hätte es gerne nachvollziehbar. Zum Beispiel mit einfachen Regeln:

Pro Einheit:

• Anzahl Soldaten (Das gibt ein Gefühl von Größe)
• Rüstung pro Soldat
• Schadeon pro Soldat (von X bis Y, zufällig)

Und dann anzeigen, wieviel Soldaten noch vorhanden sind (keine Prozentzahl!) und wieviel Schaden gerade gemacht wurde. Dann kann ich besser abschätzen, ob ein Zug auch was bringt und wie hoch das Risiko ist. Außerdem fehlen mir noch Sachen wie Flankenbonus, Formationsbonus und bessere Balance (Reichweite auf Kosten von Rüstung z.B.).

Bei Computer-Spielen (z.B. Rome) sehe ich auch, was passiert und kann noch eingreifen.

Hi malignate,

Ich finde die Idee gut und auch die Umsetzung

Danke!

mir sind aber die Regeln nicht klar.

Den Einwand hab ich schon desöfteren gehört. Die Spielregeln sind zwar wie erwähnt nicht von mir, aber ich wäre auch daran interessiert, wenn man die Spielregeln auch versteht. Es ist ja nicht nur kompliziert für den Spieler, sondern erschwert auch die Umsetzung einer effizienten KI (also des Computer-Gegners).

Ein bisschen Zufall ist ja gut, aber ich hätte es gerne nachvollziehbar.

Eigentlich ist es auch nur ein bißchen Zufall. Der Schaden, der einer gegnerischen Einheit bei einem Kampf zugefügt wird, berechnet sich aus der eigenen (noch vorhandenen) Durchschlagskraft abzüglich der gegnerischen (noch vorhandenen) Panzerung. Und dann gibt es (dem Realismus zuliebe) eine zufällige Abweichung von +/- 25% oder sowas. Der Schaden der angreifenden Einheit berechnet sich genauso (aber entgegengesetzt).

Verwirrend wird es meines Erachtens besonders dann, wenn beide Einheiten bei einem Kampf aufgerieben werden und gleichzeitig vom Spielfeld verschwinden. Vielleicht kann man solche Situationen besser veranschaulichen - oder mit neuen Spielregeln gleich ganz vermeiden.

Pro Einheit:

• Anzahl Soldaten (Das gibt ein Gefühl von Größe)
• Rüstung pro Soldat
• Schadeon pro Soldat (von X bis Y, zufällig)

Aber wird's dadurch nicht noch komplizierter?

Und dann anzeigen, wieviel Soldaten noch vorhanden sind (keine Prozentzahl!)

Das wäre für Fußtruppen und die Kavallerie realistischer als eine Prozentzahl, aber für ein U-Boot...? Eigentlich sollte doch eine einzige Zahl anschaulicher sein als zwei oder mehr Zahlen?

und wieviel Schaden gerade gemacht wurde.

Da muß ich mal überlegen, wie man das visualisieren könnte, ohne noch mehr Info-Text einzublenden.

Außerdem fehlen mir noch Sachen wie Flankenbonus, Formationsbonus

Soetwas gibt es in der KI des Computergegners. Aber welche Strategie und welche Taktiken du als Spieler wählst, bleibt dir völlig selbst überlassen. In den unterschiedlichen Spielen ist auch jedesmal eine unterschiedliche Vorgehensweise erforderlich.

und bessere Balance (Reichweite auf Kosten von Rüstung z.B.).

Die Werte für Stärke und Panzerung der Einheiten sind für jedes Spiel unterschiedlich, und auch frei konfigurierbar.

Bei Computer-Spielen (z.B. Rome) sehe ich auch, was passiert und kann noch eingreifen.

Ich kenne das Spiel zwar nicht, aber die Videos, die ich gesehen habe, sehen so aus als, als würde dort der Kampf im Wesentlichen zwischen zwei Computer-Gegnern geführt, denen man Kommandos geben kann. Den BattleSimulator würde ich eher mit einem Schach-Computer vergleichen, auch wenn das nicht ganz so sexy klingt 😃

Christian