Tutorial GIF animado de GIMP

GIMP es una pieza de software notablemente poderosa considerando que es gratis. Los diseñadores web, en particular, pueden estar agradecidos por su capacidad para producir GIF animados simples.

Los GIF animados son animaciones simples que verá en muchas páginas web y, si bien son mucho menos sofisticados que las animaciones Flash, son muy simples de producir para cualquier persona con conocimientos básicos de GIMP.


Índice
  1. Cómo hacer un GIF animado en GIMP
  2. Conclusión

Cómo hacer un GIF animado en GIMP

Los siguientes pasos muestran una animación simple del tamaño de un banner web que utiliza un par de gráficos básicos, algo de texto y un logotipo.

Las instrucciones de este artículo se aplican a la versión 2.10.12 de GIMP.

  1. Abra un nuevo documento. En este ejemplo, hemos seleccionado la plantilla preestablecida de Banner web móvil grande 320x100.

    Para su animación, puede seleccionar un tamaño preestablecido o establecer dimensiones personalizadas dependiendo de cómo usará su animación final.

    Para este tutorial, la animación constará de siete cuadros y cada cuadro estará representado por una capa individual, lo que significa que el archivo GIMP final tendrá siete capas, incluido el fondo.

  2. Establezca el cuadro uno. La animación comenzará con un espacio en blanco, por lo que no habrá cambios en la imagen real. Fondo Se necesita una capa ya que ya es completamente blanca.

    Sin embargo, un cambio en el nombre de la capa en el Capas se necesita paleta. Haga clic derecho en el Fondo capa en la paleta y seleccione Editar atributos de capa.

    Una captura de pantalla de GIMP con el comando Editar atributos de capa resaltado

  3. En el Editar atributos de capa cuadro de diálogo que se abre, agregue (250ms) hasta el final del nombre de la capa. Esto establece la cantidad de tiempo que se mostrará este cuadro en la animación. El ms significa milisegundos y cada milisegundo es una milésima de segundo. Este primer cuadro se mostrará durante un cuarto de segundo.

    Una captura de pantalla de la ventana Editar atributos de capa en GIMP con el campo Nombre de capa resaltado

  4. Establecer marco dos. Para el tutorial, se utiliza un gráfico de huella para este marco. Ir Expediente > Abrir como capas y seleccione el archivo de gráficos. Esto coloca la huella en una nueva capa que se puede colocar según sea necesario usando el Herramienta de movimiento.

    Una captura de pantalla de GIMP con el comando "Abrir como capas" resaltado

  5. Al igual que con la capa de fondo, es necesario cambiar el nombre de esta nueva capa para asignar el tiempo de visualización del cuadro. En este caso, 750ms.

    En el Capas paleta, la vista previa de la nueva capa parece mostrar un fondo negro alrededor del gráfico, pero en realidad esta área es transparente.

    Una captura de pantalla de la ventana Editar atributos de capa de GIMP con el campo Nombre de capa resaltado

  6. Establezca los fotogramas tres, cuatro y cinco. Los siguientes tres fotogramas son más huellas que caminarán por la pancarta. Estos se insertan de la misma manera que el cuadro dos, usando ese mismo gráfico y otro gráfico para el otro pie. Como antes, el tiempo se establece en 750 ms para cada fotograma.

    Cada una de las capas de la huella necesita un fondo blanco para que solo se vea un marco; actualmente, cada una tiene un fondo transparente. Podemos hacer esto creando una nueva capa inmediatamente debajo de una capa de huella, rellenando la nueva capa con blanco y luego haciendo clic derecho en la capa de huella y haciendo clic en Fusionar.

  7. Establecer marco seis. Este marco es solo un marco en blanco lleno de blanco que dará la apariencia de que la huella final desaparece antes de que aparezca el marco final. Hemos llamado Intervalo a esta capa y hemos optado por tener esta visualización durante solo 250 ms.

    No es necesario que nombre las capas, pero puede facilitar el trabajo con los archivos en capas.

    Editar atributos de capa en GIMP.

  8. Establecer marco siete. Este es el cuadro final y muestra algo de texto junto con el logotipo de Lifewire.com. El primer paso aquí es agregar otra capa con un fondo blanco.

    Agregar el logotipo de Lifewire a la animación en GIMP.

  9. A continuación, utilice el Herramienta de texto para agregar el texto. Esto se aplica a una nueva capa, pero nos ocuparemos de eso una vez que haya agregado el logotipo o la nueva imagen, que se puede hacer de la misma manera que se agregaron los gráficos de la huella anteriormente.

    Una captura de pantalla de GIMP con la herramienta Texto resaltada

  10. Cuando tengamos estos arreglados como se desee, podemos usar Fusionar para combinar las capas de logotipo y texto y luego fusionar esa capa combinada con la capa blanca que se agregó anteriormente. Esto produce una sola capa que formará el cuadro final y elegimos mostrar esto durante 4000 ms.

    Una captura de pantalla de GIMP con el comando Merge Down resaltado

  11. Vista previa de la animación. Antes de guardar el GIF animado, GIMP tiene la opción de obtener una vista previa en acción yendo a filtros > Animación > Reproducción. Esto abre un cuadro de diálogo de vista previa con botones que se explican por sí mismos para reproducir la animación. Si algo no se ve bien, se puede modificar en este punto. De lo contrario, se puede guardar como un GIF animado.

    La secuencia de animación se establece en el orden en que las capas se apilan en el Capas paleta, comenzando desde el fondo o la capa más baja y trabajando hacia arriba. Si su animación se reproduce fuera de secuencia, deberá ajustar el orden de sus capas haciendo clic en una capa para seleccionar y usando las flechas hacia arriba y hacia abajo en la barra inferior de la Capas paleta para cambiar su posición.

    Una captura de pantalla de GIMP con el comando Reproducir resaltado

  12. Guarda el GIF animado. Guardar un GIF animado es un ejercicio bastante sencillo. Primero, ve a Expediente > Guardar una copia y asigne a su archivo un nombre relevante y seleccione dónde desea guardar su archivo.

    Una captura de pantalla de GIMP con el comando Guardar una copia resaltado

  13. A continuación, vaya a Expediente > Exportar cómo para guardarlo como un GIF animado.

    Una captura de pantalla de GIMP con el comando Exportar como resaltado

  14. En el Exportar imagen cuadro de diálogo que se abre, seleccione Seleccionar tipo de archivo y desplácese hasta la imagen GIF y selecciónela, luego seleccione Exportar. Si recibe una advertencia sobre las capas que se extienden más allá de los bordes reales de la imagen, seleccione la Cultivo botón.

    Una captura de pantalla de la ventana Exportar de GIMP con el botón Exportar resaltado

  15. Esto conducirá ahora a la Guardar como GIF diálogo con una sección de Opciones de GIF animados. Puede dejarlos en sus valores predeterminados, aunque si solo desea que la animación se reproduzca una vez, debe desmarcar bucle para siempre.

    Una captura de pantalla de la ventana Exportar imagen como GIF de GIMP con la opción Loop Forever resaltada

  16. Ahora puedes compartir tu GIF animado.

Conclusión

Los pasos que se muestran aquí le brindarán las herramientas básicas para producir sus propias animaciones simples, utilizando diferentes gráficos y tamaños de documentos. Si bien el resultado final es bastante básico en términos de animación, es un proceso muy fácil que cualquier persona con un conocimiento básico de GIMP puede lograr.

Entradas Relacionadas

Subir

Utilizamos cookies propias y de terceros para personalizar contenidos y analizar el tráfico web. Política de privacidad