El GIF (Graphics Interchange Format, o formato de intercambio de gráficos) es uno de los formatos de imagen con mayor antigüedad en la World Wide Web. En los primeros años de la Red, las animaciones GIF se utilizaban de manera indiscriminada, como adorno o bien como elemento de interfaz (el botón de «enviar correo electrónico» con un sobre movedizo era muy común en esos días). Con el advenimiento de la Web 2.0 en la década de 2000, los GIFs animados perdieron popularidad. Pero en los últimos años resurgieron: actualmente, se los puede ver representando memes o breves secuencias de películas, especialmente en foros y redes sociales como Tumblr y Twitter.

Sin embargo, los GIF animados no solo pueden servir como detalle divertido: también pueden mejorar la experiencia de usuario que ofrece nuestra interfaz. En este artículo veremos algunas de estas aplicaciones.

Demostración de producto

Fuente: Line25/Nikolay Kuchkarov

Muchos sitios web utilizan secuencias animadas para mostrar los diferentes estados de sus productos. Por ejemplo, en los sitios web de aplicaciones mobile es común usar animaciones para mostrar la transición entre diferentes vistas o pantallas.

Preloaders

El preloader nos indica que un elemento o toda la página está en proceso de carga. Existen muchos diseños, pero generalmente son circulares, como el que muestra la imagen.

Explicaciones

Fuente: Wikimedia

Los GIF animados pueden servir para ilustrar conceptos con una claridad que las imágenes estáticas no tendrían. Esto es aplicable a sitios educativos y tutoriales. En el ejemplo, se muestra gráficamente el movimiento armónico simple.

User engagement

Fuente: Awwwards

Este término no tiene una traducción fiel al español, pero podría definirse como el nivel de compromiso que alcanza el usuario con nuestro sitio. Es decir, es una medida de cuánto se «engancha» con nuestra propuesta. Un GIF como el que muestra el ejemplo, con una animación apenas perceptible, permite destacar una imagen por sobre las demás, y resulta un detalle atractivo para el usuario. Este tipo de imagen se conoce como cinematic GIF o cinemagraph.

Conversaciones

Facebook permite insertar GIF animados a la manera de emoticones en las conversaciones que mantienen los usuarios, tanto por chat como a través del Muro, los álbumes de fotos y otras herramientas. Permiten expresar emociones de una forma que a menudo resulta más divertida que cualquier palabra. De los usuarios depende no terminar atiborrando la página hasta el cansancio con estas imágenes.

Comentarios finales

Frente a las transiciones por CSS, los GIF animados tienen la ventaja de que se ven en cualquier browser. Además, permiten mostrar fragmentos de video sin tener que embeber un reproductor de YouTube o, peor aun, una animación Flash. Sin embargo, pueden llegar a ser muy pesados, ralentizando la carga de la página. Conocer la plataforma desde la que navegan nuestros usuarios nos ayudará a elegir el mejor método.