Los errores más comunes al usar Material Design para tu aplicación

Material Design es un concepto, una filosofía, unas pautas enfocadas al diseño utilizado en Android, tanto en las aplicaciones nativas como en la web: básicamente en cualquier plataforma.

Material Design recibe su nombre por estar basado en objetos materiales. Piezas colocadas en un espacio (lugar) y con un tiempo (movimiento) determinado. Es un diseño donde la profundidad, las superficies, los bordes, las sombras y los colores juegan un papel principal.

El mayor error de Material Design es su mala implementación

Tras algo más de un año desde su llegada, Material Design se ha ido consolidando, pero esto nos ha llevado a ver cómo muchas apps presumían de la experiencia  Material Design, mientras que la impresión de los usuarios era que la experiencia de usuario que Google prometía no terminaba de ser lo esperado. ¿Por qué?

La clave estaba en que algunos diseñadores y programadores no entienden aún que Material Design es un concepto nuevo. Es decir, que no era aplicar reglas que Google se había sacado de la manga, sino conseguir una nueva experiencia.

Y esto precisamente nos llevaba a ver cómo hay algunos tipos de errores frecuentes que perjudican seriamente dicha experiencia de usuario. Os pasamos a comentar algunos de ellos:

El botón flotante no se puede tomar a la ligera

Empezaremos por el fallo más importante de todos: muchos programadores creen que implementar Material es poner un botón flotante. Y eso es totalmente falso.

El botón flotante es un patrón de diseño introducido por material para reforzar las acciones positivas por parte del usuario, pero no un botón que hay que meter con calzador en muchas pantallas, en las cuales no aplicaría para nada. De hecho, sólo deberíamos utilizarlo cuando creamos que en la mayoría de los casos será la acción que el usuario utilizará.

La importancia de la estética y la animación

Si hasta ahora parecía que todo el diseño giraba en torno a la apariencia física de una aplicación, ahora el diseño incluye la experiencia de usuario, hasta el punto de cómo se modifican los diferentes elementos (siguiendo las leyes de la materia) y sabiendo dar significado a dichos cambios.

Así que no penséis que incluir animaciones y buenas transiciones simplemente es un añadido: con Material es un must have.

No a las pantallas de inicio

Muchas veces hemos utilizado las típicas pantallas de carga mientras todos los datos estaban preparados para ser mostrados en nuestra aplicación.

Sin embargo, con la llegada de Material Design, Google recomienda enormemente evitar el uso de estas pantallas, para lo que debemos ser capaces de gestionar las pantallas de nuestra aplicación de forma que gestione los tiempos para su carga.

Los nuevos Grids de Material

La mejor forma de tener un entorno natural y equilibrado con Material radica también en saber respetar las proporciones. Para ello, Google introdujo el concepto del grid base de 8dp, en el cual se basa todo.

Desafortunadamente, muchos desarrolladores restan importancia a dicho grid, provocando un desbalance del contenido en la aplicación, que acaba significando algo no natural al usuario.

El navigation drawer, un elemento clave

Los patrones de diseño del panel de navegación lateral y el famoso y controvertido icono de la hamburguesa han ido cogiendo adeptos cada vez más rápido.

Pero, como ocurre con el botón flotante, llega un punto que con tal de utilizarlo, llegamos a provocar una carencia de significado en el uso del mismo. No es tan trivial si Google mismo le dedica una sección a este elemento de diseño.

La barra de navegación, parte de la aplicación

Como último caso, os mencionaremos la conocida barra de navegación, la cual Google pretende hacer parte de la aplicación, en ese intento de que Material cree estabilidad y natural en los productos.

Sin embargo, no muchos programadores parecen darle la importancia que requiere.

Y estos son simplemente algunos ejemplos de errores, que todo programador debe evitar. Y para ello, existen múltiples guías y documentación, como este mini tutorial que ya os introducimos aquí.

Via xda-developers