Google Design: Toda la información

Google Design: Toda la información

Actualizaciones Android

Los principios de Material Design. ¿Por qué algunas apps de iOS no está al nivel?

12 julio, 2014 21:00

Si algo ha transcendido durante el pasado Google I/O, aparte de los nuevos Android (auto, wear, TV), es el nuevo diseño que llevará Android L: el que Google ha denominado Material Design. Pero, ¿cómo se está viendo reflejado este nuevo diseño? ¿Está todo totalmente definido ya?

Cuando hablamos de diseño, encontramos dos elementos clave: el diseñador y el programador. Y normalmente, el punto de vista de un diseñador no tiene nada que ver con el del programador, a no ser que una sola persona ejerza ambos roles. Esto produce un gap entre lo que «estamos tratando de evocar» (perspectiva del desarrollador) y «las clases que debemos utilizar» (perspectiva del programador. Esto nos lleva a que hay un montón de conceptos que se pueden perder en el camino en la guía de diseño.

Pero podemos analizar un claro ejemplo de cómo no seguir las pautas de Material Design. Y para ello, además utilizaremos la aplicación de otro sistema operativo, la del clima para iOS, la cual ofrece un gran diseño visual pero que se rompe al no haber un modelo de interacción definido. 

Si nos fijamos, nada nos indica que la parte superior de la pantalla es interactiva, y lo que es aún más grave, no tenemos ningún tipo de feedback cuando la estamos tocando.

¿Eso es todo? No, hay más. Por ejemplo que con los puntos de la parte inferior de la pantalla vemos que hay varias páginas que podemos ver deslizando el dedo, pero que si lo hacemos desde la mitad inferior, provocará que toda la pantalla (excepto el fondo) se desplace, produciéndose un problema incluso con los márgenes. Estamos perdiendo la dimensionalidad del contenido.

Pongamos que eso no es malo, al menos si mantenemos la norma en todos los casos. Pero, ¿dónde radica el problema? En que el usuario debe aprender a interactuar con la aplicación, al no ser obvia e intuitiva la forma de interación.

Otro ejemplo ocurre cuando tocamos el indicador de menú de la parte inferior derecha, deslizándose el contenido hacia arriba desde abajo. Sin embargo, ¡no podremos ocultarlo deslizando hacia abajo, justo como hacíamos antes pero lateralmente! Para ello, deberemos tocar una de las filas, la cual tampoco nos dará feedback sobre el estado en el que se encuentra (tocada o no). Eso es falta de homogeneidad.

En esta misma vista, podremos añadir ciudades con tan sólo pulsar el botón con el símbolo +.  ¿Sencillo, no? Pero ¿cómo eliminamos? Tenemos que deslizar desde la derecha en la fila para ver el botón de borrar. Podríamos pensar que es algo típico de la plataforma (iOS), pero el problema es que no ocurre así en todas las aplicaciones, incluso en esta misma aplicación, pues ¡la primera fila no nos permite borrarla!

Similar ocurre si queremos reordenar las filas, siendo la primera discriminada, y el único elemento diferenciador es una flechita a la derecha de la hora. ¿Suficientemente intuitivo? Creo que no.

Hay veces, que pensar en rediseñar una aplicación, pero haciéndolo en papel nos ayuda a ver más allá, aclarando el diseño y la estructura por secciones o piezas. ¿O no vemos realmente más sencillo la interacción en la siguiente imagen?

Pero, ¿qué conclusiones podemos sacar de todo esto? Material Design está intentando mostrar de forma sencilla todos los indicadores de interacción, de una forma similar a como vemos en la imagen anterior a papel, mucho más sencillo. Con eso, por ejemplo, una fila que podremos cortar y mover a otro sitio, tendrá bordes definidos, como ejemplo. Si por ejemplo nos movemos por una lista de elementos que tendrá un botón de entrar, éste no puede aparecer por arte de magia, debe deslizarse. Así, una gran cantidad de detalles.

Precisamente, de ahí viene el nombre Material Design. La idea es que veamos los diseños que esperamos los materiales, pues serán más sencillos e intuitivos. Todo esto lo han definido en Google como:

Una metáfora material es la teoría de la unificación de un espacio racionalizado y un sistema de movimiento.

Es decir, dar un sentido físico es sinónimo de moverse con fluidez. Y esto nos lleva a cumplir las características que cuando íbamos viendo el ejemplo en iOS íbamos marcando en negrita.

¿Y vosotros, qué opináis de Material Design?