Cabezera para sitio web
Usted aprenderá a diseñar una cabezera para un sitio web profesional. Lo único que deberá hacer en este tutorial será dibujar los botones y la barra alpicándoles luego unos ((Layer Styles)) para lograr esta genial cabezera.
Abrimos un nuevo documento de 1000×250px con fondo negro.
((Crean una nueva capa)).
Con ((Rectangle Tool)) dibujen un rectángulo blanco como el que ven abajo.
Sobre esta capa hagan doble clic para aplicar ((Blending Options)).
((Gradient Overlay)). Para este degradado deben usar estos colores. #191919, #545454, #545454.
((Stroke)).
Nuestra botonera quedará así.
Crean otra ((New Layer)).
Con ((Rectangle Rounded Tool)) dibujen el botón que estará activo. Observen la siguiente imagen. Lo he rellenado de negro.
Ahora hagan doble clic sobre esta capa para aplicarle los siguientes ((Blending Options)).
((Inner Shadow)).
((Gradient Ovleray)). Para el degradado usamos los siguientes colores: #1eb400, #0cff00, #1eb400.
((Stroke)).
El botón activo quedará así.
Ahora crean otra ((New Layer)).
Le cambian el modo de capa a ((Overlay)).
Apreten Ctrl + Clic sobre la capa del botón para activar su selección, luego vuelven a pararse sobre la nueva capa.
Seleccionen ((Brush Tool)), Color frontal: Blanco, Tamaño de pincel: 81px.
Lo que van a hacer es aplicar un brillo extra sobre la parte inferior del botón activo. Vean el resultado en la siguiente imagen.
Deseleccionen (Ctrl + D).
Con la fuente Arial y color blanco como frontal escriben el texto del botón activo.
Parados encima de la capa de texto vayan al menu ((Layer))-((Layer Stlye))-((Drop Shadow)).
El título del botón activo quedará así.
Ahora vamos a crear los demás títulos de los botones.
Escriban los títulos usando como color frontal el #acaaaa.
Vuelvan a ((Layer))-((Layer Stlye))-((Drop Shadow)).
Crean otra ((New Layer)) y la colocan por debajo de todas las capas menos el fondo por supuesto.
Elijan el color blanco como frontal en la paleta de colores.
Seleccionen ((Rounded Rectangle Tool)) con un ((Radio)) de 10px y dibujen sobre la nueva capa un rectángulo como el que ven abajo.
Vamos a aplicarle ((Gradient Overlay)) así que hacemos doble clic sobre esta capa.
Los colores usados para este degradado son: #b1b1b1 y #ffffff.
Por último agregamos el nombre o logo de la página en el costado izquierdo. Observen el resultado final. Espero que les halla gustado.
