InicioHazlo Tu MismoHacer Barras Separadoras

Hacer Barras Separadoras

Hazlo Tu Mismo9/21/2010
Primero y principal, conseguí alguna versión de Photoshop (Yo uso Photoshop CS4)...

1) Andá a Archivo (File), Nuevo (New) y creá un nuevo documento de 700 píxeles de Ancho (Width) por 50 píxeles de Alto (Height) y con Fondo (Background Contents) transparente:

2) En la barra de arriba de todo, andá a Ventana (Window) y seleccioná las opciones Color, Capas (Layers), Opciones (Options) y Herramientas (Tools), y acomodalas como más cómodo te parezca...

3) Busca la Barra de Herramientas:



Ahí seleccioná el ícono que tiene una forma geométrica, en caso de que no sea un Rectángulo Redondeado (Rounded Rectangle Tool), hacele click derecho y elegilo...

Busca esta barra:



Recomiendo poner todo como está en mi barra, pero cada uno puede poner lo que más le guste, eso sí, elegí el color que vas a usar para la barra...

4) Después de haber configurado todo como queríamos, atrastrá el Rectángulo Redondeado desde la punta superior izquierda de la pantalla, hasta la inferior izquierda (Vos elegís lo alta que la querés, pero tratá que queden por lo menos dos píxeles libre de ancho y alto porque es lo que se va a ver transparente en la Barra Separadora):



5) Ahora andá a Edición (Edit), y hacé click en Transformación Libre (Free Transform Path), y en la barra de arriba, en "X:" poné la anchura del documento (700 en este caso) dividido dos, o sea, 350 px; y en "Y:" poné la altura del documento (50 en este caso) dividido dos, o sea, 25 px, y hacé click en cualquier botón de la Barra de Herramientas, y en la nueva ventana que te aparece hacé click en Aplicar (Apply)...

Ahora que tenemos la Barra de Separación ubicado exactamente en el centro del documento...

6) Buscá la ventana de Capas (Layers):



Haz click derecho en el Nombre de la Capa, que puede ser Forma 1, o Shape 1 como en mi caso dependiendo del idioma de tu Photoshop, y hacé click en Rasterizar (Rasterize Layer), con esto la capa se va a transformar en una imagen común para Photoshop...

7) Se le pueden hacer miles de efectos, pueden ser Degradados de Colores, Bordes, Brillo, y muchísimas combinaciones más, pero en este caso le vamos a agregar un borde (Para distinguirlo del fondo de donde lo vamos a poner) y le vamos a hace un efecto tipo vidrio...

Asique hacé de nuevo click derecho en el Nombre de la Capa (Si querés cambiale el nombre haciendole doble click), y hacé click en Blending Options...

Te aparece una ventana así:




Andá a Borde (Stroke) y dejalo como está en la foto (En caso de que quieras cambiarle el color al borde lo podés elegir ahí mismo)...

8) Si te pasó como a mi que el borde se salió de la imágen, andá a Imagen (Image), Tamaño de Lienzo (Canvas Size), selecciona Píxeles en lugar de Centímetros y agregale 5 o 10 píxeles más de Alto y Ancho...

9) Para hacer el efecto vidrio, mantene Ctrl y hacele click a la imágen en miniatura de la capa (Está a la izquiera del nombre), en caso de que no esté, hacé click derecho en cualquier parte de la ventana de Capas (Layers) y clickeá en Small Thumbnails (No se como aparece en la versión en español, pero es la segunda opción)...

Con lo que hicimos recién, solo va a ser seleccionada la imágen de la barra, no el Borde que agregamos antes...

Ahora hacele click al siguiente botón:



Se va a crear una nueva capa, asique en la Barra de Herramientas buscá el botón de Herramienta de Degradado, en el mismo lugar que la barra del Rectángulo Redondeado va a aparecer esta barra:



Dejá todo como está en la imágen y hacele click al cuadro de colores (En mi imágen aparece de Blanco a Transparente, en la tuya lo más probable es que no pero hacele click igual)...

En la nueva ventana seleccioná la segunda opción de los Predeterminados (Presets), la que yo resalté en Rojo:




En caso de que el color que se ve no sea Blanco, hacé Doble Click en lo resaltado en Azúl y hacelos de color Blanco...

10) Si la capa de la barra no sigue seleccionada como antes, seleccionala con Ctrl como antes, una vez está seleccionada, seleccioná la capa vacía que creamos antes que tiene que estar arriba de la Barra...

Ahora, con la capa vacía seleccionada, seleccioná de nuevo la Herramienta de Degradado y, manteniendo Shift para que la línea sea totalmente recta, arrastrala desde el tope de el documento hasta un poco más de el final del documento, te queda algo así:



11) En la Barra de Herramientas, seleccioná la Goma (Eraser), buscá la barra de arriba y en Modo (Mode) ponele Block (La tercera opción), ahora la goma es un cuadrado blanco, teniendo todavía la selección que hiciste antes, apoyá el tope de la goma en la mitad de la Barra Separadora, mantené Shift, y arrastrala borrando la mitad de lo blanco de la capa (En caso de que con una pasada te quede más blanco abajo, borralo también), te queda algo así:



2) La Barra Separadora ya está lista, si le querés agregar letras, hacele click al botón de Texto (Horizontal Type Tool) en la Barra de Herramientas, y hacé click en la parte en la que querés escribir, se va a crear una nueva capa...

Seleccioná la Fuente, el Color, la Medida y escribí lo que quieras...

Poné la nueva capa lo que escribiste arriba de las otras y hacele click derecho, y andá a Blending Options...

Andá a Bisel y Relieve (Bevel and Emboss), seleccionalo y en Estilo (Style), seleccioná Pillow Emboss (La anteúltima opción)...

Esto va a hacer que parezca que el texto está incrustado en la Barra Separadora, si no seleccioná Stroke Emboss (La última opción), y agregale Borde (Stroke)...
Datos archivados del Taringa! original
100puntos
5,810visitas
29comentarios
Actividad nueva en Posteamelo
0puntos
0visitas
0comentarios
Dar puntos:

Posts Relacionados

Dejá tu comentario

0/2000
29 Comentarios archivados
Del Taringa! original
A@Anónimo8/28/2012+0-0
no se ven las imagenes
A@Anónimo2/28/2012+1-2
depaso mira la mia

A@Anónimo2/28/2012+0-0
gracias viejo te agradesco
A@Anónimo9/2/2011+0-0


eso serian imagenes GIF y esas no se hacen con el pscs5
A@Anónimo8/31/2011+0-0
oye men pero no puedeo hacer barras distintas osea esas q se mueven espero tu pregunta.
A@Anónimo8/23/2011+0-0
explica mejor loco
A@Anónimo7/18/2011+0-0
Esto me va a servir mucho , buen aporte, despues te dejo +3
A@Anónimo5/28/2011+0-0
grasias te mereces 10 me sirvio mucho pero solo tengo hoy + 9
A@Anónimo5/15/2011+0-0


se merece un 10 no hablen pavadas
A@Anónimo4/25/2011+2-2
mira la mia
A@Anónimo4/25/2011+0-0
te dejo mis 10 por que no tengo a quien mas
A@Anónimo4/2/2011+0-0
muchas gracias me sirvio
A@Anónimo3/7/2011+0-0


Conformate...tambien el post ni se merecia un +2 !!
A@Anónimo3/6/2011+0-0
como se llama el mono que tienes de imagen de avatar, lo he visto varias veses pero no se como se llama
A@Anónimo3/4/2011+0-0
buen tuto.
A@Anónimo3/2/2011+0-0
loco.. un hosting de imagenes estable hay? jajajajaja
A@Anónimo2/27/2011+0-0
aun no se usar el photoshop tengo el cs4 veo q ondaa
A@Anónimo2/22/2011+0-0
gracias a ti aprendi ya ahcer una barra separadora
A@Anónimo2/7/2011+0-0
Gracias! ¿Donde subes las barras?
Esque ya no sé donde subirlas $:.
Y otra duda: ¿Conoces algún Host de Imágenes, que suba más de 1 Img a la vez?, tipo Tinypic.
A@Anónimo2/6/2011+1-0
+5 muchas gracias
A@Anónimo1/20/2011+1-0
+10 Gracias x la barra my friend!!!!
A@Anónimo11/7/2010+1-0
no me sale pero buee nimporta
A@Anónimo11/7/2010+9-1

jajajajjaaaaaaa
A@Anónimo11/7/2010+9-1

jajajajjaaaaaaa
A@Anónimo11/7/2010+9-0


y dejas 2 puntos nada mas? miserable
A@Anónimo11/7/2010+9-0


y dejas 2 puntos nada mas? miserable
A@Anónimo11/6/2010+2-0

.PNG
A@Anónimo10/18/2010+1-0
yo quiero saber como haces para guardarla y que quede asi porque el la parte de la transparencia me sale el color de la barra no me sale
A@Anónimo9/21/2010+1-0
el mejor tuto para hacer barras que he visto,+2...

Autor del Post

c
chivas9908🇦🇷
Usuario
Puntos0
Posts6
Ver perfil →
PosteameloArchivo Histórico de Taringa! (2004-2017). Preservando la inteligencia colectiva de la internet hispanohablante.

CONTACTO

18 de Septiembre 455, Casilla 52

Chillán, Región de Ñuble, Chile

Solo correo postal

© 2026 Posteamelo.com. No afiliado con Taringa! ni sus sucesores.

Contenido preservado con fines históricos y culturales.