[PhotoShop] Crear gif animado v2

[R2]

Crear gif animados V.2

1.- Primero lo que necesitas es una secuencia de imágenes (hechas por ti o ya existentes) que caractericen el movimiento. Recuerda: es un gif por lo tanto cuida de hacer pocos cuadros o mejor aíºn de no hacer un movimiento complicado, no haremos una pelí­cula con esto, así­ que piensa en algo sencillo (también es importante por el peso final de tu gif animadoâ�Š de ser muy grande corres el riesgo de que tarde en cargar si lo requieres para web. El primer paso es tener la imagen inicial lista de tu gif abierta en el Photoshop.
Aquí­ puedes quitarle el fondo si deseas que tu gif sea transparente. Entonces cuando estés listo con todos los cuadros de tu gif guardados continuemos al siguiente paso.


2.- Verifica que tus imágenes estén en el modo RGB. Después debes ir al menúFile (Archivo) y buscar la opción Jump to (Ir aâ�Š). Ahí­ encontrarás el programa Adobe Image Ready (segíºn la versión de PPS con la que cuentes) Esta acción abrirá una nueva ventana aparte de la ventana de Photoshop con tu imagen inicial (como lo muestra la ilustración)


Una vez en el Image Ready comenzará lo laborioso, si no prestas atención a tu gif te confundirás un poco y seguramente te atorarás... así­ que procura seguir estos pasos cuidadosamente la primera vez para no perderte, cuando tengas dominado el arte de hacer gifs animados trata de innovar como tu gustes. En la ventana de Image Ready tienes ciertas caracteristicas del Photoshop para editar aíºn más tu imagen, como quitarle el fondo, pero no te recomiendo que le hagas muchos cambios aquíÂ

3.- A estas alturas del partido se supone que ya sabes perfectamente qué hará tu gif animado, así­ que con ese conocimiento procederemos a crear los cuadros que llevará. En la ventana Animation (Animación), que aparece debajo de tu dibujo, podrás introducir los frames (cuadros) que necesites. Haciendo click en el botón Duplicates Current Frame (Duplica cuadro actual) que tiene la forma de una hoja doblada.


En el caso de este ejemplo, el cabello de Mary simulara que se mueve con el viento, asi que solo necesito 3 cuadros más.


4.- Ahora con tus frames esperando para las siguientes imágenes, crearemos Layers (capas). En la ventana Layer (Capa) que aparece a la derecha de la pantalla crea el la misma cantidad de capas que de frames, porque aquí­ irán las otra imágenes que simularan el movimiento.



5.- Regresa a la ventana de Photoshop (sin cerrar la ventana del Image Ready) y abre los otros cuadros de tu gif animado. Cópialos y pégalos en los layers correspondientes cuidando que las imágenes queden perfectamente alineadas unas con otras, sino tu gif animado parecerá brincarâ�Š y no queremos eso! Notarás que la parte donde los cuadros son diferentes esta encimada, eso es porque falta amocodar los layer en sus frames correspondientes




6.- Como tenemos la misma cantidad de frames que de layers es muy fácil acomodarlos. Vayamos en orden: Para el 1Ã�° Frame necesitamos que el 1Ã�° layer se vea y nada mas, así­ que seleccionamos el 1Ã�° frame y el 1Ã�° layer, y escondemos los demás layers. Para el siguiente cuadro seleccionamos el 2Ã�° Frame y el 2Ã�° layer y escondemos el 1Ã�° layer, y así­ sucesivamente hasta que tengamos en cada frame el layer correspondiente.


Puedes verificar el movimiento de tu gif haciendo click en el botón Plays/Stops animation (Inicia/ Detiene animación) en la parte inferior de la ventana Animation.

7.- Primero agrega un nuevo layer, pero depende qué es lo que pondrás para la ubicación del layer. Como le voy a poner el nombre (texto) y quiero que aparezca durante toda la animación pondré el layer hasta arriba. Añado texto, lo modifico a mi antojo y lo acomodo en el lugar que lo quiero. Para que se vea durante toda la animación dejaré visible ese layer en cada frame.



8.- Una vez verificado que el gif se mueve correctamente y que tiene todos los elementos deseados, pasemos a guardarlo! En el menúFile (Archivo) selecciona la opción Save Optimized Asâ�Š (Salvar Optimizado Como). En la ventana de diálogo nombra tu gif, verifica que sea en formato .GIF y listo!!! Podrás ver tu gif animado en acción en el explorador o en cualquier aplicación que soporte las animaciones.

Nota importanti­sima: Antes de pasar tus imágenes al Image Ready cerciorare de que ese es el tamaño que deseas para tu gif final, porque si intentas cambiar el tamaño de tus imágenes en el Image Ready distorsionará tus imágenes y el gif brincará cuando esté animado.

Ver el ejemplo terminado y animado:








Publicado por: Bloody
en: http://www.elitefirmas.org