37
USABILIDAD Introducción al desarrollo web http://idesweb.es/ Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos Universidad de Alicante (España) IDW-UsaWeb-01

AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

  • Upload
    others

  • View
    0

  • Download
    0

Embed Size (px)

Citation preview

Page 1: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Usabilidad: principios básicos

Sergio Luján Mora

Departamento de Lenguajes y Sistemas Informáticos

Universidad de Alicante (España)

IDW-UsaWeb-01

Page 2: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Contacto • http://gplsi.dlsi.ua.es/~slujan/

• http://accesibilidadenlaweb.blogspot.com.es/

• http://accesibilidadweb.dlsi.ua.es/

• http://desarrolloweb.dlsi.ua.es/

• http://www.youtube.com/user/sergiolujanmora

[email protected]

• @sergiolujanmora

Page 3: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

¿Qué es la usabilidad?

Page 4: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

¿Cuándo un sistema es usable?

Page 5: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

¿Cómo se mejora la usabilidad?

Page 6: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Usabilidad Usable

Facilidad de uso

Page 7: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

ISO/IEC 9126 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 9241 Usabilidad es la eficacia, eficiencia y satisfacción con la que un producto permite alcanzar objetivos específicos a usuarios específicos en un contexto de uso específico.

Page 8: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Principios básicos

Page 9: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Tres consejos

Page 10: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Piensa en el usuario Piensa en el usuario Piensa en el usuario

Page 11: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

¡No pienses en ti!

Page 12: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Formato de entrada “normal” de una fecha: - Mes - Día - Año (Mejor si también dejase usar “-” y “.” como separador)

“Normal” según el país, en España lo

normal es

día/mes/año

Ejemplo real extraído del sitio web de una

aerolínea importante

Page 13: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Entrada adaptada al formato de la base de datos (año-mes-día), pero no al formato del usuario

Por lo menos no lo han pedido en tiempo Unix: la cantidad de segundos transcurridos desde la medianoche UTC del 1 de enero de 1970

Page 14: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Principios básicos

1 2 3

4

Page 15: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Conoce al usuario

1

Page 16: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Piensa en el usuario

Page 17: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Conocimientos Destrezas Ambiente Propósito

Expectativas

Page 18: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Minimiza la memorización

2

Page 19: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Page 20: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Page 21: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Sustituir la entrada de datos por la selección de elementos

Page 22: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Usar nombres en vez de números

Page 23: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Ofrecer un comportamiento predecible

Page 24: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Optimiza las operaciones

3

Page 25: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/ Facilitar la rápida ejecución de las

operaciones más comunes

Respetar la inercia del interfaz

Reducir el esfuerzo de la interacción

Reorganizar el sistema en función de la interacción del usuario

Page 26: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Gestiona los errores

4

Page 27: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Page 28: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/ Ofrecer buenos mensajes de error

Evitar los errores más comunes

Deshacer las acciones realizadas

Redundancia

Garantizar la integridad de la información

Page 29: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Conoce al usuario 1

Minimiza la memorización 2

Optimiza las operaciones 3

Gestiona los errores 4

Page 30: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Page 31: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Page 32: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Page 33: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Page 34: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

¿Cómo puede ser que 40 años después,

la gente siga cometiendo

los mismos errores?

Page 35: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Piensa en el usuario

Page 36: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

http://idesweb.es/

[email protected] @idesweb

Page 37: AD Usabilidad: principios básicos web... · AD Introducción al desarrollo web Usabilidad: principios básicos Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

USA

BIL

IDA

D

Introducción al desarrollo web http://idesweb.es/

Créditos de las imágenes y fotografías http://www.sxc.hu/photo/1125736

http://www.sxc.hu/photo/308374

http://www.sxc.hu/photo/1285565

http://dl.acm.org/citation.cfm?id=1479159