Patrociname en Patreon
huion 1060plus
banner tienda ropa
Error while rendering module.
Lunes, 08 Agosto 2016 13:58
Valora este artículo
(2 votos)

Cómo hacer un gif animado en photoshop (tutorial)

Si alguna vez has querido aprender cómo hacer un gif en photoshop, hoy estás de suerte. Un gif es un formato de imágenes que permite crear imágenes en movimiento o animaciones generalmente de breve duración. Se usa sobretodo para la creación de banners publicitarios. Últimamente también se emplean para crear animaciones de personajes, de fotografías o cualquier otra cosa que a una mente creativa se le ocurra. Hay gif muy sencillos y otros que son extremendamente complicados en los que se han invertido horas y horas de trabajo.

Al ser tan populares ahora mismo, hay muchos ilustradores, diseñadores y artistas en general que se dedican exclusivamente a esto. Si siempre has querido saber cómo hacer un gif en photoshop, hoy te traigo un pequeño tutorial para novatos (abajo del artículo tienes un videotutorial). En este tutorial te voy a mostrar cómo hacer un gif animado en photoshop a partir de unos gráficos vectoriales. Yo he creado un pequeño personaje al que voy a dotar de un movimiento simple. Espero que te sea de utilidad.

Cómo crear imágenes gif en photoshop

Vamos a empezar este tutorial sobre cómo hacer un gif animado en photoshop explicando lo que vamos a necesitar. Debes poseer una serie de imágenes estáticas que varíen en algún aspecto de una a otra para crear la ilusión de movimiento al crear imágenes gif en photoshop. Esto creo que es algo obvio.

Para este tutorial sobre cómo hacer un gif en photoshop, yo he creado un pequeño personaje a modo de sticker. Se trata de un flan de estilo cartoon con unos grandes ojos y una sonrisa. He ido variando las pupilas y la forma de la boca para conseguir una expresión de sorpresa al crear la imagen gif en photoshop. Es decir, el personaje del flan varía de una expresión neutra (o media sonrisa) a una expresión de sorpresa. Esto lo he conseguido con cinco fotogramas (frames).

Fotogramas de un flan necesarios para hacer un gif animado en photoshop

Una vez tienes tus fotogramas, te voy a enseñar cómo hacer un gif en photoshop. Verás que es un proceso sencillo. Abrimos photoshop e importamos nuestros fotogramas. Cada uno debe estar un una capa distinta dentro del mismo archivo.

Las 5 capas con los 5 fotogramas necesarios para crear un gif animado en photoshop

Vamos a ventana y hacemos clic en la línea de tiempo. Se nos abrirá una pequeña ventana. Seleccionamos “Crear animación de fotogramas” y pulsamos sobre ese botón. Ahora debemos crear tantas capas en este panel como fotogramas tengamos. Yo tengo cinco fotogramas, así que crearé 5 capas. A cada una de estas capas debemos asignarle cada uno de los fotogramas. Esto se hace haciendo visible o invisible las capas en el panel de capas. En la imagen puedes ver como para el fotograma 4, tengo visible sólo la capa 4.

Pulsar en crear animación de fotogramas para empezar a hacer el gif en photoshop
Mostrar u ocultar capas para hacer visibles o invisibles nuestro fotogramas en el panel de creación de animaciones

Para acabar de crear imágenes gif en photoshop debemos ajustar el tiempo que habrá de un fotograma a otro. A tiempos menores más fluidez. Yo voy a poner a todos mis fotogramas, menos al último, un intervalo de 0 segundo. El último tendrá un intervalo un poco mayor.

Ajustar el tiempo de cada uno de los fotogramas para crear una animación de gif fluida

Por último asigna un número de repeticiones. Esto indica cuantas veces se repetirá el la imagen gif antes de parar.

Número de repeticiones que tendrá el gif antes de detenerse

Cómo guardar un gif animado en photoshop

Para terminar de hacer un gif animado en photoshop tenemos que guardarlo. Como su destino va a ser exclusivamente para web nos dirigimos a Archivo y pulsamos en Guardar para Web. Aquí tendremos que seleccionar “Gif” como archivo de salida y podremos ajustar otras opciones. Juega un poco con esto para lograr el efecto deseado. Pulsamos en “Guardar” y ya lo tenemos.

Panel de guardado para establecer las opciones finales de exportación del gif

Cómo hacer un gif en photoshop (videotutorial)

Si quieres ver el ejemplo en vivo de cómo hacer un gif animado en photoshop a partir de unos gráficos vectoriales, he creado un pequeño videotutorial. En él, a parte del proceso de creación de una imagen gif se muestra cómo he hecho el personaje del flan con illustrator. Es un timelapse cortito. Así, a parte de aprender cómo crear imágenes gif, podrás ver parte de mi proceso creativo.

Espero que te haya sido de utilidad este artículo. No olvides comentar, compartir y aprender.

Suscribirse

Subscríbete para estar al corriente de nuevos artículos.

Patrocíname en Patreon
Comparte esto
Publicado en Blog Ilustración
Beatrizxe

Me llamo Beatriz. Soy fundadora y autora de este blog. Me apasiona el mundo de la ilustración y el diseño gráfico y por eso decidí crear esta web. Así puedo conocer gente interesante y ayudar con mis conocimientos a todo aquel que lo desee.

Artículos relacionados