Herramientas SAP Fiori: evolución de los iconos

Las herramientas de SAP Fiori tienen nuevos iconos brillantes para todos sus componentes, así como el icono principal de la suite en sí. Cuando presentamos el producto, los 3 o 4 íconos iniciales se diseñaron juntos como un conjunto algo coherente. A medida que las herramientas de SAP Fiori ganaron popularidad e impulso, seguimos construyendo nuevas extensiones para cubrir cada vez más las necesidades de los usuarios. Agregamos nuevos íconos según sea necesario, pero no coordinados como parte de un sistema de diseño unificado.

Hace aproximadamente 6 meses, nos encontramos en una situación en la que no podíamos encontrar otra analogía para otro ícono más, y no teníamos un sistema para crear un ícono nuevo para que pareciera que pertenece a una familia con otros íconos. Entonces, nos embarcamos en un viaje para cambiar esto.

Los nuevos íconos de herramientas de SAP Fiori se construyen a partir de un sistema de diseño común

Teníamos varios objetivos que queríamos lograr:

• Crear un sistema que nos permita crear nuevos íconos en el futuro, esencialmente preparar el conjunto para el futuro.
• Elabore una cuadrícula subyacente en la que se colocarían los elementos del icono.
• Defina un estilo para el conjunto de íconos para que los íconos se vean como si estuvieran todos juntos, teniendo un parecido familiar
• Utilice la paleta de colores aprobada por SAP

Nuestro viaje nos llevó a través de varias etapas de exploración, en las que examinamos posibilidades con pocas limitaciones. Después de aprender de esta amplia exploración, los redujimos. Luego tomamos ese punto de referencia y ampliamos nuevamente, utilizando lo que hemos aprendido, para ampliar los conceptos y generar nuevamente un amplio conjunto de ideas y diseños. Luego seguimos iterando así durante algunas rondas en un proceso cíclico de expansión y contratación.

Nos decidimos por una cuadrícula de 16 por 16 puntos con algunos elementos de andamiaje de construcción internos, y pudimos colocar todos los diseños en ella.

Un sistema de cuadrícula nos permite crear un diseño consistente para todos los íconos de herramientas de SAP Fiori

Exploramos muchos estilos de íconos y los redujimos a una especie de estilo Bauhaus con bloques grandes y gruesos, que se pueden analizar visualmente fácilmente. Este estilo también limita qué elementos podemos usar, sirviendo como una barrera para nuestros diseños, manteniendo la coherencia entre todos los íconos. Casi todos los elementos que usamos para construir los íconos son rectángulos simples (aunque con esquinas redondeadas), óvalos y triángulos.

Por supuesto, esto está relacionado con el tema de la funcionalidad de las herramientas SAP Fiori: un conjunto de funciones simples más pequeñas se unen para formar grandes aplicaciones.

Hubo algunos elementos de íconos anteriores que decidimos conservar. Una brújula siempre representa guía. Por lo tanto, nuestras aplicaciones «Desarrollo guiado» y «Respuestas guiadas» aún conservan la aguja de la brújula. El «Generador» conservó su relámpago familiar, pero lo modificamos en nuestro nuevo estilo visual.

Brújula: guiar a nuestros usuarios

Finalmente, el icono que representa todo el conjunto de herramientas de SAP Fiori transmite tres cosas de las que se trata el conjunto: la flor (SAP Fiori), los pétalos que representan una multitud de aplicaciones y la tuerca que mantiene todo unido, firmemente atornillado.

También pasamos por muchas, muchas combinaciones de colores. Probamos variantes monocromáticas, variantes coloridas, todo tipo de combinaciones contrastantes, hasta que finalmente nos decidimos por el cálido amarillo dorado combinado con rosa fuerte, colocado sobre el fondo azul tradicional de SAP. Evitamos la clásica combinación de colores «sobrecarga de azul» para que nuestros íconos se destaquen y no se pierdan en el mar de otros íconos azul sobre azul.

Exploramos muchas combinaciones de colores para los nuevos íconos de herramientas de SAP Fiori

Inicialmente, pensamos que podríamos prescindir del rectángulo de fondo blanco y solo tener íconos independientes. Sin embargo, esto haría que los íconos fueran difíciles de ver en temas oscuros.

Si añadimos el marco blanco, los íconos serían seguros para usar en cualquier lugar, independientemente del fondo en el que se encuentren.

Un fondo blanco hace que los íconos sean visibles en cualquier tema, como en este GitHub en modo oscuro

Algunos de los íconos no son visibles directamente en el producto en sí y son prácticamente solo para uso interno. Esto se debe a que algunas de nuestras aplicaciones, como «Modelador de aplicaciones», incluyen varios elementos en su interior, como «Página de información de la aplicación», y esa pieza no tiene mucha presencia visual externa. Sin embargo, lo tratamos como un proyecto separado, por lo que merece un ícono por sí mismo, incluso si ese ícono no está expuesto directamente en ningún lugar del producto. Puede estar todavía presente en la documentación, el repositorio de GitHub o similar.

En los próximos días y semanas, reemplazaremos nuestros íconos antiguos por los nuevos. Con suerte, lograremos encontrar al menos la mayoría de los rincones y grietas donde los íconos han proliferado en los últimos años.

Se puede acceder a las herramientas de SAP Fiori a través de SAP Business Application Studio o como una descarga en Microsoft Mercado de códigos VS.