¿Que es la usabilidad?
-
Upload
itertulia-podcast -
Category
Business
-
view
2.385 -
download
1
description
Transcript of ¿Que es la usabilidad?
![Page 1: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/1.jpg)
¿Qué es usabilidad?El papel del diseño en los sistemas web
Basado en el artículo What is Usability? de Nigel Bevana, Jurek Kirakowskib y Jonathan Maissela
MDI Luis Arturo Domínguez
@ladbrito
![Page 2: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/2.jpg)
Fundamentos del diseño II¿Qué es usabilidad?
Con el término usabilidad, pasó lo mismo.
Hay todavía muchas aproximaciones sobre hacerun producto usable, y no hay una definiciónaceptada del término.
El término usabilidad fue acuñado hace 10 añoscon el fin de sustituir el término "amigabilidad"el cual a principios de los '80 había adquirido uncúmulo de indeseables, vagas y subjetivasconnotaciones.
![Page 3: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/3.jpg)
Fundamentos del diseño II
Orientado al"performance"
Orientadoal usuario
Orientado alproducto
Orientado alcontexto
Usabilidad
Puntos de vista sobre el concepto
![Page 4: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/4.jpg)
Fundamentos del diseño II
Orientado alproducto Usabilidad
Orientación al producto
La usabilidad puede ser medida en términosde atributos ergonómicos del producto.
![Page 5: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/5.jpg)
Fundamentos del diseño IIOrientación al producto
La flexibilidad en el uso, mínimo esfuerzo,toleracia al error entre otros son algunos de los
principios básicos del diseño universal.
![Page 6: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/6.jpg)
Fundamentos del diseño II
?
Orientación al producto
Algunos productos pueden presentar problemas ergonómicoshttp://www.baddesigns.com/examples.html
![Page 7: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/7.jpg)
Fundamentos del diseño IIOrientación al producto
Algunos elementos que deben cuidarseen las interfaces gráficas
1. Constrate y armonía de color
2. Legibilidad de textos y gráficos
3. Proporción de los elementos y jerarquía visual
4. Composición y distribución de los elementos
5. Marco de referencia (resolución)
6. Soporte tecnológico de la interfaz (ej. disp. móviles)
![Page 8: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/8.jpg)
Fundamentos del diseño IIOrientación al producto
Ejemplo: Mal manejo de color y tamaño tipográfico. Interfazeditada para mostrar mal ejemplo.
![Page 9: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/9.jpg)
Fundamentos del diseño IIOrientación al producto
Mar de texto
Ríos tipográficos
Al justificar textos en internet, los espacios entre palabrassuelen abrirse irregularmente generando "ríos tipográficos"
Esto no sucede en el buen diseño editorial porque se tienela posibilidad de partir partir las palabras últimas delrenglón ajustando el texto correctamente a la columna
Idealmente un texto en un renglón debe contener entre7 y 14 palabras por renglón. De otra forma la longitud delrenglón dificulta la lectura del renglón siguiente y cansaal lector. Lo anterior es conocido como "Mar de texto" yson comunes en muchas páginas de internet.
![Page 10: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/10.jpg)
Fundamentos del diseño IIOrientación al producto
![Page 11: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/11.jpg)
Fundamentos del diseño IIOrientación al producto
![Page 12: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/12.jpg)
Fundamentos del diseño IIOrientación al producto
Imagen del artículo: Basic Graphic Design Principles, de Bruce Ian Meader.
![Page 13: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/13.jpg)
Fundamentos del diseño IIOrientación al producto
Ubicación deelementos
Reconocimiento
Gestalt
![Page 14: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/14.jpg)
Fundamentos del diseño IIOrientaciónal producto
Peso visual
![Page 15: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/15.jpg)
Fundamentos del diseño IIOrientación al usuario
La usabilidad puede medirse en términosde esfuerzo mental y aptitud del usuario.
Orientadoal usuario
Orientado alproducto Usabilidad
![Page 16: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/16.jpg)
Fundamentos del diseño IIOrientacion al usuario
Usableal 20%
Usableal 100%
http://www.baddesigns.com/examples.html
![Page 17: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/17.jpg)
Fundamentos del diseño IIOrientacion al usuario
http://www.baddesigns.com/examples.html
![Page 18: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/18.jpg)
Fundamentos del diseño IIOrientación al usuario
http://www.baddesigns.com/examples.html
![Page 19: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/19.jpg)
Fundamentos del diseño IIOrientación al usuario
http://www.baddesigns.com/examples.html
![Page 20: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/20.jpg)
Fundamentos del diseño IIOrientación al usuario
http://www.baddesigns.com/examples.html
![Page 21: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/21.jpg)
Fundamentos del diseño IIOrientación al usuario
1. Minimizar el ruido (sólo lo necesario)
2. Capacidad para explorar vs recordar
3. Preparar las interfaces para evitar errores o corregir
4. Hacer evidente lo que se puede hacer click
5. Mantener estándares y coherencia estética
6. Establecer buena navegación
7. Capacidad de configurar y personalizar la interfaz
Algunos elementos que deben cuidarseen las interfaces gráficas
"No me hagas pensar" (Steve Krug)
![Page 22: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/22.jpg)
Fundamentos del diseño IIOrientación al usuario
Minimizar el ruido (sólo lo necesario)
![Page 23: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/23.jpg)
Fundamentos del diseño IIOrientación al usuario
Minimizar el ruido (sólo lo necesario) Mal. Texto decorativo que confunde.
![Page 24: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/24.jpg)
Fundamentos del diseño IIOrientación al usuario
Minimizar el ruido (sólo lo necesario)http://www.baddesigns.com/examples.html
![Page 25: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/25.jpg)
Fundamentos del diseño IIOrientación al usuario
Hacer evidente lo que se puede hacer click
Del libro "No me hagas pensar" de Steve Krug.
![Page 26: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/26.jpg)
Fundamentos del diseño IIOrientación al usuario
MAL: La etiqueta"BIOTECHNOLOGY"parece un hipervínculodado que está subrayadopero NO lo es.
Mantener estándares
![Page 27: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/27.jpg)
Fundamentos del diseño IIOrientación al usuario
coherencia estética
![Page 28: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/28.jpg)
Fundamentos del diseño IIOrientación al usuario
Capacidad para explorar vs recordar
MAL: No sabes que hayen esa opción hastaque pasas el cursorpor encima del botón.
![Page 29: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/29.jpg)
Fundamentos del diseño IIOrientación al usuario
Preparar las interfaces paraevitar errores o corregirlos.
BIEN: El sitio usa menúsdesplegables para evitarque el usuario introduzcadatos inválidos.
![Page 30: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/30.jpg)
Fundamentos del diseño IIOrientación al usuario
MAL: El banner superior compitey desplaza al contenido del sitio.
![Page 31: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/31.jpg)
Fundamentos del diseño IIOrientación al usuario
Buena navegación
Simplicidad
![Page 32: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/32.jpg)
Fundamentos del diseño II
La usabilidad puede medirse examinando como los usuariosinteractúan con el producto con particular énfasis en:
Facilidad de uso: Qué tan fácil es de usar el producto
Aceptabilidad: Qué tanto el producto va a ser usado en el mundo real.
Orientado al"performance"
Orientadoal usuario
Orientado alproducto Usabilidad
Orientación al "performance"
![Page 33: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/33.jpg)
Fundamentos del diseño IIOrientación al performance
http://www.baddesigns.com/examples.html
![Page 34: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/34.jpg)
Fundamentos del diseño IIOrientación al performance
Algunos elementos que deben cuidarseen las interfaces gráficas
1. Promover el sitio o sistema
2. Enfocar la interfaz a las necesidades reales y manifiestas del usuario
3. Establecer aceleradores (Shortcuts)
4. Diseñar en función de condiciones de uso
4. Proporcionar descargas o contenidos que el usuario necesite.
![Page 35: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/35.jpg)
Fundamentos del diseño IIOrientación al performance
Interfaz que se utilizaba sólo para el Log In. El resto de los elementos no eran muy utilizados.
![Page 36: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/36.jpg)
Fundamentos del diseño IIOrientación al performance
Rediseño de la interfaz anterior incluye "shortcuts" a los sitios más utilizados por los usuarios.
Área deligas
directas
![Page 37: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/37.jpg)
Fundamentos del diseño IIOrientación al performance
![Page 38: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/38.jpg)
Fundamentos del diseño IIOrientación al performance
![Page 39: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/39.jpg)
Fundamentos del diseño II
Orientado al"performance"
Orientadoal usuario
Orientado alproducto
Orientado alcontexto
Usabilidad
La usabilidad de un producto está en función de un usuarioen particular o clase de usuarios que son estudiados porla tarea que realizan y el ambiente en el cual trabajan.
Orientación al contexto
![Page 40: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/40.jpg)
Fundamentos del diseño IIOrientación al contexto
Algunos elementos que deben cuidarseen las interfaces gráficas
1. Identidad (Que el sitio o aplicación parezca...)
2. Atender al lenguage y cultura del grupo
3. Realizar la interfaz de acuerdo a la nivel de entendimiento y capacidades del usuario. (Digital Literacy)
4. Responder a los conocimientos y terminos del grupo.
![Page 41: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/41.jpg)
Fundamentos del diseño IIOrientación al contexto
Dos interfaces del mismo emisor. A toda vista se notaque van dirigidos a dos públicos diferentes.
![Page 42: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/42.jpg)
Fundamentos del diseño IIOrientación al contexto
![Page 43: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/43.jpg)
Fundamentos del diseño IIOrientación al contexto
![Page 44: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/44.jpg)
Fundamentos del diseño IIOrientación al contexto
Iconos difíciles de comprender para un público ajeno, perofáciles de identificar para los usuarios reales del sistema.
![Page 45: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/45.jpg)
Fundamentos del diseño II
Tarea
Atributos delproducto
Determinantes de usabilidad
Atributos del producto de los cualesel usuario está conciente
Experiencia del usuario con el producto
Contextoorganizacional
Contextoambiental
Entendimientoy esfuerzo
mentalAptitud
Esquema completo: Bevana, Nigel , Et al.
![Page 46: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/46.jpg)
Fundamentos del diseño IIVarias definiciones
"Un conjunto de atributos de software los cualesdosifican el esfuerzo necesario para el uso en laevaluación de tal uso…"(Estándar ISO 1991b) orientada al usuario
"La efectividad, eficiencia y satisfacción con la cualusuarios específicos pueden lograr metas específicasen un ambiente en particular". ISO (Broke et al 1990)orientada al uso, al usuario y al contexto
"El grado en el cual los usuarios son capaces de usarel sistema con las habilidades, conocimiento,estereotipos y experiencia que ellos pueden traer paraaportar." (Eason, 1988) - orientada a "facilidad de uso"
Usabilidad es...
![Page 47: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/47.jpg)
Fundamentos del diseño IIVarias definiciones
La usabilidad está en función de la facilidadde uso (incluyendo el aprendizaje|"learnability"| cuando sea relevante) y laaceptabilidad del producto que determinaráel uso actual para un usuario particular, unatarea en particular y en un particularcontexto.
La posición adoptada por el proyecto ESPRIT MUSiC es que una definición completa de usabilidad debecontener todos estos puntos de vista.
![Page 48: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/48.jpg)
Fundamentos del diseño II
Usabilidad
La facilidad de uso y la aceptabilidad deun sistema o producto para una clase enparticular de usuarios, soportando tareasespecíficas en un ambiente específico;donde "la facilidad de uso" afecta elperformance del usuario y la satisfacción,y la "aceptabilidad" afecta si el productoes usado o no.
Definición
![Page 49: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/49.jpg)
Fundamentos del diseño IIInspección de usabilidad
1. Evaluación Heurística: Se inspecciona una interfaz usando unalista pequeña de principios generales y se produce una lista de posiblesproblemas.
2. Guías de diseño: Consiste en revisar una interfaz contra una listadetallada de directrices específicas, el resultado produce una lista delas desviaciones de las directrices.
3. Paseo Cognitivo: Consiste en recorrer el camino correcto paraalcanzar una tarea típica del sistema como si fueramos un usuarionovato señalando en cada paso el posible exito o fracaso.(análisis de la facilidad de aprendizaje)
4. Puntaje: Se evalua la interfaz contra una lista detallada de directricesespecíficas y se genera una puntuación total que representa el grado enque la interfaz sigue las directrices.
5. Análisis de Acciones: Se estima el tiempo que un usuario expertonecesita para completar una tarea dada. (análisis de eficiencia)
![Page 50: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/50.jpg)
Fundamentos del diseño II
"Diseño no es valor agregado es valor"
Gui Bonsiepe
Imagen portada del libro"The Design of EverydayThings" de Donald Norman.
![Page 51: ¿Que es la usabilidad?](https://reader034.fdocuments.mx/reader034/viewer/2022042700/55872b7ed8b42a86598b46db/html5/thumbnails/51.jpg)
Fundamentos del diseño II
Referencias
Bevana, Nigel , Et al. "What is Usability?" Proceedings of the 4th International Conferenceon HCI, Stuttgart, September 1991
Krug, Steve, "No me hagas pensar", Prentice-Hall, 2006.
Norman, Donald. "The Design of Everyday Things", The MIT press,2000
Meader, Bruce Ian, "Basic Graphic Design Principles", Rochester Institute of Technology,Graphic Design Department, 1998.