Muchas aplicaciones web han comenzado a utilizar íconos en escala de grises (negros), por ejemplo, Github, el nuevo Google Analytics, etc. Incluso aplicaciones como Firefox 4, Chrome , IE9, iTunes, Mac OS, han eliminado íconos de colores.
¿Cuál es el razonamiento detrás del cambio de íconos de colores a íconos en escala de grises / monocromos?
Ejemplos:
- Icono de configuración de Google Analytics
- Github (mira los botones de íconos en la parte superior derecha)
- iTunes 10 hizo un cambio a íconos monocromos
Actualización: parece que Apple lo introdujo por primera vez en Aqua en Diseño de iconos para controles de barra de herramientas de estilo rectangular :
Los iconos que se ven bien en los controles de la barra de herramientas de estilo rectangular son imágenes negras estilizadas que transmiten significado a través del contorno y el contorno, no con detalles internos. Dado que sus iconos deben imitar la apariencia de las imágenes de Mac OS X existentes dentro de los controles de la barra de herramientas de estilo rectangular, utilice las imágenes de plantilla proporcionadas por el sistema como guía. Al diseñar un icono para un control de barra de herramientas de estilo rectangular, tenga en cuenta los siguientes puntos:
- Haga que el contorno sea nítido y claro
- Use una perspectiva directa
- Use negro completo y algunos tonos de gris para sugerir dimensionalidad
- Use suavizado
- Asegúrese de que la imagen esté centrada visualmente en el control (tenga en cuenta que visualmente centrado puede no ser lo mismo que centrado matemáticamente)
Los iconos de los controles de barra de herramientas de estilo rectangular de tamaño regular no deben medir más de 19 x 19 píxeles.
Comentarios
- ¿Puede proporcionar una imagen de lo que está hablando? Acabo de mirar Google Analytics y ' no veo nada parecido a lo que está diciendo.
- Lo siento. ¡Actualizó la publicación con dos enlaces! Aquí hay algunos más: Firefox 4 mozilla.com/en-US/firefox/features Chrome (mire atrás / adelante / inicio / favoritos) google.com/chrome Itunes apple.com/itunes/what-is/player.html
- Buena pregunta y gracias por la actualización. +1, y otro +1 que corta y pega la actualización en una nueva respuesta. 🙂
Respuesta
Creo que esta tendencia se unió a la idea de separación de contenido y presentación. Los íconos son parte de chrome / ui y no deben ser demasiado llamativos para no competir con el contenido en sí.
Otra razón puede ser que es más fácil llamar la atención sobre un elemento cuando es el solo uno con un ícono de colores, y todo lo demás está en escala de grises. Por ejemplo, un ícono de candado de inicio de sesión verde en combinación con íconos de menú en escala de grises. Hacer algo emergente en un grupo de elementos de colores requiere mucha más habilidad y tiempo, ya que es necesario Piense en mucho más que solo el color (que ya no juega el papel principal para atraer la atención del usuario).
Comentarios
- Exactamente lo que yo iba a decir. Google Chrome es un ejemplo perfecto porque fue diseñado para salir del camino. La barra superior, los botones y los iconos son monocromos y están muy bien condensados. Por lo tanto, la interfaz de usuario de Chrome no ' t roba demasiada atención a la página web que ' estás tratando de ver. Y ' he notado que Microsoft tiene una filosofía similar con IE9.
- La parte que me enfurece (dado que Microsoft ' s último anuncio blogs.msdn.com/b/visualstudio/archive/2012/02/23/… ) es que esto solo funciona para ciertos tipos de interfaces de usuario, particularmente aquellas que ' no tienen cien botones, vistas de árbol y paneles en toda la interfaz. ¿Cuándo comenzarán los diseñadores de UI a darse cuenta de que esto es solo una metáfora de diseño muy específica y no una moda genial? Los iconos de colores funcionan cuando hay muchos iconos a la vista.
Responder
- Suelen verse bien , independientemente del diseño, para que pueda conservarlos si el diseño cambia.
- Puede combinar iconos de diferentes fuentes (The Noun Project, fuentes de símbolos, iconos existentes utilizados en plataformas como el iPhone, etc.) , ya que en su mayoría se ven similares.
- Es fácil hacer las tuyas propias.
Personalmente, creo que generalmente es una mala tendencia. Nuestro cerebro procesa el color con mucha atención (incluso antes de que lo veamos conscientemente); «Somos realmente buenos en tareas como» encontrar el ícono rojo en una lista de íconos de colores «. No somos tan buenos en una tarea como» encontrar el ícono que parece un pequeño camión en una lista de íconos negros «. Hacer que todos los iconos sean del mismo color hace que su producto sea más difícil de usar.
Hay excepciones, por supuesto.