Guía de contenidos
En este artículo vamos a aprender a realizar un archivo GIF desde 0 utilizando Adobe After Effects y Adobe Photoshop.
CREAMOS UN GIF BÁSICO PLANO
Comenzamos abriendo Adobe After Effects. Una vez dentro creamos un nuevo proyecto para poder empezar a trabajar.
Vamos a realizar una nueva composición con una proporción 1:1 (cuadrado). Podemos utilizar 450px por 450px (el estándar de algunas plataformas que utilizan gifs en web como GIPHY por ejemplo).
Ahora importamos los recursos necesarios para crear nuestro GIF, en nuestro caso, utilizaremos un archivo con el logotipo de nuestra empresa, Lowe Marketing. Si vamos a trabajar con formas, lo mejor es importar el archivo vectorial para disponer de formas editables. Si vamos a crear el gif sin partir de ningún recurso, After effects permite también crear formas desde 0 utilizando estas mismas “capas de formas”.
Nuestro objetivo es crear un gif que llame la atención pero que a su vez sea simple, así que vamos a centrarnos en la parte simbólica del logo (isotipo), el león.
Eliminamos las formas que no nos interesan y nos quedamos con las que necesitamos.
UTILIZAMOS EL MOTOR 3D DE AFTER EFFECTS
Ya tenemos la base de nuestro gif, pero vamos a darle una vuelta de tuerca. Marcamos el icono del cubo en la capa para activar el modo 3D de la misma.
Vamos a hacer que nuestro gif sea el isotipo de Lowe en 3D girando sobre sí mismo. Podemos hacer este proceso con cualquier otra forma, lo importante es comprender el proceso.
Cambiamos la vista de la cámara a alguna que nos otorgue perspectiva, pues nos interesa observar con nitidez cualquier cambio de tipo tridimensional.
Nos aseguramos de que en ajustes de composición el procesador 3D es el de CINEMA 4D, para poder usar las transformaciones en el modo 3D.
Abrimos los ajustes de rotación seleccionando la capa y pulsando R. Activamos el icono del cronómetro para poder hacer una animación de rotación Y y marcamos dos keyframes. En nuestro caso nos sirve que dé una vuelta o dos completas, para que termine en la misma posición que en el punto de partida, así será un loop infinito al reproducirlo varias veces.
Creamos una extrusión en el isotipo en las opciones de geometría de la capa, consiguiendo ese volumen tridimensional.
Creamos a su vez dos luces para aumentar la sensación de volumen. Una de tipo ambiente para regular la luminosidad general del objeto y otra de punto para darle perfilado y un sombreado más preciso.
EXPORTACIÓN COMO VÍDEO EN AFTER EFFECTS
Ya tenemos nuestro archivo, ahora debemos realizar una exportación adecuada para convertir este proyecto en un GIF.
IMPORTANTE: Antes de exportar debemos colocar la vista adecuada de nuestro objeto, por ejemplo, si quiero que el logo se vea de frente, cambiaré a vista frontal.
Primero añadimos la composición a la cola de procesamiento. Una vez en la cola editamos el módulo de salida y seleccionamos el canal RGB + Alfa, de esta manera exportaremos con color y también con transparencia, ya que no queremos que exista fondo detrás del isotipo, así podremos colocarlo en cualquier sitio.
Exportamos el archivo a AVI.
EXPORTACIÓN FINAL COMO GIF. EN PHOTOSHOP
Abrimos Adobe Photoshop. Arrastramos el archivo AVI dentro del programa para que se abra.
Una vez aquí simplemente tenemos que guardar el vídeo en Exportar > Guardar para Web en archivo GIF. Si no queremos que aparezca un borde blanco en el gif, quitamos el Halo (podemos “ninguno”). El peso del GIF y la cantidad de colores también podemos modificarlos, así como otras características. También tenemos la opción de indicar cuantas veces queremos que se repita el gif.
Guardamos nuestro GIF y ¡listo! El siguiente paso será subirlo a la web, pero eso lo veremos en otro artículo.
