Si quieres llamar la atención al usuario que está delante de una pantalla, la animación de un objeto es la mayor provocación y estimulación para su cerebro. Por delante de los contrastes en colores, formas, tamaños, etc. De hecho, la etiqueta de parpadeo de texto en HTML  (que es la mínima expresión de animación) se llegó a eliminar por su intrusismo. Adios “_blink”.

Ahora bien, una animación con gusto, con intención, aportando estética al conjunto, integrada en la maquetación, y que además, permita interacción por el usuario, es casi el culmen de un trabajo digital.

Ya pasó hace años con FLASH, donde si querías sacarle jugo de verdad a las animaciones web, la gracia estaba en hacer partícipe al usuario y no dejarle como simple espectador. Quedó claro que, para llegar a crear algo con fuerza, debías rezar por tener una buena idea en interacción digital, en creación de ilustraciones, y finalmente, el conocimiento en programación necesario para crear los eventos (a base de picar código).

Con el nacimiento de la programación en HTML5 parecía que se simplificaría la ecuación, o así nos lo vendieron. Pero lo cierto es que los atributos para lograr la animación, finalmente, son los mismos: idea, arte y programación. La diferencia simplemente está en que el código fuente final se escribe con el mismo lenguaje que los otros elementos de la web: HTML5.

Pero las necesidades básicas son las mismas que con el viejo Action Script: idea, arte y programación

Por supuesto, hay algunas herramientas que facilitan la construcción de gráficos, la creación de eventos y, que en definitiva, te permiten crear un poco de acción para tus espectadores, pero sin ser una película lineal.

Ejemplos de animaciones web

Navegando por internet se ven verdaderos ejemplos de animaciones web de calidad en la combinación de diseño, programación  e integración con los contenidos.

 

 

 

 

Herramientas y programas de animación HTML5

Las herramientas de creación de animación HTML5 tienen 2 vertientes principalmente: creación de banners de publicidad y creación de sitios web completos a través de secuencias de animaciones integradas.

Este artículo prefiero enforcarlo desde el punto de vista más artístico y completo, donde la animación debe estar cuidada y supone en más de un caso, una forma de navegación. Si lo que necesitas es una simple animación para conseguir un banner, lo más rápido y seguro es trabajar con Google Web Designer.

Ofrezco GREENSOCK la primera de todas como homenaje a los que trabajamos en su momento con FLASH, pues sus componentes para animación siempre fueron un ahorro de miles de líneas de código para suavizar y dar realismo a los movimientos. En línea con su producto ultraflexible, la propia empresa se ha reconducido hacia los componentes de HTML5.

GREENSOCK

 

 

 

 

Otros programas de animación:

 

Volver al glosario
Agencia de Branding

Somos una agencia de branding. Todos nuestros proyectos tienen algo en común: la creatividad y la estrategia. Contáctanos si tienes un proyecto o si te gustaría saber más sobre nuestro método de trabajo.

Conócenos