Comment créer des RPG dans votre jeu HTML5

Le jeu de rôle (RPG) est l'une des formes les plus durables de gameplay. Alors que les jeux de rôle peuvent travailler dans de nombreuses façons différentes pour votre jeu HTML5, la configuration générale suit un modèle familier. L'utilisateur engage comme un personnage avec un ensemble de caractéristiques de base. Le joueur récupère ensuite les objets et les défaites ennemis, à terme, d'améliorer sa performance, ce qui conduit à des monstres les plus difficiles.

Construire la classe de base du personnage du jeu

Commencez par construire un générique Personnage classe qui prend en charge toutes les caractéristiques communes, et vous pouvez ensuite modifier facilement cette classe pour construire tous les héros et les monstres que vous pouvez imaginer. Les clés de toute classe de caractères sont les statistiques utilisées dans le combat et le nivellement. Vous pouvez gérer ce de plusieurs façons:

• Nom: Même si cela peut être évident, le nom est utile pour rendre compte de ce qui se passe.

• hp: Points de dommage. Ceci est le montant des dommages peut prendre un caractère. Si vous avez beaucoup de points de vie, vous pouvez prendre beaucoup de dégâts.

• hitPerc: Ceci est le pourcentage de probabilité qu'une attaque particulière va frapper. Si le hitPerc est 50, les attaques se posera la moitié du temps. Des valeurs plus élevées conduisent à des attaques plus réussies.

• dommage: La dommage modificateur indique combien de dommages sera fait sur un coup réussi. Cette valeur indique combien de dés à six faces seront déployés. (Utilisation de dés donne une valeur de dégâts plus crédible à une valeur aléatoire droite. Par exemple, deux dés à six faces va produire les valeurs de cinq à neuf beaucoup plus souvent que 2 ou 12.)

• defMod: Cette valeur est un modificateur défensif. Il est utilisé pour simuler la dextérité et la capacité d'esquiver une attaque. Le modificateur de la défense est utilisé pour faire un adversaire moins susceptibles de décrocher un coup.

• armure: Une fois l'attaque a atterri, le armure valeur va absorber une partie des dégâts. Plus la armure valeur, plus il est difficile de faire du mal le caractère.

Les character classe contient toutes ces valeurs dans les propriétés, et il contient également deux fonctions. La showStatus () fonction retourne une chaîne contenant toutes les stats pour le personnage. La bats toi() fonction gère un round de combat.

Voici le code pour le bats toi() méthode:

 tChar.fight = function (ennemi) {// assume ennemi est également basé sur CharhitPerc = (this.hitPerc - enemy.defMod) / 100-si (Math.random () lt; hitPerc) {dommages = 0-for (i = 0 à i lt; this.damage- i ++) {dommages + = parseInt (Math.random () * 6) -} // Fordamage final - = enemy.armor-enemy.hp - = dommages-si (enemy.hp lt; = 0) {alert (enemy.name + "! est mort") document.location.href = "" -} // fin 'ennemi mort »si} // fin" frappé "si} // combat final

Voici comment le bats toi() méthode fonctionne:

1. 
   
   
   
   

   Accepter un autre personnage en tant que paramètre.

   La bats toi() méthode attend un ennemi de classe, qui devrait également être un personnage (ou quelque chose basé sur la Personnage classe).

2. Déterminer le pourcentage de succès.

   Soustraire le modificateur de la défense de l'ennemi de l'attaquant de hitPerc. Cela donnera une valeur comprise entre 0 et 100. Diviser cette valeur par 100 pour obtenir un flotteur 0-1.

3. Rouler un nombre aléatoire.

   La Math.random () fonction renvoie une valeur entre 0 et 1. Comparez cela à la calculé hitPerc pour savoir si il a été un succès.

4. Lancer les dés.

   Lancez un dé à six faces pour chaque point de dégâts, et ajouter cette valeur à un total cumulé de déterminer combien de dommages est causée par ce hit.

5. Compenser armure de l'ennemi.

   Soustraire la valeur d'armure de la quantité de dégâts.

6. Soustraire les dommages à l'ennemi hp.

   Appliquer dommages en le soustrayant hp.

7. Vérifiez pour voir si l'ennemi est mort.

   Si le hp descend en dessous de 0, l'ennemi est mort.

Le modèle de combat est conçu pour être simple et flexible. Tous les différents micros ou des améliorations de niveau peuvent se résumer à modifier petites caractéristiques.

Héros de jeux

Le héros est une autre extension de la Personnage classe, mais (comme il sied à un héros), il dispose d'une amélioration de la peu plus. Le héros utilise une animation de feuille de sprite. Un fichier GIMP vous permet de construire des caractères personnalisés par allumer et éteindre différentes couches dans GIMP.

La Héros classe est un peu comme la valeur par défaut Personnage. L'ajout principal est le code d'animation. Voici une partie de ce code:

 Hero fonction () {Thero = nouveau personnage ("héros", "hero.jpg") - tHero.loadAnimation (512, 256, 64, 64) -tHero.generateAnimationCycles () - tHero.renameCycles (new Array ("Up" , "gauche", "bas", "right")) - tHero.setAnimationSpeed ​​(500) - // laisser toutes les statistiques à leur valuestHero.pause = function () par défaut {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")-}

Le héros utilise un collision prédictive modèle pour éviter de marcher dans l'orc. Si une collision est noté, le héros soutient tout simplement à l'endroit d'origine avant de se mettre à jour:

 tHero.checkCollision = function () {// prédictive collision detectionif (this.collidesWith (orc)) {// sauvegarde et pausethis.x - = this.dx-this.y - = this.dy-this.pause () -Lutte () -}} // fin checkCollision

Si le héros entre en collision avec l'orc, le bats toi() mécanisme commence. Ceci est en fait assez simple:

 lutte function () {hero.fight (orc) -orc.fight (héros) -heroStatus.innerHTML = hero.showStats () - orcStatus.innerHTML = orc.showStats () -} // fonction de combat de fin

La bats toi() fonction a l'attaque de l'héros orc, puis l'orc attaque le héros. Après la ronde, les statistiques de chaque personnage sont affichés dans la sortie appropriée.

Comment améliorer le jeu de rôle

Ce jeu prie simplement pour des améliorations. Il ya plusieurs façons de prendre cet exemple particulier de plus:

• Ajouter plus de monstres. Vous pouvez construire une gamme complète de monstres. Notez que chaque monstre pourrait être simplement une image et les statistiques de combat.

• Ajouter un inventaire. Permettre à l'utilisateur de récupérer des objets divers. Chacun des éléments seront tout simplement changer une variable ou deux: rendant le joueur plus fort, en lui donnant plus de dégâts, ou mieux la défense contre une attaque, par exemple.

• Inclure un donjon. Utilisez des graphiques de fond pour ajouter à l'atmosphère. Vous pouvez toujours utiliser un tableau de blocs pour les barrières.

• Ajouter un donjon à base de tuiles. Bien sûr, mondes tuile-basés et RPG de combat sont des compagnons naturels.