#HTML5 Animator = animaciones sin #Flash

¿Qué es A5 HTML5 Animator? 

Es una aplicación que permite a los usuarios realizar complejas animaciones sin necesidad de usar Flash creada por la empresa alemana Data Becker www.todate.es 

Lo interesante de la herramienta es que la interfaz a utilizar es muy parecida a la de Flash, pero al terminar la animación y exportarla, el resultado es un código HTML5 totalmente listo para subir a la web. 

Éste resultado puede ser visualizado en cualquier navegador compatible con HTML5, así como en la mayoría de dispositivos móviles, entre los que se incluyen el sistema operativo Android e iOS. Para más información sobre compatibilidad de HTML5 con dispositivos móviles, se recomienda visitar el siguiente enlace. 

Características más importantes.

► Línea de tiempo con la animación de fotogramas clave. La aplicación de las animaciones colocando manualmente los fotogramas clave en la línea de tiempo o mediante el modo de grabación simple. 

► Todas las habilidades de HTML5 y CSS3. Reflejos, sombras, bordes, rotación 3D, etc., son fáciles de insertar. 

► Escenas y soporte multi-línea de tiempo. Las animaciones pueden ser divididas en diferentes escenas y en varias líneas de tiempo paralelas que se ejecutan activándose cuando una determinada acción se lleva a cabo. 

► Administrador JavaScript. Ofrece la oportunidad de escribir funciones propias. Todos los objetos pueden ser abordados y manipulados con la ayuda de su ID. 

Ventajas

► Excelente editor WYSIWYG que garantiza la creación sencilla y un fácil posicionamiento de los objetos (textos, imágenes, videos) de la manera más sencilla arrastrando y soltando el clic del ratón. 

► Variedad de animaciones integradas listas para usar, así como de efectos que se pueden aplicar a un objeto de su elección. 

► Para usuarios avanzados se pueden crear y modificar interacciones complejas con el editor integrado de Javascript (con resaltado de sintaxis). 


Tutoriales 

Trabajando con la línea de tiempo 

En este tutorial puedes aprender cómo crear animaciones de manera manual (introduciendo fotogramas clave en la línea de tiempo) y automáticamente, con la ayuda del modo grabación. 


link: http://www.youtube.com/watch?v=53xntVxgY8M 


Escenas e interacciones 

Este vídeo explica cómo dividir animaciones en distintas escenas, cómo trabajar con varias líneas de tiempo e introduce las distintas opciones de interactividad, mediante la creación de eventos. 


link: http://www.youtube.com/watch?v=Uoh-HednQng 


Animaciones en directo y efectos 

El objetivo de este videotutorial es mostrar cómo podemos trabajar con diferentes animaciones y efectos prediseñados. Además, se explica cómo generar animaciones personalizadas con ayuda de los fotogramas clave. 


link: http://www.youtube.com/watch?v=-q0IBG1UgOo 


Ejemplos 


Podemos ver en el siguiente enlace algunos ejemplos de animaciones diseñadas con A5 HTML5 Animator, entre los que podemos encontrar: 

► Ejemplo de juego en HTML5 

► Animación tipográfica con efectos de texto 

► Menú animado 

► Presentación en diapositivas 

► Pelota animada 

Pueden verse más ejemplos de animaciones aquí.


Probar programa 


En la actualidad, A5 HTML5 Animator se encuentra en la prueba Beta, así que cualquier usuario puede descargar el programa gratuitamente previo registro y aportar nuevas ideas o corregir posibles bugs, antes del lanzamiento de la versión oficial. 

Para probar el programa de la página oficial, pueden seguir el siguiente enlace.

Posted in: 4boot,animacion,css3,flash,html5,javascript,tutoriales