Showing posts with label separadora. Show all posts
Showing posts with label separadora. Show all posts

Hace tu barra animada con Photoshop

Hace tu barra animada con Photoshop

gif barra hacer photoshop animacion separadora



Paso a paso hace tu barra separadora



animada usando solo photoshop











Buenas, les voy a explicar paso a paso como lograr una barra como la de arriba!



1.Primero abrimos el photoshop y cramos un archivo de las siguientes caracteristicas:







2. Ahora, una vez creado el lienzo, extendemos un rectangulo de estilo web azul. Deben hacerlo de este estilo y este tipo de trazado:







3. Ahora tipeamos la T! de ! en un extremo de la barra, yo lo hice asi:







4. Ahora tipeamos nuestro nombre de usuario PERO cada letra en una capa diferente de texto! Asi:







5. Una vez que escribimos el nombre en distintas capas y lo alineamos bien debemos hacer lo siguiente: vamos a VENTANAS > ANIMACION, se nos abrira esta ventana, donde deberemos dejar la PRIMERA CAPA VACIA y luego agregar una capa por cada letra de nuestro nombre, asi:







6. Ahora nos paramos en la primera capa de la ventana de animacion y ocultamos TODAS las capas que contienen las letras de nuestro nombre clickeando en el ojito de al lado. Luego vamos a la segunda capa de la ventana de animacion y ahi "mostramos" la primera letra de nuestro nombre dandole click al ojito, en la tercera capa "mostramos" la primera y la segunda letra, en cuarta mostramos la 1,2 y 3ra letra, y asi sucesivamente hasta que en la ultima capa se vean TODAS las letras de nuestro nombre.



7. Ahora le damos play a la barrita de abajo de la ventana de animacion y veremos como van apareciendo las letras de acuerdo al orden que nosotros le dimos. El tiempo en el que aparecen las letras se puede ajustar, debajo de cada capa en la ventana de animacion pueden darle en tiempo deseado.





8. Finalmete para guardar nuestra barra y poder utilizarla en nuestros post debemos ir a ARCHIVO > GUARDAR PARA WEB Y DISPOSITIVOS, y corroboramos que lo guarde como GIF de esta manera:









Y LISTO! Espero que les guste y les sirva!




Les dejo la fuente de T!(Coupe-Bold) por si tambien quieren usar esa.


















Autor: DINNNNO
https://dibujosconanimacion.blogspot.com/
 

Rojadirecta