El otro día escribía un post sobre las userbars y un pequeño tutorial explicando como hacer una muy sencilla con Photoshop. Hoy os dejo otro tutorial explicando como darle un toque más “profesional” con un par de sencillos pasos. Vamos a jugar con el relleno con patrones para darles más vivacidad; para ello explicaré como crear y guardar un patrón y como rellenar una capa con el posteriormente.
Yo para las userbars suelo usar tres patrones básicos, uno rayado y dos con cuadrados. Cada uno le da un estilo distinto. Comencemos por establecer el patrón. Abrimos el Photoshop y creamos un nuevo documento de 4×4 píxeles con fondo transparente.
En la barra de herramientas, seleccionamos el lápiz, con tamaño de punta 1 y pintamos lo siguiente:
Ahora tenemos que guardarlo como patrón. Nos vamos al menú “Edición” (edit) y hacemos click en “Definir Patrón” (Define pattern). Ponemos el nombre que queramos y aceptar.
Nos vamos a nuestra userbar que ya tenemos hecha con fondo, logo, texto y brillo, y creamos una nueva capa. La posición de esta nueva capa depende de la userbar y del gusto de cada uno, esta vez vamos a ponerla por encima de todas las anteriores menos la de brillo. Hacemos click en rellenar: en la ventana que nos sale cambiamos color por patrón (pattern) y lo seccionamos de la lista que nos aparece.
Como veréis queda una cosa horrorosa. De nuevo tendremos que jugar con la opacidad de la capa (un 25% más o menos) para que el resultado sea este:
Seguro que tras leer esto se os ocurren muchas otras cosas que hacer para que nuestra userbar quede mejor. Yo os propongo un par de patrones más que a mi me gustan mucho.
El de cuadrados:
Resultado(en este caso el relleno lo hice por detrás del logo y el texto:
El de puntos: sería como el primero de rallas pero en vez de crear un documento de 4×4, haríamos lo mismo con uno de 2×2, generando un efecto de puntos.
Espero que os guste y os sirva de ayuda este “revival” de barras . En una tercera entrega subiré una colección de userbars/fanbars con productos y webs conocidas.
Saludos a todos los que me leen, pulsad F5!
Tweet
Descargar Userbars. dice:
febrero 15th, 2010 a las 17:49 pm
[…] añadiré algunas más. Si queréis alguna en concreto avisad y la hago. Recordad que tenéis el tutorial para diseñar fanbars con Photoshop en unos sencillos pasos. […]