es.hideout-lastation.com
Paraíso Para Los Diseñadores Y Desarrolladores


Cómo dibujar el ícono de Apple iCloud - Tutorial de Photoshop

iCloud, el servicio de almacenamiento en la nube más nuevo presentado por Apple, tiene un logotipo bastante simple pero hermoso. El ícono está hecho de material metálico y tiene un ícono de una nube extruida encima. Puede que no lo sepas, pero crear este tipo de ícono es realmente muy fácil, y abajo está el icono de iCloud que te enseñaremos a dibujar en esta publicación, usando Photoshop.

Parece un poco complicado, pero de hecho todo lo que necesitamos es algunos estilos de capa, formas básicas de vectores y un poco de dibujo manual. ¡Vamos a entrar!

Paso 1

Comience por crear un nuevo archivo con un tamaño de 512 x 512 px. Activar la herramienta Rectángulo redondeado. En la barra de opciones, configure su radio a 75 px. Haga clic y arrastre para dibujar un rectángulo redondeado. Establezca su color a # 5d5d5d.

Haga doble clic en la capa para abrir el cuadro de diálogo Estilo de capa. Agregue Gradient Overlay con gradiente predeterminado, negro a blanco, y reduzca su Opacity al 76%.

Paso 2

Presione Ctrl + J para duplicar la forma de la capa. Haga clic en Editar> Transformación libre o presione Ctrl + T para realizar la transformación. Desde la barra de opciones, configure su tamaño en 98%.

En el panel Capas, elimine Estilo de capa arrastrando el ícono de fx al icono de papelera, que se encuentra en la parte inferior derecha del panel Capas. A continuación, haga doble clic en la miniatura de las capas para mostrar el cuadro de diálogo Estilo de capa. Añade sombra interna y superposición de degradado.

En la configuración de Superposición de degradado, configure Estilo de degradado en Ángulo. Haga clic en el cuadro de vista previa del degradado para abrir el editor de degradado y use la combinación de colores # 8e8e8e, # a5a4a4 y # d8d8d8. Siéntete libre de jugar con cada posición del marcador, solo asegúrate de establecer el mismo color en el primer y el último marcador.

Este es el resultado después de agregar estilos de capa.

Paso 3

Crear nueva capa. Rellene con degradado radial de blanco a negro.

Mantenga presionada la tecla Alt y arrastre la máscara vectorial de la capa anterior a la capa actual. El degradado ahora cabe dentro del ícono.

Abra el Estilo de capa y cambie su modo de fusión a Pantalla.

Etapa 4

Dibuja un rectángulo redondeado dentro del ícono. Establezca su radio a 75px con color # 2a2a2a.

Agregue 2 formas de círculos más (elija la herramienta Elipse, luego mantenga presionada la tecla Mayús y arrástrela). Desde la barra de opciones, configure el modo de ruta a Agregar al área de forma.

Haga doble clic en la capa de la nube y luego agregue Inner Shadow, Bevel and Emboss, y Stroke.

Paso 5

Duplicar la capa de la nube presionando Ctrl + J. Eliminar su estilo de capa arrastrando el ícono de fx desde la miniatura de su capa al ícono de la papelera. Cambiar el tamaño de la misma (Ctrl + T) al 89%.

Cambie el color de la forma a # 5d5d5d. Reordenar la posición de cada forma hasta que el tamaño de la nube pequeña sea proporcional a la nube más grande.

Haga doble clic en la capa de la nube y agregue los siguientes estilos de capa.

Para Superposición de degradado, asegúrese de usar la configuración exacta de Superposición de degradado en el Paso 2.

Esto es lo que tenemos después de agregar estilos de capa a la nube pequeña.

Paso 6: agregar textura de metal

El diseño actual es muy plano y muy limpio. Agreguemos una sutil textura de metal en la superficie. Crear nueva capa. Haga clic en Editar> Rellenar y seleccione Usar: Negro para rellenar la nueva capa con negro.

Haga clic en Filtro> Ruido> Agregar ruido.

Haga clic en Filtro> Desenfocar> Desenfoque radial. Seleccione el método de desenfoque: giro y calidad: mejor.

Este filtro hará girar el ruido y creará una onda circular.

Paso 7

Haga clic en Imagen> Ajustes> Nivel o presione Ctrl + L. En el cuadro de diálogo, arrastre el deslizador negro en los Niveles de salida hacia el centro para aclarar la onda circular.

Mantenga presionada la tecla Alt y arrastre la máscara vectorial desde la capa base del icono hasta la capa actual. La onda circular ahora está dentro del ícono.

Active la herramienta Selección de ruta y seleccione la ruta de la nube que creamos en el Paso 4. Presione Ctrl + C para guardarla en el portapapeles. Presiona Ctrl + V para pegarlo en la máscara vectorial de la onda circular. Establezca su modo de camino a Restar.

Finalmente, copie y pegue la ruta de la nube más pequeña que hemos creado en el Paso 5. Establezca su modo de ruta a Agregar a la forma.

Este es el resultado. La onda circular está dentro de la superficie del icono.

Cambia el modo de fusión de la capa a la pantalla.

Paso 8: Sombra

Crea una nueva capa y coloca detrás de todas las capas. Crea una selección elíptica (usando la herramienta elipse) debajo del ícono. Completa la selección con negro.

Suaviza la sombra usando el filtro, Gaussian Blur. Haga clic en Filtro> Desenfocar> Desenfoque gaussiano.

Duplique la sombra presionando Ctrl + J. Agregue otra falta de definición de Gaussian, para esta vez utilice Radius más grande para obtener una sombra más suave. Si la sombra es demasiado dura, puedes rechazar la Opacidad de su capa.

Resultado final

Este es el resultado de nuestro tutorial. Como puede ver, el proceso de creación de este ícono es muy fácil. Solo necesitamos usar algunas formas básicas de vectores y estilos de capas. Espero que disfruten de este tutorial. ¡Si usted tiene alguna pregunta no dude en preguntar!

Descargar PSD

No se puede lograr cierto paso? Aquí está el archivo PSD del resultado para que lo pruebes y juegues.

  • iCloud Icon Tutorial PSD File

Genere códigos incrustados receptivos fácilmente con esta aplicación gratuita

Genere códigos incrustados receptivos fácilmente con esta aplicación gratuita

Cada diseñador web sabe cómo incrustar videos . Incrustar es la forma más fácil de compartir contenido y mejorar sus artículos con los medios relevantes.Sin embargo, existe un problema con iframes y otras incrustaciones de video similares: la falta de soluciones receptivas . Todos los sitios modernos responden completamente y un video fijo realmente puede romper ese flujo en los dispositivos móviles.Para

(Consejos de tecnología y diseño)

10 dispositivos de seguimiento Bluetooth para mantener sus pertenencias seguras

10 dispositivos de seguimiento Bluetooth para mantener sus pertenencias seguras

La diferencia entre extraviar su teléfono y sus llaves / billeteras / control remoto es que solo puede llamar a su teléfono y seguir el tono de llamada para localizarlo. También hay aplicaciones que te permiten encontrar tu dispositivo si se pierde en un lugar público.Sin embargo, para los otros artículos, es probable que necesite limpiar su habitación o su casa para encontrarlos, o prepare un lugar designado para dejar sus artículos esenciales para que pueda encontrarlos fácilmente antes de salir de la casa. De for

(Consejos de tecnología y diseño)