Juegos con Javascript
Impact viene con el versátil editor de niveles Weltmeister que te permite crear tus mundos de juego con facilidad. Ya sea para un Jump’n’Run de desplazamiento lateral o un RPG de arriba abajo, Weltmeister está a la altura.
La documentación de Impact responde a todas tus preguntas y más. Una lista creciente de tutoriales en vídeo y artículos, así como una detallada referencia de clases con mucho código de ejemplo, te ayudarán a desarrollar tu primer juego HTML5 hoy mismo.
Jesse Freeman’s Introducing HTML5 Game Development te guía a través de todo el proceso de creación de un juego con Impact. Cubre todo, desde la configuración del entorno de trabajo hasta el empaquetado del juego para su lanzamiento.
Phaser
¿Qué mejor juego para representar el desarrollo web que el juego del dinosaurio de Chrome al que juegas cuando pierdes la conexión a Internet? Es un juego divertido, y es fácil recrear el código. No se ve exactamente igual, pero funciona igual. Si realmente quieres, ¡puedes darle estilo cuando termines!
Para empezar a codificar el juego, crea una nueva carpeta en tus documentos. Usa tu editor de texto favorito para abrir esa carpeta, luego crea tres nuevos archivos y nómbralos: index.html, style.css y script.js. Es posible hacer todo en un solo archivo con HTML5, pero es más organizado mantener todo separado.
Nuestro archivo index.html va a ser muy sencillo: una vez que tengas un diseño HTML básico, crea un div con el ID “game”, y luego dos divs más dentro de él con los IDs “character” y “block”. El personaje será el dinosaurio, y el bloque serán los cactus que vienen hacia nosotros.
A continuación, ve al archivo CSS y empieza a aplicar estilos a los dos divs que acabamos de crear. Primero, empezaremos con el div del juego. Selecciona el elemento por su id, que está representado por el símbolo hash (#).
Motor de juegos Js
Cada paso tiene muestras editables y en vivo disponibles para jugar, para que puedas ver cómo deberían ser las etapas intermedias. Aprenderás los fundamentos del uso del elemento <canvas> para implementar mecánicas de juego fundamentales como el renderizado y el movimiento de imágenes, la detección de colisiones, los mecanismos de control y los estados de victoria y derrota.
Nota: Esta serie de artículos puede utilizarse como material para talleres prácticos de desarrollo de juegos. También puedes hacer uso del kit de contenidos de Gamedev Canvas basado en este tutorial si quieres dar una charla sobre desarrollo de juegos en general.
Juegos Html
Para demostrarlo, demostraré la construcción de un juego desde cero utilizando tecnologías web y sólo dos bibliotecas externas, y lo haré en menos de una hora. Cubriré una variedad de temas de desarrollo de juegos, desde el diseño básico y la maquetación, los controles y los sprites, hasta la inteligencia artificial (IA) para un simple oponente. Incluso voy a desarrollar el juego para que funcione en PC, tabletas y smartphones. Si tienes algo de experiencia en programación como desarrollador web o en otro ámbito de desarrollo, pero no tienes experiencia escribiendo juegos, este artículo te servirá para empezar. Si me das una hora, me comprometo a mostrarte las cuerdas.
Haré todo el desarrollo en Visual Studio, lo que permitirá una rápida ejecución de la aplicación web a medida que vaya haciendo cambios. Asegúrate de tener la última versión de Visual Studio (descárgala en bit.ly/1xEjEnX) para poder seguirla. He utilizado Visual Studio 2013 Pro, pero he actualizado el código con Visual Studio 2013 Community.
Esta aplicación no requerirá código de servidor, así que empiezo creando un nuevo proyecto de página web vacío en Visual Studio. Utilizaré la plantilla vacía de C# para un sitio web seleccionando la opción Visual C# después de seleccionar Archivo | Nuevo | Sitio web vacío de ASP.NET.
