sábado, 20 de noviembre de 2010

Diseña tu propio banner con Photoshop

Os voy a explicar de manera rápida y resumida cómo diseñar vuestro propio banner con Photoshop. Un banner es un recuadro donde generalmente aparece un título, como el que tengo yo en este mismo blog arriba del todo. No voy a entrar en muchos detalles para no hacer complicada la faena, además yo no soy demasiado experto en Photoshop, pero sé lo suficiente como para hacer banners en 5 minutos y que queden bastante molones. Os voy a explicar cómo he hecho yo el mío.

Lo primero que tenéis que hacer una vez abierto el Photoshop es crear una nueva imagen (Archivo --> Nuevo) y en la ventanita que aparece, debéis especificar el tamaño que queráis que tenga el banner. Para títulos como el de una web, lo ideal es un ancho de entre 600 y 1000 pixels, y un alto de 100 o 200. En "contenido de fondo", poned "Transparente". El resto de opciones no hace falta hacerles mucho caso.

Ahora lo ideal es empezar por copiar cualquier fondo que encontrés en Google en vuestro recuadro. Para eso, buscad en imágenes de Google la palabra "fondo", "background", "wallpaper" o cosas por el estilo (y elegid tamaño grande), y encontraréis millones de fondos, y el que os guste pincháis en él y cuando lo veáis a tamaño completo copiáis la imagen (botón derecho sobre la imagen, y después "copiar imagen"). Volvemos a Photoshop, y pegamos la imagen sobre nuestro lienzo (Edición --> Pegar, o "control + V"). Ajustamos el fondo como queramos, teniendo en cuenta que nuestro banner es más pequeño, podemos mover o encoger la imagen de manera que en nuestra zona quede el trozo que más nos guste.



Una vez pegado el fondo, podemos añadir colores, difuminados o cualquier cosa que se nos ocurra. Para eso primero creamos una nueva capa (Capa --> Nueva capa) que quedará encima del fondo, y ahora trabajaremos sobre esta nueva capa vacía (aunque en principio se verá el fondo de la otra capa). En mi caso he usado la "herramienta de degradado", que aparece en el panel de botones de la izquierda (si no aparece entonces aparecerá el "bote de pintura", que ocupan el mismo botón, podéis elegir entre los dos), o simplemente pulsando la tecla "G". Con el degradado elegimos el efecto que queramos, los colores, etc. y nos vamos al lienzo, hacemos clic y arrastramos para que nos quede el degradado a nuestro gusto. Siempre podemos ajustarlo y arreglarlo tantas veces como queramos, al final el degradado sólo será uno. Veremos que el fondo ya no se ve, porque hemos puesto el degradado encima. Es entonces cuando tenemos ajustar su opacidad. Para ello, en el panel de capas (deberíamos ver dos capas) seleccionamos la capa 2 que es donde está el degradado, y ajustamos la barrita de opacidad, bajándola de manera que poco a poco se vea el fondo por debajo. Cuando lo tengamos como nos gusta, lo dejamos (una opacidad de entre el 30% y el 50% está bien).



Ahora sólo nos falta añadir el texto. Simplemente seleccionamos la herramienta de añadir texto (el típico botón con la letra "T") y escribimos lo que queramos en la zona que queramos. Os recomiendo una letra grande y clara, que se vea bien, ya que va a ser un título. También es aconsejable usar un tipo de letra poco habitual, que sea llamativa y que mole, siempre que sea legible. En internet podéis encontrar miles de fuentes tipográficas. Una vez puesto el texto como queramos, y con el color que queremos, podemos añadirle un borde, sombras, resplandor, texturas... Esto se consigue en el panel de capas, ya que el texto es otra capa. Hacemos doble click en su capa (pero no encima del texto que aparece en la capa, sino al lado) y aparecerá una ventanita con muchas opciones. Aquí podemos añadir todo lo que queramos. Esto sirve para cualquier capa a la que queramos añadir sombras, texturas, color de fondo o cualquier otra cosa, no sólo para el texto.



Por último, si queremos podemos añadir más efectos con la opción "Filtro --> Galería de filtros". Si tenemos seleccionado el texto que hemos escrito, nos pedirá rasterizarlo previamente. Esto significa que ahora el texto no será reconocido como texto, sino como imagen. Los filtros se pueden añadir a cualquier capa, o a toda la imagen global. Si queremos esto último, primero tenemos que combinar todas las capas con "Capa --> Combinar visibles", y ya podemos irnos a la galería de filtros y elegir el que más nos guste y ajustarlo como nos de la gana.



Una vez acabado nuestro diseño, lo guardamos en formato .jpg o .png y listo, ya tenemos un banner para colocar en nuestra página web o blog o donde sea. Esta mini-guía también es perfectamente válida para crear nuestros propios fondos de pantalla, siempre podemos elegir el tamaño que queramos de la imagen, elegir cualquier fondo (o diseñarlo nosotros si se nos da bien el Photoshop en esos temas), añadir todos los efectos, textos o imágenes por encima, y guardarlo. Siempre podemos añadir más y más capas para combinar imágenes o fondos y configurarlos a nuestro gusto. También os aconsejo que probéis de vez en cuando las herramientas de colorear, borrar, enfocar/desenfocar y demás, con la práctica conseguiréis buenos diseños "fotochoperos".

No hay comentarios:

Publicar un comentario