HTML5 ha revolucionado las posibilidades de nuestros navegadores (al menos de los navegadores decentes). Animaciones, vídeos, elementos que se transforman, Canvas…
Y si hay algo que engancha a la gente son los juegos. Por eso, hoy os presento este framework que para variar me he encontrado revisando los repositorios más populares en GitHub.
El framework en cuestión se llama Phaser.
Phaser es una framework open source de desarrollo de videojuegos para navegadores de escritorio o móvil. Utiliza Pixi.js internamente para un rápido renderizado de Canvas en 2D y WebGL.
Características
WebGL & Canvas
Phaser utiliza tanto Canvas como WebGL internamente y cambia entre uno u otro en función de las características del navegador. Esto permite renderizar de forma rápida tanto en móvil como en pc. Phaser hace uso de la librería Pixi.js para un mejor renderizado.
Preloader
La precarga se realiza en tan solo una línea de código. Imágenes, sonidos, sprites, Tilemaps, JSON y XML. Todo parseado y manejado automáticamente, listo para el uso durante el juego y almacenado en caché.
Physics
Utiliza su propio sistema Arcade Physics. Un librería ligera, perfecta para dispositivos poco potentes, con una respuesta veloz a las colisiones. Control de velocidad, acelaración, rebotes, arrastres y control total de colisiones.
Sprites
Los sprites son la base del juego. ¡Posiciona, agranda, encoge, rota, escala, anima, colisiona, pinta o aplica texturas! Con control sobre los propios sprites. Controla los clicks, toques y mucho más.
Groups
Grupos de Sprites para reciclar y agilizar, evitando la creación constante de objetos idénticos. Control de colisiones por grupos, pudiendo definir cuales colisionan y cuales no.
Animation
Phaser soporta las clásicas hojas de Sprite con tamaños fijos de frame, packs de texturas, Flash CS6, ficheros JSON y XML. Con todas ellas se puedes crear animaciones.
Particles
Con su propio sistema de Partículas, el cual permite crear divertidos efectos de partículas muy fácilmente. Crea explosiones, efectos de lluvia, fuego. O añade el emisor de partículas sobre un Sprite concreto.
Camera
Phaser dispone de su propio mundo de juego. Los objetos pueden ser colocados en cualquier parte de este mundo en el que tendrás acceso a multitud de opciones de cámara.
Input
Entradas de todo tipo. Ratón, teclado, toques en pantallas táctiles. Multigestos y reconocimiento de gestos personalizados.
Sound
Phaser soporta Audio Web y directamente Audio HTML. Automáticamente controla el bloqueo en dispositivos, facilita la creación de audio para Sprites. Control de repeticiones y volumen.
Tilemap
Phaser puede cargar, renderizar y hacer colisionar el mapa de cuadros (o tilemap) con unas simples líneas de código. Soporte de CSV y TiledMap con múltiples capas. Control total para manipular las cuadrículas.
Algunos ejemplos de juegos publicados y realizados con Phaser son:
...........................................................................................