1. UNMSM Diseño de Interfaces de Usuarios
Jorge Diaz 1
LOGO
13/04/2011
Análisis de las
Tareas
Profesor: Jorge Diaz Muñante
Diseño de interfaces de Usuarios
2011-I
¿IU de la fama o la vergüenza?
Le hace falta mas metáforas, además los conceptos de
AMON, DMON, EMON, IMON no son claros para el usuario
(“por experiencia propia”).
¿IU de la fama o la vergüenza?
MS Powerpoint
Modifico el dialogo
Lado izquierdo los
nombres de los
files
Lado derecho un
preview de la
imagen
IU Hall de la fama
Preview
Ayuda significativa
Permite
desactivarla
• Imágenes
pequeñas /grandes
IU a la fama o la vergüenza ?
¿Como se abre la
griferia?
Error
Atención
Reconocer
No existe un mapeo
natural
Temas
Ejemplo
Vistazo del análisis de tareas
¿Qué es un analisis de tareas?
¿Cómo desarrollarlo?
Selección de tareas
Usando tareas en el diseño
2. UNMSM Diseño de Interfaces de Usuarios
Jorge Diaz 2
Tormenta de ideas
ANALISIS DE TAREAS
EJEMPLO LA “MAQUINA BART”
Maquina Bart
Máquina BART
“Comprar-un-Ticket”
Proposito
Comprar tickets o adicionar una
tarifa
Acepta tarjetas ATM, crédito y
cash
Problemas
una “secuencia” de operaciones
• Tipo de ticket -> tipo de pago ->
pagar -> ticket
BART Plus tiene un minimo de
$28, no indica hasta que despues
que inserte >= $1
Bastantes transacciones
descartadas por botones que no
hacen nada
3. UNMSM Diseño de Interfaces de Usuarios
Jorge Diaz 3
Lecciones de la Máquina de BART
No es una maquina conveniente
¿Los diseñadores tomaron en cuenta?
Variedad de clientes que usan la maquina
Cuales son las tareas que ellos pueden
realizar
algunos encuentran el funcionamiento de la
maquina discordante.
¿Cómo evitamos un resultado similar?
“Se requiere desarrollar las tareas de los
usuarios”
Análisis de Tareas
Una de las premisas de cualquier aproximación
con la que abordemos el diseño es la de conocer
al usuario y por tanto cómo realiza las tareas
Esta información se recoge en la fase de análisis
de las tareas con una notación que permita su
formalización y estudio
Tarea: Unidad significativa de trabajo en la
actividad de una persona (sobre una aplicación)
Beneficios del análisis de tareas:
Proporciona un diseño de la aplicación consistente
con el modelo conceptual del usuario
Facilita el análisis y evaluación de usabilidad. Se
puede predecir el rendimiento humano e identificar
problemas de uso
Analisis de Tareas
El análisis de tareas consiste en el estudio de:
Información que necesita el usuario para realizar la
tarea (qué hacer)
Terminología y símbolos del dominio del problema
(elementos)
Descripción de cómo esas tareas se realizan
actualmente (cómo)
Es el proceso de analizar la manera en que las
personas realizan sus trabajos
Lo que hacen
Sobre qué cosas actúan
Qué necesitan saber
LOGO
13/04/2011
Un metodo
Preguntas
¿quiénes usan el sistema?
¿qué tareas se van a desarrollar?
¿qué tareas son deseadas?
¿cuál es el aprendizaje de las tareas?
¿dónde las tareas son desarrolladas?
¿cuáles son las relaciones entre el usuario
y datos?
Preguntas (cont.)
¿qué otras herramientas tiene el usuario?
¿cómo los usuarios se comunican con
otros?
¿con que frecuencias se van a desarrollar
las tareas?
¿cuáles son los tiempos de cada tarea?
4. UNMSM Diseño de Interfaces de Usuarios
Jorge Diaz 4
¿Quién?
Identidad?
Es fácil identificar el cliente especifico o
interno
Antecedentes / Habilidades
Conocimientos actuales o que se requieren
adquirir para realizar las tareas
Gustos (preferencias) o disgustos
Caracteristicas personales
Edad
Educacion
Habilidades o discapacidades
Quién (BART)?
Identificación
Turistas, pasajeros habituales, gente de
negocio, estudiantes, en general cualquier
persona
Antecedentes
Tiene una ATM o Tarjeta crédito ?
Habilidades
Conoce como colocar tarjetas en maquinas
ATM
Conoce como comprar en maquinas BART
¿Quién? (BART cont.)
Hábitos en el trabajo o preferencias
Puede no gustarles los viajes
Características físicas
El tamaño de las personas es variado -> la
maquina no puede ser ni muy alta ni muy
baja!
Piense acerca de donde ubicar el control para
el ingreso del dinero.
Mezcla de edades
¿Qué tareas?
Importante para las nuevas funciones y
automatización
Importancia relativa de las tareas
Observe a los usuarios
¿Qué tareas (BART)?
Tareas antiguas?
Cash para comprar un nuevo ticket
Cash para adicionar una tarifa a un ticket
existente
Nuevas Tareas? (futuro)
Obtener precio de los destinos o rutas
Comprar tickets con destinos fijos
El nivel de detalle puede variar
¿Como aprendemos las tareas?
¿Qué necesita el usuario conocer?
Ellos necesitan entrenamiento?
academico
conocimiento generales / habilidades
instrucción especial / entrenamiento
5. UNMSM Diseño de Interfaces de Usuarios
Jorge Diaz 5
Como aprendemos las tareas
(BART)?
Llega y usa el sistema
No podemos asumir el background /
entrenamiento
Entrenamiento?
Tambien consume tiempo
Debe ser simple y similar a sistemas
existentes
Cajeros automaticos
Dispensadores de galletas
¿Donde es desarrollada la tarea?
Oficina, laboratorio,
un punto de venta?
Efectos del ambiente a
los usuarios?
Usuarios bajo stress?
Se requiere
confidencialidad?
Tienen ellos las manos
húmedas, sucias ?
Bebidas suaves?
Iluminación ?
Ruido?
DONDE (BART)?
Estación del Tren
Mucho ruido
Implementar con
reconocimiento de voz - no
es una buena idea.
No confirmar con sonido
Otros están pendientes de
usted
no es privado
El ingreso del PIN debe ser
confidencial
La iluminación es poca
asegúrese que los
mensajes sean entendibles
¿Cual es la relacion entre el usuario
y datos?
Datos personales
siempre son accesados en la misma
maquina?
Los usuarios se mueven entre maquinas?
Datos comunes
usados en la actualidad?
Pasados secuencialmente entre los usuarios?
Acceso remoto es requerido?
Acceso a los datos es restringido?
Relaciones con los datos (BART)
Datos personales
usuarios pueden usar cualquier maquina
Datos almacenados en la tarjeta
Datos comunes
Relacion de tarifas (ejm. BART Plus)
usado actualmente
Acceso a datos restringidos?
Solo usted puede usar su tarjeta ATM o de
crédito
No se requiere acceso remoto
¿Qué otras herramientas tiene el
usuario ?
como el usuario trabaja con las
herramientas
Ejemplo: registro automático de datos en un
lab.
• ¿Cómo son registrados los datos ahora?
• ¿Que instrumentos y procedimientos manuales?
• Como es analizada la información?
• Los resultados son transcritos para su registro o
publicación?
• Que medios/formas son usados y como ellos van
a ser manejados?
6. UNMSM Diseño de Interfaces de Usuarios
Jorge Diaz 6
Otras herramientas (BART)
No relevante
¿cómo los usuarios se comunican?
¿quién se comunica con quién? ¿acerca
de qué?
Sigue las lineas de la organización? Hacia
abajo/arriba?
Ejemplo : un asistente a un gerente
instalación de una computadora cambia la
comunicación entre ellos
las gente prefiere cambiar el uso de su
computadora que cambiar sus relaciones
personales
¿cómo el usuario se comunica
(BART)?
No relevante
¿con qué frecuencia el usuario hace
las tareas?
Usuarios frecuentes recuerdan mas
detalles
Usuarios no frecuentes pueden necesitar
mas ayuda
inclusive para operaciones simples
Por cada funcion desarrollada
¿cuáles son las mas frecuentes?
¿Por cuales usuarios?
Con que frecuencia (BART)?
Varia la frecuencia de los usuarios
algunos usan el BART todo los dias (al
menos)
algunos son ocasionales
Varia la frecuencia de las tareas
cada 2 semanas usamos el BART Plus
• no es frecuente -> mas instrucciones
comprar un nuevo ticket todos los dias
• probablemente muy comun
Observe al usuario para tener la
seguridad
Cuales son los Tiempos
involucrados en la Tarea?
¿Con cuales de las funciones estarían los
usuarios en un apuro?
¿Quienes pueden esperar?
¿Existe una relación de tiempo entre las
tareas?
7. UNMSM Diseño de Interfaces de Usuarios
Jorge Diaz 7
Tiempos Involucrados (BART)?
Los usuarios estarán casi siempre en
apuros
Forman una cola los usuarios
Toma menos de un minuto/transaccion
Esta disponible para cualquier tarea en
cualquier orden
¿qué pasa cuando las cosas estan
erradas?
como las personas reacciona cuando
¿hay errores en lo relacionado con las
tareas?
¿Dificultad en la practica?
¿catastrofe?
Hay una estrategia de backup
¿Cosas incorrectas (BART)?
confunsion en la tareas
boton de “cancelar
transaccion”
Dificultad en la practica
Tickets con dinero de alta
denominación
politica solo-cash?
Catastrofe
maquina “se come” la
tarjeta
Estrategia de Backup
usar cash en algunas
maquinas
Seleccion de tareas
Tareas reales que el usuario realiza
coleccione cualquier material
Debería proveer de un respaldo razonable
compare la lista de las funciones con las tareas
Mezcla tareas simples y tareas complejas
Cuando se cambia a un estado de diseño
complicado
descarte los features que no ayuden a sus tareas
adicione una tarea real que ejercite esos feature
¿Cómo se ven las tareas?
Diga que desea hacer el usuario pero no
como el usuario podría hacerlo
permite comparar diferentes alternativas de
diseño
Ellos deberian ser muy especificos
Forzar a que las descripciones esten al
detalle, con información relevante
Ellos deberian describir el trabajo
completo
nos fuerza a considerar como trabajan juntos
los features
• ejemplo: funciones bancarias telefónicas
Visualización de las tareas (cont.)
Vea de donde vienen los inputs y a donde
van los output
Las Tareas deben decir quienes son los
usuarios
el diseño puede cambiar dependiendo de
quien
si es posible, dar nombre de usuarios
• a medida que gana importancia, permite obtener
más información
caracteristicas de los usuarios
• trabajo, experiencia, etc.
8. UNMSM Diseño de Interfaces de Usuarios
Jorge Diaz 8
Visualización de las Tareas (cont.)
Refleja los intereses de los usuarios potenciales
ilustra las funciones propuestas en el contexto de
trabajo que los usuarios realmente desean realizar
Los usuarios no siempre están en lo correcto
no se puede anticipar apropiadamente la nueva
tecnología
Trabajo es el construir el sistema de la manera
en que lo deseen los usuarios
los usuarios no dicen que desean
sea muy cuidadoso con esto (usted es un
expectador)
Usando las tareas en el diseño
Escriba una descripción de las tareas
formal (libro) o informal
obtener mas informacion donde se necesite
Muestre el diseño de la interfaz
pantallas mayores y funciones (no muy
detallado)
hecho a mano (sketchs)
Produzca escenarios por cada tarea
qué es lo que tienen que hacer los usuarios y
qué es lo que verían
paso a paso las tareas
Asignacion # 2 (Analisis de tareas)
Entreviste a por lo menos 3 usuarios
objetivos y especificos.
Responda las 11 preguntas
Describir las 6 tareas
2 faciles, 2 medianas y 2 dificiles
En base al analisis de tareas realizar el 1er
prototipo en papel (1 de cada dificultad)
Ejemplo de otra metodología (Referencial)
Análisis de tareas
Ejemplo
Análisis de tareas de un vídeo:
¿Qué quiere realizar el usuario?
¿Qué información se necesita?
¿Qué acciones debe llevar a cabo?
Análisis de tareas
Ejemplo
Objetivos del usuario:
Ver un vídeo
Grabar la telenovela de todas las tardes
Grabar una película esta noche y no estoy en
casa
9. UNMSM Diseño de Interfaces de Usuarios
Jorge Diaz 9
Análisis de tareas
Ejemplo
Información requerida:
Lista de programas
Tiempo de inicio, duración, canal
Día de la semana para la grabación
Análisis de tareas
Ejemplo
Acciones necesarias:
Lista de programas (identificar el programa
que se quiere grabar)
Seleccionar la cinta (de duración adecuada)
Iniciar el proceso de grabación
(seleccionando ajustes adecuados)
Análisis de tareas
Métodos
Descomposición de tareas
Ver el modo en el cual una tarea se puede
descomponer en otras más simples
Análisis basado en conocimiento
Identificar el conocimiento del usuario para
llevar a cabo dicha tarea y cómo está
organizado este conocimiento
Análisis de relaciones entre entidades
Aproximación orientada a objetos que
enfatiza los actores y objetos, las relaciones
entre los mismos y las acciones que pueden
realizar
Análisis de tareas
Análisis jerárquico
Secuencia de Tareas Selección de Tareas
*
Iteración de Tareas Tarea Unitaria
Análisis de tareas
Análisis jerárquico
Análisis de tareas
GOMS
Familia de técnicas propuesta por Card,
Moran, y Newell (1983) para modelar y
describir las prestaciones de las tareas
desde el punto de vista humano
GOMS es un acrónimo que significa
Objetivos (Goals), Operadores
(Operators), Métodos (Methods) y Reglas
de selección (Selection rules)
10. UNMSM Diseño de Interfaces de Usuarios
Jorge Diaz 10
Análisis de tareas
GOMS
Objetivos
Objetivos del usuario, describen lo que pretende
conseguir
Operadores
Acciones básicas que se deben llevar a cabo para
utilizar el sistema
Métodos
Existen diferentes alternativas para conseguir un
objetivo. P.ej. una ventana se puede cerrar mediante
una combinación de teclas (Alt-F4) o con el ratón
(Archivo-cerrar)
Reglas de selección
Elección entre posibles alternativas para alcanzar un
objetivo
Análisis de tareas
GOMS
Ejemplo: Cerrar ventana
GOAL: CERRAR-VENTANA
[select GOAL: USAR-MÉTODO-RATÓN
MOVER-RATÓN-A-MENÚ-VENTANA
ABRIR-MENÚ
CLICK-SOBRE-OPCIÓN-CERRAR
GOAL: USAR-MÉTODO-TECLADO
PULSAR-TECLAS-ALT-F4
GOAL: USAR-MÉTODO-CERRAR-APLICACIÓN
PULSAR CONTROL-ALT-DEL
SELECCIONAR CERRAR-APLICACIÓN]
Rule 1: IF (USUARIO-EXPERTO) USAR-MÉTODO-TECLADO
ELSE USAR-MÉTODO-RATÓN
Rule 2: USAR-MÉTODO-CERRAR-APLICACIÓN si se queda
bloqueado el sistema
Análisis de tareas
Diálogo
El diálogo es el proceso de comunicación
entre dos o más participantes
En el diseño de interfaces de usuario, el
diálogo representa la estructura de la
conversación entre el usuario y el
ordenador
Notaciones para el diálogo
Diagramas de transición
Notaciones para el diálogo
Diagramas de transición
inicio
Portapapeles
Vacio sin
selección
Portapapeles
Lleno sin
selección
Portapapeles
Vacío
y objeto
Seleccionado
Portapapeles
Lleno y objeto
Seleccionado
copia
limpia
portapapeles
deselecc.objeto
selecc.objeto
Crearobjeto
borrarobjeto
vaciar
portapapeles
inicio
Portapapeles
Vacio sin
selección
Portapapeles
Lleno sin
selección
Portapapeles
Vacío
y objeto
Seleccionado
Portapapeles
Lleno y objeto
Seleccionado
copia
limpia
portapapeles
deselecc.objeto
selecc.objeto
Crearobjeto
borrarobjeto
vaciar
portapapeles
inicio
Portapapeles
Vacio sin
selección
Portapapeles
Lleno sin
selección
Portapapeles
Vacío
y objeto
Seleccionado
Portapapeles
Lleno y objeto
Seleccionado
copia
limpia
portapapeles
deselecc.objeto
selecc.objeto
Crearobjeto
borrarobjeto
vaciar
portapapeles
Notaciones para el diálogo
Redes de Petri
Negrita On
Negrita Off
Itálica On
Itálica Off
Usuario pulsa
Negrita
Usuario pulsa
Negrita
Usuario pulsa
itálica
Usuario pulsa
itálica
T1 T2 T3 T4
11. UNMSM Diseño de Interfaces de Usuarios
Jorge Diaz 11
Notaciones para el diálogo
Gramáticas
Uno de los primeros métodos utilizados para la
representación del diálogo en IPO
Una gramática describe un lenguaje mediante un
conjunto de reglas que especifican los literales
correctos en el lenguaje
Ventaja: se pueden usar herramientas para
asegurar la corrección y completitud
Adecuadas para lenguajes basados en órdenes
Las gramáticas multi-party poseen símbolos no
terminales que se etiquetan con el participante:
usuario (U) u ordenador (C)
<Sesión> ::= <U: Open> <C:Respuesta> <U:Open>
::= LOGIN <U: Name>
<C: Respuesta> ::= HELLO [<U: Name>]
Notaciones para el diálogo
User Action Notation
Las técnicas basadas en gramáticas o
diagramas son adecuadas para sistemas
basados en menús, pero no para
manipulación directa
UAN es una especificación mediante un
lenguaje para la descripción de las tareas
del usuario
Una especificación en UAN se realiza en
una tabla dividida en 3 columnas:
acciones del usuario
realimentación de la interfaz
estado de la interfaz
Notaciones para el diálogo
UAN
icon!
Respuesta del sistema: iluminar el icono
icon-!
Dejar de iluminar el objeto icono
icon >~
Movimiento de arrastre del objeto icono
UAN Realimentación Estado de la interfaz
1) ~[file] Mv File!, forall(file!): file-! Selected = file
2) ~[x,y]* Outline(file) > ~
3) ~[trash] Outline(file) > ~ trash!
4) M^ Delete(file), trash!! Selected = null
Ejemplo: Tarea ”borrar un fichero enviándolo a la papelera de
reciclaje”
Notaciones para el diálogo
UAN
Ejemplo: Tarea ”borrar un fichero enviándolo a la papelera de
reciclaje”
Notaciones para el diálogo
UAN
Análisis de tareas
Implementación
Una vez modeladas las tareas debe obtenerse una
implementación correcta de las mismas
Para ello hay que tener en cuenta varios factores:
Tipos de interacción
• Posicionamiento, valor, texto, selección, arrastre
Principios, guías de estilo, estándares
Gestión de entradas del usuario
• Petición, muestreo, evento
Diseño de la presentación
Gestión de errores
12. UNMSM Diseño de Interfaces de Usuarios
Jorge Diaz 12
Conclusiones
El diseño de la interfaz es parte
fundamental del proceso de desarrollo del
software y debe ser considerado desde el
principio
El usuario debe tomar parte en el diseño y
no ser mero espectador
Existen metodologías y notaciones para el
diseño que deben ser utilizadas
La evaluación del diseño tiene una gran
importancia