21 Dic Cómo hacer un Gif animado en Photoshop
Un gif animado es un recurso que queda muy chulo en los blogs. Seguro que más de una vez has pensado que te gustaría tener uno, pero no sabes cómo hacerlo. A primera vista puede parecer algo muy complicado, pero crear un Gif animado básico es algo más sencillo de lo que piensas. Pero como en todo, si tienes maña y mucha paciencia, puedes llegar a crear auténticas obras de arte.
Gif es un formato de archivo que no pierde calidad para imágenes con hasta 256 colores. Una de las ventajas de este formato es su gran capacidad de compresión, que hace que los archivos pesen muy poco. Este formato es muy utilizado en publicidad y en diseño gráfico. En publicidadprincipalmente para realizar banners, y en diseño como recurso para mejorar la estética de webs y blogs. Hoy en día es un formato muy de moda debido al auge de las redes sociales. Algunas de ellas como Google Plus, Pinterest o Tumblr permiten la inserción de este tipo de animaciones.
Existen muchas herramientas para poder crear archivos Gif, algunas muy sencillas. Personalmente utilizo Photoshop ya que me ofrece muchas opciones para poder realizar este tipo de animaciones. Puede parecer complicado desde fuera, pero con este tutorial paso a paso verás que podrás hacer el tuyo sin tener que tener un gran conocimiento del programa.
8 razones para utilizar Gif animados:
- Una imagen vale más que mil palabras, con lo que una sucesión de ellas tiene muchísimo valor
- Son pura tendencia, si quieres estar a la última en diseño utiliza este recurso. Si quieres más consejos sobre cómo tener un blog atractivo, no te pierdas este otro post
- Son muy útiles para espacios publicitarios como banners, con el mismo espacio podrás ofrecer mucha más información
- Son perfectos para utilizarlos en clave de humor como chistes o viñetas
- Pueden ser una buena herramienta de Branding, te ayudarán a conectar con tus seguidores de una manera muy emocional
- Muchas de las redes sociales son compatibles con este formato, Twitter ha sido la última en aceptar los Gif animados. Tumblr es una de las redes en las que más se utiliza este formato
- Tienen un mayor impacto que las imágenes estáticas, por lo que son ideales para llamadas a la acción
- Puedes crearlos tú mismo, o descargarlos de bancos de imágenes. Aquí te dejo un listado con algunas de las mejores webs
Giphy / Gifmania / Picgifs / GifGif / Clipsartmania
Cómo realizar un Gif animado en Photoshop paso a paso:
Antes de nada, tienes que tener claro el proyecto que quieres realizar, puedes hacer un pequeño boceto. Para empezar, puedes crear algo sencillo pero vistoso. Yo he utilizado un estuche, unos bolis, unas tijera y una goma de borrar.
El archivo que vamos a crear está compuesto de una sucesión de imágenes seguidas, como cuando pasas muy rápido las fotos de la cámara y consigues que parezca que es un vídeo. Así que voy a ir paso a paso para enseñarte cómo he realizado este Gif.
1. Piensa qué es lo que quieres hacer y qué necesitas:
Prepara los materiales para que a la hora de hacer las fotos sea todo más rápido. Como fondo de las mismas puedes utilizar una mesa bonita, una tabla de madera, o cualquier textura que le pueda aportar un toque chulo a tus fotos. En mi caso tengo varios tableros de madera pintados, para esta animación he elegido el blanco. La idea es que los bolis, la tijera y la goma se muevan hasta meterse en el estuche. Así que simplemente tienes que hacer una foto por cada movimiento que quieras. Lo más difícil es que el movimiento sea limpio y no se noten cambios de posición en los elementos estáticos de una a otra imagen. Te recomiendo que utilices un trípode, de esta manera la cámara no se moverá y el resultado final será mucho mejor.
2. Prepara las imágenes:
Una vez hayas hecho las fotos, puedes pasarlas rápidas en el visor de la cámara para ver si el efecto del movimiento es el que estabas buscando. Si no fuese así, tendrás que repetir las fotos. No desesperes, es normal que las repitas varias veces, te lo digo por propia experiencia. Este paso puede que sea el más importante, si las fotos tienen un buen ritmo y no tienen mucho desfase entre una y otra, tienes ya la mitad del trabajo hecho.
Si vas a retocar las fotos, recuerda que tienen que tener todas el mismo tamaño y el mismo retoque. Si sueles usar Photoshop lo puedes hacer de una manera muy rápida si programas una acción con el retoque. Si no lo utilizas, no pasa nada, puedes hacer el escalado de una en una en el programa que suelas utilizar para editar imágenes.
En este tutorial he realizado 10 fotos, las he escalado a un tamaño de 711 x 400 px que es un ancho que se adapta bien a mi plantilla de WordPress. Una vez que las tengas todas, mételas en una carpeta para tenerlas localizadas.
3. Crea el archivo Gif en Photoshop:
Ya tenemos todo listo para meternos con la parte de Photoshop. Si lo manejas te resultará muy fácil, y sino, verás como es sencillo si sigues los pasos en este videotutorial.
Y ya tienes tu imagen animada. ¿A qué ha sido mucho más fácil de lo que pensabas?. Ahora sólo necesitas un poco imaginación para hacer tus propias creaciones. Si quisieras hacer un banner con texto, las capas del mismo funcionarían exactamente como las imágenes, aunque podrás jugar con las palabras si las colocas en diferentes capas.
¿Me recomiendas alguna otra manera de hacer un Gif animado?
Si te apetece ampliar este tutorial, escribe tus recomendaciones en los comentarios y, sobre todo, comparte este post en tus redes sociales si te ha parecido útil. ¡Ah! y no olvides suscribirte a mi canal de Youtube.
¡Un besico!
LeonorCanuelo
Posted at 16:58h, 21 diciembre¡Qué post más útil y bien explicado, Patricia! Me lo guardo para verlo más veces. Me encanta lo bien que lo explicas, ya tienes una nueva suscriptora a tu canal de Youtube! 😀
Kaori project
Posted at 17:38h, 21 diciembre¡Muchas gracias Leonor! Me alegra mucho que te haya sido útil y mil gracias por suscribirte a mi canal. Un besico enorme
Daniel
Posted at 19:05h, 13 eneroHola Patricia,
Muchas gracias por el tutorial. No tenia idea como hacer un gif en Photoshop. Me has dejado tarea para la casa 🙂
Un abrazo
Daniel
Kaori project
Posted at 10:02h, 14 eneroMuchas gracias por tu comentario David. Si lo haces de manera ordenada es sencillo. Si necesitas ayuda o te atascas en algún paso, mándame un email y te ayudo.
Un saludo y a por ese Gif
Carolina
Posted at 23:09h, 18 enero!Muy buen post! Bien explicado, voy a ponerlo en práctica 🙂
Kaori project
Posted at 12:50h, 19 eneroMuchas gracias por tu comentario Carolina. Me alegro mucho que te pueda servir este post.
Un besico
improvvisa
Posted at 00:24h, 20 enero¡Qué bueno! 🙂 Siempre me ha gustado mucho esto des los GIF pero nunca me he animado a intentar hacer uno, así que tomaré como referencia este tutorial, ¡qué es muy simple y detallado! ¡Gracias!
Kaori project
Posted at 11:33h, 20 enero¡Muchas gracias Leticia! Ya verás que es muy fácil hacer un giff y el resultado es muy chulo. Un besico
admin
Posted at 14:18h, 18 agosto¡Muchas gracias por tu comentario Sandra! Es muy fácil, seguro que te queda genial. Un besico
Pingback:Como usar Gifs en tu estrategia de Marketing – Vicente Cubedo
Posted at 08:26h, 29 noviembre[…] de Kaori Project, nos deja una entrada que vale su peso en oro: Como Hacer un Gif animado en Photoshop. En este post nos muestra como crear un Gif animado al más puro estilo Stop Motion (técnica de […]
admin
Posted at 08:39h, 09 febreroMil gracias Vicente, me alegro que te haya gustado el post, y sobre todo que te haya sido útil. Un besico muy gordo
Melissa Mendoza
Posted at 01:49h, 13 abrilBuenísimo este tutorial, entendible al 100% …. esta técnica solo es para blog o también se puede utilizar para FB ? … gracias saludos
admin
Posted at 09:45h, 01 febreroHola Melissa.
Puedes utilizarla en cualquier programa o red social que acepte el formato gif.
Muchas gracias por tus palabras.
Un besico
irene
Posted at 12:21h, 23 julioQue bien explicado ☺ muy útil, lo pondré en práctica. Muchas Gracias!!!
admin
Posted at 09:34h, 01 febreroMuchas gracias Irene, me alegro de que te haya sido útil.
Un besico