Hace tiempo no aparecía nuestro querido y siempre bien ponderado photoshop, asi que vamos a volver con algo de diseño web y enseñaremos a crear un menu con estilo “metalico”.

Para ver Como Lo Hago, vamos despues del salto.

Cómo hacer un menú metálico en Photoshop

¿Qué necesitamos?

– Photoshop, se utilizo CS4 en Español.

¿Cómo Lo Hago?

1.- Creamos un nuevo documento, de altura, aproximadamente 70 px y del ancho que ustedes estimen conveniente, en este caso lo hicimos para que cupieran 2 botones, pero lo puede hacer para mas o idealmente para uno, y luego solo copiar y cambiar el texto.

2.- Sobre este nuevo documento, con la herramienta Degradado con colores blanco y negro, crearemos un degrade con un estilo como este:

Ojo que para dar este estilo, en el menu de arriba, luego de elegir la herramienta Degradado, aparecen las opciones, esta, en CS4, es la cuarta opcion.

3.- Creamos una nueva capa (Menu Capa->Nueva->Nueva Capa) y en esta capa, creamos una seleccion del tamaño que queremos nuestro boton, asi:

4.- Con esta seleccion hecha, van a la pestaña Canales, que esta al lado de donde ven sus capas, aqui:

5.- En la ventana “Canales” crean un nuevo canal (con los botones de la parte inferior de la ventana) que por defecto se llamará “Alpha 1”, hecho esto vamos a pintar blanca nuestra seleccion (no la de futbol, la que hicimos para el boton)

6.- Una vez pintada blanca, vamos al menu Filtros -> Desenfocar ->Desenfoque Gaussiano y le damos el valro de 5px, quedará algo así:

7.-Vamos al menu Imagen->Ajustes->Niveles y los cofiguramos mas o menos así:

8.- Con esto hecho, vamos a seleccionar nuevamente lo pintado blanco (control+click sobre el canal Alpha, en CS4 el click debe ser sobre la imagen pequeña que sale en la capa) y volvemos a la pestaña Capas (paso 4).

9.-Estando en la pestaña Capas, crearemos una nueva capa, y en esta, nuevamente con la herramienta “Degradado” pintaremos crearemos un diseño, esta vez solo sobre la seleccion.

10.- Creamos otra capa (siempre con la seleccion hecha) y vamos al menu Seleccion->Modificar->Contraer y contraemos 1 o 2 pixeles depedendiento el tamaño de la seleccion.

11.-Como veran, ahora la parte seleccionada es mas pequeña y lo que haremos sera pintar, nuevamente con Degradado, sobre esta nueva seleccion con el color primario que ustedes quieran y con blanco como color de fondo.

12.- Ya se puede ver el efecto de profundidad en el boton, ahora vamos al menu Edicion->Contornear y damos los siguientes valores (aprox).

13.- Crearemos una nueva capa (si, ya parece cebolla) y con la tecla Alt presionada y la herramienta de seleccion, borramos la parte de abajo de esta, asi:

14.- Nuevamente contraeremos la seleccion 2 px y pintaremos, nuevamente con Degradado, esta vez con el color blanco como primario y de fondo, el que ustedes quieran, y pintaremos esta pequeña seleccion.

15.- Duplicaremos la ultima capa que creamos y pintamos, con esta seleccionada, vamos al menu Imagen->Transformar->Rotar 180°, y presionamos Control+D para deseleccionar. Veremos algo asi:

16.- Tenemos las 2 capas gemelas (la girada y la no girada) una encima de otra, asi que con la herarmienta mover, bajaremos la ultima capa suavemente, hasta conseguir algo asi:

17.- Ya estamos casi listos, nuestro menu esta listo, solo queda agregar otro boton si se desea y por supuesto, el texto de cada uno, ademas si quieren, pueden poner algun adorno adicional, como se vene la sigueinte imagen:

Como ven experimente con algunos colores para las letras y claramente en “Secciones” mi daltonismo extremo me jugo una mala pasada ;).

Con esto ya pueden crear su menu metalico,

Cualquer duda, dejen su comentario.

Por Ahora,

Me despido