Top Banner
[email protected] · @darmng
150

¿Usabilidad móvil?

Jul 27, 2015

Download

Design

Dani Armengol
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: ¿Usabilidad móvil?

[email protected] · @darmng

Page 2: ¿Usabilidad móvil?
Page 3: ¿Usabilidad móvil?
Page 4: ¿Usabilidad móvil?
Page 5: ¿Usabilidad móvil?
Page 6: ¿Usabilidad móvil?
Page 7: ¿Usabilidad móvil?
Page 8: ¿Usabilidad móvil?
Page 9: ¿Usabilidad móvil?
Page 10: ¿Usabilidad móvil?
Page 11: ¿Usabilidad móvil?
Page 12: ¿Usabilidad móvil?
Page 13: ¿Usabilidad móvil?
Page 14: ¿Usabilidad móvil?
Page 15: ¿Usabilidad móvil?
Page 16: ¿Usabilidad móvil?
Page 17: ¿Usabilidad móvil?
Page 18: ¿Usabilidad móvil?
Page 19: ¿Usabilidad móvil?
Page 20: ¿Usabilidad móvil?

UX

Buenos contenidos

Acceso a contenidos

Page 21: ¿Usabilidad móvil?

UX

Buenos contenidos

Acceso a contenidos

Page 22: ¿Usabilidad móvil?

UX

Buenos contenidos

Acceso a contenidos

Page 23: ¿Usabilidad móvil?

UX

Buenos contenidos

Acceso a contenidos

Page 24: ¿Usabilidad móvil?

UX

Buenos contenidos

Acceso a contenidos

Page 25: ¿Usabilidad móvil?

UX

Buenos contenidos

Acceso a contenidos

Page 26: ¿Usabilidad móvil?
Page 27: ¿Usabilidad móvil?
Page 28: ¿Usabilidad móvil?
Page 29: ¿Usabilidad móvil?

“La usabilidad se refiere a la capacidad de un software de ser comprendido, aprendido, usado y ser atractivo para el usuario en condiciones específicas de uso”

ISO/IEC 9126

Page 30: ¿Usabilidad móvil?
Page 31: ¿Usabilidad móvil?
Page 32: ¿Usabilidad móvil?
Page 33: ¿Usabilidad móvil?
Page 34: ¿Usabilidad móvil?
Page 35: ¿Usabilidad móvil?
Page 36: ¿Usabilidad móvil?
Page 37: ¿Usabilidad móvil?
Page 38: ¿Usabilidad móvil?

Foto de flickr/Clive Fint

“Mobile refers to the user, and not the device or the application”.

Barbara Ballard

Page 39: ¿Usabilidad móvil?

• Conexiones lentas e intermitentes

• Pantallas pequeñas

• Variedad de dispositivos

• Interacción táctil

• Sujeción con una mano

• Contexto móvil

Page 40: ¿Usabilidad móvil?
Page 41: ¿Usabilidad móvil?
Page 42: ¿Usabilidad móvil?
Page 43: ¿Usabilidad móvil?

"Porcentaje de población cubierta por alguna red de cuarta generación 4G/LTE" (CNMC, 2014)

Page 44: ¿Usabilidad móvil?

Cobertura 4G Movistar http://www.movistar.es/particulares/coberturas/movil (Febrero 2015)

Page 45: ¿Usabilidad móvil?

Cobertura 4G Vodafone http://www.vodafone.es/conocenos/es/cobertura-y-tiendas/ (Febrero 2015)

Page 46: ¿Usabilidad móvil?

"Población con acceso a redes 3G/UMTS" (CNMC, 2014)

Page 47: ¿Usabilidad móvil?

Cobertura 3G Movistar (Febrero 2015)

Page 48: ¿Usabilidad móvil?

GRPS

EDGE

3G

ADSL

GPRS

UMTS

Page 49: ¿Usabilidad móvil?

GRPS

EDGE

3G

ADSL inmediato

1 segundo

3 segundos

12 segundosGPRS

UMTS

Page 50: ¿Usabilidad móvil?

GRPS

EDGE

3G

ADSL inmediato

7 segundos

medio minuto

GPRS 2 minutos

UMTS

Page 51: ¿Usabilidad móvil?
Page 52: ¿Usabilidad móvil?
Page 53: ¿Usabilidad móvil?
Page 54: ¿Usabilidad móvil?

NO!

Page 55: ¿Usabilidad móvil?
Page 56: ¿Usabilidad móvil?
Page 57: ¿Usabilidad móvil?
Page 58: ¿Usabilidad móvil?

19”4”

Page 59: ¿Usabilidad móvil?
Page 60: ¿Usabilidad móvil?
Page 61: ¿Usabilidad móvil?
Page 62: ¿Usabilidad móvil?
Page 63: ¿Usabilidad móvil?
Page 64: ¿Usabilidad móvil?
Page 65: ¿Usabilidad móvil?
Page 66: ¿Usabilidad móvil?
Page 67: ¿Usabilidad móvil?
Page 68: ¿Usabilidad móvil?
Page 69: ¿Usabilidad móvil?

69

19”1440x900px

3,5”640x960px

Page 70: ¿Usabilidad móvil?
Page 71: ¿Usabilidad móvil?

Un CSS px es una unidad angular, no de longitud...

“the visual angle of one pixel on a device witha pixel density of 96dpi and a distance fromthe reader of an arm's length. For a nominal arm's length of 28 inches, the visual angle istherefore about 0.0213 degrees. For readingat arm's length, 1px thus corresponds to about 0.26 mm (1/96 inch). “

Page 72: ¿Usabilidad móvil?
Page 73: ¿Usabilidad móvil?
Page 74: ¿Usabilidad móvil?
Page 75: ¿Usabilidad móvil?

Quirksmode.org

Page 76: ¿Usabilidad móvil?
Page 77: ¿Usabilidad móvil?
Page 78: ¿Usabilidad móvil?

Addy Osmani

Page 79: ¿Usabilidad móvil?
Page 80: ¿Usabilidad móvil?

19 mm

Page 81: ¿Usabilidad móvil?
Page 82: ¿Usabilidad móvil?
Page 83: ¿Usabilidad móvil?
Page 84: ¿Usabilidad móvil?

Microsoft

Page 85: ¿Usabilidad móvil?
Page 86: ¿Usabilidad móvil?
Page 87: ¿Usabilidad móvil?
Page 88: ¿Usabilidad móvil?

Tamaño real (visual) del botón

9,00mm es el tamaño recomendado (tasa de error del 1,6%)

7,00mm es un tamaño aceptable (48 CSS pixels)

Page 89: ¿Usabilidad móvil?

2mm (al menos) de separación visual reduce la percepción de dificultad.

Separación visual

Page 90: ¿Usabilidad móvil?
Page 91: ¿Usabilidad móvil?
Page 92: ¿Usabilidad móvil?
Page 93: ¿Usabilidad móvil?

93

Fuente: Barron Cuadrro [http://barroncuadro.com]

Page 94: ¿Usabilidad móvil?
Page 95: ¿Usabilidad móvil?
Page 96: ¿Usabilidad móvil?
Page 97: ¿Usabilidad móvil?
Page 98: ¿Usabilidad móvil?
Page 99: ¿Usabilidad móvil?
Page 100: ¿Usabilidad móvil?
Page 101: ¿Usabilidad móvil?
Page 102: ¿Usabilidad móvil?
Page 103: ¿Usabilidad móvil?
Page 104: ¿Usabilidad móvil?
Page 105: ¿Usabilidad móvil?
Page 106: ¿Usabilidad móvil?
Page 107: ¿Usabilidad móvil?
Page 108: ¿Usabilidad móvil?
Page 109: ¿Usabilidad móvil?

109

Page 110: ¿Usabilidad móvil?
Page 111: ¿Usabilidad móvil?
Page 112: ¿Usabilidad móvil?
Page 113: ¿Usabilidad móvil?
Page 114: ¿Usabilidad móvil?
Page 115: ¿Usabilidad móvil?
Page 116: ¿Usabilidad móvil?
Page 117: ¿Usabilidad móvil?
Page 118: ¿Usabilidad móvil?

?

Page 119: ¿Usabilidad móvil?

Quirksmode.org

Page 120: ¿Usabilidad móvil?
Page 121: ¿Usabilidad móvil?
Page 122: ¿Usabilidad móvil?

Foto de flickr/Josh Liba

Page 123: ¿Usabilidad móvil?

Foto de flickr/Jaymi Heimbuch

Page 124: ¿Usabilidad móvil?

Steven Hoober “How Do Users Really Hold Mobile Devices?”

Page 125: ¿Usabilidad móvil?
Page 126: ¿Usabilidad móvil?
Page 127: ¿Usabilidad móvil?
Page 128: ¿Usabilidad móvil?
Page 129: ¿Usabilidad móvil?
Page 130: ¿Usabilidad móvil?

Steven Hoober “How Do Users Really Hold Mobile Devices?”

Page 131: ¿Usabilidad móvil?
Page 132: ¿Usabilidad móvil?
Page 133: ¿Usabilidad móvil?
Page 134: ¿Usabilidad móvil?

Foto de flickr/NoHoDamon

Atención parcial

Apertura social que predispone a interrupciones

Mecanismos de navegación “ocupados”

etc.

134

Page 135: ¿Usabilidad móvil?
Page 136: ¿Usabilidad móvil?

11Mark. Octubre 2011. Usuarios EEUU.

Page 137: ¿Usabilidad móvil?

11Mark. Octubre 2011. Usuarios EEUU.

Page 138: ¿Usabilidad móvil?

11Mark. Octubre 2011. Usuarios EEUU.

Page 139: ¿Usabilidad móvil?

Foto de flickr/lschoen

“Unlike the static and predictable PC context, the mobile context is a lot like life. It’s unpredictable, ambiguous . . . it’s everywhere”.

Rachel Hinman

Page 140: ¿Usabilidad móvil?

“cut features, to eliminate things that are not core to the mobile use case”.

Jakob Nielsen

Page 141: ¿Usabilidad móvil?

3

13

2.600

700.000Techcrunch, octubre 2011 (desde apps)

compras cada segundo

piezas de ropa, zapatos o accesorios cada minuto

vehículos cada semana (3 o 4 Ferraris al mes)

artículos puestos a la venta cada semana

Page 142: ¿Usabilidad móvil?

“cut features, to eliminate things that are not core to the mobile use case”.

Jakob Nielsen

“Every time you assume someone won’t want to do something on mobile, you’re wrong”.

Josh Clark

Page 143: ¿Usabilidad móvil?
Page 144: ¿Usabilidad móvil?

Luke Wroblewski

Page 145: ¿Usabilidad móvil?
Page 146: ¿Usabilidad móvil?
Page 147: ¿Usabilidad móvil?
Page 148: ¿Usabilidad móvil?

“The fundamental distinction between mobile-targeted design and design targeted for other platforms is The Carry Principle: the user typically carries the device, all the time”.

Barbara Ballard

Page 149: ¿Usabilidad móvil?

Implicaciones en el dispositivo:• Dimensiones

• Pantalla pequeña• Teclado pequeño (si hay)

• Limitaciones ergonómicas…• …

• Autonomía• Uso de batería

• Interruptibilidad• Priorización técnica de poco consumo

• CPUs poco potentes• Aplicaciones lentas…

• Comunicación inalámbrica

Page 150: ¿Usabilidad móvil?

[email protected] · @darmng