Eventos » Evento Programación de Videojuegos HTML5 Live
Seguimiento del HTML5 Tour: Programación de Videojuegos HTML5 desde el Espacio CAMOM.
El evento será llevado a cabo por el grupo Madrid.JS e impartido por Fernando Oteros.
Los temas que se tratarán en detalle en el evento serán:
- Novedades HTML5: viendo las diferencias entre el Canvas y SVG.
- Estructura básica de los videojuegos HTML5: lo que es un Gameloop, keyhandlers, el manejo del CanvasBuffer,…
- Juegos 2D: manejando sprites y sonidos.
- Juegos 3D: WebGL, Wave JS
Espero que os guste el evento…
Entradas relacionadas:
- HTML5 Tour: Programación de Videojuegos HTML5
- W3C HTML Working Group y su trabajo con HTML5
- Documentos HTML5
- Ejemplos de código HTML 5
- Publicado el borrador de HTML5
Os dejo un enlace al vídeo del evento… http://vimeo.com/50051692
Hasta aquí el resumen del evento. Muy buena la charla de Fernando Oteros y felicidades al grupo Madrid JS por haber juntado a tanta gente. Seguir así. 
La sala repleta…
El uso de las técnicas de vídeo-juegos se pueden utilizar a la hora de manejar un Canvas, aunque no estemos haciendo un vídeo-juego. Como ejemplo…
Sobre todo pensando en la multiplataforma y el abandono del Flash.
¿Qué hacer con el vídeo-juego en múltiples resoluciones?
Utilizar Modernizr para las capacidades y escalar los sprites.
¿Editores HTML5?
PHPStorm – http://www.jetbrains.com/phpstorm/ y Visual Studio.
En el turno de preguntas…
Ejemplo de desarrollo con WaveJS
Plain Concepts está desarrollando el framework multiplataforma WaveJS para el desarrollo 3D.
Para librerías 3D: WebGL. Lo soportan todos los navegadores menos IE y los móviles.
Vídeos con canal alpha
Para los sonidos tenemos el elemento Audio. Hay que manejar el método oncanplaythrought() para detectar que se ha cargado el audio.
La animación de sprites consiste en tener una imagen con la combinación de animaciones y mediante la programación irnos moviendo a través de la imagen.
Para el teclado y ratón tenemos los manejadores de eventos (click, mouseover, keydown,…). Una buena optimización es insertar las combinaciones de teclas en un array y luego tratar el array. Así evitaremos colisiones a la hora de atender los eventos.
Cuando estemos trabajando con un Canvas debemos de crear un Canvas secundario que actuará de CanvasBuffer. Y luego se hará una copia directa sobre el Canvas de pintado.
A la hora de realizar el loop teníamos setInterval(). Ahora tenemos requestAnimationFrame(). La ventaja de requestAnimationFrame() es que si abandonamos el foco de la ventana en la que se utiliza se para su ejecución. Algo que no sucede en setInterval(). Algo a tener en cuenta en dispositivos móviles.
El ciclo del vídeo-juego será un loop() con update() para la actualización de datos y un draw() para el volcado de datos sobre el Canvas.
A la hora de utilizar el Canvas o SVG la idea es que Canvas ofrece mayor rendimiento. Si bien en SVG es más sencillo realizar detecciones sobre fragmentos.
Volver a utilizar sprites de imágenes, repetición de fondos,…
La idea es aplicar las técnicas de desarrollo de vídeo-juegos “de la vieja escuela” a los desarrollos sobre el navegador. La idea es paliar las limitaciones de los navegadores actuales.
Entre los problemas con la WIFI y el haber perdido el teléfono ha sido imposible comentaros la conferencia online. Os dejo los comentarios que he ido tomando… Espero que os sean de utilidad.
El streaming del evento lo podréis seguir desde http://www.tucamon.es/directo_mad
A partir de las 19h (hora de Madrid) empezaremos a comentar el evento sobre Programación de Videojuegos HTML5 Live desde el Espacio CAMOM.
Mientras podéis revisar en detalle el evento en http://www.aulambra.com/eventos/html5-tour-programacion-de-videojuegos-html5/
Si tienes dudas, preguntas, curiosidades,... sobre HTML5 no dudes en visitar el Foro sobre HTML5 y participar con los temas que se tratan.http://www.dudasprogramacion.com/forum/html-5
