Posts etiquetados ‘HTML5’

Desde el surgimiento de HTML5, hemos visto una discusión en torno de esté y Flash. Desde “OneMoreLevel” han desarrollado una infografía, que analiza a nivel de juegos estas dos tecnologías, midiendo su desempeño en diferentes browsers y sistemas operativos, así como también el uso que le dan sus usuarios.

Después del salto podrán analizar la infografía y sacar sus propias conclusiones, por mi parte pienso que HTML5 no esta derrotando a Flash, ni que este va a sucumbir muy pronto, pero solo el tiempo y desarrollo dará la razón a los defensores de cada una de estas tecnologías.

Leer el resto de la entrada »

Navegando la Web me encuentro esta interesante plataforma llamada “Spaceport”, la cual permite crear juegos HTML5 en Javascript, y que pueden ser corridos como aplicaciones nativas de iOS o Android, gracias a sus estándares.

Dentro del sitio oficial podremos hacer un tour que ilustra su funcionamiento, así mismo podremos jugar con los juegos de ejemplo que allí tienen, además cuenta con una muy buena documentación.

Spaceport soporta plataformas de iOS, Android, HTML5 y Flash, sin duda excelente alternativa que aparece en un momento oportuno, dado al reciente anuncio de flash donde se retira de los móviles.

Enlace: Spaceport (Sitio oficial)

Continua los avances de HTML5 frente al descenso de Flash, ahora Google nuevamente presenta una extensión que esta disponible para instalar en Flash para las versiones de Mac y Windows. Una ves instalada los desarrolladores de Flash podrán exportar sus trabajos a HTML5.

Sin duda HTML5 continua acortando distancia frente a Flash. Si quieres probar la extensión la puedes descargar desde el enlace.

Enlace: Google Swiffy (Sitio oficial de Extensión Google)

Robert Kleffner es un programador que ha desarrollado Infinite Mario en HTML5, este juego fue desarrollado originalmente por Marcus Persson en el lenguaje de programación Java.

Robert Kleffner también se ha dado a la tarea de integrar el juego con Facebook, así tus amigos pueden ver tus avances en el juego.

Si creciste con el nintendo seguro te es familiar Mario Bross así que anímate a jugar aquí.

Enlace: Infinite Mario in HTML5

“Adobe edge” es la nueva herramienta de Adobe para desarrollar aplicaciones Web en HTML5, CSS3 y Javascript de forma sencilla, tal como nos tiene acostumbrados la compañía detras de Flash.

La nueva herramienta no reemplazará a Flash ya que como dicen sus creadores, hay funciones que aun no se pueden simularse.

De momento se pueden hacer solo animaciones Web, aunque se pretende ampliar para desarrollar juegos.

Adobe edge esta disponible para PC y Mac, en su versión de prueba, lo puedes descargar y probar desde aquí.

Después del salto puedes ver algunos vídeos con los primeros tutoriales de la herramienta.

Leer el resto de la entrada »

Cuando estamos involucrados en proyectos donde recojemos datos de nuestros visitantes, siempre estamos expuestos al spam, es por esta razón que salen los sistemas de captcha, aquellas imagenes distorcionadas que debemos escribir adecuadamente para que el formulario pueda ser enviado correctamente.

“MotionCAPTCHA” es un plugin captcha de jQuery basado en la etiqueta Canvas de HTML5, y que nos brinda una manera diferente de validar la identidad humana a la hora de llenar los formularios, este nos provee con un cuadro y una figura la cual debemos dibujar con el mouse para poder validarnos y enviar la información.

Actualmente esta en etapa de prueba, lo cual lo hace vulnerable ya que el código solo es validado del lado del cliente, en su próximo lanzamiento se espera tener validación del lado del servidor, así como se espera mejorar el soporte en más navegadores.

Aca tienes un Demo para que te hagas a la idea de su funcionamiento, que sin duda es interesante.

Enlace: MotionCAPTCHA (Sitio oficial)

Navegando la Web me encuentro esta sin duda excelente aplicación llamada “RPG JS”, la cual nos permite crear nuestros propios juegos RPG en HTML5 y Javascript, usando la librería Javascript RPG basada en Easeljs.

Esta aplicación nos permite obtener un juego en 2D, que funciona en los navegadores modernos sin la necesidad de Flash.

RPG JS es de código abierto y totalmente gratuito, tanto para uso personal como comercial, además cuenta con una excelente documentación, se pueden importar mapas RPG Maker XP, hay más de 100 animaciones predefinidas las cuales podremos usar y cuenta con una demostración para que ves su potencial.

Así que anímate a crear tu propio vídeo juego RPG, no queda más probarla.

Enlace: RPG JS (Sitio oficial)
Demostración

Estábamos un poco alejados en vacaciones, pero ahora estamos de vuelta y recargados. El día de hoy quiero compartirles una herramienta llamada “Cooties”, la cual es un editor para realizar animaciones en HTML5, sin poner ni una sola linea de código, al estilo de Macromedia para Flash, que si lo has usado veras la enorme ayuda que brinda.

De igual forma es lo que pretende “Cooties”, realizar animaciones de una forma sencilla, pero esta ves para HTML5 sin uso de .swf o .fla.

Para hacer uso de esta herramienta solo debes ir a cooties, y loguearte con tu cuenta de Google, y comenzar a trabajar, al final podremos obtener y descargar a nuestro ordenador los archivos, los cuales podremos posteriormente subir en nuestra aplicaciones Web.

De momento no cuenta con demasiadas opciones pero hasta ahora comienza, lo cual muestra sin duda un futuro prometedor para la herramienta.

Enlace: cooties (Sitio oficial)

Watermark.js es una interesante librería en Javascript, que permite crear marcas de agua sobre imágenes, lo interesante de esta librería es que la imagen que usas no necesariamente tiene que ser PNG o GIF, también puede ser JPG.

Esta librería es Open Source y en su sitio encuentras la documentación necesaria para que la utilices, así como también encontraras demos usando códigos QR como marca de agua en la imagen

Como usarlo:

1. Llama “watermark.js” antes de la etiqueta body de tu documento HTML.
2. “className” la clase en los elementos donde usará una marca de agua. (Opcional) Por defecto: “watermark”.
3. “position”: “top-left”|”top-right”|”bottom-right”|”bottom-left” (Opcional) Por defecto: “bottom-right”.
4. “watermark” un elemento img que representa la marca de agua.
5. “Path” la ruta a la imagen.
6. “opacity” Opacidad 0-100 Por defecto: 50

Con estos pasos ya tienes tus marcas de agua sobre tus imágenes usando watermarks.js.

Enlace: Watermarks.js

Adobe acaba de lanzar la primera versión de Wallaby, una herramienta que permitirá a diseñadores y desarrolladores, convertir archivos de Flash a HTML5.

De acuerdo a Adobe, Wallaby cuenta con una interfaz de usuario muy simple,  que acepta como entrada un Archivo FLA y lo exporta  a HTML.

“Se trata de una tecnología experimental, que proporciona una visión de la innovación que estamos haciendo en torno a Flash y HTML, y que muestra la inversión que hemos hecho en las dos tecnologías que creemos que son importantes para largo plazo”, dijo Barclay. La salida de Wallaby no solo permite el uso de HTML, si no también de SVG y CSS que son tecnologías relacionadas.

La idea de Adobe es que los desarrolladores, a través de Wallaby, puedan extender sus aplicaciones a dispositivos que no son compatibles con Flash, como es el caso de Apple. Una vez que los archivos están convertidos se pueden modificar, utilizando una herramienta de edición de HTML, como lo es Dreamweaver o a mano.

Wallaby está disponible para Mac y Windows y se puede descargar totalmente gratis desde Adobe Labs.

Vía: Digital Arts