Ayuda para tu web

crear banner con photoshop

Crear banner con photoshop

Este tutorial es para aquellos que tienen una idea de como se utiliza el Adobe Photoshop. Si tienen alguna duda, no dude en consultarme. Ahora, manos a la obra...

Empezaremos realizando lo siguiente :

1 - En este caso vamos a crear un banner en la medida de 468x60 pixeles, es bueno recordar que se recomienda que nuestro gráfico no supere los 15 Kb de peso ya que si no no podremos inscribirnos en ningún programa de intercambio

Hacemos Click en Archivo Nuevo o Ctrl+N

En la pantalla que veremos debemos colocar los siguientes valores :

Anchura = 468 - Seleccionar Pixeles
Altura = 60 - Seleccionar Pixeles
Resolución = 28,346 Pixeles/cm - Dejar el valor por defecto
Modo = Color RGB
Contenido = Blanco

Al hacer click en Ok ya tendremos el área en la cual realizaremos nuestro banner 2 - En este caso utilizaremos un solo color de base, entonces seleccionaremos un color para pintar el fondo veremos que en la barra de la izquierda tendremos la herramienta : - Bote de Pintura ( G ) Pintamos el área de trabajo y ya podremos escribir el texto para el primer cuadro.

Guardamos el gráfico haciendo click en : Archivo - Guardar para la web... Debemos tratar que el grafico no sea demasiado pesado y que a la vez se vea bien, ya que la suma de todos los cuadros harán que nuestro banner sea muy pesado. Podremos probar con distintos valores de colores y distinto formato ( Gif o Jpg )

Guardamos nuestro gráfico.- 3 - Para crear una transición entre los cuadro que componen nuestro banner crearemos un efecto de movimiento. Hacemos click en Filtro - Desenfocar - Desenfoque de movimiento.... Veremos dos opciones : Angulo = 0 Distancia = 16 pixeles ( a mayor números de pixeles mas borrosa será la imagen )

Volvemos a guardar el gráfico.- 4 - Para volver a utilizar el gráfico sin tener que hacerlo nuevamente, debemos hacer lo siguiente : Hacer click en - Ventana - Mostrar Historia - En la barra veremos que la ultima acción es la Desenfoque de movimiento.... al hacer click en la acción anterior el gráfico se vera como si nada hubiese pasado.

5 - Escribiremos el texto de cada uno de los cuadros para nuestro banner y los guardamos. 6 - Realizar siempre los cuadros con el mismo color de fondo para hacerlo mas atractivo. No olvidarse de realizar el efecto de movimiento para la transición de cada uno de los cuadros.- 7 - Solo nos resta utilizar el programa Image Ready ( entre otros ) para darle "vida" a nuestro banner, eso queda para el proximo tutorial. 8 - Este es el trabajo terminado.

Este es solo uno de los efectos que se pueden realizar con Adobe Photoshop, solo debemos utilizar nuestra imaginación para darle mas vida a nuestro banner, cambiando el fondo, agregando efectos al texto y mucho mas...

Espero que les sirva XD
Volver a tutoriales