Animar letras en Photoshop

Nuevo tutorial de Photoshop. Hoy vamos a trabajar con Photoshop e Image Ready 3, uavertigo diseño graficon programa que viene en el mismo paquete que Photoshop y que permite la creación de secuencias, de gifs animados, presentaciones en flash para un banner (que veremos durante esta semana como se hacen), etc.. Lo que vamos a hacer es animar unas letras para que tengan vida.

Lo realizado para las letras puede ser utilizado perfectamente para la creación de banners. De hecho, miles de banners (gráficos de publicidad que se mueven) se realizan usando este sistema que voy a explicar a continuación.

1.- Primero creamos una nueva imagen. Usando la fuente Impacto, escribimos la palabra avertigo, o la que tu quieras, pero antes de eso crea un nuevo documento de este modo:



 

2.- Ahora vamos a aplicar los efectos que voy a colocar a continuación y que vamos a aplicar a la palabra avertigo que hemos escrito.Los estilos aplicados son los siguientes, vamos por orden. Para aplicar los estilos únicamente pincha en el botón con forma de “f” situado abajo a la izquierda de la siguiente imagen:



Estos son los estilos a aplicar:



letras animadas









4.- Ahora vamos a ver cual es el secreto de esta animación. Primero duplicar la capa que acabamos de crear de texto. Doble clic en la capa e ir a Superposición de motivo. Mantén esta ventana abierta e ir a la imagen y moverla horizontalmente hacia abajo, unos pocos pixeles. Darle a Aceptar, duplicar la capa recién creada y volver a hacer lo anterior hasta que tengamos 4 capas. Acuérdate de arrastrar con el ratón para mover el motivo. Ahora grabamos y vamos a pinchar en el botón de Image Ready situado en la parte inferior de la barra de herramientas.



5.- Tu animación se abrirá como una secuencia. Pulsar en el botón de nuevo secuencia para crear la segunda secuencia de nuestra “película”. Ahora es sencillo. Asi es como trabajar.

  • En la primera secuencia la capa primera queda visible, las otras 3 no.

  • En la segunda secuencia la capa dos queda visible, las otras 3 no.

  • En la tercera secuencia la capa tres queda visible, y las otras 3 no.

  • En la cuarta secuencia, sólo queda visible la cuarta capa.

A veces puede haber un pequeño problema a la hora de ver como queda. Recordemos que lo que hace Image Ready es crear una imagen tipo GIF, que permite animación. El problema es que a veces toma la imagen como JPEG y el formato JPEG no permite animación. Por ello hay que tener cuidado y fijarse que en el siguiente cuadro de diálogo está la opción GIF:



6.- Ya solo nos guardar nuestro trabajo. Tambien podemos pinchar en el icono de internet Explorer de la barra de herramientas y vemos como quedaría en el navegador. En el mismo navegador podemos guardar la imagen gif que aparece. Asi sería el resultado final:

 


Print   Email

Publish modules to the "offcanvs" position.