7. prototipos básicos (intro hci)
TRANSCRIPT
7 Prototipos Básicos
11/01/102
Contenido
Repaso Prototipos básicos (low fidelity) Técnica del Mago de Oz Interfaces informales de usuario Diagramas de UI de forma electrónica Resumen Tarea 6
11/01/103
Modelo Humano Procesardor (MHP)
Desarrollado por Card, Moran, y Newell (‘83)
Memoria de largo plazo
Memoria de trabajoAlmacenamiento memoria visual
Almacenamiento memoria auditiva
Procesadorperceptual
Procesadorcognoscitivo
Procesadormotor
Ojos
Oídos
Dedos
Búfers sensores(Dix)
11/01/104
Porqué desarrollar prototipos?
Obtener retroalimentación del diseño Ahorra tiempo, dinero y esfuerzo
Permite experimentar con diseños Corrige problemas antes que se codifique Mantiene el diseño centrado al usuario
11/01/105
Fidelidad en prototipos
La fidelidad se refiere al nivel de detalle Alta fidelidad
Prototipos que se parecen al producto final
Baja fidelidad Representación inicial sin detalles del
producto
11/01/106
Sketches de baja fidelidad
11/01/107
Storyboards de baja fidelidad
De dónde vienen los storyboards? Cine y animación (CG o dibujos)
Nos proporciona un script de eventos No se fija en detalles Se concentra en interacciones importantes
11/01/109
Porqué utilizar estos prototipos?
Métodos tradicionales toman mucho tiempo sketches -> prototipos -> evaluar -> iteraciones
Podemos simular en el prototipo sketches -> evaluar -> iteraciones Los sketches sirven como prototipos
El diseñador “le hace de computadora” Otros miembros observan y graban
Habilidades de kinder necesarias Permite participar a todos
11/01/1010
Materiales básicos
Hoja de cartulina negra, dura (11 x 17) Tarjetas de 5x8 in. Diurex, pegamento, corrector blanco Plumas y marcadores (tamaños y puntos) Acetatos transparentes Tijeras, cutters, etc Algo más? (Post It, lápiz y papel, etc)
11/01/1012
Construcción del modelo
Fije una fecha límite No ocupe más tiempo de lo debido
Dibuje una ventana en una hoja grande Dibuje diversas regiones en las tarjetas
Todo lo que se mueva, cambie, aparezca, desaparezca
Prepare respuestas para cualquier acción Menús, pull down, etc
Fotocopie el modelo para tener versiones
11/01/1013
Preparando para pruebas
Seleccione a sus usuarios Conocer el background de los usuarios Utilice un cuestionario para obtener ayuda No use a amigos o familiares
Preparar escenarios que sean: Típicos del uso normal del producto Construir prototipos que soporten aquellos
Practicar para evitar errores
11/01/1014
Realizando las pruebas
Cuatro usuarios para probar (mínimo) Miembros del equipo:
1. Recepción (pone al usuario en confianza y obtiene datos del usuario de prueba)
2. Facilitador (único miembro que habla durante las pruebas) Da instrucciones y pide que compartan opiniones
o ideas
11/01/1015
Cont.
1. Computadora (miembro del equipo que sabe y conoce la lógica de los movimientos) Simula respuesta o interacción
2. Observadores (toman notas y hacen recomendaciones)
Todo toma una hora, aproximadamente Preparación, pruebas, análisis posterior
11/01/1016
Desarrollo de la prueba
Saludar Obtener datos del usuario, tranquilizar, asegurar
confidencialidad, etc Prueba
El conductor pasa tareas escritas al usuario Deben ser claras y bien detalladas
El conductor debe obtener retroalimentación del usuario participante
“en qué está pensando?”, “puede pensar en voz alta?” Observe, no asienta, burle, haga gestos, etc.
11/01/1017
Cont.
Análisis posterior Llene el cuestionario de evaluación posterior Pregunte a los otros miembros si observaron
problemas, comparta opiniones Reuna impresiones Dé las gracias
11/01/1018
Evalúe los resultados
Ordene por prioridad las observaciones Qué fue importante? Muchos problemas en la misma área?
Desarrolle un reporte de lo encontrado Permite hacer una agenda para cambios
Haga cambios e iteraciones
11/01/1019
Ventajas de prototipos de baja fidelidad
Toma unas pocas horas No requiere equipo muy caro
Puede probar múltiples alternativas Iteraciones rápidas
Número de iteraciones está relacionada con la calidad final
Casi toda interacción puede ser simulada
11/01/1020
El Mago de Oz
11/01/1021
Técnica del Mago de Oz
Simular la interacción De la película “The Wizard of Oz”
“el hombre detrás de la cortina”
Ampliamente utilizado en la industria Prototipos con una PC y una VAX detrás de la cortina
Mucho más importante para opciones muy difíciles de implementar Eg. reconocimiento de escritura y de lenguaje
11/01/1022
Técnica del Mago de Oz
Donde un usuario interactúa con lo que parece ser una computadora, pero realmente es una simulación, ya sea por un humano (Mago) o un humano y una computadora
11/01/1023
Uso de DENIM
Permite a los diseñadores Hacer scketches rápidos de ideas de
interfaces Probar estas ideas con usuarios Transformar a un diseño más terminado, sin
programar http://dub.washington.edu/projects/denim/
11/01/1024
Qué es SILK?
Sketching Interfaces Like Krazy Precursor de DENIM
11/01/1025
Desarrollo de interfaces con DENIM
1 El diseñador hace un sketch de sus ideas rápidamente con un pad y pluma electrónica DENIM reconoce el patrón Fácil de editar con “gestos” (mov de la pluma)
2 El diseñador o usuario, prueban la interface La interface responde a la interacción Agrega funcionalidad visualmente
3 El diseño se transforma en una interface automáticamente
11/01/1026
Ejemplo de SILK
11/01/1027
Agregar funcionalidad…
11/01/1028
Transformarlo en…
11/01/1029
Demo de DEMIM
http://dub.washington.edu/projects/denim/denim_daily_files/page149.html
11/01/1030
Desventajas de herramientas
Requiere especificación con mucho detalle Detalles de la idea general
Eg. Distribución, tipo de letras, colores, alineación, etc
Se pierde la idea por los detalles Los evaluadores se fijan en detalles no importantes
Toma mucho tiempo usarlos Aunque da soporte a desarrollo iterativo
Toma cinco veces más que hecho a mano
11/01/1031
Sketches en papel
Ventajas Permite la lluvia de ideas No requiere de especificación de detalles Es más abierto y libre
Desventajas No se desarrollan fácilmente Se necesita una transferencia manual a un formato
electrónico No muestra, del todo, interacción con un usuario real
11/01/1032
Video
11/01/1033
Utilizando SILK (DENIM)
Crear un storyboard a partir de sketches Pueden mostrar “funcionalidad”
antes después
Mostrar secuencia entre sketches
11/01/1034
Storyboards con SILK
Copiar sketches en papel a SILK Dibujar flechas a otras ventanas
Cambiar a modo “correr modelo” SILK cambia pantallas con un click
11/01/1036
Resumen
El desarrollo de prototipos tiene muchas ventajas
Existen prototipos de baja y alta fidelidad Los prototipos en papel tienen ventajas, como
libertad, facilidad En cambio, las herramientas tienen la
posibilidad de convertir sketches a storyboards y a interfaces reales, sin programar
11/01/1037
Tarea 6
WOZ a iPod (eg nano, shuffle, touch, classic)
Se deberá desarrollar una prueba del Mago de Oz para el iPod de Apple
www.apple.com/ipod/
Se deberá realizar una demostración en el salón de clases
Fecha de exposición: (POR DEFINIR), hora de clase