Diseño de iconos: 5 consejos esenciales para empezar

Diseño de iconos: 5 consejos esenciales para empezar

Simplemente garabatea un icono muy rápido. ¿Qué tiene eso de difícil? Bueno, definitivamente no es fácil. Le mostraremos lo que debe tener en cuenta al comenzar con el diseño de iconos.

¿Por qué existen los iconos?

Comencemos con algunos conceptos básicos. Cuando hablamos de iconos, no nos referimos a las pequeñas imágenes de madera dibujadas a mano con motivos cristianos que fueron famosas hace siglos en el cristianismo de Europa del Este. En cambio, estamos hablando de pequeños símbolos que representan objetos o funciones en una pantalla.

Este último debutó en la Xerox Star 8010 en 1981. Si observa la Xerox de los años sesenta y setenta, se sorprenderá de las innovaciones de las que son responsables la empresa y su Centro de Investigación de Palo Alto. El ratón de la computadora es uno de ellos. Básicamente, todo el concepto de la denominada computadora personal fue creado por Xerox.

Xerox Star y la interfaz de usuario visual con la metáfora del escritorio. (Imagen: Digibarn)

La invención de los iconos forma parte de la denominada metáfora del escritorio (también conocida como metáfora de la oficina), que se utilizó para mostrar el típico escritorio digital. ¿Y qué sucede cuando se supone que debe mostrar un escritorio completo en pantallas que solían tener aproximadamente 12 pulgadas como máximo? Derecha. No tienes mucho espacio.

En consecuencia, los iconos se diseñaron como pequeños pictogramas que intentan comunicar qué objeto o función representan desde el principio. Hoy, todavía tenemos que afrontar esta tarea y todas sus dificultades. Sin embargo, tenemos la ventaja de poder crear iconos como gráficos vectoriales, lo que significa que ya no estamos limitados a los píxeles. Esto permite una visualización mucho más compleja de lo que queremos transmitir.

No obstante, la mayoría de los problemas que deben resolverse durante el diseño del icono no han cambiado. Los siguientes consejos le ayudarán si desea o tiene que crear pictogramas.

Consejo n. ° 1: los iconos deben ser claros y fáciles de entender

Comencemos con el consejo más importante. Un icono solo es útil cuando los usuarios potenciales pueden saber inmediatamente lo que se supone que representa. Si el ícono es demasiado artístico o abstracto, eso no funcionará. Ahí va la utilidad.

El esqueomorfismo y las altas resoluciones permiten la perfecta representación de la realidad. Sin embargo, eso por sí solo no es un diseño ideal. (Regate: Eddie Lobanovskiy )

Por tanto, es importante no intentar ser innovador; y definitivamente no disruptivo. El mejor símbolo es aquel con el que el usuario está familiarizado y ya está asociado con el objeto o las funciones que pretende representar. Este pensamiento nos lleva al skeuomorfismo que pensamos haber dejado atrás con la tendencia del diseño plano. Con el enfoque de Material Design, Google unió ambos mundos, permitiendo que un ícono en material design se vea plano y realista al mismo tiempo.

Si no quieres vivir con las reminiscencias de tiempos pasados, o incluso odiar el skeuomorfismo, te recomiendo que reconsideres tu punto de vista. Si eso no ayuda, aún puede tomar algunas medidas asociativas y orientar sus íconos hacia el lenguaje de funciones popular. Un ejemplo de esto sería el triángulo mentiroso como metáfora establecida del «juego».

Eskeuomorfismo en forma modesta. (Regate: Mentas creativas)

El diseño de iconos orientado al futuro debe evitar las metáforas que se establecieron una vez, pero es poco probable que permanezcan establecidas en el futuro cercano. Espero que no se le ocurra usar un disquete de 3,5 ”como icono. Hay algunos ejemplos como ese; un símbolo de CD, por ejemplo.

Consejo n. ° 2: no empieces a dibujar, la investigación es clave

Si desea dibujar íconos para un cliente o un propósito en particular, tómese su tiempo para una investigación adecuada. ¿Qué lenguaje de imagen ya se ha establecido en el área que estás buscando? ¿Qué metáforas de función me vienen a la mente?

Por supuesto, también debería echar un vistazo a los proveedores comerciales y gratuitos de conjuntos de iconos. No necesitamos reinventar la rueda. Además, los diseñadores de servicios como iconos8 ya ha pasado por los mismos problemas con los que está lidiando. Si encuentra la solución perfecta allí, tómela. No estás obligado a crear algo que ya exista.

Al diseñar para un cliente, podría tener sentido integrar una parte de su marca o logotipo en el diseño. Si su cliente usa una estrella en el logotipo, podría considerar esa estrella como parte del diseño de cada icono. Solo mire lo que encaja con el caso actual. Esto facilita agregar un toque personal al diseño al mismo tiempo que protege sus símbolos para que no los llamen arbitrarios.

Si no puede encontrar un componente de marca, un tema compartido también puede funcionar. Con un cliente de la industria petrolera, una gota de aceite podría ser una buena opción para un tema consistente. Aquí, tendrá que pensar fuera de la caja de vez en cuando.

En este contexto, observar las características culturales es fundamental. Algunos símbolos que consideramos un éxito podrían tener un efecto muy diferente en otro lugar. Un ejemplo sería el búho, que es parte de la marca del ayudante de redes sociales Hootsuite. En las culturas occidentales, el búho se asocia con la sabiduría, mientras que las culturas orientales lo asocian con la estupidez. Mmm.

Desde el principio, debes ser consciente del hecho de que, incluso con una pequeña familia de iconos, no podrás realizar la mejor asociación en todo momento. Esto resultará en una mezcla. Un icono es un éxito de taquilla cognitivo; el otro requiere pensar un poco. En caso de duda, simplemente diseñe de manera que mantenga la coherencia en toda la familia de iconos.

Consejo n. ° 3: menos es más: no sobrecargue sus iconos

No competimos por la pantalla más compleja en un espacio mínimo. Lo que importa es la comprensibilidad y no la visualización más detallada del símbolo. Después de todo, su icono es solo un medio para un fin. Si puede lograr su propósito con la combinación de dos formas simples, esto no es una desventaja, sino una ventaja.

Creo que es seguro decir que nadie podría clasificar estos llamados íconos de un vistazo. (Regate: Estudio Fireart)

Permítanme citar a Einstein, quien recomendó hacer las cosas lo más fáciles posible, pero no más fáciles. Las dos formas mencionadas anteriormente para formar su icono están completamente bien si hacen que su icono sea inequívocamente claro. Desafortunadamente, un ícono de esa simplicidad a menudo deja espacio para diferentes interpretaciones. Agregue complejidad a su diseño hasta que haya garantizado una interpretación inequívoca del símbolo.

También debe tener el hábito de mantener los íconos utilizables en tamaños pequeños, incluso si solo los necesita en 512 x 512 píxeles para la comisión específica. Sin embargo, puede ajustar la complejidad de los pictogramas al tamaño de la pantalla. Su versión de 512 x 512 podría ser más detallada que el símbolo de 64 x 64. En cualquier caso, no debe llevarlo demasiado lejos, ya que aún desea que la gente sepa que ambas versiones pertenecen a la misma familia de iconos.

Consejo n. ° 4: elija un estilo y manténgalo

No soy fanático de los cajones. Por lo tanto, evitaré escribir una lista aparentemente concluyente de todos los estilos de diseño de iconos actuales. Tampoco creo que la categorización de los servicios de diseño ayude a la comunidad de ninguna manera.

Por supuesto, siempre hay varias formas de visualizar el mismo tema, como se muestra en este extracto de la colección de símbolos de iconos8. estaba buscando cualquier icono de cámara. (Captura de pantalla: Noupe)

Lo que recomendaría es muy simple. Si desea dibujar sus íconos en un estilo esquemático, hágalo, pero apéguese a este estilo en todo el conjunto. Si elige uno, dos o tres colores, utilícelos de manera constante. Si utiliza perspectiva, iluminación o sombras, utilice siempre la misma perspectiva, haga que la luz provenga de la misma dirección y coloque la sombra en el mismo lugar.

Puede pensar que esto es lógico. Sin embargo, en un nuevo proyecto, acabo de ver un ícono que se ve completamente diferente a los demás en una descripción general de seis símbolos.

¿Por qué hizo eso el diseñador? Porque pensó que este ícono era especialmente apropiado para el caso que nos ocupa. Y estaba convencido de que era mejor utilizar este singular icono que consideraba óptimo, aunque no encajara con los demás símbolos.

Estaba con el cliente, así que pude rechazar su borrador y crear un ícono en colaboración con él, que armonizaba con los demás y al mismo tiempo era un compromiso real. Pero está bien, porque tenía que serlo.

Consejo n. ° 5: Sea Pixel Perfect y renuncie al texto

Bueno, este consejo consiste básicamente en dos recomendaciones independientes. Sin embargo, en mi opinión, ambos pertenecen a una guía para principiantes.

El texto es muy común en pésimos conjuntos de iconos. ¿Porque eso? Es simple. Alguien no intentó encontrar una buena metáfora. Es posible que lo sepas por jugar Pictionary con algunos amigos. Normalmente, el término que los demás deben adivinar debe visualizarse dibujando. La tentación de usar texto cuando faltan buenas ideas para dibujar la palabra a mano siempre está ahí. Sin embargo, es un hecho que su icono simplemente no es correcto si no puede renunciar al uso de texto.

Los iconos se crean siempre, no a veces ni la mayor parte del tiempo, en una cuadrícula de píxeles precisos. Aquí, la cuadrícula de cada icono del conjunto debe tener las mismas dimensiones. Sin embargo, esto no significa que tenga que dibujar todos los íconos que consuman toda esta cuadrícula. En cambio, no hay problema en tener algún modo de retrato, algunos iconos horizontales, diagonales o incluso redondos, dejando el espacio de la cuadrícula sin usar.

No obstante, la cuadrícula permanece cuadrada. El libro mayor del diseño es el centro visual de su pictograma. Sin embargo, el centro visual no necesita coincidir con el centro del objeto determinado gráfica y matemáticamente. Aquí, todo se reduce a la percepción visual.

Para estar preparado para diferentes formas, siempre deje píxeles libres en las partes exteriores de la cuadrícula. Ningún icono debe tocar los bordes, incluso si es un pictograma cuadrado que podría hacerlo sin problemas.

Las líneas y formas siempre incluyen píxeles enteros para evitar desenfoques que de otro modo se producirían fácilmente al escalar el icono.

Conclusión: hazlo como Abraham Lincoln

«Si tuviera ocho horas para talar un árbol, pasaría seis de esas horas afilando el hacha». Se dice que esta cita proviene del ex presidente de los Estados Unidos, y seguramente también se aplica al diseño de iconos.

La investigación, la planificación y la preparación son importantes. Dibujar el pictograma es solo la parte final del acto. Es como encender una fogata que tomó horas recolectando y apilando leña. ¡Vamos, vamos al bosque!

Otras fuentes relacionadas:

#Diseño #iconos #consejos #esenciales #para #empezar

Publicaciones Similares

Deja una respuesta

Tu dirección de correo electrónico no será publicada.