Cuando estamos trabajando en un proyecto de diseño web, a menudo necesitamos iconos para mostrar comandos como agregar, eliminar o editar. Con la tendencia de la Web 2.0, el uso de insignias y 3D sutiles se ha vuelto muy popular. En este tutorial, te mostraré cómo crear un efecto 3D realmente fácil y agradable para usarlo en botones e íconos o elementos que necesitan cierta profundidad..
Cree un nuevo documento y seleccione la herramienta Elipse (U). No importa qué color use, ya que se reemplazará más adelante con los estilos de capa..
Haga doble clic en la capa de elipse para abrir el cuadro de diálogo Estilo de capa. Luego seleccione Superposición de degradado y use un azul y un tono más claro de azul para los colores de degradado. Para el estilo usa Radial. A continuación, agregue un bisel y relieve como se muestra a continuación.
Consejo: mueva el degradado radial más hacia la parte superior del círculo. Para hacerlo con el cuadro de diálogo Estilo de capa aún abierto, asegúrese de estar en la sección Superposición de degradado, haga clic y mantenga presionado el botón y comience a mover el degradado..
Duplique la capa de círculo y cambie su tamaño para hacerla un poco más pequeña, como la imagen de abajo.
Haga doble clic en la nueva capa para abrir el cuadro de diálogo Estilos de capa. Deseleccione todos los efectos anteriores (Bevel and Emboss y Gradient Overlay). Ahora seleccione Trazo y para el Tipo de relleno seleccione Degradado. Para los colores, seleccione blanco para ambos extremos del degradado y cambie la opacidad al 0% para el principio y al 100% para el final..
Seleccione la herramienta de tipo horizontal (T) y cree una capa de texto. Asegúrese de que esta capa está en la parte superior. Ahora abra el cuadro Estilos de capa y cambie la Superposición de color a blanco, seleccione Sombra interna y use la configuración que se muestra a continuación.
Agrupa las tres capas y llámalo "Círculo Azul".
Seleccione la herramienta Polígono (U) y cambie algunas configuraciones como se muestra a continuación para crear una insignia de estrella. Duplique la capa y cambie su tamaño como lo hicimos en el paso 3.
En lugar de aplicar esos estilos de capa a la capa, simplemente copie el estilo del ícono anterior que creamos y péguelo en nuestra nueva capa. Para hacerlo, seleccione la capa de la que desea copiar el estilo de capa, haga clic con el botón derecho del mouse (Macs: Opción-Clic) y elija Copiar estilo de capa. A continuación, seleccione la capa a la que desea agregar el estilo y haga clic con el botón derecho nuevamente y elija Pegar estilos de capa.
Lo único que tendrá que cambiar serán los colores degradados debajo de la Superposición de degradado.
Esta es una de las maneras más fáciles de crear un botón de estilo 3D genial. Puede cambiar algunas configuraciones como el color del degradado del trazo y crear diferentes estilos 3D.