Tema 2. Principios de diseño centrado en el usuario 30258- Diseño Centrado en el Usuario. Dra. Sandra Baldassarri Objetivos Conocer los principios de diseño centrados en el usuario y su aplicación al diseño web y multimedia. Diseño de la información y la navegación Revisión de las técnicas vistas en IPO Estudio de nuevas técnicas de prototipado para modelar el sistema en desarrollo, con especial atención a aquellas que se usan en diseño web y diseño multimedia. Diseño del contenido de la información: Arquitectura de la información: Definición y Técnicas Técnicas de evaluación Aplicar técnicas de evaluación con usuarios para verificar la viabilidad del sistema
El proceso de diseño Análisis de Requisitos Prototipado, Evaluación Diseño Iteración: Prototipado y Evaluación Técnicas de evaluación Definir tareas: Análisis jerárquico de las tareas Diálogos Definir estilo: Interacción e Interfaz Guías Estándares Reglas Implementación Prototipos funcionales, evaluación Lanzamiento Evaluación: test de usabilidad Ref: Transparencias IPO El proceso de diseño Diseño Iteración: Prototipado y Evaluación Esbozos o bocetos (AR) Escenarios Narrativa Diagrama de flujo Texto de los procedimientos Storyboard Prototipos en papel Prototipos en vídeo Técnicas de evaluación Definir tareas: Análisis jerárquico de las tareas Diálogos Definir estilo Guías Estándares Reglas Ref: Transparencias IPO
Qué es un prototipo? Diseño. Prototipado Clasificación de los prototipos según su funcionalidad Vertical Horizontal Clasificación de los prototipos según su calidad Baja fidelidad Alta fidelidad Otras técnicas de prototipado Diseño. Prototipado Qué es un prototipo? Un prototipo es un objeto diseñado para realizar una demostración de cualquier tipo. Qué se puede prototipar? Aspectos técnicos Flujo de trabajo, diseño de tareas Diseño de pantallas, información a mostrar Áreas críticas, difíciles o controvertidas La etapa de prototipado se basa en la elaboración de modelos o prototipos de la interfaz del sitio o aplicación web.
Qué técnicas de prototipado se utilizan en el diseño de interfaces? Escenarios Narrativa Diagrama de flujo Texto de los procedimientos Storyboard* Prototipo en papel Prototipo en vídeo Prototipo software Ref: Transparencias IPO Tipos de prototipos. Funcionalidad Los prototipos se pueden clasificar según la funcionalidad reproducida: Prototipado horizontal: Se reproduce gran parte del aspecto visual, pero sin que esos modelos de interfaz estén respaldados por la funcionalidad real que tendrá finalmente. Prototipado vertical: Se reproduce únicamente el aspecto visual de una parte de la interfaz, pero la parte reproducida posee la misma funcionalidad que tendrá una vez implementada la aplicación.
Tipos de prototipos. Funcionalidad Prototipado horizontal y vertical Tipos de prototipos. Funcionalidad Prototipado horizontal Muestra el espectro de características de una aplicación. Muestran las páginas principales, sin demasiada profundidad. Permite a los usuarios navegar por el sistema. Las páginas que implementan tareas específicas no están presentes. Sirven para ver la lógica general del sitio. Se utiliza en las etapas tempranas del diseño: Para determinar funcionalidades a incluir Para decidir sobre el concepto de la interfaz de usuario Ayuda a evaluar: Navegación Preferencias de usuario Accesibilidad
Tipos de prototipos. Funcionalidad Prototipado vertical Demuestra una característica específica de una aplicación Permite que el usuario sólo utilice esa función concreta Implementan las páginas claves para completar una tarea específica. Apropiado cuando hay tareas complejas que no se comprenden. No es necesario que implementen enlaces que conectan a otras tareas u otras partes del sitio. Se utiliza en las etapas tempranas del diseño: Para comparar entre diferentes diseños de una función Ayuda a evaluar: El diseño óptimo de una función en particular Optimizar la usabilidad de esa función Tipos de prototipos. Calidad Los prototipos se pueden clasificar según la calidad o fidelidad del prototipo (refinamiento progresivo): Prototipado de baja fidelidad: El aspecto de prototipo distará bastante del aspecto final. Prototipado de alta fidelidad: El prototipo será muy parecido a la interfaz una vez terminada.
Tipos de prototipos. Calidad Prototipos de baja fidelidad (low-fidelity prototype) Son prototipos fáciles de realizar Se suele utilizar un medio que sea diferente del prototipo final, ej: prototipado en papel. Se caracteriza por ser rápido, barato y fácil de cambiar Se utiliza para verificar aspectos del diseño con clientes o usuarios potenciales. Ejemplos: sketch de pantallas, secuencia de tareas, notas post-it, storyboards, wizard-of-oz Tipos de prototipos. Calidad Prototipos de baja fidelidad
Tipos de prototipos. Calidad Prototipo de alta fidelidad (high-fidelity prototype) Se suele utilizar un medio parecido al esperado en el producto final Para la representación del sistema se sueen utilizar entornos como Macromedia Director, Dreamweaver, Photoshop, etc. Conviene dejarlo para etapas más avanzadas del diseño. Limita la interacción con los clientes Hay peligro de que los clientes piensen que el producto está terminado Tipos de prototipos. Calidad Prototipos de alta fidelidad
Alternativas: Tipos de prototipos. Calidad Prototipos de fidelidad media: no se tienen en cuenta detalles como tipos de letra, colores, temas gráficos Prototipos de alta fidelidad baratos : Escenarios Narrativa, Diagrama de flujo, Texto de procedimientos, Storyboard Prototipo en papel Prototipo en vídeo Prototipo software Mapa de navegación Sketching Esquemas Prototipo basado en cartas Wizard-of-Oz
Escenarios Mapa de navegación Mapa de un sitio web: Diagrama o grafo que refleja la estructura del sitio y algo sobre la estructura o flujo de navegación dentro del sitio.
Sketching Importante en los prototipos de baja fidelidad Se utilizan símbolos simples (no importa la habilidad para dibujar) Esquemas (Schematics) Representaciones de la disposición (layout) y contenido que aparecerá en las páginas individuales. No contienen imágenes aunque sí están indicados los lugares donde estas van.
Prototipo basado en cartas Cartas tipo índice (7 x 12 cm) Cada carta representa una pantalla o parte de la pantalla Se utilizan generalmente para el desarrollo de sitios web Ejemplo de uso de un prototipo basado en cartas para representar un caso de uso de una aplicación
Mago de Oz (Wizard-of-Oz) El usuario piensa que está interactuando con el ordenador pero el desarrollador quien genera las salidas del sistema. Generalmente se utiliza en los primeros diseños para entender las expectativas de los usuarios. No se implementan las partes más complejas y complicadas del prototipo El usuario tiene la experiencia sin que haya un esfuerzo excesivo de implementación del prototipo. Mago de Oz (Wizard-of-Oz) Áreas típicas en las que se suele emplear esta técnica: Reconocimiento de voz Síntesis de voz Anotaciones Razonamiento User Percepción visual >Blurb blurb >Do this >Why?
Prototipado: Algunas consideraciones prácticas Todas las técnicas de prototipado conllevan compromisos, que se deben tener en cuenta: Tiempo de desarrollo Realismo Hay investigaciones muestran que: Aquellos que trabajan en papel exploran variadas alternativas de diseño. Aquellos que trabajan en ordenador tienden a tomar una única idea y explorarla en detalle. Prototipado: Algunas consideraciones prácticas Los prototipos altamente realistas y muy trabajados estéticamente: Generalmente restringen los posibles comentarios de evaluación Los usuarios dejan de cuestionarse el concepto básico El feedback se centra en detalles del diseño visual o el diseño de la interacción Los prototipos con diseños realistas pero menos acabados estéticamente Pueden ayudar a los usuarios a cuestionarse el concepto Se pueden mejorar fácilmente los diseño visuales
Prototipado: Algunas consideraciones prácticas Prototipado: Algunas consideraciones prácticas