Botón Simple con Photoshop

Uno de los elementos que todo sitio web necesita, son los botones. Con ellos podemos hacer links, mostrar mensajes, adornar un rincón solitario y mucho más. El botón que explica este tutorial es muy sencillo de realizar, desde Photoshop 4 en adelante, y aunque en el ejemplo se ha usado un óvalo, también podría haberse hecho sobre un cículo o cualquier figura de bordes redondeados.

1.Comenzamos creando un nuevo documento (CTRL+N) de 150x100 pixels. Elegimos el color 161,161,161 de frente y presionamos ALT+Backspace para llenar el fondo.
Creamos un nuevo layer (SHIFT+CTRL+N) y con la herramienta de Selección Circular, creamos un óvalo. Lo llenamos con el color 131,131,131. A este layer lo llamaremos "original".

2.Sin deseleccionar, creamos un nuevo Layer, vamos a Select>Feather y suavizamos 4 pixels. Luego contraemos la selección (Select>Modify>Contract) otros 4 pixels. Invertimos la selección (SHIFT+CTRL+I) y la llenamos con color Negro (D y luego Shift+F5).
Hacemos CTRL+Click en el layer original para obtener su selección, invertimos y borramos (Delete). Luego, bajamos la transparencia de este layer a un 70%.

3.Creamos un layer y cargamos la selección haciendo CTRL+Click en el layer original. Movemos la selección con las flechas 10 pixels hacia abajo y 10 hacia la derecha e invertimos la selección.
Mientras mantenemos presionadas las teclas SHIFT+CTRL+ALT, hacemos click en el Layer original.
Nos quedará la intersección, luego contraemos la selección (Select>Modify>Contract) 4 pixels y vamos a Select>Feather con un valor de 2 pixels. Finalmente, llenamos lo que nos queda con el color Blanco.

4.Creamos otro layer, presionamos D y luego vamos a Filter>Render>Clouds. Luego vamos a Filter>Render>Difference Clouds. Cambiamos el modo de este Layer de Normal a Color Dodge.
Cargamos la selección del layer original como ya hicimos, invertimos la selección y borramos lo que sobra.

5.Finalmente, nos paramos sobre el layer original, cargamos su selección una vez más, elegimos el color Blanco como color de frente y vamos a Edit>Stroke. Usamos 2 pixels y la opción "outside".
Presionamos CTRL+U para modificar el Hue/Saturation, marcamos la casilla que dice Colorize y en el valor de Hue, ingresamos por ejemplo, el valor 218.

Extras.Agregándole una sombra y utilizando unos trucos simples, se pueden obtener resultados realmente buenos a la vista.

Buscar en...

Ver tambi?...

Recomendamos

Hoy-Vendo.com.ar
ZonaPHP.com
ForoWebmasters.com.ar
MaestrosDelWeb.com