Anuncio

crea tus propios iconosHay una gran cantidad de conjuntos de íconos gratuitos en línea, pero si desea desplazarse más allá del uso particular, también hay una gran cantidad de problemas relacionados con ellos. Las licencias y la falta de marca son solo dos de ellos.

Incluso si no eres un desarrollador de software, aprender a crear tus propios iconos es una habilidad tremendamente útil. Puede darle a su computadora una máscara única o brindar sus servicios a la comunidad y al mundo corporativo.

De ninguna manera es un tutorial completo de diseño de iconos. Recién estamos comenzando con los conceptos básicos básicos: tecnicismos, una lista de verificación de diseño y un conjunto de herramientas de diseño de íconos.

Icono de tecnicismos

A continuación se presentan algunas especificaciones que debe conocer sobre el formato del icono, lo más importante, las resoluciones de imagen y los formatos de archivo.

Talla

La importancia del tamaño se analiza más adelante a continuación. Por ahora, nos atendremos a los aspectos técnicos.

instagram viewer

Los iconos siempre son cuadrados. Esto significa que un icono rectangular se estirará o se reducirá para llenar, respectivamente, todo el lienzo o encajar en él. De cualquier manera, los iconos altamente rectangulares se destacan en el mal sentido. Los siguientes tamaños de iconos son los más comunes en uso:

      • 16 x 16 px * **
      • 24 x 24 px
      • 32 x 32 px * **
      • 48 x 48 px * **
      • 64 x 64 px
      • 96 x 96 px
      • 128 x 128 px **
      • 256 x 256 px **
      • 512 x 512 px **

Windows XP recomienda el uso de resoluciones de 16 x 16, 32 x 32 o 48 x 48 *. Si no hay ninguno disponible, cambiará el tamaño del ícono que tenga la resolución más cercana, hasta 256 x 256. Dado que las resoluciones de escritorio aumentan cada vez más, se recomienda incluir siempre resoluciones más grandes. El formato Apple ICNS admite tamaños de 16 x 16, 32 x 32, 48 x 48, 128 x 128, 256 x 256 e incluso 512 x 512 **.

Formato de archivo

Para Windows, el formato de archivo más utilizado para la distribución de iconos es ICO. La contraparte de Mac es ICNS (Formato de imagen de icono de Apple).

La lista de verificación de diseño de iconos

No hay un tutorial para diseñar el icono perfecto, una y otra vez. Los diferentes temas y diseños requieren diferentes enfoques, y la "tendencia actual" está en un estado de flujo constante. A continuación se presentan tres pilares principales de la creación de iconos que han demostrado ser verdaderos una y otra vez. Si eres nuevo en el diseño de íconos, asegúrate de tener en cuenta la lista de verificación de íconos en todo momento.

Inequívoco

crea tus propios iconosPor encima de todo, los iconos deben ser inconfundibles. La relación con su aplicación debe ser obvia para todos, a través del tiempo, la cultura y las diferencias de edad. Combatir la tentación de crear íconos llamativos que no tengan relevancia y mantener un diseño simple, sólido y obvio.

No veas esto como un obstáculo para tu creatividad; los íconos pueden ser hermosos y estimulantes, pero no deben estar abiertos a interpretación (léase: conjeturas al final del usuario).

Uniformidad

crear iconos propiosSi está diseñando un conjunto de iconos, mantenga el diseño uniforme.

Asegúrese de tener un hilo común que interconecte estos iconos y muestre la sinergia a los usuarios; el todo debe ser mayor que la suma de las partes.

Talla

crear iconos propiosLos iconos siempre se crean en varios tamaños. Esto afecta el diseño en más de un sentido.

Para empezar, los íconos deben verse bien y reconocibles independientemente del tamaño. Elimine el contraste alrededor de los lados para evitar bordes irregulares y haga que los detalles importantes se destaquen lo suficiente como para mantener el foco en la implementación más pequeña del icono.

A nivel técnico, los iconos se diseñan mejor usando vectores, imágenes compuestas de formas infinitamente escalables, en lugar de una composición establecida de píxeles. Sin embargo, si su resolución es lo suficientemente alta, los mapas de bits funcionarán igual de bien.

El conjunto de herramientas de diseño de iconos

Photoshop es una gran aplicación para diseñar iconos. Tienes (casi) todas las herramientas que necesitas para crear gráficos vectoriales o manipular mapas de bits, y aplicar efectos y sombreados complejos. Lo más importante serán las siguientes herramientas:

Lapicera

La herramienta Pluma le permite crear gráficos vectoriales escalables. Puede dibujar una forma creando nodos y arrastrando para ajustar la curva de la línea. Es más difícil de usar de lo que parece, pero probablemente sea la mejor herramienta de elección. Escribimos sobre la herramienta de pluma en el pasado, leímos Photoshop Pathing: cómo usar la herramienta Photoshop Pen Cómo usar la herramienta Photoshop Pen Lee mas .

crea tus propios iconos

Complemento de formato de archivo ICO

Este complemento de Photoshop agrega el formato de archivo ICO a su configuración de exportación. El método de instalación depende de su sistema operativo y la versión de Photoshop, así que asegúrese de consultar el sitio web.

Apple Icon Composer

Lamentablemente, no existe tal herramienta para el formato de archivo ICNS de Apple. Esta herramienta gratuita se ocupa del problema en su lugar. Viene con el paquete Apple Xcode, que puede descargar después de un proceso de registro (tedioso). O puede Google para la descarga.

Hongkiat: más de 40 tutoriales de Photoshop de diseño de iconos seleccionados a mano

El blog de diseño Hongkiat.com ha compilado una lista de más de 40 tutoriales de diseño de iconos de Photoshop diferentes. Esta lista cubre todo tipo de íconos y varios grados de dificultad. Explore la lista en busca de inspiración y extrapole las técnicas utilizadas para realizar sus propios diseños.

Estilos de capa

Los estilos de capa incorporados de Photoshop son una excelente manera de dar el toque final a sus iconos. Abra el panel de estilo de capa haciendo doble clic en una capa o haciendo clic con el botón derecho en la descripción general de la capa. Usa un trazo gris de 1 px con una opacidad del 40-50% para los bordes de tu ícono y coloca tus sombras a 110 ° para obtener los mejores resultados. Intenta no usar sombras alrededor el ícono, sin embargo, ya que la mayoría de los sistemas operativos ya lo hacen.

¿Tiene algún otro consejo rudimentario sobre diseño de iconos? ¡Háganos saber lo que piensa en la sección de comentarios a continuación!

Soy escritor y estudiante de ciencias de la computación de Bélgica. Siempre puedes hacerme un favor con una buena idea de artículo, recomendación de libro o idea de receta.