Foro de elhacker.net

---

En este tutorial voy a enseñar como hacer una userbar como esta:

(http://img102.imageshack.us/img102/5815/resultado7ps.jpg)


1- Abrimos un nuevo documento de 350*19, con fondo blanco

(http://img506.imageshack.us/img506/3425/13pt1.png)


2- Creamos un degradado que será el fondo de la userbar

(http://img155.imageshack.us/img155/192/25dp.png)


3- Ahora vamos a crear los scalines [lines diagonales que atraviesan nuestra userbar]

(http://img512.imageshack.us/img512/7048/34bv.png)


4- Una vez que estamos en el nuevo documento, le damos zoom al 1600%; y con el lapiz, [con un grosor de 1 pixel], trazamos una linea diagonal como ésta:

(http://img514.imageshack.us/img514/1512/44wt.png)


5- Ahora tenemos que definir el scaline, vamos a Edición->Definir Motivo.

6- Creamos una nueva capa: (http://img107.imageshack.us/img107/5465/52ub.png)


7- Rellenamos la capa con los scalines, Edición->Rellenar.

8- Una vez aplicados los scalines, vamos a cambiarle la opacidad entre 30% y 70%; depende de la claridad/oscuridad que le quieran dar a la userbar.

Con una opacidad del 30% quedaría así:

(http://img107.imageshack.us/img107/3783/62om.png)


Opcional: Este es un detalle que va por gusto propio.
Con la herramienta degradado en ésta forma: (http://img107.imageshack.us/img107/8085/75qi.png)
Voy a hacer un degradado de la izquierda a la derecha, ahora quedaría así:

(http://img107.imageshack.us/img107/5117/85ua.png)


9- Vamos a agregar una imagen relacionada con el tema de la userbar:

(http://img527.imageshack.us/img527/2252/98xu.png)


10- Agregamos el texto, preferiblemente usen fuentes bitmap [pueden descargarlas de http://www.dafont.com/bitmap ] Yo usé "VISITOR TT1 BRK" con un tamaño de 10 y color blanco.
Luego hacemos click derecho en la capa del texto, y vamos a:
Opciones de Fusion-> Trazo-> Tamaño: 1; Posición: Fuera; Opacidad: 100%

(http://img115.imageshack.us/img115/3151/101oj.png)


11- En una nueva capa vamos a hacer un degradado con el color frontal blanco y nuevamente en esta forma: (http://img128.imageshack.us/img128/5367/110qd.png)
De arriba hacia abajo, si piensan que les quedó muy claro pueden bajarle la opacidad, yo la dejé al 100%, nuestra userbar luce así:

(http://img128.imageshack.us/img128/6559/128xd.png)


Nota: Sin querer, cuando estaba explicando esta parte del tutorial desactivé la vision de la capa del texto y de la del paso Nº 11, ustedes no las desactiven.


12- Ahora viene una parte complicada de explicar, pero no de poner en practica.
Agarramos la pluma: (http://img123.imageshack.us/img123/4508/138ah.png)
Y con el color frontal en blanco trazamos 1 punto a cada lado del ancho de la userbar, y uno al medio, así:

(http://img123.imageshack.us/img123/8900/149su.png)


Ahora movemos el punto del medio hacia abajo, ésto se hace manteniendo presionado el CTRL.

(http://img519.imageshack.us/img519/4472/151im.png)


Ahora trazamos 2 puntos fuera de la userbar, así:

(http://img519.imageshack.us/img519/7522/163nd.png)


Vamos a Capa-> Rasterizar-> Capa. Y ponemos la opacidad de ésta capa en 20% (Si quieren darle mas opacidad pueden, personalmente lo prefiero así).

(http://img519.imageshack.us/img519/466/175we.png)


13- Para finalizar vamos a crear el borde.

Creamos una nueva capa - La seleccionamos presionando CTRL+A - Vamos a Edicion->Contornear.

Tamaño: 1 PX; Color: Negro; Posición: Dentro.

---

---

[/size][/size]
[/b]

Muy buen tutorial por princessa, jeje, estoy creando mis userbars, un salu2 a todos

PD: Es un tuto, creo que se deberia mover al foro Cursos y Documentacion

PD.2 : No cuestiono la labor de ningun moderador, solo lo recuerdo

salu2s a todos

Princesita creo que has puesto un tutorial repetidooo! Ya había uno hecho por nobalogic...  Y además creo que este está igual 10 posts mas abajo... jeje

Dejaré este post, pero como el tutorial ya existe, no figurará en el Directorio de Tutoriales para no poner contenidos repetidos.

Salu2

BUENO LA COPERACION ESTUBO DE BUENA INTENCION ;)