Share
En este tutorial, te mostraré algunas técnicas muy sencillas, usando gradientes y estilos de capa, que podemos usar para producir bonitos efectos 3D en nuestros diseños web..
Crear un nuevo documento con 1000x750px. Haga doble clic en la capa de fondo y en Superposición de color y elige un marron oscuro.
Habilite las reglas (Ver> Reglas) en su documento y agregue algunas guías como se muestra a continuación. Crea 2 guías horizontales, la primera en 30px y el segundo en 250px. Después de eso agregue 2 guías verticales en 100px y 900px.
Crea un rectángulo con el Herramienta Rectangular (U). Utilice las guías de referencia. Renombrar la capa a ¿¿encabezamiento??.
Escoger negro por su color de primer plano Selecciona el Herramienta elipse y crea la forma que será la sombra. Hazlo un poco más alto que el rectángulo blanco como se muestra. Renombrar la capa a sombra y ponerlo debajo de la encabezamiento capa.
Después de eso, convertirlo a Filtros inteligentes, aplicar un Desenfoque gaussiano y cambiar la opacidad al 60%..
Con el encabezamiento capa seleccionada, haga doble clic para abrir la Estilo de capa caja de diálogo. Seleccionar Gradiente de superposición. Cambia el estilo del degradado a radial. Para los colores utilicé rojos oscuros..
A continuación, seleccione la Herramienta de Línea (U) y elija el color más claro del gradiente del encabezado y cree una línea. Después de eso, elija negro y cree otra línea solo 1 píxel por encima de la línea roja. Selecciona las 2 líneas y agrúpalas. Cambie el nombre del grupo por "vDivider ".
Ir Capa> Máscara de capa> Revelar todo. Utilizando la Herramienta gradiente, seleccione un degradado radial de negro a blanco y aplique una máscara a nuestro grupo. Comienza el gradiente desde el centro del grupo..
Crea el menú usando el Herramienta de tipo horizontal (T). Usa blanco para el color del texto. Selecciona todos los enlaces y agrúpalos. Renombrar el grupo Enlaces Blancos ??.
Duplique el grupo y colóquelo debajo de los enlaces blancos, cambie el color del texto a negro y mueva el grupo 1 píxel hacia arriba y hacia la izquierda. Eso creará un bonito efecto 3D, exactamente como el que hicimos con las líneas..
Repite el Paso 6, Pero esta vez crea los divisores horizontales para los enlaces. Utilice la herramienta de línea para dibujar una línea roja y 1 píxeles a la izquierda dibujar una línea negra. Agrupa y duplica el grupo 5 veces. Distribuye los grupos como se muestra abajo..
Selecciona todos los grupos de líneas y agrúpalos. Renombrar el grupo aDivisores ??. Después de eso aplicar una máscara de capa., Capa> Máscara de capa> Revelar todo. Pero esta vez usa Linear..
Abra el archivo de patrones, u obtenga el patrón que desee. Selecciona todo y ve a Edita> Define Patrón. Llámalo patrón web.
Duplicar el capa de encabezado? y renombrarlo a modelo. Ir a sus estilos de capa y deshabilitar la superposición de degradado y establecer un Patrón de superposición. Elija el 'webPattern' que creamos y cambie el Modo de mezcla para superposición de color.
Después de eso, aplique una máscara de capa a la capa de patrón usando una Gradiente radial.
Ahora podemos añadir el logo y la cuchara..
Para el texto, escriba Psdtuts +, seleccione un tipo de letra en negrita para el PSD y una regular o light para el TUTS. Ir a los estilos de capa y aplicar una Sombra, Superposición de degradado y Trazo. Ese es un efecto muy común y hermoso..
Cuando trabajamos con diseño web, tenemos que considerar el tamaño de los archivos, las compatibilidades del navegador y muchos otros problemas. A veces, pequeños detalles como gradientes sutiles o bordes que usan 2 colores pueden crear un efecto visual muy agradable o un estilo único sin requerir muchos cortes ni ajustes.
Accentsconagua