Aquellos que trabajan en diseño o desarrollo web saben que cada proyecto implica la creación de capas que dependen una de otra para construir una experiencia completa. De la misma manera que una pintura que transmite una emoción o un plato de comida que nos deja satisfechos, una experiencia digital completa consiste en la combinación precisa de varios ingredientes sobrepuestos o mezclados uno con otro.
Aunque en el actualidad, la realidad aumentada y virtual son tecnologías que van surgiendo poco a poco, el medio que domina nuestras vidas todavía es la superficie plana de la pantalla: Ordenadores de escritorio y portátiles, tablets y smartphones, todos tienen la limitación de crear experiencias bidimensionales. Pero nosotros existimos en una realidad multidimensional. Algunos dicen que vivimos en un mundo de tres dimensiones, otros dicen cuatro y otros dicen que hay hasta 11. En cualquier caso, lo que sí es cierto es que nuestros cerebros demandan consumir una realidad llena de detalles sobrepuestos y mezclados en sincronía.
Además de la limitación del medio, hasta hace poco teníamos otra barrera: la falta de métodos estandarizados para el dibujo y animación en los navegadores web más usados. Como consecuencia, este componente no formaba parte de las propuestas de los equipos digitales y casi nunca llegaba a integrarse en post-producción. El resultado era parecido a que te sirvieran una ensalada sin aderezo.
Hoy en día, por suerte, podemos crear animaciones con las mismas tecnologías con las que construimos las funcionalidades básicas de una página web. No tenemos que usar “plug-ins” ni Flash, sino que los propios navegadores ya vienen con los requerimientos necesarios para leer y reproducir animación creada con CSS o Javascript. Esto nos permite no solo asignar un movimiento a un objeto para animarlo sino crear movimiento con propósito, con accesibilidad y con mejora progresiva. En otras palabras, ya tenemos el control necesario para impactar las experiencias digitales de nuestros usuarios y añadir esa dimensión adicional para darle vida y emoción al producto final.
En este sentido, algunas de las ventajas de la animación en diseño son:
- Aumentar la voz y tono del contenido
Solo hay que mirar al paisaje digital actual para ver la difusión de la animación en la web. Cada vez más publicaciones dirigidas a audiencias de gran volumen se están atreviendo a utilizar la tecnología disponible. Un ejemplo lo encontramos en el artículo de The Verge sobre sonido en Skype. - Enfocar la atención sobre el contenido
La animación no tiene que ser siempre una explosión de movimientos y confeti sino que puede ser un simple detalle basado en opacidad, color o desenfoque. De hecho, se puede crear animación tan integrada con el diseño de una web que pasa desapercibida pero que al mismo tiempo afecta la experiencia de usuario de una forma profunda. En un mundo donde la tecnología nos satura con información constantemente, vale la pena considerar métodos que ayudan calmar el usuario y enfocarlo en la experiencia que estamos proponiendo. Encontraremos más información sobre la Tecnología de Calma en este enlace.
- Controlar la narración y el mensaje
Hay un enlace fuerte entre el contenido y la animación. Si el mensaje está claro desde un principio existe la posibilidad de crear una comunicación muy clara y potente. Encontramos ejemplos en Stripe y Slack.
Volviendo a la comparación con la comida, cada ensalada lleva un aderezo diferente y cada aderezo tiene su propia receta. Para crear una animación eficaz y consistente, esta se tiene que tomar en consideración desde el principio del proyecto, donde se hace una evaluación de tono y un estilo de guía de movimiento. Animar elementos por animar no es suficiente ni adecuado ya que el resultado tendrá más confusión que claridad y más ruido que sincronía. Si hay que animar un proyecto ya existente, lo ideal es hacer una auditoría de animación y evaluar qué cambios aplicar sobre el proyecto base.
Las personas siempre estamos buscando experiencias que simulen la vida real y, mientras más avanza la tecnología, la matriz en la que debemos operar se hace cada vez más rica, dándonos nuevas y numerosas oportunidades.
Alex Minev, Digital Visual Designer en BeRepublic.