You are on page 1of 51

¿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
Fundamentos del diseño II
¿Qué es usabilidad?
Con el término usabilidad, pasó lo mismo.
Hay todavía muchas aproximaciones sobre hacer
un producto usable, y no hay una definición
aceptada del término.
El término usabilidad fue acuñado hace 10 años
con el fin de sustituir el término "amigabilidad"
el cual a principios de los '80 había adquirido un
cúmulo de indeseables, vagas y subjetivas
connotaciones.
Fundamentos del diseño II
Orientado al
"performance"
Orientado
al usuario
Orientado al
producto
Orientado al
contexto
Usabilidad
Puntos de vista sobre el concepto
Fundamentos del diseño II
Orientado al
producto
Usabilidad
Orientación al producto
La usabilidad puede ser medida en términos
de atributos ergonómicos del producto.
Fundamentos del diseño II
Orientació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.
Fundamentos del diseño II
?
Orientación al producto
Algunos productos pueden presentar problemas ergonómicos
http://www.baddesigns.com/examples.html
Fundamentos del diseño II
Orientación al producto
Algunos elementos que deben cuidarse
en 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)
Fundamentos del diseño II
Orientación al producto
Ejemplo: Mal manejo de color y tamaño tipográfico. Interfazeditada para mostrar mal ejemplo.
Fundamentos del diseño II
Orientación al producto
Mar de texto
Ríos tipográficos
Al justificar textos en internet, los espacios entre palabras
suelen abrirse irregularmente generando "ríos tipográficos"
Esto no sucede en el buen diseño editorial porque se tiene
la posibilidad de partir partir las palabras últimas del
renglón ajustando el texto correctamente a la columna
Idealmente un texto en un renglón debe contener entre
7 y 14 palabras por renglón. De otra forma la longitud del
renglón dificulta la lectura del renglón siguiente y cansa
al lector. Lo anterior es conocido como "Mar de texto" y
son comunes en muchas páginas de internet.
Fundamentos del diseño II
Orientación al producto
Fundamentos del diseño II
Orientación al producto
Fundamentos del diseño II
Orientación al producto
Imagen del artículo: Basic Graphic Design Principles, de Bruce Ian Meader.
Fundamentos del diseño II
Orientación al producto
Ubicación de
elementos
Reconocimiento
Gestalt
Fundamentos del diseño II
Orientaciónal producto
Peso visual
Fundamentos del diseño II
Orientación al usuario
La usabilidad puede medirse en términos
de esfuerzo mental y aptitud del usuario.
Orientado
al usuario
Orientado al
producto
Usabilidad
Fundamentos del diseño II
Orientacion al usuario
Usable
al 20%
Usable
al 100%
http://www.baddesigns.com/examples.html
Fundamentos del diseño II
Orientacion al usuario
http://www.baddesigns.com/examples.html
Fundamentos del diseño II
Orientación al usuario
http://www.baddesigns.com/examples.html
Fundamentos del diseño II
Orientación al usuario
http://www.baddesigns.com/examples.html
Fundamentos del diseño II
Orientación al usuario
http://www.baddesigns.com/examples.html
Fundamentos del diseño II
Orientació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 cuidarse
en las interfaces gráficas
"No me hagas pensar" (Steve Krug)
Fundamentos del diseño II
Orientación al usuario
Minimizar el ruido (sólo lo necesario)
Fundamentos del diseño II
Orientación al usuario
Minimizar el ruido (sólo lo necesario)
Mal. Texto decorativo que confunde.
Fundamentos del diseño II
Orientación al usuario
Minimizar el ruido (sólo lo necesario)
http://www.baddesigns.com/examples.html
Fundamentos del diseño II
Orientación al usuario
Hacer evidente lo que se puede hacer click
Del libro "No me hagas pensar" de Steve Krug.
Fundamentos del diseño II
Orientación al usuario
MAL: La etiqueta
"BIOTECHNOLOGY"
parece un hipervínculo
dado que está subrayado
pero NO lo es.
Mantener estándares
Fundamentos del diseño II
Orientación al usuario
coherencia estética
Fundamentos del diseño II
Orientación al usuario
Capacidad para explorar vs recordar
MAL: No sabes que hay
en esa opción hasta
que pasas el cursor
por encima del botón.
Fundamentos del diseño II
Orientación al usuario
Preparar las interfaces para
evitar errores o corregirlos.
BIEN: El sitio usa menús
desplegables para evitar
que el usuario introduzca
datos inválidos.
Fundamentos del diseño II
Orientación al usuario
MAL: El banner superior compite
y desplaza al contenido del sitio.
Fundamentos del diseño II
Orientación al usuario
Buena navegación
Simplicidad
Fundamentos del diseño II
La usabilidad puede medirse examinando como los usuarios
interactú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"
Orientado
al usuario
Orientado al
producto
Usabilidad
Orientación al "performance"
Fundamentos del diseño II
Orientación al performance
http://www.baddesigns.com/examples.html
Fundamentos del diseño II
Orientación al performance
Algunos elementos que deben cuidarse
en 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.
Fundamentos del diseño II
Orientación al performance
Interfaz que se utilizaba sólo para el Log In. El resto de los elementos no eran muy utilizados.
Fundamentos del diseño II
Orientación al performance
Rediseño de la interfaz anterior incluye "shortcuts" a los sitios más utilizados por los usuarios.
Área de
ligas
directas
Fundamentos del diseño II
Orientación al performance
Fundamentos del diseño II
Orientación al performance
Fundamentos del diseño II
Orientado al
"performance"
Orientado
al usuario
Orientado al
producto
Orientado al
contexto
Usabilidad
La usabilidad de un producto está en función de un usuario
en particular o clase de usuarios que son estudiados por
la tarea que realizan y el ambiente en el cual trabajan.
Orientación al contexto
Fundamentos del diseño II
Orientación al contexto
Algunos elementos que deben cuidarse
en 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.
Fundamentos del diseño II
Orientación al contexto
Dos interfaces del mismo emisor. A toda vista se nota
que van dirigidos a dos públicos diferentes.
Fundamentos del diseño II
Orientación al contexto
Fundamentos del diseño II
Orientación al contexto
Fundamentos del diseño II
Orientación al contexto
Iconos difíciles de comprender para un público ajeno, pero
fáciles de identificar para los usuarios reales del sistema.
Fundamentos del diseño II
Tarea
Atributos del
producto
Determinantes de usabilidad
Atributos del producto de los cuales
el usuario está conciente
Experiencia del usuario con el producto
Contexto
organizacional
Contexto
ambiental
Entendimiento
y esfuerzo
mental
Aptitud
Esquema completo: Bevana, Nigel , Et al.
Fundamentos del diseño II
Varias definiciones
"Un conjunto de atributos de software los cuales
dosifican el esfuerzo necesario para el uso en la
evaluación de tal uso…"
(Estándar ISO 1991b) orientada al usuario
"La efectividad, eficiencia y satisfacción con la cual
usuarios específicos pueden lograr metas específicas
en 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 usar
el sistema con las habilidades, conocimiento,
estereotipos y experiencia que ellos pueden traer para
aportar." (Eason, 1988) - orientada a "facilidad de uso"
Usabilidad es...
Fundamentos del diseño II
Varias definiciones
La usabilidad está en función de la facilidad
de uso (incluyendo el aprendizaje
|"learnability"| cuando sea relevante) y la
aceptabilidad del producto que determinará
el uso actual para un usuario particular, una
tarea en particular y en un particular
contexto.
La posición adoptada por el proyecto ESPRIT MUSiC
es que una definición completa de usabilidad debe
contener todos estos puntos de vista.
Fundamentos del diseño II
Usabilidad
La facilidad de uso y la aceptabilidad de
un sistema o producto para una clase en
particular de usuarios, soportando tareas
específicas en un ambiente específico;
donde "la facilidad de uso" afecta el
performance del usuario y la satisfacción,
y la "aceptabilidad" afecta si el producto
es usado o no.
Definición
Fundamentos del diseño II
Inspección de usabilidad
Fundamentos del diseño II
"Diseño no es valor agregado es valor"
Gui Bonsiepe
Imagen portada del libro
"The Design of Everyday
Things" de Donald Norman.
Fundamentos del diseño II
Referencias
Bevana, Nigel , Et al. "What is Usability?" Proceedings of the 4th International Conference
on 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.