diseño de interacción, prototipado y testing
DESCRIPTION
Presentación realizada dentro del marco del diplomado de Diseño de Interacción y Physical Computing 2013 de la UDD. Contempla una revisión general de conceptos, una mirada a las metodologías Waterfall y Agile, una revisión de los principales entregables del UCD, una compilación de Principios de interacción y una introducción a las etapas de prototipado y testingTRANSCRIPT
![Page 1: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/1.jpg)
Prototipado y testeo
Un camino desde la idea al producto
![Page 2: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/2.jpg)
Hola, soy Juan Paulo
Diseñador UX, Consultor en Usabilidad y Profesor
![Page 3: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/3.jpg)
¿Y ustedes?
¿A qué se dedican?
¿Por qué están aquí?
![Page 4: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/4.jpg)
Objetivos de este módulo
• Resumen de la primera etapa
• Teórica, pero enfocada en el hacer
• Entregar metodologías aplicables ahora
• Llevar ideas hacia el primer prototipo
• Diseñar centrado en el usuario
• Diferenciar approaches metodológicos
• Identificar principios fundamentales en el hacer interacción
• Explorar las formas de testear prototipos
![Page 5: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/5.jpg)
Repasando…
¿Qué es lo que más les ha gustado de lo que han aprendido hasta ahora?
![Page 6: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/6.jpg)
Veamos algunos conceptos medulares
Para que nuestras conversaciones sean más precisas
Conceptos
![Page 7: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/7.jpg)
User Experience
¿Qué es?
Conceptos
![Page 8: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/8.jpg)
UX
The spectrum of UX- Information Architects Institute
Conceptos
![Page 9: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/9.jpg)
User experience
Disciplines of UX- Dan Saffer
Conceptos
![Page 10: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/10.jpg)
User experience
Elementos de la experiencia de usuario – J.J. Garrett
Conceptos
![Page 11: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/11.jpg)
User experience
The User Experience Honeycomb- Peter Morville
Conceptos
![Page 12: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/12.jpg)
User experience
Stephen P. Anderson “Creating Pleasurable Interfaces”
Conceptos
![Page 13: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/13.jpg)
User experience
Leena Arhippainen & Marika Tähti
Conceptos
![Page 14: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/14.jpg)
Interacción / Interfaz
¿Qué diferencias hay?
Conceptos
![Page 15: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/15.jpg)
Usabilidad / Accesibilidad / Ai
¿Qué son?
Conceptos
![Page 16: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/16.jpg)
![Page 17: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/17.jpg)
¿Cómo diseñar interacción?
¿Y no morir en el intento?
Métodos
![Page 18: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/18.jpg)
2 vertientes metodológicas
Waterfall / Agile
Métodos
![Page 19: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/19.jpg)
UCD Waterfall
Métodos
![Page 20: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/20.jpg)
UCD Waterfall
Métodos
![Page 21: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/21.jpg)
UCD Waterfall
Métodos
![Page 22: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/22.jpg)
UCD Waterfall
Métodos
![Page 23: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/23.jpg)
Agile
Métodos
![Page 24: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/24.jpg)
Agile
Métodos
![Page 25: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/25.jpg)
UCD Waterfall v/s Agile
Waterfall Agile
Más lineal Más iterativo
Más documentación Más prototipos funcionales
Más reflexivo Más impulsivo
Raíces en la administración Raíces en el desarrollo
Feedback en etapas determinadas Feedback constante
Va por el producto final Va por una mejora progresiva
Resistente al cambio Abierto al cambio constante
Se avanza sobre seguro Se avanza sobre la incertidumbre
Se negocia con el cliente Se colabora con el cliente
Funciona como el cliente Funciona como los desarrolladores
Intervalos según entregable Intervalos temporales definidos
Investigación profunda Escasa investigación
Ideal para proyectos con clientes Ideal para proyectos personales
Basado en la visión Basado en la improvisación y mejora progresiva
Mas de conocimiento Mas de experimentación
Métodos
![Page 26: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/26.jpg)
OK, pero ¿por dónde empiezo?
Algunos entregables del UCD
Entregables
![Page 27: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/27.jpg)
Design the box ¿Qué es?
Es una caja que simula que tu idea viene adentro (aunque nunca venga dentro de una caja)
¿Para qué sirve?
Para aterrizar ideas, para llegar a acuerdos en el equipo, para dimensionar el proyecto, para definir áreas de investigación
¿Cuándo realizarlo?
Al principio del proyecto
Contenidos: • Nombre de la idea
• Gráfica (concepto)
• Un tagline
• 3 o 4 “promesas” destacadas en una lista (portada)
• Una descripción detallada (atrás)
• Requerimientos técnicos
Entregables
![Page 28: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/28.jpg)
Content Strategy Canvas ¿Qué es?
Es un board que se llena según los recuadros descritos
¿Para qué sirve?
Para sistematizar los antecedentes y definiciones preliminares de diseño
¿Cuándo realizarlo?
Al principio del proyecto
Contenido: • Gancho de la idea
• Forma
• Acción esperada
• Métricas
• Canales
• Detonador de uso
• Persona (usuario)
• Recursos involucrados
• Resultados esperados
Entregables
![Page 29: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/29.jpg)
Personas ¿Qué es?
Es una ficha con descriptores de los usuarios arquetípicos de mi idea
¿Para qué sirve?
Para entender a los usuarios, sus intereses, motivaciones, contextos de uso, preocupaciones, etc.
¿Cuándo realizarlo?
Al principio del proyecto
¿Cómo se hace? • Se definen arquetipos de usuarios
• Se hacen entrevistas con los involucrados
• Se crean fichas por cada usuario mencionando sus características como si estuviéramos definiendo a una persona real
Entregables
![Page 30: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/30.jpg)
Storyboarding ¿Qué es?
Es una historia dibujada de formas de uso de la idea
¿Para qué sirve?
Para focalizarse en lo central de la idea, para revisar la lógica de la idea, para comunicar el concepto de manera fácil
¿Cuándo realizarlo?
Cuando se tienen las primeras ideas, usuarios y contextos de uso
¿Cómo se hace? • Se definen las tareas y usuarios a
dibujar
• Se establece el guión
• Se dibuja la historia
• Se evalúa su resultado
Entregables
![Page 31: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/31.jpg)
Benchmarks ¿Qué es?
Es una sistematización de las mejores ideas de otros proyectos existentes
¿Para qué sirve?
Para no inventar la rueda, para no cometer los mismos errores de otros, para diferenciarme de mi competencia
¿Cuándo realizarlo?
Al momento de empezar un proyecto que ya está relativamente definido en su contexto
¿Cómo se hace? • Se definen los referentes a analizar
• Se analizan rescatando lo bueno y lo malo
• Se establecen conclusiones haciendo énfasis en las ideas que me sirven
Entregables
![Page 32: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/32.jpg)
Capacidades del sistema ¿Qué es?
Es un listado detallado de todas las posibles funcionalidades que puede tener nuestra idea
¿Para qué sirve?
Para definir y jerarquizar las funcionalidades de nuestro proyecto
¿Cuándo realizarlo?
Al momento de tener la idea clara, los usuarios estudiados y los referentes analizados
¿Cómo se hace? • Se crea una tabla con todas las posibles
funcionalidades del sistema
• Se asignan niveles de importancia y complejidad a cada funcionalidad
• Se definen las funcionalidades que van finalmente en la solución
Entregables
![Page 33: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/33.jpg)
Card Sorting ¿Qué es?
Es una dinámica de organización de contenidos
¿Para qué sirve?
Para obtener información respecto de cuál es la manera más lógica de agrupar contenido
¿Cuándo realizarlo?
Al momento de tener los contenidos delineados y/o definidos
¿Cómo se hace? • Se invita a varios grupos de usuarios a
una sesión de trabajo
• Se le entregan postits (definidos o en blanco) con los contenidos del proyecto
• Se les pide que organicen los postits en secciones (ya definidas o por crearse)
• Se realiza un reporte de los resultados
Entregables
![Page 34: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/34.jpg)
Site Maps ¿Qué es?
Es un diagrama de ordenamiento de secciones y sus contenidos
¿Para qué sirve?
Para visualizar las distintas pantallas de la solución y sus relaciones
¿Cuándo realizarlo?
Al momento de tener definidos los contenidos
¿Cómo se hace? • Se recopilan los contenidos que deben
formar parte del proyecto
• Se establecen cuáles serán las páginas que formarán parte del proyecto
• Se establecen secciones donde se encontrará cada página
• Se definen relaciones jerárquicas entre cada pantalla
• Se crea un diagrama que lo especifique
Entregables
![Page 35: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/35.jpg)
Task Flows ¿Qué es?
Es un diagrama de ordenamiento de procesos y tareas
¿Para qué sirve?
Para visualizar la manera en que las distintas tareas son realizadas (paso a paso) y encontrar posibles errores de lógica
¿Cuándo realizarlo?
Al momento de tener definidas las capacidades del sistema
¿Cómo se hace? • Se definen las tareas a visualizar
• Se establecen los pasos necesarios para realizar una tarea
• Se buscan los puntos de bifurcación y se establecen rutas alternativas
• Se crea un diagrama que explica las distintas posibilidades de interacción
http://www.jjg.net/ia/visvocab/spanish.html
Entregables
![Page 36: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/36.jpg)
Ideal Task Flows ¿Qué es?
Es un diagrama que muestra la interacción ideal de un usuario con el proyecto
¿Para qué sirve?
Para que al momento de diseñar el proyecto podamos priorizar evidentemente el flujo ideal
¿Cuándo realizarlo?
Al momento de tener definidas las capacidades del sistema
¿Cómo se hace? • Se definen las tareas más relevantes
• Se determina la ruta o los pasos ideales con los que un usuario debería relacionarse con el sistema
• Se determinan los puntos clave
• Se visualizan en una serie de diagramas simples
Entregables
![Page 37: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/37.jpg)
Sketching ¿Qué es?
Es un proceso de bocetaje de las principales ideas del proyecto (no sólo pantallas)
¿Para qué sirve?
Para sistematizar y visualizar las ideas y sus posibles soluciones
¿Cuándo realizarlo?
Al momento de tener definidas las capacidades del sistema (*mapa de navegación)
¿Cómo se hace? • Se definen las ideas a bocetear
• Se establecen las variables que conforman cada idea
• Se realizan múltiples iteraciones hasta encontrar las mejores soluciones
• Se realizan anotaciones que permitan argumentar, detallar o invalidar una idea
Entregables
![Page 38: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/38.jpg)
Wireframes ¿Qué es?
Es una serie de imágenes que muestran el layout, sin gráfica, de las principales pantallas
¿Para qué sirve?
Para especificar el diseño de layout de cada página y comprobar su funcionalidad (usabilidad)
¿Cuándo realizarlo?
Al momento de concluir conforme el proceso de sketching
¿Cómo se hace? • Se determinan las pantallas que forman
parte de la médula del proyecto (plantillas a prototipar)
• Se crean las pantallas utilizando un software de wireframing (Axure, Omnigraffle)
• Se validan los resultados con usuarios
• Se realizan iteraciones hasta estar convencido de la solución
Entregables
![Page 39: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/39.jpg)
Wireflows ¿Qué es?
Es una serie de wireframes posicionados en una única gran pizarra
¿Para qué sirve?
Para ejemplificar las relaciones entre una pantalla y la otra con tal de validar la lógica de estas en su contexto
¿Cuándo realizarlo?
Paralelamente al proceso de wireframing
¿Cómo se hace? • Se posicionan los wireframes sobre una
superficie que permita de un vistazo ver el «big picture»
• Se trazan conectores entre las pantallas que están relacionadas
• Se realizan comentarios escritos sobre la pizarra para que faciliten el entendimiento del documento
Entregables
![Page 40: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/40.jpg)
Prototipado interactivo ¿Qué es?
Es una serie de wireframes o sketches que están vinculados entre si (eventualmente tienen funcionalidades básicas también)
¿Para qué sirve?
Para testear con usuarios determinados flujos de tareas
¿Cuándo realizarlo?
Cuando se tienen listos los wireframes o sketches asociados a un flujo de tarea
¿Cómo se hace? • Se determina la tarea a testear
• Se realizan los wireframes o sketches que forman parte de la tarea
• Se les agrega funcionalidad
• Se ejecuta el proceso de testeo
• Se realizan cambios según los resultados obtenidos
POP app
Entregables
![Page 41: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/41.jpg)
Diseño visual ¿Qué es?
Es una serie de imágenes que representan el diseño final de la propuesta
¿Para qué sirve?
Para evaluar su diseño, como insumo final para el desarrollo
¿Cuándo realizarlo?
Cuando se tienen definidos los wireframes de las plantillas
¿Cómo se hace? • Se determinan las pantallas a diseñar
• Se le agregan a los wireframes decisiones de color, tipografía, imagen, textura, etc.
• Se evalúa su funcionamiento (interactive prototype)
• Se realizan mejoras según los resultados
Entregables
![Page 42: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/42.jpg)
…Y luego qué?
Mejoras constantes Ciclos de iteración
Supervisión colaborativa de desarrollo Control de calidad
Prototipos funcionales User testings
Evaluación de KPIs etc…
Entregables
![Page 43: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/43.jpg)
Una posibilidad… Kanban ¿Pero cómo llevo control del proceso?
![Page 44: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/44.jpg)
¿Es sólo aplicar bien la metodología?
Pista: NO
Entregables
Para hacer buenos prototipos
![Page 45: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/45.jpg)
Algunos principios de interacción
Tognazzini / Norman + invitados
Métodos
![Page 46: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/46.jpg)
Interaction Principles Anticipación
Las aplicaciones deberían intentar anticiparse a las necesidades y deseos del usuario.
![Page 47: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/47.jpg)
Interaction Principles Objetos humanos
Los objetos humanos de la interfaz se comportan de manera estándar por lo que se facilita su uso.
![Page 48: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/48.jpg)
Interaction Principles Protege el trabajo del usuario
Asegúrate de que el usuario nunca pierda su trabajo como resultado de un error suyo, los problemas de internet u otro tipo de problemas inevitables, como un apagón.
![Page 49: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/49.jpg)
Interaction Principles Alinear experiencias y expectativas
Consiste en realizar modelos conceptuales que se comporten de la manera en que espera el usuario (modelo mental).
![Page 50: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/50.jpg)
Interaction Principles Consistencia
Frente al mismo estímulo, la misma decisión.
Es tan importante ser visualmente inconsistente con los objetos que se comportan de forma distinta, como ser consistente con los que se comportan de igual manera.
Evita la uniformidad. Haz que los objetos que se comportan distinto parezcan distintos.
La consistencia más importante es aquella que espera el usuario. La única manera de comprobar las expectativas del usuario es hacer pruebas con ellos.
![Page 51: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/51.jpg)
Interaction Principles Carga cognitiva
El usuario no debe ser obligado a retener información crítica para el funcionamiento del sistema.
Deja que el sistema haga todo el trabajo que le sea posible con tal de que el usuario se enfoque en las tareas en las que su participación es crítica.
![Page 52: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/52.jpg)
Interaction Principles Functional Minimalism
Todo debe ser tan simple como sea posible, pero no más simple que eso.
Evita funcionalidades superfluas.
Separa tareas complejas en minitareas.
Limita las funcionalidades en pro de la experiencia.
![Page 53: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/53.jpg)
Interaction Principles Engagement (Flow)
El engagement aumenta cuando un usuario siente que la tarea que ejecuta es lo suficientemente demandante como para que sea entretenida, y no es tan difícil como para que llegue a ser frustrante.
FLOW- Mihaly Csikszentmihalyi
![Page 54: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/54.jpg)
Interaction Principles Functional Layering
Según la ley de Pareto (80 -20) el 20% de las funcionalidades son usadas el 80% de las veces.
Debemos hacer que las funcionalidades más recurrentes sean más fáciles de encontrar.
Debemos entregar herramientas a los usuarios más experimentados para que ejecuten las tareas de manera más rápida (aunque sea un tanto menos lógica).
![Page 55: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/55.jpg)
Interaction Principles Control, confianza y explorabilidad
Si el usuario se siente en control de lo que sucede en la interacción eventualmente presentará confianza en el funcionamiento de esta por lo que se sentirá en condiciones de explorarla de manera más abierta.
![Page 56: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/56.jpg)
Interaction Principles Prevención, detección y recuperación de errores
Prevenir errores:
• Deshabilita funciones que no son útiles
• Usa los patrones de interacción correctos para permitir el ingreso de data por parte del usuario
• Entrega instrucciones claras y precisas
Detectar errores:
• Entrega feedback al usuario en el caso que se presuma que pueda estar cometiendo un error
Recuperación de errores
• Si el error ya fue cometido siempre dale al usuario maneras de deshacerlo
• Si una acción es crítica y no puede ser deshecha indícalo antes de su ejecución
![Page 57: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/57.jpg)
Interaction Principles Affordance
Las características morfológicas de un objeto deben servir de ayuda para identificar su funcionamiento
![Page 58: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/58.jpg)
Interaction Principles Jerarquías de control
Cuando un elemento controla a otro deben encontrarse agrupados de manera jerárquica
![Page 59: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/59.jpg)
Interaction Principles Feedback
Comunica el clic de los botones mediante un feedback visual en los primeros 50 milisegundos.
Muestra un indicador animado para cualquier acción que dure entre 1/2 y 2 segundos.
Si dura más de 2 seg. comunica el tamaño y el progreso con un barra de estado.
Indica con pitidos e indicaciones visuales muy claras cuando el usuario puede volver al trabajo con el sistema.
![Page 60: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/60.jpg)
Interaction Principles Visibility
Los controladores debes ser fáciles de ubicar y usar.
Debe ser obvio y evidente el resultado de la operación de un controlador.
Un sistema con buena visibilidad permite al usuario transformar fácilmente objetivos en acciones.
![Page 61: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/61.jpg)
Interaction Principles Mapping
Los controladores deben ubicarse de manera que se relacionen correctamente con sus ámbitos de acción
![Page 62: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/62.jpg)
Interaction Principles Constraints
El usuario debe ser capaz de realizar sólo las acciones que corresponden en el momento determinado evitando así constantes episodios de error.
![Page 63: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/63.jpg)
Prototipado
¿Qué debo saber?
Hablemos específicamente ahora
Prototipado
![Page 64: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/64.jpg)
¿Y qué es el prototipado?
¿Y un prototipo?
Prototipado
![Page 65: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/65.jpg)
Prototipo Modelo experimental construido mediante múltiples iteraciones rápidas con usuarios. Contar con prototipos físicos durante el proceso de diseño permite un alineamiento mayor y un diseño más eficiente.
Prototipado
![Page 66: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/66.jpg)
Prototipado
![Page 67: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/67.jpg)
Prototipado
![Page 68: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/68.jpg)
Tipos de prototipado
Dependiendo de sus características
Prototipado
![Page 69: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/69.jpg)
Prototipado
![Page 70: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/70.jpg)
Formas de clasificación
Baja / Media / Alta fidelidad Baja fidelidad Media fidelidad Alta fidelidad
Muy precario, con sólo algunas decisiones medulares tomadas, sin interacciones
Con decisiones mas elaboradas, pero aún incompleto. Con interacciones simuladas
Con la totalidad de las decisiones tomadas, cercano a ser transformado en el producto. Con interacciones reales
Sketches, paper prototypes Interactive Wireframes Interactive visual design, Interactive prototypes
http://www.medien.ifi.lmu.de/lehre/ws0708/mmi1/e4.pdf
Prototipado
![Page 71: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/71.jpg)
Formas de clasificación
Según etapa productiva Basic Advanced Manufacturing Virtual
Construido con objetos caseros Sin preocupación por la estética Debe servir para probar su factibilidad
Mejor construido (con la ayuda de profesionales) Se ve y funciona como el producto
Es la versión master del producto, desde la cual se ejecuta la fabricación en masa
Es una representación digital del producto con el detalle suficiente para ser construído
http://www.edisonnation.com/forums/prototyping/topics/the-different-types-of-prototyping
Prototipado
![Page 72: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/72.jpg)
Formas de clasificación
Según etapa de diseño Sketches / Storyboards
Paper prototyping
Horizontal Vertical Wizard of OZ
Historias de uso y dibujos de las principales interacciones
Sketches que pueden ser probados por usuarios (recorridos testeables)
Se ve el global de la idea, aún no están disponibles la funcionalidades en detalle
Se presenta una funcionalidad completa para testear (no está disponible todo, solo la funcionalidad a testear)
Las partes complejas del sistema están simuladas (mediante un humano entregando respuestas, no un sistema)
http://www.medien.ifi.lmu.de/lehre/ws0708/mmi1/e4.pdf
Prototipado
![Page 73: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/73.jpg)
Formas de clasificación
Según su uso Shared communication
Working Through a Design
Selling Your Idea Internally
Usability Testing Gauging Technical Feasibility and Value
Lo suficiente para que el equipo pueda conversar y evolucionar sobre sus ideas. Reemplaza la conversación
Para trabajar sobre la misma idea, para pensar y depurar
Para vender la idea a los que no están trabajando en el proyecto
Para probar nuestra idea con usuarios
Para evaluar su factibilidad técnica y los costos de producción final
Rosenfeld- Prototyping
Prototipado
![Page 74: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/74.jpg)
Matriz de prototipos
![Page 75: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/75.jpg)
8 Principios
Para un buen prototipado
Prototipado
Rosenfeld- Prototyping
![Page 76: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/76.jpg)
Entiende a tu audiencia y tu
objetivos Son la base de un buen resultado
Prototipado
01
![Page 77: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/77.jpg)
Planifica un poco, prototipa el resto
Manos a la obra
Prototipado
02
![Page 78: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/78.jpg)
Establece las expectativas
¿Qué esperar de este prototipo?
Prototipado
03
![Page 79: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/79.jpg)
Dibuja
Es el más rápido de los prototipos y es casi gratis
Prototipado
04
![Page 80: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/80.jpg)
Es un prototipo, no la Mona Lisa
Si es lo suficientemente claro, es lo suficientemente bueno
Prototipado
05
![Page 81: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/81.jpg)
Si no lo puedes hacer, falséalo
Da lo mismo lo que está detrás del escenario
Prototipado
06
![Page 82: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/82.jpg)
Prototipa solamente lo que necesites
El resto no es necesario (por ahora)
Prototipado
07
![Page 83: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/83.jpg)
Reduce el riesgo. Prototipa luego y
seguido Mientras más tiempo pasa, más caro es un
error
Prototipado
08
![Page 84: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/84.jpg)
El primer prototipo va a ser malo
Trata de terminar tu primer prototipo en un día
Vas a cambiar el problema
No te encariñes con tu prototipo
Prototipado
Otros
![Page 85: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/85.jpg)
¿Cómo son los buenos prototipos?
Digo, como pa´saber
Prototipado
![Page 86: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/86.jpg)
Rápidos
Debes ser capaz de crear varios y modificarlos rápido
Prototipado
01
![Page 87: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/87.jpg)
Baratos
Desecharlo y empezar de nuevo debe darte lo mismo
Prototipado
02
![Page 88: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/88.jpg)
Minimalistas
Deben contener sólo lo imprescindible
Prototipado
03
![Page 89: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/89.jpg)
Testeables
Deben permitir que la gente los use, no que escuchen como funcionarían
Prototipado
04
![Page 90: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/90.jpg)
Medibles
Debes poder identificar lo que está bien y lo que está mal (ojalá mediante números)
Prototipado
05
![Page 91: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/91.jpg)
Algunos ejemplos
De prototipado
Prototipado
![Page 92: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/92.jpg)
Video prototyping
Prototipado
![Page 93: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/93.jpg)
Video prototyping
Prototipado
![Page 94: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/94.jpg)
Lego prototyping
Prototipado
![Page 95: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/95.jpg)
3D Printing
Prototipado
![Page 96: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/96.jpg)
Paper prototyping
Prototipado
![Page 97: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/97.jpg)
Testing
¿Y cómo se prueban los prototipos?
Testing
![Page 98: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/98.jpg)
¿Y qué es el Testing?
Es probar con usuarios, pero…
¿Para qué sirve?
Testing
![Page 99: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/99.jpg)
Testing
• Para sacarnos el balde de la cabeza • Para definir cambios cuando aún se puede • Para darnos cuenta de lo que sobra • Para detectar jerarquías erróneas • Para obtener retroalimentación • Para obtener motivación
• Para mejorar
Utilidades
![Page 100: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/100.jpg)
Algunos tipos de testing
Test heurístico – User Testing
Testing
![Page 101: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/101.jpg)
¿Heurísticas?
Checklist de J. Nielsen de aspectos a evaluar
Testing
Test Heurístico
![Page 102: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/102.jpg)
Visibilidad del estado del sistema
El sistema debe informar a los usuarios del estado del sistema, dando una
retroalimentación apropiada en un tiempo razonable
Heurísticas
01
![Page 103: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/103.jpg)
Utilizar el lenguaje de los usuarios
El sistema debe utilizar el lenguaje de los usuarios, con palabras o frases que le sean conocidas, en lugar de los términos que se
utilizan en el sistema.
Heurísticas
02
![Page 104: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/104.jpg)
Control y libertad para el usuario
El sistema no debe hacer sentir al usuario que actúa sin su consentimiento.
Heurísticas
03
![Page 105: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/105.jpg)
Consistencia y estándares
Ante un mismo estímulo, una misma respuesta.
Heurísticas
04
![Page 106: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/106.jpg)
Prevención de errores
Mejor que un sistema con buenos mensajes de error, es uno donde los
usuarios raramente cometen uno.
Heurísticas
05
![Page 107: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/107.jpg)
Minimizar la carga cognitiva
El usuario no debería tener que recordar algo para poder continuar, ese algo debería
estar accesible fácilmente.
Heurísticas
06
![Page 108: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/108.jpg)
Flexibilidad y eficiencia de uso
El sistema debería proveer aceleradores para los usuarios más experimentados.
Heurísticas
07
![Page 109: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/109.jpg)
Diseño estético y minimalista
Cada contenido o elemento innecesario compite por la atención del usuario y
disminuye el potencial de entendimiento.
Heurísticas
08
![Page 110: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/110.jpg)
Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de los errores
Los errores deben ser expresados en lenguaje cotidiano (sin códigos), indicar precisamente el
problema y proponer una solución.
Heurísticas
09
![Page 111: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/111.jpg)
Ayuda y documentación
Si bien es mejor que la ayuda no sea necesaria, en caso de necesitarla debe ser
accesible, contextual y precisa.
Heurísticas
10
![Page 112: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/112.jpg)
¿Cómo se hace bien?
10 Recomendaciones
User -Testing
User Testing
![Page 113: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/113.jpg)
Pensamiento hablado
Pídele al usuario que diga lo que piensa.
01
User -Testing
![Page 114: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/114.jpg)
Todo es testeable
Mientras se tenga un prototipo y usuarios.
02
User -Testing
![Page 115: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/115.jpg)
Comportamiento > Opinión
Créele a lo que ves por sobre lo que escuchas.
03
User -Testing
![Page 116: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/116.jpg)
Se prueban tareas definidas
Nunca un paseo libre.
04
User -Testing
![Page 117: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/117.jpg)
Registra los indicadores clave
Que luego te permitan comparar performance.
05
User -Testing
![Page 118: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/118.jpg)
Si se puede, testea con usuarios reales
Si no se puede, con cualquiera que no esté en el equipo de diseño.
06
User -Testing
![Page 119: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/119.jpg)
Testea y re-testea para comparar
Hazlo con usuarios diferentes.
07
User -Testing
![Page 120: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/120.jpg)
No puedes ayudar al tester
Nada de frío-frío, caliente-caliente.
08
User -Testing
![Page 121: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/121.jpg)
La culpa NUNCA es del tester
Evita que sienta que está rindiendo examen.
09
User -Testing
![Page 122: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/122.jpg)
Entrevista al final para complementar
Puedes hacer un cuestionario para complementar tus hallazgos.
10
User -Testing
![Page 123: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/123.jpg)
¿Qué estás pensando?
Describe los pasos que te han llevado hasta acá
¿Qué piensas que ocurrirá ahora?
¿Es esto lo que esperabas que pasara?
¿Eso fue confuso?
¿Te importaría repetir eso?
?
User -Testing
![Page 124: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/124.jpg)
Ejemplos
Usuarios probando cosas
Testing
![Page 125: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/125.jpg)
Ejemplos
Testing
![Page 126: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/126.jpg)
Ejemplos
Testing
![Page 127: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/127.jpg)
Ejemplos
Testing
![Page 128: Diseño de interacción, Prototipado y Testing](https://reader033.vdocuments.site/reader033/viewer/2022051323/5497dd94b47959384d8b52ae/html5/thumbnails/128.jpg)
Más información
Prototyping
Todd Zaki Warfel
Measuring The User Experience
Thomas Tullis
William Albert
UX Book
Rex Hartson, Pardha Pyla
http://www.uxd.cl/