Cómo crear juegos de rol en su juego html5

El juego de rol (RPG) es una de las formas más duraderas de juego. Mientras que los juegos de rol pueden trabajar de muchas maneras diferentes para su juego de HTML5, la configuración general sigue un patrón familiar. El usuario se involucra como un personaje con un conjunto de características básicas. Entonces, el jugador recoge objetos y derrotas enemigos para mejorar el tiempo de su actuación, lo que lleva a los monstruos más difíciles.

Construir clase base del carácter del juego

Comience por la construcción de un genérico Personaje clase que soporta todas las características comunes y, a continuación, puede modificar fácilmente esta clase para construir todos los héroes y monstruos que te puedas imaginar. Las claves para cualquier clase de caracteres son las estadísticas utilizadas en combate y nivelación. Puede manejar esto de varias maneras:

• Nombre: Si bien esto puede ser obvio, el nombre es útil para informar lo que está sucediendo.

• CV: Puntaje maximo. Esta es la cantidad de daño que un personaje puede tomar. Si usted tiene una gran cantidad de puntos de golpe, se puede tomar una gran cantidad de daños.

• hitPerc: Este es el porcentaje de probabilidad de que un ataque en particular llegará. Si el hitPerc es 50, los ataques aterrizará la mitad del tiempo. Los valores más altos dan lugar a más ataques exitosos.

• daño: Los daño modificador indica la cantidad de daño que se hará en un golpe exitoso. Este valor indica cómo se rodaron muchas dados de seis caras. (El uso de los dados le da un valor de daño más creíble que un valor aleatorio recta. Por ejemplo, poniendo los dos dados de seis caras producirá los valores de cinco a nueve mucha más frecuencia que 2 o 12.)

• defMod: Este valor es un modificador de la defensiva. Se utiliza para simular la destreza y la habilidad de esquivar un ataque. El modificador de defensa se utiliza para hacer un oponente menos probabilidad de asestar un golpe.

• armadura: Una vez que un ataque ha aterrizado, el armadura valor absorberá algo del daño. Cuanto mayor sea el armadura valor, más difícil es hacer daño al personaje.

El Character clase contiene todos estos valores en las propiedades, y también contiene dos funciones. los showStatus () función devuelve una cadena que contiene todas las estadísticas para este personaje. los lucha() función gestiona una ronda de combate.

Aquí está el código para el lucha() Método:

 tChar.fight = function (enemigo) {// asume enemigo se basa también en CharhitPerc = (this.hitPerc - enemy.defMod) / 100-Si (Math.random () lt; hitPerc) {daños = 0-for (i = 0- i lt; this.damage- i ++) {daños + = parseInt (Math.random () * 6) -} // Fordamage final - = enemy.armor-enemy.hp - = daño si (enemy.hp lt; = 0) {alert (enemy.name + "! está muerto") document.location.href = "" -} // fin 'enemigo muerto' if} // fin "hit" if} // lucha final

He aquí cómo la lucha() método funciona:

1. Acepta el otro personaje como un parámetro.

   los lucha() método espera una clase de enemigo, que también debe ser un personaje (o algo basado en la Personaje clase).

2. Determinar el porcentaje de éxito.

   Reste modificador de defensa del enemigo desde el atacante de hitPerc. Esto le dará un valor entre 0 y 100. Dividir este valor por 100 para obtener un flotador 0-1.

3. Tira un número aleatorio.

   los Math.random () función devuelve un valor entre 0 y 1. Compare esto con la calculada hitPerc para averiguar si ha sido un éxito.

4. Tirar los dados.

   Tira un dado de seis caras para cada punto de daño, y añade este valor a un total acumulado para determinar la magnitud del daño causado por este golpe.

5. Compensar blindados enemigos.

   Reste el valor de armadura de la cantidad de daño.

6. Daños Reste del enemigo CV.

   Aplicar daños por restarlo de CV.

7. Compruebe si el enemigo está muerto.

   Si el CV pasa por debajo de 0, el enemigo está muerto.

El modelo de combate está diseñado para ser simple y flexible. Todas las diversas pastillas o mejoras de nivel puede reducirse a modificar las características de los pequeños.

Héroes del juego

El héroe es otra extensión del Personaje clase, pero (como corresponde a un héroe) tiene una mejora poco más. El héroe utiliza una animación hoja de sprites. Un archivo de GIMP le permite crear personajes personalizados por el encendido y apagado varias capas en GIMP.

los Héroe clase es muy similar a la forma predeterminada Personaje. La adición principal es el código de la animación. Aquí está una parte de ese código:

 Héroe function () {Thero = new Carácter ("héroe", "hero.jpg") - -tHero.generateAnimationCycles () tHero.loadAnimation (512, 256, 64, 64) - tHero.renameCycles (new Array ("Up" , "izquierda", "abajo", "derecha")) - tHero.setAnimationSpeed ​​(500) - // dejar todas las estadísticas en sus valores predeterminados valuestHero.pause = function () {this.setSpeed ​​(0) -this.setCurrentCycle (" abajo ") - this.pauseAnimation () -} // endtHero.checkKeys = function () {if (keysDown[K_LEFT]){this.setSpeed(1)-this.playAnimation()-this.setMoveAngle(270)-this.setCurrentCycle("left")-}

El héroe utiliza una colisión predictivo modelo para evitar entrar en el orco. Si se observa una colisión, el héroe simplemente retrocede al punto original antes de actualizarse a sí mismo:

 tHero.checkCollision = function () {// detectionif colisión predictivo (this.collidesWith (orco)) {// copia de seguridad y pausethis.x - = this.dx-this.y - = this.dy-this.pause () -Lucha () -}} // checkCollision final

Si el héroe choca con el orco, el lucha() comienza mecanismo. Esto es en realidad muy simple:

 lucha function () {hero.fight (orco) -orc.fight (héroe) -heroStatus.innerHTML = hero.showStats () - orcStatus.innerHTML = orc.showStats () -} // función lucha final

los lucha() función tiene el ataque héroe orco, y luego el orco ataca al héroe. Después de la ronda, las estadísticas de cada personaje se muestran en la salida apropiada.

¿Cómo mejorar el juego de rol

Este juego simplemente pide mejoras. Hay muchas maneras de tomar este ejemplo particular adicional:

• Añadir más monstruos. Usted puede construir toda una gama de monstruos. Tenga en cuenta que cada monstruo podría ser simplemente una imagen y las estadísticas de combate.

• Añadir un inventario. Permitir al usuario recoger diversos artículos. Cada uno de los artículos serán simplemente cambiar una variable o dos: haciendo que el jugador más fuerte, dándole más daño, o mejor defensa contra el ataque, por ejemplo.

• Incluya una mazmorra. Utilice algunos gráficos de fondo para agregar atmósfera. Siempre se puede utilizar una serie de bloques de barreras.

• Añadir un calabozo azulejo-basado. Por supuesto, mundos basados ​​azulejos y RPG de combate son compañeros naturales.