Hace muy poco tiempo cuando andaba liado publicando mi tutorial sobre WP Real Media Library se me ocurrió que quizás añadiendo alguna serie de imágenes animadas podría conseguir un contenido más ameno y fácil para la comprensión de mis lectores.

Como usuario de Mac pude finalmente dar con una muy buena herramienta que me permitiese capturar mis imágenes de pantalla creando GIFs muy útiles y optimizados de la forma más rápida posible.

Al final obtuve la solución al dar con GIPHY Capture del que te hablaré un rato para que sepas cómo sacarle todo el provecho que necesitas.

Introducción

Las imágenes GIFs (Graphic Interchange Format) o Formato de Intercambio de Gráficos son un tipo de formato gráfico que lleva con nosotros desde hace casi 30 años aunque su uso ha sufrido fuertes cambios a lo largo de este período de tiempo.

Como cualquier tipo de formato gráfico los GIFs cuentan con una serie de características que los hacen únicos:

• Es un formato limitado al soportar 8 bits por pixels y un máximo de 256 colores por lo que la calidad de las imágenes obtenidas es en cierta manera reducida.
• Su grado de compresión es elevado gracias al protocolo de compresión LZW. Esto nos permite reducir su espacio en la web disminuyendo en consecuencia los tiempo de carga y mejorando nuestra optimización.
• Es totalmente accesible y gratuito como resultado de la expiración de la patente del protocolo LZW.
• Posibilidad de obtener animaciones que se repiten una y otra vez en forma de infinitos loops.
• Gran facilidad de transmisión, portabilidad y compatibilidad con todo tipo de dispositivos.

Todo esto hace de los GIFs una herramienta sencilla y super visual a la hora de transmitir cualquier tipo de mensaje convirtiéndose en un mecanismo de transmisión de la información extremadamente potente.

Un ejemplo de ello es la inclusión de GIFs por parte de plataformas tan conocidas y exitosas como Facebook y Twitter.

Podemos asegurar con certeza como los GIFs se han establecido para quedarse y todo aquel que quiera potenciar su marca atrayendo a su lector ideal y facilitándole la comprensión de sus contenidos debería hacer uso de ellos.

¿Qué es GIPHY?

GIPHY Capture es una de las muchas aplicaciones que nos ofrece GIPHY, una plataforma online que cuenta con una base de datos enorme donde almacenar y localizar los millones de GIFs que se crean a través de ella diariamente.

Su comportamiento es similar a Google puesto que cuenta con un motor de búsqueda que te permite la localización de estos archivos por toda la red así como subirlos, etiquetarlos y compartirlos en tantas redes sociales como te plazca.

Para que te hagas una idea de su potencial su valor asciende actualmente a los 300 millones de dólares habiendo alcanzado un fondos por parte de sus inversores por valor de 55 millones de dólares.

A parte de GIPHY Capture, GIPHY nos ofrece la oportunidad de hacer uso de sus múltiples funcionalidades y aplicaciones de forma totalmente gratuita:

• Upload: podrás subir cualquier GIF que tengas para que forme parte de tu colección y los compartas en las principales redes sociales, como mensaje de texto, email y mucho más.
• GIF Maker: con él conseguirás crear tus GIFs a través de archivos de video y enlaces de Youtube.
• Slideshow: por si necesitas combinar imágenes y GIFs con el fin de crear múltiples presentaciones.
• GIF Caption: te brinda la posibilidad de añadir subtítulos, leyendas y textos animados en cualquiera de tus archivos.
• GIF Editor: podrás editar cada uno de tus GIFs y personalizarlos como te plazca mediante filtros, etiquetas, etc…
• GIPHY for iMessage: tendrás todo lo necesario en tu iPhone, iPad y iMessage para que puedas buscar y compartir todos los GIFs que se te antojen.
• GIPHY Cam: ahora puedes grabar y compartir tus propios GIFs creados a través de la cámara de tu iPhone, iPad o iPod Touch y compartirlo en las redes sociales.
• GIPHY Keys: aplicación específica para iPhone para que busques fácilmente GIFs, los almacenes y compartas con quién tu quieras.

Creando GIFS con GIPHY Capture

Como comenté anteriormente, mi objetivo es poder hacer de mis capturas de pantallas imágenes animadas y usarlas como complemento en cada uno de mis artículos y tutoriales . Es precisamente esto lo que conseguiremos con la aplicación GIPHY Capture.

Para que lo veas todo claramente te muestro aquí un ejemplo de un GIF que utilicé en mi artículo sobre WP Real Media Library:

 

Lo primero que haremos será descargarnos la aplicación a través de su página:

Una vez descargada la localizaremos en nuestra Launchpad y la abriremos. Nos dirigiremos inmediatamente a la parte superior derecha de nuestra pantalla y haremos clic sobre el primer icono:

Se nos abrirá una ventana donde nos dará la opción de registrarnos o acceder a nuestra cuenta, si es que ya tenemos una:

Como en casi todas aplicaciones tu cuenta estará compuesta por un Dashboard o Escritorio donde podrás configurarla.

También cuenta con una sección de favoritos, una guía con videotutoriales y tu canal con acceso a todas tus creaciones donde podrás editarlas y terminar de darles el toque que andabas buscando.

Lo destacable de esta ventana emergente es la opción Record Shortcut y Capture Cursor.

Con Record Shortcut conseguiremos atajar el camino para activar la aplicación y empezar a realizar la captura de pantalla. Sólo tienes que elegir uno de los comandos que te aparecen tras hacer clic en esta opción:

Como su nombre indica, Capture Cursor te da la oportunidad de hacer que el cursor de tu ratón esté siempre visible o no durante tu proceso de grabación. Especialmente útil en el caso de videotutoriales donde tienes que indicar con precisión las acciones que estás realizando para que tu usuario comprenda con claridad cada uno de los procedimientos expuestos.

Proceso de captura

Actualmente existen dos formas de realizar la captura de pantalla y posterior creación de tu GIF animado:

1. Mediante el símbolo record: 

Haremos clic en nuestro icono GIPHY Capture situado en nuestro Launchpad o en el Dock de nuestro Mac para que se nos abra la ventana de captura:

Presionaremos el símbolo record de color rojo y comenzaremos con la grabación.

Cuando lo consideremos necesario sólo tendremos que presionar otra vez el botón y se nos guardará un archivo localizado justo debajo de la palabra GIPHY:

2. Shortcut: 

Si establecimos previamente un shortcut o atajo podremos realizar la grabación sin necesidad de buscar nuestra aplicación y tener que presionar el símbolo record.

Ésta es sin duda mi opción favorita puesto que es la más rápida y directa.

Cada vez que presiones la combinación de teclas elegida la aplicación se mostrará lista para ser usada. Una vez abierta, si ejecutas otra vez esta acción tu proceso de captura comenzará y se terminará cuando repitas otra vez tu combinación de teclas.

¡Así de fácil y sencillo!

Ajustes de pantalla

GIPHY Capture te permite ocultar la barra donde se mostrarán tus capturas las cuales siempre son mostradas por defecto. Para ello haz clic en el primer botón a la derecha del símbolo record:

En caso de querer eliminar alguna de tus grabaciones sólo tienes que pasar el ratón encima de ellas. Se mostrará un botón con forma de «X» que te permitirá deshacerte de ella:

Si necesitaras ajustar el tamaño de la ventana de captura sólo tienes presionar y mantener el segundo botón situado a la derecha del símbolo record y mover tu ratón hacia un lado u otro para aumentar o disminuir su tamaño:

Edición de resultados

Una vez satisfecho con tu grabación necesitarás darle unos toques finales.

Haz clic sobre el archivo que acabas de obtener situado en la barra de capturas, debajo de la palabra GIPHY. Te dará acceso a una nueva ventana con un montón de opciones a seleccionar:

GIF Detail

Obtendrás información de todo tipo:

• Dimensión de la captura realizada.
• Duración de la animación.
• Frame Rate o número de fotogramas por segundo.
• File size o tamaño del archivo. Establecido en función de parámetros controlables como son las dimensiones finales de la animación y la calidad basada en el número de fotogramas por segundo.

Metadata

Tendrás acceso a tus metadatos pudiendo incluso editar alguno de ellos. Haz clic en el icono lápiz que encontrarás justo a la derecha de METADATA para editarlos:

• Nombre de usuario.
• Tags o etiquetas: si quieres compartir tu GIF en GIPHY es muy importante que añadas una o varias etiquetas. Esto es debido a que el buscador de GIPHY basa su búsqueda en la localización de estas tags. Luego si no añades ninguna tu GIF va a ser muy difícilmente localizado por los demás usuarios.
• Source URL: si tu captura ha sido obtenida a través de un contenido previamente publicado a través de otro sitio web siempre podrás incluir la URL de donde proviene.

Edit GIF

• Barra morada: podrás acortar tu animación mostrando sólo el fragmento que consideres necesario.
• Loop: te da la opción de indicar la dirección en la que el loop o bucle de tu captura se repite:
  • Normal o hacia la derecha.
  • Reverse o en sentido inverso, hacia la izquierda.
  • Pingpong: primero hacia la derecha y luego a la izquierda, y así sucesivamente.
• Size: para que configures el tamaño final de tu GIF y su posterior visualización en pantalla. Tienes las siguientes opciones:
  • Tamaño original de captura.
  • 640px
  • 480px
  • 320px
• FPS: determina el número de fotogramas por segundo. A mayor número de fps mayor calidad del producto final pero mayor peso del mismo. Opciones:
  • High
  • Standard
  • Low
• Caption: si necesitas añadir un texto informativo sólo tendrás que rellenar el cuadro de texto que te brinda la aplicación.

Save

Haciendo clic sobre ella guardaremos nuestro GIF en nuestro ordenador rápidamente.

Upload to GIPHY

Si queremos disponer de ella en nuestra cuenta GIPHY sólo tienes que activar esta opción. Podrás posteriormente reeditarla y hacer los ajustes que creas necesario.

Redes sociales

Si has subido tu archivo como parte de tu colección en tu cuenta GIPHY podrás compartirlo a través de los siguientes medios y redes sociales:

• Correo electrónico
• Facebook
• Twitter
• Reddit
• Tumblr
• Pinterest

Como has podido comprobar son muchas las opciones que tienes a la hora de editar tus GIFs animados con el objetivo de personalizarlos lo máximo posible en función de tus necesidades.

Optimización de nuestros GIFs

El proceso de optimización de nuestro archivos es algo que no debemos olvidar si queremos realmente que nuestro sitio web cargue lo más rápido posible y Google no nos penalice por un aumento de tiempo en la velocidad de carga.

Podremos mejorar este parámetro mediante la combinación de:

1. Edición de GIFs con GIPHY Capture.
2. Herramientas online de compresión de GIFs.

1. Edición de GIFs con GIPHY Capture

Como vimos anteriormente una vez que nuestra animación ha sido creada podremos controlar su tamaño final y el número de fotogramas por segundo mediante la edición de los parámetros Size y FPS que encontramos en la opción Edit GIF.

Una vez realizado los ajustes sobre dichos parámetros podremos calcular el peso final que tendrá la animación haciendo clic en la opción «File Size: Calculate size», localizada en GIF DETAIL.

Para que lo entendáis mejor os aporto esta captura de pantalla donde he configurado mi GIF para que tenga un tamaño final de 480px y un fps standard. El resultado es un tamaño de archivo de 338KB:

2. Herramientas de optimización

Siempre que sea posible debemos comprimir nuestros archivos un poco más teniendo especial cuidado en la calidad final de los mismos.

Para la compresión de GIFs utilizo actualmente la herramienta online Compressor.io puesto que a parte de comprimir archivos en formato JPEG, PNG y SVG comprime GIFs con porcentaje de hasta un 90%.

Sólo tendréis que seleccionar el archivo localizado en vuestro ordenador o arrastarlo directamente a la plataforma de compresión

Como podréis observar en mi caso hemos obtenidos una compresión del 45% por lo que hemos pasado de 338KB a unos 187KB. ¡Estupendo! 🙂

Para su descarga sólo es necesario tener una cuenta de Google Drive y/o de Dropbox.

Conclusión

Las imágenes animadas GIFs se han establecido en Internet para quedarse puesto que son un método directo, dinámico y divertido de transmitir tu mensaje.

Prueba de ello es la apuesta que hoy en día realizan empresas importantísimas en internet como por ejemplo Facebook y Twitter.

Para lograr estos objetivos y realizar un trabajo de la forma más profesional posible aconsejo GIPHY Capture. Gracias a su calidad y fácil manejo se ha consolidado como la mejor plataforma para la búsqueda y creación de GIFs para usuarios Mac.

¡Y hasta aquí mi artículo de hoy! Me encantaría que dejaras tu comentarios para enriquecernos todos mutuamente. ¿Algún comentario entonces? 😉