Wie RPGs in Ihr HTML5-Spiel erstellen

Das Rollenspiel (RPG) ist einer der beständigsten Formen von Gameplay. Während Rollenspielen auf viele verschiedene Arten für HTML5-Spiel arbeiten können, folgt das allgemeine Setup einem bekannten Muster. Der Benutzer greift als ein Zeichen mit einer Reihe von grundlegenden Eigenschaften. Der Spieler sammelt sich dann Objekte und Niederlagen Feinde, um schließlich ihre Leistung zu verbessern, was schwieriger Monster führt.

bild0.jpg

Erstellen Sie die Basischarakterklasse des Spiels

Beginnen Sie mit einer generischen Aufbau Charakter Klasse, die alle die gemeinsamen Merkmale unterstützt, und Sie können dann diese Klasse einfach verändern alles, was Sie sich vorstellen können, die Helden und Monster zu bauen. Die Schlüssel für jede Charakterklasse sind die im Kampf und Nivellieren Statistiken. Sie können dies eine Reihe von Möglichkeiten behandeln:

  • Name: Während dies offensichtlich sein kann, der Name ist nützlich für die Berichterstattung, was geschieht.

  • hp: Trefferpunkte. Dies ist die Menge an Schaden, den ein Charakter annehmen kann. Wenn Sie eine Menge Trefferpunkte haben, können Sie eine Menge Schaden nehmen.

  • hitPerc: Dies ist der Prozentsatz der Wahrscheinlichkeit, dass ein bestimmter Angriff wird getroffen. wenn der hitPerc die Hälfte der Zeit ist 50, landen Angriffe. Höhere Werte führen zu einer erfolgreichen Angriffe.

  • Beschädigung: Das Beschädigung Modifikator gibt an, wie viel Schaden wird auf einem erfolgreichen Treffer erfolgen. Dieser Wert gibt an, wie viele sechsseitige Würfel gerollt wird. (Würfeln gibt einen glaubhafter Schadenswert als eine gerade Zufallswert, z. B. Walzen zwei sechsseitige Würfel werden die Werte von fünf bis neun viel häufiger als 2 oder 12 erzeugen)

  • defMod: Dieser Wert ist ein defensiver Modifikator. Es wird verwendet, ein Angriff Geschicklichkeit und die Fähigkeit, ausweichen zu simulieren. Die Verteidigung Modifikator wird ein Gegner weniger wahrscheinlich zu machen einen Schlag zu landen.

  • Rüstung: Sobald ein Angriff gelandet, die Rüstung Wert wird einen Teil des Schadens absorbieren. Je größer der Rüstung Wert ist, desto schwieriger ist es, den Charakter zu verletzen.

die Character Klasse hält alle diese Werte in den Eigenschaften, und es enthält auch zwei Funktionen. Das showstatus () Funktion gibt eine Zeichenfolge, die alle Statistiken für das Zeichen enthält. Das Kampf() Funktion verwaltet eine Kampfrunde.

Hier ist der Code für die Kampf() Verfahren:

 tChar.fight = function (Feind) {// übernimmt Feind auch auf CharhitPerc basiert = (this.hitPerc - enemy.defMod) / 100-if (Math.random () lt; hitPerc) {Schaden = 0-for (i = 0-i lt; this.damage- i ++) {Schaden + = parseInt (Math.random () * 6) -} // end Fordamage - = enemy.armor-enemy.hp - = Schaden-if (enemy.hp lt; = 0) {alert (enemy.name + "! ist tot") document.location.href = "" -} // end 'Feind tot' if} // end "Hit" if} // end Kampf

Hier ist, wie die Kampf() Methode funktioniert:

  1. Nehmen Sie ein anderes Zeichen als Parameter.

    Das Kampf() Methode erwartet eine feindliche Klasse, die auch ein Zeichen (oder etwas auf der Basis sein sollte Charakter Klasse).

  2. Bestimmen Sie den Hit Prozentsatz.

    Subtrahieren Sie die Verteidigung Modifikator des Feindes aus dem Angreifers hitPerc. Dies wird einen Wert zwischen 0 und 100. Teilen Sie geben diesen Wert von 100 einen 0-1 Schwimmer zu bekommen.

  3. Rollen Sie eine Zufallszahl.

    Das Math.random () Funktion gibt einen Wert zwischen 0 und 1. Vergleichen Sie dies mit dem berechneten hitPerc um herauszufinden, ob es einen Treffer gegeben hat.

  4. Würfeln.

    Rollen Sie einen sechsseitigen Würfel für jeden Schaden Punkt, und fügen Sie diesen Wert auf eine laufende Summe zu bestimmen, wie viel Schaden durch diesen Treffer verursacht.

  5. Compensate für feindliche Panzer.

    Ziehen Sie den Rüstungswert der Schadenshöhe.

  6. Subtrahieren Schaden vom Feind hp.

    Wenden Sie Schaden durch Subtraktion von hp.

  7. Überprüfen Sie, ob der Feind tot ist.

    wenn der hp geht unter 0, ist der Feind tot ist.

Das Kampfmodell ist so konzipiert, einfach und flexibel zu sein. All die verschiedenen Pickups oder Ebene Verbesserungen können bis zu modifizieren kleine Merkmale gekocht werden.

Game heroes

Der Held ist eine weitere Verlängerung der Charakter Klasse, aber (wie es sich für einen Helden) ist es ein bisschen mehr Verstärkung hat. Der Held wird ein Blatt Sprite-Animation. Eine GIMP-Datei können Sie benutzerdefinierte Zeichen, die durch Ein- und Ausschalten verschiedenen Schichten in GIMP zu bauen.

Das Held Klasse ist ähnlich wie die Standard Charakter. Der Haupt hinaus ist die Animation Code. Hier ist ein Teil dieser Code:

 Funktion Held () {Thero = new-Charakter ( "Held", "hero.png") - tHero.loadAnimation (512, 256, 64, 64) -tHero.generateAnimationCycles () - tHero.renameCycles (new Array ( "up" "links", "unten", "rechts")) - tHero.setAnimationSpeed ​​(500) - // verlassen alle Werte auf ihren Standard valuestHero.pause = function () {this.setSpeed ​​(0) -this.setCurrentCycle ( " down ") - this.pauseAnimation () -} // endtHero.checkKeys = function () {if (keysDown[K_LEFT]){this.setSpeed(1)-this.playAnimation()-this.setMoveAngle(270)-this.setCurrentCycle("left")-}

Der Held nutzt ein prädiktive Kollisions Modell zu verhindern, in den Ork zu Fuß. Wenn eine Kollision festgestellt wird, sichert der Held einfach an den ursprünglichen Ort, bevor sich die Aktualisierung:

 tHero.checkCollision = function () {// prädiktive Kollisions detectionif (this.collidesWith (ORC)) {// zurück und pausethis.x - = this.dx-this.y - = this.dy-this.pause () -Fight () -}} // end checkCollision

Wenn der Held kollidiert mit dem Ork, der Kampf() Mechanismus beginnt. Das ist eigentlich ganz einfach:

 Funktion Kampf () {hero.fight (ORC) -orc.fight (Held) -heroStatus.innerHTML = hero.showStats () - orcStatus.innerHTML = orc.showStats () -} // end Kampf Funktion

Das Kampf() Funktion hat den Helden Angriff der Orks, und dann der Ork greift den Helden. Nach der Runde werden jedes Zeichen Statistiken in den entsprechenden Ausgang angezeigt.

Wie die Rollenspiel zu verbessern

Dieses Spiel stellt sich einfach für Verbesserungen. Es gibt viele Möglichkeiten, weiter dieses besondere Beispiel zu nehmen:

  • Fügen Sie mehr Monster. Sie können eine ganze Reihe von Monster bauen. Beachten Sie, dass jedes Monster einfach ein Bild und die Kampfstatistiken sein könnte.

  • Fügen Sie eine Bestandsaufnahme. Hiermit kann der Anwender verschiedene Gegenstände zu holen. Jedes der Elemente werden einfach eine Variable ändern oder zwei: so dass die Spieler stärker, ihr mehr Schaden zu geben, oder bessere Verteidigung gegen einen Angriff, zum Beispiel.

  • Fügen Sie ein Verlies. Verwenden Sie einige Hintergrundgrafiken Atmosphäre hinzuzufügen. Sie können jederzeit eine Reihe von Blöcken für Barrieren verwenden.

  • Fügen Sie eine Kachel-basierte Verlies. Natürlich Kachel-basierte Welten und RPG Kampf sind natürliche Begleiter.

Menü