Cómo crear GIF animados sin morir en el intento

Probablemente, Compuserve nunca imaginó que su antiguo formato GIF iba a resurgir de las cenizas y volver a ponerse de moda en Internet y redes sociales más de 25 años después de su creación.

Y es que, actualmente, el formato GIF tiene varias desventajas respecto a otros: cantidad de colores limitada, tamaño en disco mayor al de otros formatos de imagen, etc. Sin embargo, hay una simple característica que ha hecho que siga siendo único: puede mostrar imágenes animadas.

Eso, y por supuesto el hecho de estar tan extendido. Prácticamente cualquier programa reconoce este formato, a pesar de existir formatos alternativos más recientes y eficientes que también soportan animaciones, pero que por razones «políticas» no tuvieron tanta suerte en su extensión, como APNG o MNG.

Más info | La guía definitiva para reducir el tamaño de las imágenes

1. Introducción a los GIF animados

Los GIF animados fueron muy populares en la Internet de la época de los 90, con sus arrobas girando y carteles de «sitio web en construcción». Por aquel entonces, el formato GIF se vió envuelto en un problema de patentes, debido a que su implementación más común utilizaba el algoritmo LZW, que analizaba cadenas de texto para reducir el tamaño del archivo evitando las que se repetían más frecuentemente, algoritmo que suele ser utilizado muy a menudo en diferentes formatos de compresión.

Una vez caducada la patente, GIF quedó en tierra de nadie pero tampoco habían muchas razones para seguir utilizando un formato que se iba quedando obsoleto, por lo que fue perdiendo fuerza hasta los tiempos actuales, que se ha vuelto a popularizar, principalmente gracias a redes como Tumblr o Google+.

Un pequeño ejemplo de GIF animado sería el siguiente:

Básicamente, un GIF animado está compuesto por varias imágenes (frames o fotogramas) con una duración establecida para cada uno. Además, también está la opción de que la animación se repita un número de veces determinado, ninguna o indefinidamente.

Otro detalle interesante de los GIF animados es que es posible definir un color como color transparente (en la imagen, ejemplificado en verde). Esto se aprovecha bastante bien en las animaciones, puesto que una forma de reducir el tamaño de la imagen es añadir en cada fotograma sólo las partes que cambian respecto a su fotograma anterior. De esta forma, toda esa información omitida reduce considerablemente el tamaño final del archivo.

Obviamente, esta característica también es la culpable de que muchos visores de imágenes o aplicaciones (incorrectamente diseñados) no sean capaces de mostrar la animación del GIF de forma correcta, mostrando en su lugar líneas o cambios extraños.

Te preguntarás ¿Y cómo puedo crear un GIF animado?. Existen muchas y muy variadas aplicaciones para ello, sin embargo voy a basarme en una, que desde mi punto de vista es la más interesante, y luego ofreceré algunas alternativas:

2. Cómo crear un GIF animado con GIFCam

GifCam es una pequeña aplicación portable (no necesita instalación) que podemos utilizar a modo de «cámara de video». Todo lo que entre dentro de la región de su ventana, será capturado y guardado a GIF. Por supuesto, la ventana es redimensionable y podemos darle el tamaño que queramos, lo que lo hace muy práctico:

El control del programa es muy sencillo. A parte de redimensionar la ventana, tenemos cuatro botones, con los que podemos especificar ciertos parámetros o acciones:

Internamente, durante una grabación, si existen varios fotogramas idénticos, GIFCam se encarga de eliminar los repetidos, manteniendo sólo uno y variando su duración, optimizando al máximo el tamaño del GIF.

Editor de frames (fotogramas)

Además, GifCam incluye un simple pero excelente editor de fotogramas. Con él, puedes eliminar frames (o series de frames), variar la duración de ciertos fotogramas, añadir texto, redimensionar la imagen, conseguir efecto Yo-yo (ida y vuelta) o incluso marcar zonas con el ratón como transparentes, algo muy útil para crear cinemagraphs.

En definitiva, una gran cantidad de funcionalidades interesantes en un programa de apenas 1,5MB, lo que lo convierte en una de las mejores alternativas para la creación de GIF animados.

URL | GifCam

3. Otros programas para crear GIF animados

Instagiffer

Instagiffer es un programa muy similar a GIFCam, quizás menos práctico y versátil, pero con algunas funcionalidades que pueden interesar, como variar el brillo o la velocidad de los fotogramas, añadir efectos o incluso utilizar un video de Youtube para crear el GIF animado.

Al igual que GifCam, permite capturar regiones de pantalla, aunque su rendimiento es ligeramente inferior. Eso sí, posee una integración muy fuerte con Internet, mostrando avisos de límites de Tumblr o permitiendo subir el GIF a Imgur desde la propia aplicación.

El programa es freeware y está disponible para Windows y Mac.

URL | Instagiffer

QGifer

Otra alternativa muy interesante es QGifer, software libre multiplataforma con el que podremos editar vídeos y extraer fragmentos para crear nuestros propios GIF animados. Proporciona un control más avanzado sobre los fotogramas (al más puro estilo de un editor de video) a la vez que permite un gran número de funcionalidades, incluido el uso de ImageMagick como optimizador externo de imágenes si lo tenemos instalado. Es ideal para convertir desde videos.

Tanto QGifer como Instagiffer tienen también una funcionalidad interesante: guardar sólo los fotogramas impares. Cómo los videos suelen tener una tasa de FPS alta, no se pierde demasiada información y se consigue ahorrar en el tamaño final.

URL | QGifer

AnimateGIF

Si acostumbras a utilizar IrfanView, Paint.NET, Adobe Photoshop o cualquier otro tipo de editor de imágenes, quizás prefieras un programa que simplemente una las diferentes imágenes en un sólo GIF animado. Existen programas como UnFreez, pero desde mi punto de vista, está algo obsoleto y es fácilmente reemplazable por AnimateGIF, el cuál soporta imágenes que no sean GIF para añadir, realizando la conversión de una forma más cómoda para el usuario.

Por otra parte, si quieres profundizar un poco sobre el formato APNG anteriormente mencionado, puedes utilizar GIF2APNG para convertir las imágenes, aunque desgraciadamente, el soporte de este formato es bastante reducido y no parece que vaya a cambiar demasiado en los próximos años.

URL | AnimateGIF
URL | Editores gráficos gratuitos

Virtualdub

Otro método para crear GIF animados es utilizar uno de los editores de video preferidos por muchos: VirtualDub. A pesar de ser un programa orientado a la edición multimedia de video, también podemos elegir la opción Exportar / Animated GIF, para exportar videos editados con este potente programa.

URL | VirtualDub

Byzanz

Por último, no me olvido de los usuarios avanzados de GNU/Linux, los cuales probablemente utilicen byzanz, que permite, cómodamente, desde línea de comandos, capturar cualquier tipo de actividad en pantalla y exportarla a un GIF animado.

Un ejemplo sería utilizar la siguiente línea de comandos, que captura una imagen de 700x400 píxeles desde el punto (320,150) de la pantalla en un GIF con 3 segundos de duración:

byzanz-record --cursor -x 320 -y 150 -w 700 -h 400 -d 3 capture.gif

Existen otros programas similares, como ffmpeg, recordmydesktop o kazam, que también sirven, entre otras cosas, para exportar a GIF.

4. Optimización de GIF animados

Aunque ya he hablado varias veces de cómo optimizar imágenes (imágenes en general), es un buen momento de mencionar dos programas que servirán para reducir el tamaño de nuestros GIF animados:

A modo de ejemplo, la imagen superior fue creada con un tamaño resultante de 78KB. Si le aplicamos el parámetro optimizador de nivel 3 de gifsicle podemos reducirlo hasta 9KB. Obviamente, esto funciona mejor en los GIF animados con menos colores, para los que estén basados en películas o similares, aconsejo el segundo método.

URL | Programas para crear imágenes Pixel Art

GifSicle

GifSicle es un programa en línea de comandos que nos permite manipular y hacer casi cualquier cosa con un GIF animado: añadir, eliminar o reemplazar frames, recortar regiones, voltear, rotar, operaciones de transparencia, añadir metadatos, redimensionar tamaño, modificar la duración de los frames, optimizar o incluso «desoptimizar» un GIF animado.

Quizás, una de las cosas más interesantes sea la de optimizar una imagen. Para ello, escribiremos la siguiente línea de comandos:

gifsicle original.gif -O3 -o optimizado.gif

URL | GifSicle

ImageMagick

Si gifsicle puede parecer potente, ImageMagick lo es aún más, aunque su uso es un poco más complejo. Es uno de los sistemas más utilizados por desarrolladores para manipular imágenes en el lado del servidor, y permite prácticamente un abanico de posibilidades infinitas.

En esta ocasión nos centraremos en la optimización de los frames de un GIF animado basado en un video o película, en la que no importa si perdemos algo de calidad. Para ello, escribimos la siguiente línea:

convert original.gif -fuzz 5% -layers Optimize optimizado.gif

Con ello conseguiremos que, aplicando un 5% en el parámetro de Fuzzy Distance, los colores dentro de ese rango de similitud, sean considerados el mismo, y por lo tanto, reduzca el tamaño. El porcentaje se puede ir variando a gusto personal.

URL | ImageMagick

13-01-2014