“Una imagen vale más que mil palabras”, la mayoría de veces esa famosa frase es cierta. Pero si esa imagen no transmite bien esas mil palabras de nada vale. Por eso es muy importante pensar bien a la hora de diseñar Iconos. ¿Qué hay que tener en cuenta para que representen bien lo que queremos? ¿Y qué factores hay que tener en cuenta para que estén bien diseñados? Vamos a hacer un breve repaso a algunas ideas que nos pueden ayudar.

01 · ¿Qué vamos a diseñar y quién es el público objetivo?

Es importante tener claro nuestro “target” y el entorno donde irán esos iconos. No es lo mismo diseñar los iconos para una zona infantil del zoo, que los que irán en una web de un bufete de abogados. Por eso hay que pensar si vamos a utilizar masas de colores vivos y llamativos o trazos finos y elegantes. Un aspecto interesante a tener en cuenta son las características y las costumbres sociales o nacionales. ¿A qué nos referimos? Por ejemplo, supongamos que tenemos que diseñar un icono que represente “Comida” para un restaurante, no será lo mismo diseñarlo para un italiano, un indio, un restaurante de comida rápida o un japonés. También podríamos poner el ejemplo de una aplicación para el email, podríamos pensar en utilizar un buzón, pero ¿no es más común entre todas las culturas utilizar por ejemplo un sello?

vía: planktonartcompany

02 · Seguir una misma línea

Si no se trata del icono de una App o un encargo especial, la mayoría de veces se diseña un conjunto o “pack” de iconos. Lo mejor para comenzar un trabajo de este tipo es crear guías y patrones que nos ayuden a mantener siempre el mismo estilo y seguir la línea que elijamos. Por ejemplo, que todos mantengan el mismo “peso visual”, utilizar siempre un mismo grosor de trazo (o dos para algún detalle necesario), partir de formas básicas como un cuadrado o un círculo, que tengan el mismo acabado… etc.

03 · ¡Menos es más!

Añadir elementos a nuestro icono para que se entienda mejor no va a ayudar. La función de un icono es transmitir una idea de un solo vistazo, si nos tenemos que pararnos para ver que significa realmente ese icono, no funciona ni cumple su función. Por eso es mejor darle vueltas al coco, ser originales y pensar en nuevas maneras de representar la idea de la forma mas sencilla y clara posible. Tampoco os vayáis a pasar de originales, tenemos que buscar un concepto que entienda todo el mundo, en especial nuestro público objetivo.

04 · Diferenciación

No queremos que los clientes de nuestros clientes se confundan por que no hemos sabido hacer una buena diferenciación. ¡Cuánta gente ha entrado en el baño de chicas porque el icono de la puerta no sabemos si representa un hombre una mujer o un mono… Estos casos suelen pasar mucho en “packs” donde tengamos que representar cosas muy parecidas, por ejemplo empresas de administración donde todos los iconos hablan de documentos.

05 · Perspectivas, sombras y tamaños

Volvemos a repetir que los iconos tienen que ser claros. Las perspectivas, 3Ds, excesos de sombras, brillos y reflejos no mejoran la claridad del icono. En dribbble hay ejemplos excelentes de iconos que utilizan lo que hemos hablado pero lo hacen de una manera sutil y acertada.

No es recomendable tampoco utilizar texto, ya que cuando se reduzca su tamaño lo único que se lee es una línea borrosa.

El tamaño sí importa. Si el icono se va a utilizar en varios medios y a distintas medidas, sería recomendable adaptar el icono según su tamaño. No es lo mismo un icono de 512 px en una pantalla retina que un favicon de 16px… A veces incluso hay que cambiar ligeramente el icono para que se vea mejor como por ejemplo el icono de Wunderlist:

06 · Fuera de la línea de Pixels

Si creamos un icono pequeño utilizando la herramienta vector de Photoshop, “no nos salgamos de la línea”. ¿A qué nos referimos? Que si mantenemos los nodos dentro de la línea entre los pixels conseguiremos un acabado liso y más claro. Con la siguiente imagen lo entenderéis mejor:

Hay muchas más consejos y trucos para hacer buenos iconos y que logren lo más importante: transmitir claramente su significado. Si tienes algún otro consejo que pueda beneficiarnos a todos ¡déjanos un comentario! También nos encantaría ver algún icono vuestro! Próximamente publicaremos más entradas con ayudas de este tipo.