¿De dónde viene el diseño de SAP Fiori?

Lo que indudablemente salta a la vista de cualquiera que utilice SAP Fiori, por primera vez, es la sencillez del diseño.  Los iconos de la aplicación son claros y no están recargados. Para quienes están un poco interesados en el diseño de aplicaciones web, esto no les parecerá nuevo. Pero vamos a profundizar en ello.

Flat design vs Skeumorphic design

El flat-design es ahora un enfoque común en la creación de aplicaciones. El nombre significa diseño plano, y efectivamente los iconos parecen sencillos, ordenados… ¡y planos!

Esto contrasta con el estilo que se utilizaba antes, llamado “skeuomorphic design“.  En este, se intentaba reproducir las características del objeto físico en la versión digital. Para los curiosos de la etimología, la palabra deriva del griego skéuos, σκεῦος (herramienta) y morphḗ, μορφή (forma).

Ejemplo

El ejemplo de la calculadora del Smartphone es sin duda el más trivial, pero también el que mejor ilustra el concepto. Si guardas tu iPhone4 en algún cajón, prueba a encenderlo y mirar los iconos de la pantalla: ¡entenderás de qué hablo!

El aspecto minimalista del flat-design consigue enfatizar la usabilidad de la función, ya que aligera la vista, es directo y colorido. Sobre todo parece moderno a los ojos del usuario final; pero eso no es lo único.

Este diseño también ofrece ventajas técnicas: precisamente por la simplificación de las imágenes, se reduce el uso de la batería. También la carga de datos, pues las imágenes se cargan rápidamente y el cambio de una pantalla a otra es rápido y suave.

Características generales del diseño de SAP Fiori

Volvamos a SAP. Al trabajar en el desarrollo de Fiori, la nueva aplicación debía cumplir las siguientes características:

Basada en la función

Cada aplicación se configura en función del rol del usuario: gerente, vendedor, empleado, etc.

Un usuario puede tener varios roles. Debido a eso, una misma persona debe poder acceder directamente a la función de su interés en varios módulos. En este sentido, las anteriores transacciones de SAP ERP se dividían en diferentes pantallas, de acuerdo a la función del usuario final.

Con capacidad de respuesta

La pantalla se adapta al tipo de terminal o dispositivo que estemos utilizando. Ya sea un portátil, una tableta u otro.; como esta página web.

Además, Fiori puede utilizarse con un ratón, un teclado o una pantalla táctil, por ejemplo.

Las aplicaciones Fiori incluso funcionan de la misma manera independientemente de la plataforma operativa (Windows, iOS o Android)

Simple

Las funciones son completadas por el usuario de forma más rápida y sencilla.

Consecuente

Todas las aplicaciones Fiori tienen la misma apariencia y estructura.

Así el usuario se familiariza más rápidamente con las aplicaciones y tiene menos dificultades cuando utiliza una nueva aplicación. Al fin y al cabo, la estructura es muy similar.

De valor inmediato

La formación del personal es más corta: los usuarios finales pueden empezar a trabajar en la plataforma inmediatamente, sin demasiados problemas. Esto es gracias a su enfoque intuitivo y, en consecuencia, los costes de formación también se reducen considerablemente.

Diseño técnico de SAP Fiori

Desde el punto de vista técnico, Fiori se basa en HTML5, la quinta versión de HTML (HyperText Markup Language). Con ellas se escriben las páginas web.

Está diseñado para resolver ciertos problemas que han surgido en los últimos años. Por ejemplo, la necesidad de gestionar elementos multimedia de audio y vídeo, o favorecer la creación de páginas “responsive”. Es decir, las que se adaptan al tamaño del dispositivo en el que se visualizan.  

También está pensado para separar al máximo los distintos elementos de las páginas. Se basa en tres herramientas principales:

• HTML – Gestión de contenidos semánticos. “Semántico” significa que se especifica qué elemento representa el título, el subtítulo, etc.
• CSS (Cascading Style Sheets) – Gestión de la apariencia “estética” o gráfica (por ejemplo, colores, tipo de letra, tamaño, etc.).
• JS (JavaScript) – Interactividad con la página.

Hoy existe un nuevo diseño y  uso de la estructura HTML5 para las apps. Por eso, usuarios de SAP Fiori tienen acceso a lo que SAP ha lanzado bajo el nombre de SAP Fiori User Experience.

Si tienes curiosidad por leer más sobre la Experiencia de Usuario (UX) de Fiori, hablo de ella en este post.