You are on page 1of 31

Objetivos:

Crear un lenguaje visual que sintetiza los principios


clsicos del buen diseo con la innovacin y la posibilidad
de la tecnologa y la ciencia.
Desarrollar un sistema subyacente que permite una
experiencia unificada a travs de plataformas y tamaos
de los dispositivos. Preceptos mviles son fundamentales,
pero el tacto, la voz, el ratn y el teclado son todos los
mtodos de entrada de clase primera.
Movimiento Autntico
Interaccin responsiva
Transiciones significativas
Detalles encantadores
Observando el movimiento de un objeto nos dice si es
ligero o pesado, flexible o rgido, pequeo o grande.
Cuando un objeto sale del marco, tienen que mantener su
velocidad, en lugar de desacelerar a medida que sale del
marco:
Masa y peso
Cuando un usuario interacta con una aplicacin, y cosas
hermosas y an perfectamente lgicas suceden, el
usuario se siente satisfecho, incluso encantado.
Alienta la exploracin ms profunda de una aplicacin:
qu pasar si toco esto? Y entonces este?
Reaccin sensible
Fuente: adobe.com
El material puede responder a la interaccin al levantarse
cuando se toca o se hace clic:
Respuesta del material
Todas las acciones iniciadas por el usuario tienen un
epicentro; el lugar o lugares en los que su intencin entra
en el sistema.
Accin radial
Fuente: www.theedublogger.com
El Diseo de movimiento no slo debe ser bello, sino que
debe servir a un propsito funcional.
Fuente: mobverge.blogspot.com
La transicin entre dos estados visuales debe ser suave,
aparecer sin esfuerzo, y sobre todo, proporcionar claridad
para el usuario, sin confusin.
Las disolvencias en la
pantalla completa
no son deseables, pero son
preferibles a los recortes.
En la construccin de una transicin, debe tenerse en
cuenta tanto el orden en que se mueven los elementos y
el momento de su movimiento.
Como los elementos de transicin se mueven por la
pantalla, deben comportarse de una manera coordinada.
Todos los elementos trabajan juntos para construir una
experiencia perfecta y una aplicacin bella y funcional
Seleccin (Artculos y Texto)
Gestos
Acciones Promovidas
Configuraciones
Tratamiento de Imgenes
Bsqueda
Cundo es recomendable habilitar seleccin
mltiple?
Algunas operaciones bsicas se muestran directamente y
operaciones adicionales se pueden desplegar de un botn.
Descartar
Abrir el men
Navegacin en la jerarqua
Refrescar Actualizar
Cambio de pgina
Contenido
Acciones relacionadas
Cualidades
Ubicacin
Utilidad: Recordar preferencias (Evitar preguntas
molestas e innecesarias)
Acceso: No es muy frecuente
Uso: Evitar demasiadas opciones
Agrupacin: Convertir una lista larga en mltiples
listas cortas agrupadas
Valores predeterminados: satisfacer a la mayora
opacidad
contraste
Saturacin
3 Fases
Solapamiento Blancos
Transiciones
Pantallas mas grandes
Animaciones
Bsqueda dentro de la app:
Bsqueda por voz
Sugerencias de acuerdo al
historial
Autocompletar
Bsqueda persistente
Bsqueda expandible
Un producto es accesible cuando todas las personas,
independientemente de su capacidad-pueden navegar,
entenderlo, y lo utilizan para lograr sus objetivos. Un producto
realmente exitoso es accesible a la mayor audiencia posible.
Fuente: www.bluehaired.com
Ayude a los usuarios a ser rpido y eficiente.
Es fcil para navegar por la pgina de forma rpida y
eficiente (por ejemplo, saltar a las secciones principales o
volver a la pgina principal)?
Fuente: play.google.com
Asegrese de que el
producto es an
utilizable con tamaos
de fuente grandes. Es el
texto an legible cuando
un usuario maximiza la
pantalla o ampla la
fuente?
Fuente: google.com
Controles interactivos claros y
visibles
Texto alternativo para imgenes
y video
Orientacin y ayuda
Sentido a los vnculos
1. Layout Templates
2. Sticker Sheets
3. Roboto Font
4. Color Palettes
http://www.google.com/design/spec/material-
design
https://developer.android.com
https://www.google.com
https://play.google.com

You might also like