Informática, tecnología y mucho más
Estás en Informática-Hoy > Software Diseno Grafico >

Como hacer un GIF animado en Photoshop

Comentarios (0)

Photoshop es la herramienta preferida de cientos de miles de profesionales de la fotografía y del diseño gráfico alrededor del mundo, no sólo por ser el estándar para todo lo que tiene que ver con las artes gráficas y la fotografía, sino por ser el programa que mejores características y opciones ofrece.

Sin embargo, Photoshop no solamente es el preferido de los profesionales, sino también por usuarios que nada tienen que ver con estos ámbitos, pero que tienen necesidades gráficas puntuales. A pesar de que no es una herramienta sencilla de dominar, Photoshop también es el software al que recurren los usuarios amateur, debido principalmente a la inmensa cantidad de tutoriales que se encuentran disponibles en la red. Exactamente como este, en donde aprenderemos a crear un GIF animado con Photoshop.

hacer gif animado con photoshop

Como bien saben los diseñadores gráficos, la creación de un GIF animado no es una tarea precisamente excitante, pero que puede llegar a dejarnos algún dinero que sumar a la actividad principal, más aún si estamos comenzando a dar nuestros primeros pasos en el diseño.

Si ya somos diseñadores, este tutorial no contendrá demasiadas novedades, ya que está más enfocado en aquellos usuarios principiantes que tienen un sitio web personal o de un pequeño emprendimiento, y que no tienen ni el presupuesto ni el conocimiento para crear un banner del tipo GIF animado de aspecto profesional.


hacer gif animado con photoshop

Antes de comenzar, es necesario resaltar una regla general, que todo diseñador conoce: Lo más grande que se pueda dentro de los límites de espacio, y con el mayor atractivo posible. También es importante recordar no hacer un banner con más de tres diapositivas, ya que el espectador puede llegar a perder la atención muy rápidamente.
Una vez que tenemos aclarados estos conceptos, podemos pasar a hacer el GIF animado en Photoshop.

Creación de un GIF animado en Photoshop

- Configuración del documento

Paso 1

Una vez que hemos ejecutado Photoshop, lo primero que tenemos que hacer es desplazarnos hasta el menú de la aplicación y seleccionar “Archivo>Nuevo”.

Paso 2

En el cuadro de diálogo que aparece, pulsamos sobre el menú desplegable “Predefinir” y seleccionamos la opción “Web”.


hacer gif animado con photoshop

Paso 3

En este punto deberemos ajustar algunas variables como el tamaño, la resolución y demás. En el caso de que no estemos muy seguros de qué valores debemos modificar, lo mejor es dejarlo en los valores predefinidos.

El único valor que debemos modificar es el tamaño, para que se ajuste a nuestras necesidades de diseño. También en este punto es una buena ida comprobar en el menú “Vista” que todas las opciones del apartado “Ajustar a” se encuentren habilitadas.


hacer gif animado con photoshop

- Añadir los elementos gráficos para hacer el GIF animado

A partir de este punto, ya podremos comenzar a añadir los elementos que necesitaremos para realizar el GIF animado


Paso 1

En este caso, añadiremos tan sólo un logo y algún texto, con el propósito de hacerlo más sencillo y claro. Pero se pueden agregar tantas imágenes y textos como se crea conveniente.

Aquí debemos poner especial cuidado en nombrar a las capas de Photoshop con un nombre bien descriptivo, para no tener problemas cuando las tengamos que poner en orden.

hacer gif animado con photoshop

- Preparación de las diapositivas

Paso 1

Básicamente, podemos crear una diapositiva comenzando primero con el fondo, luego con los logos o imágenes y luego añadiendo el texto. Recordar que siempre debemos tener una capa por elemento que queremos mostrar en el resultado final.

Es decir, creamos el fondo y los elementos que permanecerán estáticos. Luego de ello, añadimos los elementos que variarán, como las imágenes y el texto. Una vez que estamos satisfechos con el resultado, comenzamos a combinar las capas que deseamos que permanezcan estáticas.

hacer gif animado con photoshop

- Creación del GIF animado

A partir de este punto, comenzaremos con la creación de la línea de tiempo del GIF animado. Para ello, seguimos las instrucciones que se detallan a continuación.


Paso 1

Una vez que tenemos los gráficos terminados, nos desplazamos hasta el menú de Photoshop y pulsamos sobre “Ventana”, donde seleccionaremos la opción “Línea de tiempo”. En este punto podremos observar que ha aparecido una nueva sección en la interfaz, ubicada en el borde inferior.


hacer gif animado con photoshop

Paso 2

En principio, debemos preparar la primera escena. Para ello, ocultamos todas las capas que no deban mostrar. Luego, pulsamos sobre el pequeño botón ubicado en el extremo derecho del panel de “Línea de tiempo”. Cabe destacar que podemos seleccionar el tiempo en que cada una de las imágenes o cuadros permanecerán visibles antes de dar paso al siguiente, lo que podemos hacer fácilmente pulsando sobre cada cuadro y seleccionando el tiempo que deseamos permanezcan en primer plano. Para terminar de crear la animación web, debemos repetir el mismo procedimiento para cada cuadro que deseamos incluir en la animación.


hacer gif animado con photoshop

Aquí es necesario hacer una pequeña aclaración con respecto a la velocidad a la que se reproducen los fotogramas. No deben ser extremadamente lentos, ya que se perderá la atención del espectador rápidamente, pero tampoco debe ser tan rápidos como para que no se pueda leer el mensaje que se quiere mostrar. Para hacer esto de la manera debida, lo mejor es ponernos en el papel del espectador y comprobar si ambos puntos son aceptables.

Lo único que resta a partir de este punto es guardar la animación en un formato que pueda ser incluido en otros proyectos y que también pueda ser reproducido en multitud de dispositivos sin que genere problemas de ningún tipo.

hacer gif animado con photoshop

- Guardar el GIF animado

El formato indicado para ello es el llamado GIF “Graphics Interchange Format”, también conocido como “Formato de Intercambio de Gráficos”. Para exportar nuestro trabajo a este formato, lo único que tenemos que hacer es desplazarnos hasta el menú de Photoshop, pulsar sobre “Archivo”, y finalmente sobre “Guardar para Web”.

En este punto, en la ventana que aparece, podremos seleccionar el tipo de archivo, en este caso GIF, en el menú desplegable y algunas opciones para conseguir el resultado deseado, como por ejemplo el tamaño y la calidad, parámetros que se pueden ajustar en el apartado “Tamaño de imagen”, ubicado en la parte inferior de la ventana.

hacer gif animado con photoshop

Ahora lo único que resta es presionar sobre el botón “Guardar” y seleccionar la ubicación de almacenamiento.

Para probar el resultado, podemos arrastrar nuestro GIF animado a la ventana de cualquier navegador web.


Si esta página te gustó, puedes compartirla ...


Seguramente esto te interesa
Programas para bajar musica gratis
Una seleccion de los mejores programas para bajar musica gratis. Descargas gratis de todos.
6 Simples consejos para navegar seguros
Cada dia que pasa aparecen nuevas y mas sofisticadas amenazas que impiden que podamos disfrutar por completo de nuestra navegacion por Internet phishing, robos de identidad, Tabnabbing y muchas otras estan agazapadas esperando a que demos un paso en falso. En este articulo conoceremos algunos consejos para mantenernos a salvo.
Cómo limpiar las pantallas touchscreen
Las pantallas touchscreen frecuentemente presentan suciedad y manchas de grasa, la limpieza tiene que hacerse con mayor frecuencia y muchas veces esa limpieza no es la correcta para este tipo de material. Es por eso que en este articulo te mostramos cuales son las mejores y mas seguras formas de mantener tus pantallas tactiles impecables y cuidadas siempre.
Tecnología VoIP: llamadas a muy bajo costo
Cuando se piensa en reducir costos, las tecnologias actualmente disponibles pueden ayudar a ahorrar en telecomunicaciones, y la tecnologia VoIP (Voz sobre IP) es una buena opcion para ello. Conoce como VoIP puede significar un importante ahorro para tu empresa u hogar.
Todo lo que hay que saber antes de comprar una netbook
Las netbooks invadieron la esfera de la informatica nomade y han seducido en pocos meses a muchos usuarios.

Nos interesa tu comentario.
Ingresa el texto que ves en la imagen de abajo.
  
Comentarios de los usuarios


No hay comentarios aún, puedes dejarnos el tuyo.


Registrate para recibir nuestros mejores contenidos en tu e-mail Como hacer un GIF animado en Photoshop
Instrucciones paso a paso para hacer un GIF animado con Photoshop