24 May

Cube: Pon a prueba tu navegador con este juego desarrollado por Google

Cube: Juego desarrollado por Google

Cube: Juego desarrollado por Google

Google ha desarrollado un divertido juego que funciona por aceleración de hardware utilizando la tecnología WebGL (una implementación de OpenGL en los navegadores). WebGL forma parte del estándar HTML5 lo que significa que todos los navegadores que respeten la norma deberían poder ejecutar el juego sin complicaciones.

El juego es una especie del clásico pinball en la que es necesario llevar una esfera del punto A al punto B. El terreno está formado por mapas de calles de Google Maps en un cubo en 3 dimensiones. Al mover el cursor el cubo gira sobre su propio eje causando que la esfera se vea afectada por la gravedad. Es admirable el nivel de detalle de los mapas y el tiempo de respuesta del juego, bastante bueno para ser un juego dentro de un navegador web.

He probado el juego en Firefox y Google Chrome y funciona bastante fluido y sin problemas. Si te interesan otro tipo de juegos algo más comerciales en HTML5 (como Angry Birds) revisa la siguiente página.

Enlace: Play Map’s Cube

07 Mar

5 juegos excelentes desarrollados en HTML5

Cut the rope

HTML5Recapitulando, HTML 5 está siendo desarrollado con el objetivo de ser un estándar para la utilización de elementos multimedia en Internet. Debido a que es un estándar abierto, las empresas y desarrolladores lo apoyan como un remplazo de la tecnología propietaria Flash de Adobe. En el último año han comenzado a surgir ports de juegos desarrollados originalmente para PC, Android e iOS que ahora hacen su debut en HTML5 y a continuación les presento 5 juegos bastante adictivos que deben probar.

Canvas Rider

Canvas Rider

Este juego aprovecha al máximo el nuevo elemento canvas de HTML5, consiste en conducir una bicicleta a través de increíbles escenarios dibujados por los propios jugadores. En esencia es muy simple, pero entretenido y muestra el potencial de combinar HTML5 y Javascript.

TankWorld

TankWorld

Sus gráficos no son impresionantes, pero es un shooter 3D bastante interesante construido enteramente en HTML5 y Javascript. En el manejamos un pequeño tanque de guerra, con el objetivo de capturar la bandera mientras destruimos otros tanques con las diferentes armas disponibles.

Angry Birds

Angry Birds

Uno de los juegos más populares de los últimos tiempos y su mecánica de juego es prácticamente conocida por todos. Disponible principalmente en plataformas móviles ahora por fin hace su aparición en equipos tradicionales a través de HTML5. El juego se realizó para ser presentado en la inauguración de la tienda de aplicaciones Chrome Web Store y fue desarrollado para funcionar en el navegador Google Chrome, aunque en otros navegadores también funciona sin mayores problemas.

Cut the rope

Cut the rope

Uno de mis juegos favoritos de todos los tiempos. Cut the rope apareció por primera vez para la plataforma iOS y su mecánica de juego hasta ahora había sido totalmente orientada a pantallas multitouch. El juego consiste en alimentar con un caramelo a un pequeño monstruo verde llamado om nom. Lo entretenido del juego es lograr que el caramelo llegue justo a la boca de om nom y para eso tendrás que romper cuerdas, romper bombas, etc. Mejor pruébenlo para que conozcan de primera mano la calidad de este juego. Este juego fue desarrollado basándose en Internet Explorer 9, pero no tendrán problemas con Chrome o Firefox.

Fieldrunners

Fieldrunners

Si te gustan los juegos tipo tower defense no te puedes perder Fieldrunners. Al igual que Cut the Rope este juego nació en plataformas móviles y de hecho fue uno de los primeros juegos exitosos en la tienda de aplicaciones de Apple. Ahora han hecho un port completo a HTML5 para que puedas probarlo a través de cualquier navegador web actual. Les advierto que es bastante adictivo, así que pruébenlo. 🙂

Chrono Trigger

Chrono Trigger

Nah, siento tomarles el pelo pero oficialmente todavía no hay una implementación de Chrono Trigger en HTML5. El enlace los llevará a una demo del juego que realicé para los laboratorios de Panchosoft.com. El personaje (Frog) se puede mover a través de la pantalla con las teclas de desplazamiento del teclado. Fue interesante desarrollar este pequeño demo utilizando el elemento canvas de HTML5, más adelante presentaré un post técnico sobre el proceso de desarrollo.

Fuente: Bitelia

 

20 Feb

Infografía: Uso de Flash vs HTML5 para desarrollar juegos

Como bien dicen en GenbetaDev los juegos en línea han retomado popularidad gracias a los usuarios de las redes sociales. Uno de los ejemplos más representativos de esta tendencia es el juego Farmville y su base de usuarios de Facebook. Farmville inicialmente fue desarrollado en Flash y desde hace tiempo tiene disponible una versión en HTML5 (aún en desarrollo). Esto demuestra algo, si el mayor caso de éxito de juego en línea está migrando a HTML5 significa que la intención de abandonar Flash es verdadera. ¿Pero y el resto de juegos y desarrolladores?. En la siguiente infografía vienen algunos datos interesantes sobre el estado actual del desarrollo de juegos en HTML5 y en Flash.

Desde luego todavía falta tiempo para que Flash pase al segundo lugar en el desarrollo de videojuegos en línea. Principalmente debido al tiempo en el que ambas tecnologías han existido, Flash tiene más de una década mientras que HTML5 solo tiene un par de años.

10 Feb

Depthcam, el hack HTML5 para Kinect que lleva tus videoconferencias a otra dimensión

Existen numerosos hacks o desarrollos que utilizan Kinect para hacer cosas asombrosas utilizando la webcam con profundidad. Lo que hasta ahora a nadie se le había ocurrido es publicar una webcam utilizando como medio la tecnología WebGL de los navegadores web modernos. El autor utilizó WebGL para generar un ambiente 3D  “real” en lugar de enviar un simple video en 2D. Es posible interactuar con la escena al arrastrar el puntero del mouse. El stream en vivo está disponible en esta dirección, si en el momento que visitas la página no hay nada publicado entonces puedes ver el siguiente video demostrativo. El resultado es asombroso.

Fuente: Engadget

31 Ene

Agrega gráficas interactivas a tu sitio web con Highcharts [Javascript]

La tecnología Flash está en pleno declive en Internet después de que los gigantes del mundo de la informática y los propios usuarios le dieran la espalda. Empresas como Apple, Google, Facebook y Microsoft han decidido darle soporte al estándar HTML5 y al lenguaje Javascript como las nuevas tecnologías predominantes de Internet.

Hasta hace algunos años Flash era muy utilizado en sitios web para mostrar gráficas de barra o de pastel. Había cientos de plugins que hacían muy sencilla la labor de colocar estas gráficas para los desarrolladores web, además incluían animaciones que daban un mejor aspecto.

Si eres desarrollador (especialmente si eres desarrollador web) seguramente te interesará utilizar las últimas tecnologías disponibles y sobre todo utilizar los estándares. Así que para el caso de las gráficas, presento como referencia una librería de Javascript llamada HighCharts.

HighCharts te permite añadir gráficas animadas a tu sitio web en una gran variedad de formatos. El plugin está hecho en Javascript por lo que es sumamente sencillo agregarlo a tu sitio web. La alimentación de información se hace a través del formato JSON.

Personalmente he utilizado esta librería en varios proyectos y siempre me ha dado excelentes resultados. Lo mejor de todo es que es compatible con cualquier navegador que soporte Javascript. Es decir, funciona con Windows, Linux, Mac, Android, iOS, Windows Phone, Firefox, Chrome, Safari, Internet Explorer, en una PC, en un Smartphone, en una Tablet, etc. Algo con lo que Flash no puede competir.

Librería: Highcharts
Demos: Highcharts Demos