Lenguajes de diseño gráfico en la era digital. Material Design

marzo 13, 2021

En un mundo digital de constantes cambios, una interfaz visual bien diseñada es un standard u signo distintivo de una marca dedicada al desarrollo de sistemas operativos.

En este articulo exploraremos el mundo del diseño gráfico digital y como este debe convivir en absoluta armonía con los lenguajes de programación y el usuario final.

Crear un lenguaje visual único, original, atractivo, funcional y dinámico no es nada sencillo, ya que se deben conjuntar una infinidad de elementos como colores, formas, iconografía, composición y fotografía de forma congruente y armónica.

El principal objetivo de un buen diseño visual, es generar en el usuario una verdadera experiencia de usuario (UX), es un término para definir el nivel de satisfacción total de usuarios cuando utilizan un producto o sistema. Si la experiencia es buena el usuario volvera a utilizar el sistema y si es mala lo abandonara.

¿Conoces que es Material Design?

Material design es un lenguaje de diseño visual creado por Google para su actual y próxima generación de interfaces de usuario para el sistema operativo Android. Este ofrece un sistema de diseño funcional y elegante.

Google define a sus sistema de lenguaje visual de la siguiente manera:

“Es una teoría unificadora de un espacio racionalizado y un sistema de movimiento. Material design está basado en la realidad táctil, inspirado en el estudio del papel y tinta.

style_color_introduction

Las superficies y los bordes de cada material proporcionan pistas visuales que se basan en la realidad. Ayuda a los usuarios a comprender rápidamente las características de los objetos. Por otro lado, la flexibilidad de material permite crear nuevas características para los objetos que sustituyen a los del mundo físico, sin romper las reglas de la física.

Los fundamentos de la luz, la superficie y el movimiento son la clave para trasmitir como se mueven, interactúan y existen los objetos en el espacio entre ellos. La iluminación realista muestra las uniones, divide el espacio e indica las partes en movimiento."

Algunos de los multiples elementos que componen a Material Design son los siguientes:

Espacio

Material design se encuentra basado en un espacio tridimensional, lo que significa que todos los objetos tienen dimensiones (x, y, z). El eje z está alineado perpendicularmente al plano de la pantalla, con la parte positiva dirigiéndose hacia el observador.

Material-Design-680x453

Luces

Existe una composición compleja de luces virtuales las cuales iluminan en todo momento la escena; una luz principal crea sombras direccionales, mientras que una luz ambiente crea sombras suaves y consistentes desde todos los ángulos.

whatismaterial_environment_shadow3

Movimiento

El movimiento y transiciones refuerzan las acciones del usuario y genera una retroalimentación a la acción realizada, centrando la atención y continuidad conectando dos acciones separadas.

material-design-animation

Color

Existe una gran cantidad de combinaciones vividas y yuxtapuestas con ambientes apagadas, los cuales dan jerarquía a la información desplegada, los colores más obscuros generan la base de la aplicación, los colores claros están encargados de desplegar información secundaria o contextual.

Iconografía

El diseño de estos iconos está inspirado simplicidad de estructura, cada icono es cortado, doblado, e iluminado como si fuera realizado en papel.

style_logos_product_intro_material_lighting
style_logos_product_intro_material_color

Tipografía.

La tipografía es una herramienta fundamental de comunicación dentro de una interfaz esta debe se capaz de ser legible en distintos tamaños, pesos y resoluciones de pantalla. La tipografía utilizada en Material design es la llamada ROBOTO la cual se ha convertido en in signo distintivo de Android.

google-roboto-font

Material design es un excelente ejemplo que nos permite comprender como es y como se compone la estructura de una interfaz de usuario. La próxima vez que utilices tu teléfono móvil, piensa la cantidad de horas que un diseñador grafico dedico a generar una interfaz útil y atractiva.

linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram