Unlimited PS Actions, graphics, videos & courses! Unlimited asset downloads! From $16.50/m
  1. Design & Illustration
  2. Tools & Tips

Consejo rápido: Cómo crear un conjunto de iconos grunge escalables

by
Read Time:7 minsLanguages:

Spanish (Español) translation by Rosario (you can also view the original English article)

Sigue este consejo rápido y aprende a crear un conjunto de iconos grunge. Utilizaremos un montón de Pinceles de arte y con la ayuda del panel Buscatrazos crearemos la forma grunge. Para acentuar el aspecto grunge utilizaremos el efecto Cristal (Esmerilado) junto con otras apariencias.


Paso 1

Primero abre un nuevo documento web. Usa la herramienta Rectángulo (M) para dibujar un cuadrado de 90x90 px y dale cualquier color de relleno. Cópialo y Pégalo delante, borra el color de relleno existente y dale solo un Trazo de 1 pt. A continuación, toma la herramienta Tijeras (C) y haz clic en los cuatro puntos de los vértices del trazado negro para cortar el cuadrado en segmentos. He coloreado los cuatro trazados resultantes de forma diferente para que puedas verlos mejor.


Paso 2

Selecciona el trazado rosa y trázalo con el pincel Artístico llamado Carboncillo-Grueso que puedes encontrar en el menú Biblioteca de pinceles en Artístico > Artístico_LápizTizaCarboncillo. Utiliza el mismo pincel para trazar el trazado azul. Pasamos al trazado naranja y lo trazamos con el pincel Tiza-Garabato de la misma categoría. Para el trazado verde he utilizado el pincel Seco 8 que se encuentra en Artístico >Artístico_Pincel. El Grosor del trazo es de 1 pt para todos ellos. Puedes elegir otros pinceles de la biblioteca si quieres, aquí no hay ninguna regla. Yo he probado varios y luego he utilizado los que me han gustado.

También puedes voltearlos abriendo la ventana de Opciones de trazo del panel Apariencia y marcando las opciones Voltear a lo largo o Voltear a través.


Paso 3

Copia y Pega delante del trazado de la izquierda y elimina el trazo del pincel existente. Selecciona blanco como color de trazo y luego abre el menú Biblioteca de pinceles y navega a Artístico >Artístico_Tinta. Aquí encontrarás un Pincel de arte llamado Galaxia, úsalo para trazar este trazado (1). Copia y Pega delante el trazado inferior y utiliza "Fire Ash" (Ceniza de fuego) para trazarlo (2), que puedes encontrar en la misma categoría. El Grosor de trazo para estos dos trazados es de 1 pt.

Copia y Pega delante, de nuevo, el trazado inferior y trázalo con el pincel Seco 2 que puedes encontrar en Artístico >Artístico_LápizTizaCarboncillo. Cambia el Grosor del trazo para este trazado a 0.5 pt (3).

Luego, toma la herramienta Pluma (P) y dibuja un trazado sobre el vértice superior derecho del cuadrado como se muestra en la imagen de abajo. Trázalo con un Pincel artístico llamado Tiza que puedes encontrar en Artístico > Artístico_LápizTizaCarboncillo y cambia el Grosor del trazo a 2 pt.


Paso 4

Oculta todas los trazos blancos, y céntrate en los primeros trazos de pincel (paso 2). Selecciona los cuatro y en el menú Objeto elige Expandir apariencia. Selecciona todas las formas rosas resultantes, también el cuadrado y haz clic en Añadir al área de formas >Expandir del panel Buscatrazos. Obtendrás el trazado compuesto grunge que se muestra en la primera parte de la imagen de abajo.

Ahora, haz que todos los trazos de pincel blanco sean visibles de nuevo. Selecciona los cuatro y luego en el menú Objeto elige Expandir apariencia y en el panel Buscatrazos elige Añadir al área de forma > Expandir. Como resultado de estas acciones obtendrás un trazado compuesto complejo como el que se muestra en la segunda parte de la imagen. Selecciona ambos trazados compuestos (éste y el verde) y haz clic en Restar de área de forma > Expandir del panel Buscatrazos. La forma grunge que necesitas para crear estos iconos está lista.


Paso 5

Rellena la forma grunge obtenida con el degradado radial mostrado y luego ve al panel Apariencia, abre el menú desplegable y elige Añadir nuevo relleno. Cambia el degradado por el segundo degradado mostrado en el ejemplo de abajo, que tiene los mismos colores sólo que están invertidos. Teniendo este segundo relleno seleccionado en el panel Apariencia, ve al menú Efecto > Trazado > Desplazamiento y aplica un valor de Desplazamiento de -2 px.

Con el segundo relleno aún seleccionado, ve al menú Efecto >Distorsionar y aplica el efecto Cristal. Establece los valores mostrados y como textura elige Esmerilado. A continuación, ve al menú Efecto > Estilizar y aplica el efecto Desvanecer, luego cambia el Modo de fusión a Luz suave.


Paso 6

Continuemos con los símbolos. Todos los símbolos que he utilizado se pueden encontrar en el menú Biblioteca de símbolos en las categorías escritas al lado de cada uno. Encuéntralos, arrástralos todos a tu área de trabajo y pulsa el botón Romper enlace a símbolo en el panel Símbolos.


Paso 7

Enfócate en el símbolo Casa. Después de pulsar el botón Romper enlace a símbolo ve al menú Objeto y selecciona Desagrupar dos veces. Como resultado obtendrás tres formas, la casa y las dos ventanas. Selecciónalas todos y haz clic en Restar de área de forma > Expandir del panel Buscatrazos para obtener un único trazado compuesto.

Pasa al símbolo de Compras. Selecciona Expandir en el menú Objeto para transformar los trazos en rellenos y luego Desagrúpalo tres veces. Ahora selecciona todas las formas que componen la cesta de compras y haz clic en Añadir a área de forma >Expandir para obtener una única forma.

Continúa con el símbolo de Búsqueda. Selecciona Expandir apariencia en el menú Objeto y luego Expandir para transformar todos los trazos en rellenos. Desagrupa dos veces y luego selecciona todas las formas que componen este símbolo y haz clic en Añadir a área de forma > Expandir para unirlas todas.


Paso 8

Selecciona el símbolo Arroba y primero elimina el efecto 3D del panel Apariencia. Expándelo y Desagrúpalo dos veces. En el caso del símbolo Globo de conversación, basta con desagruparlo dos veces para que se elimine el efecto 3D.


Paso 9

Desagrupa el símbolo de Contactos y elimina el rectángulo redondeado gris. Selecciona todas las formas y haz clic en Añadir a área de forma > Expandir para obtener un único trazado compuesto.

Continúa con el símbolo de Correo y Desagrúpalo tres veces. Elimina todas las formas blancas y luego selecciona todos los trazos negros y expándelos. Ahora, selecciona todo y haz clic en Añadir a área de forma >Expandir del panel Buscatrazos.

Desagrupa el símbolo de Teléfono dos veces y luego selecciona el rectángulo redondeado y borra el relleno negro. Dale un Trazo negro de 1 punto y luego ve al menú Objeto y Expándelo. Selecciona todas las formas que componen el símbolo y haz clic en Añadir a área de forma > Expandir para unirlas.


Paso 10

Aquí están todos los símbolos obtenidos hasta ahora. Tienen diferentes tamaños, así que escálalos hasta que todos tengan más o menos el mismo tamaño. Los demás símbolos que he utilizado se han obtenido igual que los otros. El objetivo es obtener del conjunto de formas que componen cada símbolo un único trazado.


Paso 11

Vuelve a la forma del icono grunge y pon el símbolo de la casa obtenido en el paso 7 en el centro. Rellénalo de blanco y luego ve al panel Apariencia, abre el menú desplegable y elige Añadir nuevo relleno. Cambia el color de relleno a gris y luego ve al menú Efecto > Desenfocar y aplica un Desenfoque gaussiano de 3 px. De esta manera obtendrás una sombra discreta alrededor del símbolo.

A continuación, toma la herramienta Texto (T) y escribe "Home" utilizando una fuente llamada Cataclysmic que funciona perfectamente en este caso. Puedes encontrarla aquí. El primer icono grunge está listo y puedes usarlo para crear los demás.

Duplica la forma del icono grunge y simplemente cambia los dos degradados radiales por los que se muestran. Coloca el símbolo Arroba encima, rellénalo de blanco y crea una discreta sombra alrededor como se muestra arriba. Escribe "Address" utilizando la misma fuente.

Haz los mismos cambios para crear el icono de Compra...

...y para el icono de Búsqueda:


Paso 12

Aquí están los cuatro iconos grunge hechos hasta ahora. Si quieres escalarlos, asegúrate de seleccionar Expandir apariencia en la forma grunge y así expandir todos los efectos aplicados. Lo mismo ocurre con los símbolos para expandir el efecto de Desenfoque gaussiano. Además del relleno blanco, el texto también tiene un Trazo blanco de 0,5 pt y para hacerlo un poco más grueso, es necesario expandirlo dos veces. Ya están todos listos para ser escalados.


Paso 13

Si quieres crear el resto de los iconos igual que en la imagen final, aquí tienes los dos degradados radiales que he utilizado para cada uno de ellos. Cámbialos, luego coloca el símbolo y escribe el texto.

Estos son los otros dos iconos:


Paso 14

Las posibilidades son infinitas. En este conjunto también hice un icono de Documentos, Moda, Configuración y un icono del Clima utilizando el resto de los símbolos mostrados en el paso 6. Puedes elegir cualquier tema y colores. También puedes optar por no escribir texto y dejarlos simples.


Imagen final

Aquí está la imagen final, espero que te gusten estos coloridos iconos grunge.

One subscription.
Unlimited Downloads.
Get unlimited downloads