Hello! Si estás utilizando Quintus para el desarrollo de juegos en HTML5 y usas esta gran librería poco conocida pero con una gran utilidad y estás de suerte, no he encontrado (al menos yo) nada sobre esto, si lo utilizas sabrás que realizar el mapa o escena del nivel es bastante tedioso, tener que estar escribiendo el numero del elemento en JSON para montar un simple nivel y luego el archivo JSON para las colisiones y después donde van todos los elementos del juego (Player, enemigos, meta, etc.)

Como no sabía nada en realidad sobre la librería hice un pequeño curso de dos horas en vídeo impartido por Pablo Farias Navarro (@ZenvaTweets) el curso lo podéis encontrar aquí es directo y para empezar está muy bien.

Aquí es donde te vengo a echar una mano, hace muy poco que empecé a utilizar esta librería y lo primero que vi fue el problema de crear los niveles y me puse a ello, miré como se estructuraba los archivos JSON para crear cada nivel, una vez que lo tenía claro empecé a desarrollar una herramienta para este tedioso propósito, ahora gráficamente podrás crear niveles y cargarlos a tu juego tan sencillo como coger los archivos y subirlos a la carpeta data de tu juego.

De forma gráfica podrás añadir los elementos como los tiles o fijar la posición de los enemigos, el inicio del jugador, etc.

Es una forma muy fácil de hacerlo, pero… Como funciona?

• Al entrar encontrarás un sistema muyyy simple con una ventana de configuración, esta ventana se compone de los siguientes elementos:
  • Width: Ancho de la escena ¡ Ojo, en celdas !
  • Height : Alto de la escena igual, en celdas
  • Width Cell: Ancho de las celdas, esto dependerá de la imagen tiles que tengáis a que ancho tiene cada elemento.
  • Number of Image Tiles: El número de imágenes que contiene tu imagen Tiles.
  • Image Tiles: La imagen propiamente dicha, puedes utilizar una local que es como está por defecto o puedes utilizar una imagen que tengas subida a algún servidor o a algo por el estilo.
• Una vez que pulsamos en Generate Scene creará un grid de celdas y cargará en el menú de la izquierda todos los elementos de vuestra imagen tiles, por defecto el grid está vacío, al lado de cada uno de los elementos tendréis un botón de «All» para que todo el grid se rellene con ese elemento ( Por ejemplo el cielo de fondo ). También encontraréis un campo de texto, esto es importante, esto es lo que generará el archivo level_collision.json, si tu juego utiliza el número 2 para el suelo por ejemplo o el elemento player debe chocar con los valores «2» tendrás que poner en cada campo el valor correspondiente.
• Elements, aquí es donde podréis agregar los nombres de los elementos (enemigos, player, etc) Esto será utilizado por level.json que genera el archivo con las posiciones de los elementos para cuando empiece el nivel.
• Una vez que tenemos todo entendido y colocado en el grid podemos usar la opción arriba a la izquierda de Export, que generará los archivos necesarios para montar la escena o escenario de nuestro nuevo nivel, yo por ejemplo en un juego que estoy desarrollando he creado un sistema en la aplicación que puede sacar el numero de archivos que hay para sacar el numero de niveles que tiene y lo hace todo automático así no me preocupo de crear nuevos niveles y sacarlos como rosquillas :).
• También está la opción de usar un archivo level_background.json que ya exista para por ejemplo modificar algo del nivel que esté mal o cualquier causa, al pulsar en «Using Exist» abrirá un popup con un textarea para pegar el contenido de tu level_background.json eso si, antes de eso deberás generar la escena con las medidas exactas de tu escena existente, utilizar la misma imagen de tiles y la configuración que sea igual a la que utilizaste para generarlo. Una vez hecho esto genera la escena y utiliza la función de Using Exist, pega el contenido del archivo y pulsa el botón se colocará todo como en tu escena y podrás modificar todo, recuerda que los parámetros de los elementos personales (enemigos, player y demás) no lo cargará. Quizás en próximas versiones de la herramienta.

Y nada más, utilizarla sin miedo y si alguien se atreve a modificar o mejorarla que lo haga 🙂 Está en github.

• El sistema online lo podéis encontrar aquí
• El repositorio del sistema para si queréis descargarlo y hacerlo de forma local lo podéis descargar aquí
• Mi Twitter por si queréis preguntar algo es @DanyRiera_

Ya solo espero que os guste, que os resulte interesante y si no sabéis nada de Quintus y queréis aprender, intentaré subir algún manual para que empecéis con esta librería.

Un Saludo y hasta la próxima