Qué es el Material Design: Guía de supervivencia para el nuevo estilo de diseño

Hace tiempo que se viene escuchando el concepto de Material Design. De hecho, el pasado mes de junio os contábamos que el nuevo diseño que estaba probando Google para su interfaz de búsqueda llevaba integrado el Material Design. El Material Design es un nuevo concepto de diseño que Google ha creado para Android y para distintas aplicaciones en estos dispositivos, y ya extendido para web y cualquier plataforma. Pero ¿en qué consiste realmente el Material Design? Este lenguaje se basa en el diseño de objetos materiales, con un lugar y un tiempo determinado, que se traducen en Material Design como espacio y movimiento. Por eso se sirve de iluminaciones y sombras, volúmenes, perspectivas, animaciones, y siguiendo siempre un patrón. [Tweet “Descubre las principales características del #MaterialDesign!”] Hablemos un poco más sobre algunas de estas características:

• Espacio 3D: En el Material Design los objetos representados reflejan luces y proyectan sombras, consiguiendo así efectos de profundidad. Los objetos además, al igual que en la vida real, pueden apilarse pero nunca pasar a través de ellos mismos.
• Animaciones: Es común en este lenguaje el uso de efectos de movimiento de objetos llamativos. Resultan agradables a la vista y construyen el significado de las relaciones espaciales e informan sobre el sistema. Por ejemplo, el cambio del triángulo del play a las dos rayas del pause. También es usual en Material Design la utilización de juegos interactivos en aplicaciones que inciten al usuario a explorarlas. Su intención es provocar curiosidad en el usuario, nunca distraerle.
• Transiciones: Para pasar de un punto a otro, el Material Design suele valerse de transiciones que guíen la atención del usuario y le lleven por distintos pasos cuando hay cambio de elementos.

Estilo visual del Material Design

El Material Design se sirve de referencias cromáticas como las señales de tráfico o la arquitectura contemporánea para marcar su estilo. El resultado es un diseño con colores vibrantes y atrevidos. [Tweet “Las imágenes utilizadas en Material Design son muy gráficas y atrevidas”] La paleta de color de este lenguaje utiliza los colores primarios y los colores de acento (para llamar la atención sobre algo; un botón de acción, por ejemplo). Google establece utilizar los colores 500 como los primarios, y los otros como colores de acento, debiendo limitarse a unos pocos colores principales y uno de acento. Al igual que los colores, las imágenes utilizadas en Material Design son muy gráficas, atrevidas, y deben poseer el poder de atraer al usuario. El objetivo de su uso es comunicar y darle vida a los contenidos. Las tipografías son sencillas y claras (Roboto y Noto son los tipos estipulados), y son muy importantes los conceptos de orden y jerarquía. El lenguaje se basas en estructuras y tipos de cuadrículas base, para no perder ese sentido del orden. [Tweet “Colores e imágenes atrevidas, y tipografías sencillas y claras para un buen diseño #MaterialDesign”] Actualmente el Material Design es multiplataforma, no sólo pensado para aplicaciones móviles de Android, sino para todos los sistemas. Las páginas web, smartphones y tablets pueden hacer uso del mismo.  

Imágenes: desarrollador-android.com