introducción a “material design” de google [versión en español]

Introducción a “Material Design” de Google(versión en español)

Melissa Powel (Google UX) Verónica Traynor

Octubre 2015. Google, Santiago de Chile.

¿Qué es material design?google.com/design

Qué es material design?

● Material design es un lenguaje visual que sintetiza

○ los principios clásicos del buen diseño ○ + la innovación ○ + las posibilidades que brindan la ciencia y la

tecnología

Qué es material design?

● Fue inspirado en el estudio

○ de la tinta y el papel○ + un poco de magia ○ + un poco de imaginación

Tangible: Material Design es una metáfora

● Las superficies, sombras y cada detalle está basado en lo que sucede en la realidad material.

(cuando se interactúa con sus tres dimensiones)

La metáfora de los materialesagiliza la comprensión.

Diseño gráfico e intencional

● Jerarquías● Sentido en el diálogo humano-computadora ● Enfoque en la acción

Los movimientos transmiten sentidos

● Enfocan la atención● Dan feedback interactivo● Refuerzan al usuario como primer motor ;)

Optimizar UX = Optimizar ROI

Material Design NO significa copiar el diseño de Google

CRANE AIR | Reference: https://design.google.com/articles/expressing-brand-in-material/

PESTO | Reference: https://design.google.com/articles/expressing-brand-in-material/

ABISCO | Reference: https://design.google.com/articles/expressing-brand-in-material/

Shrine | Reference: https://design.google.com/articles/expressing-brand-in-material/

Algunos componentes importantes ;)

FLOATING ACTION BUTTON

● Nos servirá para indicar cuál es la acción principal de una pantalla.

● Lo podemos distinguir porque es un ícono circular.● No todas las páginas lo necesitan.

Source: https://www.google.com/design/spec/

FAB: FLOATING ACTION BUTTON

Súper ;)

No

CARDS

● Una card es una pieza de papel con la cual el usuario puede interactuar: puede contener fotos, textos, links, comentarios, etc.

CARDS

Súper ;)

No

TILES

● Los tabs organizan la arquitectura de la información a alto nivel

Source: https://www.google.com/design/spec/

TABS

Súper ;)

No

No

Introducción a “Material Design” de Google

Melissa Powel (Google UX) Verónica Traynor

Octubre 2015. Google, Santiago de Chile.