EDGE, EL NUEVO EDITOR DE ANIMACION HTML5 DE ADOBE

Recientemente Adobe ha publicado un avance de lo que será su nueva herramienta de diseño web HTML 5, Adobe Edge, la cual permitirá a los diseñadores crear contenidos animados para páginas web, usando estándares web como HTML5, JavaScript y CSS 3, mediante una sencilla interfaz que lo asemeja a un editor de video.

No se trata en este caso de un sustituto de Flash, ya que según la compañía ambas tecnologías, Flash y HTML, pueden coexistir, y en ello podemos estar de acuerdo, ya que según profesionales del diseño, HTML 5 aún no está a la altura.

La compañía ya había incorporado herramientas HTML5 en su Creative Suite 5, y dio a conocer una completa herramienta de conversión de Flash a HTML5 llamada Wallaby.

Con el uso de Edge, podremos importar nuestro sitio actual y agregar animaciones a los documentos HTML y también podremos importar gráficos estándar para la web como SVG, PNG, JPG y GIF, estilos CSS, y aplicar hasta 27 diferentes transformaciones.


También podemos contar con la posibilidad de visualizar la animación creada, un servicio prestado en tiempo real gracias al motor WebKit integrado.

Asimismo también tendremos disponibles en el paquete algunas características muy interesantes, prácticas y efectivas, que la convierten en una inmejorable suite de herramientas que nos ayudará a crear animaciones profesionales en poco tiempo.

A continuación, algunas de estas funcionalidades:

Interfaz de usuario intuitiva

La interfaz de usuario se basa en un escenario, timeline, y paneles para los elementos y propiedades. Esta característica está influenciada por After Effects y Flash Professional, pero innova en su facilidad de uso. Las animaciones y el tiempo se pueden controlar en un escenario basado en WebKit, o a través de los ajustes precisos de las propiedades de los elementos, directamente en la línea de tiempo. También se pueden hacer cambios rápidos en los objetos múltiples o individuales.

Animación visualmente controlada por el autor

La aplicación permite crear nuevas composiciones a partir de cero utilizando bloques de construcción básicos de HTML, texto y gráficos importados de la web. Es posible manipular los objetos con una variedad de opciones de estilo de transformación, los cuales Edge aplicará de forma nativa al marco de trabajo de animación basado en jQuery.

Añadir movimiento a contenido HTML existente

Agregar elementos de movimiento a documentos web existentes. Edge almacenará la animación en un archivo JavaScript independiente que distinguirá entre el código HTML original y el código de animación de Edge.

Importación de archivos gráficos Web

Importa gráficos web existentes, tales como SVG, JPG, PNG y GIF.

Salida basada en estándares

Adobe Edge lee y escribe en HTML, CSS y JavaScript de forma nativa. El contenido animado producido por Edge es expresado en JavaScript Notation (JSON), una estructura de datos que conserva el diseño basado en CSS. JSON es un formato de estilo de JavaScript que es de fácil lectura, y permite una mayor flexibilidad para trabajar con el documento y el contenido animado de manera independiente.

Contenido confiable en equipos de escritorio y dispositivos

El contenido de animación creado por Adobe Edge se ha diseñado y probado para funcionar correctamente en IOS y Android, todos los dispositivos habilitados para WebKit, y los navegadores de escritorio más populares como Firefox, Chrome, Safari e Internet Explorer 9.

Si lo deseas, puedes descargar una versión preview de la aplicación desde el siguiente enlace:
http://labs.adobe.com/technologies/edge/