Este documento presenta una lección sobre diseño de interfaces de usuario centrado en el usuario. Explica la importancia de comprender a los usuarios y las tareas que realizan, y describe las etapas del proceso de diseño centrado en el usuario, incluido el análisis de requisitos, generación de prototipos, implementación y evaluación. El objetivo es capacitar a los estudiantes para diseñar interfaces que sean útiles, usables y satisfactorias para los usuarios.

1. Diseño de Interfaces de Usuarios
¿IU de la fama o vergüenza?
Diseño de Interfaces Profesor:
de Usuarios
Diaz Muñante Jorge
Ciclo 2012-1
Diseño Centrado en el Usuario
¿Como se interactúa con esta tacho de basura?
¿IU de la fama o vergüenza?
Outlook Express no puede empezar porque ha fallado al esperar sobre un mutex del sistema.
El computador puede tener poca memoria o es inestable.
¿ .. ?
¿en qué me equivoque?. Obliga a re-llamar.
Se abre empujando por uno de los lados
No es visible ni evidente ¡¡
IU a la fama o la verguenza Objetivos de hoy
Al final de la clase debemos ser capaces de:
– Describir las razones del porque es importante comprender
a los usuarios del sistema.
• Diferencias individuales
• Habilidades
• Conocimiento
• Destreza
• Experiencia
– Describir las razones del porque es importante comprender
las tareas que el usuario realiza con el sistema.
Diaz Muñante Jorge 1

2. Diseño de Interfaces de Usuarios
Diseño de Interfaz e Ingeniería de Usabilidad Diseño de Interfaz e Ingeniería de Usabilidad
Diseño : Tormenta Diseño Refinado Diseño
* Usuario ? Metas Terminado
Metas * Tarea Clave ? de Ideas
M M
Diseño Centrado Sicologia de Diseño con
E Cada cosa E Pantallas Graf.
en la Tarea Pruebas
T Interaccion
T Pruebas
de Uso
O Diseño Envolviendo Participativa O Guias de de
Evaluación al Interfaces Campo
D Participativo D Evaluac.
Usuario Escenario
O O Guias de Heuristica
Diseño centrado de tareas
S en el Usuario Metáforas S estilos
Prototipos
Prototipos de Alta Fidelidad
de Baja Prototipos
Descripción Sistema Alfa /Beta
Productos de Tareas
Fidelidad Salida: Productos Probables
o Especificaciones
Prototipos en
y Usuarios Terminadas
Papel
Etapas y tareas del ciclo Proceso del diseño (Koberg & Bagnall)
Diseño
– Analisis de requerimientos del producto
– Analisis de tareas
– Conocimiento del usuario
– Generación de posibles metáforas y análisis de tipo de
diálogo.
– Revisión de posibilidades para la implementación
Etapas y tareas (cont..) Etapas y tareas (cont..)
Implementación Evaluación
– Generación de prototipos (para investigación general o – Conclusión (análisis de los datos, elaboración del
de ajustes). informe, resultados y recomendaciones).
– Desarrollo de la aplicación, sitio o sistema. – Comparación contra estándares (internos y/o externos),
Medición (Test de usabilidad) versiones anteriores del mismo producto y productos
competidores.
– Planificación (desarrollo del plan, definición de las
– Verificación de las diferencias.
medidas, selección de participantes, formación de
observadores, preparación de los materiales. – Generación de nuevas metas.
– Test (Prueba piloto, tests con usuarios) ¿cómo se articula el DIU en el marco de un proyecto?
Diaz Muñante Jorge 2

3. Diseño de Interfaces de Usuarios
Diseño centrado en el Usuario / Iterativo Diseño centrado en el usuario
El diseño esta basado en el usuario: Inicio
– Habilidades y necesidades reales
Requirimiento Nosotros diseñamos las
– Contexto IU aqui
– Trabajo Especificacion
– Tareas Nosotros lo verificamos
Diseño aca
La regla de oro del Diseño de Interfaz“Conozca al
usuario” Implementacion
Pruebas ¿no es muy tarde?
Diseño centrado en el usuario ISO 13407
Por eso, debemos estudiar: 1. Planear el Proceso
Inicio Centrado en el Usuario
– Diseño IU
Requirimientos – Principios de usabilidad
Completado
DCU + Pruebas
Especificaciones
– Diseño centrado en el usuario 2. Especificar el
contexto de uso
Diseño
5. Evaluar diseño vs 3. Especificar los
Implementacion requerimientos del requerimientos
usuario organizacionales y del
usuario
Pruebas
4. Producir soluciones
de diseño
Comprendiendo el usuario ¿por qué estudiar al usuario?
Para diseñar una interfaz eficiente y eficaz es Porque los usuarios son quienes deciden usar el sistema, NO
el diseñador !!!
necesario conocer lo siguiente:
Cuanto mas conocemos al usuario, mejor sera nuestro
– ¿quiénes son los usuarios? diseño.
– ¿cuáles son sus tareas? Si el usuario no participa en el diseño, es muy probable que
– ¿cuál es el ambiente en donde ellos trabajan? falle
Estudiamos al usuario para contestar:
– ¿qué caracteristicas individuales afectan su conducta?
– ¿qué conocimientos y experiencias tienen?
– ¿qué valores tienen en su trabajo? (motivacion,
capacitación)
– ¿qué clases de herramientas usan?
Diaz Muñante Jorge 3

4. Diseño de Interfaces de Usuarios
¿quiénes son los usuarios? Características personales
El mejor paso para aprender de los usuarios es Conocimiento y experiencia
estudiarlos en su campo – niveles de educacion
– Visite a los usuarios y observe como trabajan – Nivel de lectura / Lenguaje nativo
Pero: ¿quiénes son los usuarios? – Algunas destrezas
– Las personas que compran software para que otros lo use, – Nivel de conocimiento de sistemas
NO son los usuarios. – Nivel de experiencia/facilidad en usar sistemas o
– Los supervisores no son los usuarios. computadoras en general.
– Expertos en sw pueden ser usuarios, pero no son – Nivel de experiencia/experto en las tareas.
representativos en forma completa. – Aspectos particulares de la tarea que pueden ser muy
familiar.
Identificando al usuario Diferencias individuales
Meta: Identificar quien interactua con la interfaz Diseñadores IU pueden considerar una variedad de
directamente o indirectamente posibles diferencias entre los usuarios.
Hacer: – Características personales
– Una lista preliminar de los usuarios – Habilidades físicas
– Crear una matrix para identificar las principales tareas a – Suposiciones culturales
desarrollar, y el grupo de usuarios.
– conducta y motivacion en el trabajo.
– Discuta las suposiciones acerca de los potenciales
usuarios. – Experiencia
• Educacion y experiencia previa – Educacion
• Edad, genero, diferencias físicas.
– Capacitacion
• Nivel en el trabajo, etc.
Características personales Diferencias físicas
Estilo de aprendizaje Limitaciones físicas pueden trabar al interactuar con
– Algunos prefieren que les enseñen, otros solos. la interfaz
– Tipos de asistencia – discapacitados físicos
• capacitación a distancia – Distinguir los colores
• Documentación, ayudas en línea
• Cuidado en usar los colores como simbolos.
• Tarjetas de referencias
• Soporte
– Pobre visión
– Wizards • Problemas en distinguir pequeños objetos o leer algunos fonts.
Preferencia en usar algunas herramientas
– Raton vs. raton/teclado vs. teclado
Diaz Muñante Jorge 4

5. Diseño de Interfaces de Usuarios
¿Que es la usabilidad universal? No solamente personas con necesidades especiales
De hecho para cada necesidad especial hay
Nos basaremos en la definición de diseño situaciones que las personas sin necesidades
universal…. especiales se pueden encontrar que pueden
necesitar los mismo requisitos de interfaz
Diseño universal es el proceso de diseñar productos
que sean usables por el rango mas amplio de Por ejemplo ---
personas, funcionando en el rango mas amplio de
situaciones y que es comercialmente practicable
Sin visión - ciegos -personas con ojos ocupados Diferencias culturales
-(e.g., conduciendo o en navegación telefónica)
- en oscuridad.
Poca visión - personas con -personas con un visualizador pequeño Especialmente importante cuando el producto es vendido
limitaciones --en un entorno de humos
visuales en cualquier país.
Operable sin - personas - entornos ruidosos
Problema: Puede que una palabra no signifique lo mismo
poder oir sordas - oidos ocupados de un lenguaje a otro
- silencio forzado (bibliotecas,etc..)
– ¿una palabra que en Perú tenga un significado distinto
Oido - personas - gente en entorno ruidoso en otro país?
limitado duras de oido
– ...
Operable con - personas con - personas con vestidos especiales
manualidad limitaciones - o que van en un vehiculo que se balancea – Puede usar palabras comunes en Ingles (OK, Cancel)
limitada
Operable con - Personas con - personas distraidas
cognitividad cognitividad - con pánico
limitada limitada - o bajo la influencia del alcohol
Operable sin - personas con - Personas que no conocen ese lenguaje,
lectura problemas - visitantes,
cognitivos - personas que han dejado los lentes de lectura
¿qué camisa te pondrias? Usuario y sus tareas.
Necesitamos conocer QUE y COMO ellos realizan
las cosas en el trabajo.
Impacto en el diseño
– Estilos de control mecanico como pueden afectar para
definir la nueva interfaz en la computadora.
– Cuando los usuarios tienen un nuevo producto, ellos van a
descubrir nuevas alternativas si el producto no les permiten
adecuarse a sus necesidades.
Diaz Muñante Jorge 5

6. Diseño de Interfaces de Usuarios
Controles del tiempo Clasificación en los usuarios
Tipico esquema de clasificación
– Novato
– Intermitente
– Experto/Frecuente
La clasificación nos permite generalizar a los
10 0 1
9 usuarios
8
2 2 45 – Novatos tienen ciertas características comunes, los
7 3 expertos lo mismo ....
hr min
6 4
5 No es posible diseñar en forma individual
– El mito de la “persona promedio”
Clasificación del usuario Tipos de usuarios
Novatos (desconocen las tareas e interfaces)
– Mucha dificultad
• Menos experiencia
• Menos familiarizados
• Menos probable en tener un modelo mental
Intermitentes – Procesamiento mental es lento, laborioso
– Conocimiento es declarativo vs. Por procedimiento
– Necesita mas “andamiaje” (ayuda)
Novatos Expertos/
Experiencia Frecuente
Guias para novatos Guias para novatos ...
Necesitan mucha retroalimentación y termino Los procedimientos de ingresos debe ser consistente con las
– Termino: retroalimentación para indicar que una tarea espectativas del usuario.
particular o procedimiento esta completo. – Usuario forma espectativas acerca de la conducta del
Todas las iniciativas la toma la computadora sistema.
– Novatos no conocen lo que pueden hacer. – Es importante para el usuario desarrollar un modelo mental
que empate como el sistema trabaja.
– Computadora puede ofrecer tareas y esperar respuesta a
sus preguntas Ninguna capacitación debe ser necesaria.
Cada paso requiere ser resumido – Ingresar-usar el sistema
– Restringir el vocabulario y número de acciones – No “conocimimiento en la cabeza”: toda la información
necesita ser mostrada en la pantalla.
– Mas probable de ser recordado, menos probable de
cometer errores.
Diaz Muñante Jorge 6

7. Diseño de Interfaces de Usuarios
Guias para novatos ... Guias para los intermitentes
Los mensajes del sistema deben ser claros e Estos usuarios pueden mantener conocimiento de
inequivocos. sus tareas y uso general de una computadora.
– Un mensaje claro para un experto no necesariamente lo es Necesita:
para un principiante.
– Estructuras consistentes
– Debe ser especifico
• Uso no frecuente de ciertas facilidades
• Donde esta el problema (si existe)
– Buena facilidad de ayuda
• Especificamente, cual es el problema
• Como puede corregirlo (si es posible)
– Buena documentacion
• pueden necesitar ejemplos de cómo las tareas se realizan.
Guias para los expertos. Guias para los expertos ...
Organiza los conocimientos diferente a los novatos. Expertos prefieren estructuras abreviadas para los
– Procedimientos de bajo nivel en lugar de alto nivel. comandos (ejm. Atajos con el teclado, macros).
– Experto tienen un modelo similar del sistema, en cambio en – Usa “CTRL-X” en lugar del menu
los novatos pueden tener una variedad de modelos Nota: requerimientos para expertos son la
mentales.
contradicción de los novatos.
– Expertos no necesitan mucha “visilidad”, retroalimentación,
tiempo breves, etc.
Modelos mentales Novato vs Experto Entendiendo al usuario
¿Como su usuario trabaja?
EXPERTO NOVATO – Analisis de tareas, entrevistas y observacion
1. Ingresa nombre-usuario 1. Click en caja de nombre usuario
2. Ingresa password 2. Tipea su nombre ¿cómo el usuario piensa?
3. Click en caja password – Entender el conocimiento humano
4. Tipea password
5. Presiona [ENTER] – observe al usuario en su desarrollo de sus tareas
¿cómo el usuario interactua con los IUs?
No diseñe su sistema solo – observe!
para novatos
Diaz Muñante Jorge 7

8. Diseño de Interfaces de Usuarios
Involucrando al usuario ¿Que podrian decir los usuarios?
Los usuarios ayudan a los diseñadores a aprender “Esto es muy dificil”
– Que involucra su trabajo “Usted no tiene las etapas en orden, nosotros lo
– Que herramientas usan haremos”
– es decir, que hacen No realice ningun comentario personal
Los desarrolladores revelan las capacidades tecnicas
– usted no debe tomarlo como un interes personal
– Relacion de figuras y una idea de lo que es posible
La meta es hacer el sistema faciles de usar para sus
El usuario pruebe prototipos (Modelos del sistema Real) y lo usuarios
comente
– Desarrolladores hacen los cambios en forma incremental e
iterativa
Resumen
Diseño centrado al usuario es diferente a los
métodos tradicionales
Conozca al usuario e involucrese por completo en el
diseño
Diaz Muñante Jorge 8