Diseño de usabilidad y experiencia de usuario
¡Atención, diseñadores y desarrolladores! Esta es vuestra guía completa sobre el diseño de UX basado en datos para productos digitales. Descubrid cómo una experiencia de usuario eficaz incorpora conocimientos de psicología, principios de diseño y datos prácticos. Seguid un enfoque probado para seleccionar vuestros métodos de diseño y, a continuación, recorred en detalle el proceso de diseño de UX basado en datos: realizad análisis de contexto, especificad requisitos, desarrollad prototipos de soluciones y probad vuestros productos. ¡Aprenda de casos prácticos e ilustraciones a todo color para llevar su diseño al siguiente nivel!
- Diseña productos digitales para aplicaciones B2C, B2B y médicas que ofrezcan una experiencia de usuario excepcional.
- Planifique su diseño, realice análisis del contexto de uso e identifique los requisitos.
- Desarrollar y evaluar soluciones de diseño, desde la fase de creación de prototipos hasta la etapa de pruebas y revisión.
Aprenderás sobre:
- Teoría del diseño:
¿Qué hace que un diseño sea eficaz? Conoce los elementos básicos que crean una experiencia de usuario increíble: ergonomía y usabilidad, evaluación de datos, investigación de usuarios, procesamiento de información humana, principios de diseño y mucho más.
- Proceso de diseño de la experiencia de usuario:
Domina el diseño de UX basado en datos. Explora métodos para analizar el contexto de uso de tu proyecto de diseño. Utiliza técnicas como prototipos y wireframes para desarrollar una solución de diseño y, a continuación, perfecciónala mediante pruebas de usabilidad y UX.
- Diseño en acción:
¡Vea ejemplos de diseños que cobran vida! Siga tres casos prácticos que ilustran el proceso de diseño de productos digitales: una aplicación de movilidad B2C, una aplicación de gestión de relaciones con los clientes B2B y un portal de citas médicas B2C/B2B.
Aspectos Destacados:
- Diseño de UX basado en datos
- Aplicaciones B2B y B2C
- Habilidades del investigador de usuarios
- Fundamentos psicológicos
- Principios de diseño
- Análisis del contexto de uso
- Formulación de requisitos
- Prototipos y esquemas funcionales
- Pruebas y evaluación del diseño
- Matrices de decisión
- Casos de uso
Ver Tabla de Contenidos Completa
- Prólogo
- 1 Introducción
- 1.1 ¿Para quién está escrito este libro?
- 1.2 ¿Por qué deberías leer este libro?
- 1.3 ¿Cómo se debe leer este libro?
- 1.4 Tus compañeros constantes: nuestros tres ejemplos
- 1.4.1 moveHUB: la aplicación de movilidad para cada ocasión
- 1.4.2 BusinessBooster: la herramienta de inteligencia empresarial CRM para pequeñas y medianas empresas
- 1.4.3 Healthyfy: la plataforma para conectar a pacientes y profesionales de la salud
- 2 Los términos más importantes y su historia
- 2.1 La (pre)historia de la usabilidad y la experiencia de usuario
- 2.1.1 La Antigua Grecia e Hipócrates de Cos
- 2.1.2 El Renacimiento y Leonardo da Vinci
- 2.1.3 La Revolución Industrial
- 2.1.4 Ciencia del trabajo
- 2.1.5 Ergonomía
- 2.1.6 Factores humanos
- 2.1.7 Ergonomía del software
- 2.1.8 Interacción persona-máquina
- 2.1.9 Interacción persona-computadora
- 2.1.10 Conclusión
- 2.2 Usabilidad y diseño UX: conceptos básicos
- 2.2.1 Usabilidad
- 2.2.2 Experiencia del usuario
- 2.2.3 Diseño
- 2.2.4 Usuarios
- 2.2.5 Contexto de uso
- 2.3 La interacción entre ergonomía, usabilidad y experiencia de usuario
- 2.3.1 La metáfora del árbol
- 2.3.2 El modelo Kano
- 2.3.3 Ergonomía frente a usabilidad frente a experiencia de usuario en moveHUB
- 2.3.4 Ergonomía frente a usabilidad frente a experiencia de usuario en BusinessBooster
- 2.3.5 Ergonomía frente a usabilidad frente a experiencia de usuario en Healthyfy
- 3 La usabilidad y la experiencia de usuario como factores clave para crear productos excepcionales
- 3.1 ¿Qué es el retorno de la inversión?
- 3.2 Métricas para el éxito empresarial
- 3.2.1 Métricas relacionadas con sistemas, productos o servicios
- 3.2.2 Medidas relacionadas con los usuarios y los clientes
- 3.2.3 Métricas relacionadas con el servicio
- 3.2.4 Elección de los indicadores adecuados
- 3.3 Planificar en lugar de descubrir el retorno de la inversión
- 3.4 Métricas para el éxito empresarial: sectores B2C frente a B2B
- 3.5 ¿Qué retorno de la inversión se puede lograr mediante el diseño de usabilidad y experiencia de usuario?
- 3.5.1 Estudios sobre el retorno de la inversión en usabilidad y diseño de la experiencia de usuario
- 3.5.2 Comentarios de nuestros clientes sobre el retorno de la inversión en usabilidad y diseño de la experiencia de usuario
- 3.6 Caso práctico: medición del retorno de la inversión en moveHUB
- 3.7 Caso práctico: medición del retorno de la inversión en BusinessBooster
- 3.8 Caso práctico: medición del retorno de la inversión en Healthyfy
- 4 Cómo «hacer» diseño de usabilidad y experiencia de usuario
- 4.1 La norma ISO 9241-210: Diseño centrado en las personas para sistemas interactivos
- 4.1.1 Paso 1: Planificar el proceso de diseño centrado en las personas
- 4.1.2 Paso 2: Comprender y especificar el contexto de uso
- 4.1.3 Paso 3: Especificar los requisitos del usuario
- 4.1.4 Paso 4: Creación de soluciones de diseño
- 4.1.5 Paso 5: Evaluación del diseño
- 4.1.6 Conclusión
- 4.2 Pensamiento de diseño
- 4.2.1 Paso 1: Comprender
- 4.2.2 Paso 2: Observar
- 4.2.3 Paso 3: Definir el punto de vista
- 4.2.4 Paso 4: Idear
- 4.2.5 Paso 5: Prototipo
- 4.2.6 Paso 6: Prueba
- 4.2.7 Conclusión
- 4.3 Producto mínimo viable
- 4.3.1 Paso 1: Construir
- 4.3.2 Paso 2: Medir
- 4.3.3 Paso 3: Aprender
- 4.3.4 Conclusión
- 4.4 Doble diamante
- 4.4.1 Fase 1: Descubrir
- 4.4.2 Fase 2: Definir
- 4.4.3 Fase 3: Desarrollo
- 4.4.4 Fase 4: Entrega
- 4.4.5 Principios fundamentales
- 4.4.6 Conclusión
- 4.5 Ingeniería de usabilidad para dispositivos médicos según la norma IEC 62366-1
- 4.6 Puntos en común entre los métodos
- 4.6.1 Análisis de las necesidades de los clientes
- 4.6.2 Optimización iterativa de la solución
- 4.6.3 Aprender de los comentarios directos de los usuarios/clientes
- 4.6.4 La velocidad como objetivo
- 4.6.5 El éxito a través de la colaboración
- 4.6.6 La visualización como medio de elección
- 5 Diseño de UX basado en datos
- 5.1 El objetivo del proceso de diseño de UX basado en datos
- 5.2 El proceso de diseño de la experiencia de usuario basado en datos
- 5.2.1 Cómo sacar el máximo provecho del proceso
- 5.2.2 Breve descripción general del proceso de diseño de UX basado en datos
- 5.2.3 Análisis del contexto de uso, incluida la evaluación de riesgos y la documentación
- 5.2.4 Derivación y documentación de los requisitos de uso
- 5.2.5 Desarrollo de soluciones de diseño basadas en el riesgo y el uso
- 5.2.6 Evaluación de soluciones de diseño priorizadas por riesgo y frecuencia de uso
- 5.3 La matriz de flexibilidad y riesgo: ¿cuántos datos necesitas realmente?
- 5.3.1 La flexibilidad de su solución
- 5.3.2 El riesgo de su solución
- 5.3.3 Trabajar con la matriz de flexibilidad y riesgo
- 5.4 Datos objetivos frente a datos subjetivos
- 5.5 Datos cuantitativos frente a datos cualitativos
- 5.6 Evaluación crítica de los datos
- 5.6.1 ¿De dónde proceden los datos?
- 5.6.2 Datos objetivos o interpretación
- 5.6.3 ¿Es correcto el marco de referencia?
- 5.6.4 ¿Le han explicado los juicios de valor o las declaraciones?
- 5.6.5 ¿Son completos y significativos los datos?
- 5.7 Ayuda rápida para la categorización
- 5.7.1 ¿Necesita datos durante el desarrollo?
- 5.7.2 ¿Cuántos datos necesita?
- 5.7.3 ¿Qué tipo de datos necesita?
- 5.7.4 Conclusión
- 6 Una mentalidad útil para el diseño de usabilidad y UX
- 6.1 Supuestos frente a conocimientos
- 6.1.1 Revelar claramente las propias suposiciones
- 6.1.2 Distinguir entre suposiciones y conocimientos
- 6.1.3 ¿Por qué necesito datos para esto?
- 6.1.4 Ejemplos de suposiciones mayormente falsas y rara vez verdaderas
- 6.2 ¡Los usuarios no saben lo que quieren!
- 6.2.1 Experiencia en tareas y objetivos frente a experiencia en diseño
- 6.2.2 Reunir la experiencia
- 6.2.3 Creación de soluciones excepcionales con los usuarios
- 6.3 Habilidades clave para los investigadores de usuarios: observar, hacer preguntas y escuchar
- 6.3.1 Observación
- 6.3.2 Hacer preguntas
- 6.3.3 Escuchar
- 6.3.4 Tu mentalidad como investigador de usuarios
- 6.4 El diseño como proceso que se puede aprender
- 6.4.1 El papel de la creatividad
- 6.4.2 El papel del talento, la práctica, la experiencia y el conocimiento
- 6.4.3 ¿Qué necesito aprender para convertirme en diseñador de usabilidad y experiencia de usuario?
- 6.5 Pruebas y cultura corporativa
- 7 Fundamentos
- 7.1 Fundamentos psicológicos: no te preocupes, se trata de personas
- 7.2 Percepción: el sistema sensorial humano
- 7.2.1 El ojo
- 7.2.2 El oído
- 7.2.3 La piel
- 7.2.4 La lengua
- 7.2.5 La nariz
- 7.2.6 Conclusión
- 7.3 Procesamiento de la información humana
- 7.3.1 Fundamentos del modelo
- 7.3.2 Estímulo
- 7.3.3 Descubrir
- 7.3.4 Reconocer
- 7.3.5 Decidir
- 7.3.6 Actuar
- 7.3.7 Reacción
- 7.3.8 Memoria
- 7.3.9 Conclusión
- 7.4 Conceptos básicos de diseño
- 7.4.1 Impacto del diseño
- 7.4.2 Elementos básicos del diseño visual
- 7.4.3 Principios de la Gestalt
- 7.4.4 Principios de interacción
- 8 Diseño de UX basado en datos en detalle: preparación
- 8.1 Planificación del proceso de diseño de la experiencia de usuario basado en datos
- 8.1.1 ¿Quién debe participar en el taller para las partes interesadas?
- 8.1.2 El programa del taller para las partes interesadas
- 8.2 Integración del diseño de UX basado en datos en proyectos de desarrollo ágil
- 8.3 Planificar el esfuerzo adecuado
- 9 Diseño de UX basado en datos en detalle: análisis del contexto de uso
- 9.1 ¿Qué preguntas debe responder el análisis del contexto de uso?
- 9.2 ¿Cuál es el contexto de uso?
- 9.2.1 Los usuarios
- 9.2.2 Los pacientes (dispositivos médicos)
- 9.2.3 La tarea
- 9.2.4 Los objetivos
- 9.2.5 Los recursos
- 9.2.6 El medio ambiente
- 9.2.7 Riesgo, frecuencia y conclusión
- 9.3 Métodos de análisis del contexto de uso
- 9.3.1 Investigación secundaria/investigación documental
- 9.3.2 Observación de campo
- 9.3.3 Entrevista/Tareas a realizar
- 9.3.4 Debates grupales/grupos focales
- 9.3.5 Encuestas cuantitativas/cuestionarios
- 9.3.6 Investigación contextual
- 9.3.7 Análisis de datos cuantitativos de uso
- 9.3.8 Seguimiento web/Análisis de clics
- 9.3.9 Análisis de tickets y comentarios
- 9.4 Métodos analíticos del análisis del contexto de uso
- 9.4.1 Análisis de tareas
- 9.4.2 Mapeo del recorrido del usuario o cliente/Análisis de puntos de contacto
- 9.4.3 Personajes y mapas de empatía
- 9.5 Ejemplos prácticos para el análisis de contexto
- 9.5.1 Análisis del contexto en moveHUB
- 9.5.2 Análisis contextual en BusinessBooster
- 9.5.3 Análisis contextual en Healthyfy
- 10 Diseño de UX basado en datos en detalle: especificación de los requisitos de uso
- 10.1 Considera tus personajes o mapas de empatía
- 10.2 Casos de uso e historias de usuarios: cómo no hacerlo y cómo hacerlo de todos modos
- 10.2.1 Casos de uso
- 10.2.2 Historias de usuarios
- 10.3 De las historias de usuario a los requisitos
- 10.3.1 Requisitos fijos
- 10.3.2 Requisitos de alcance
- 10.3.3 Requisito frente a deseo
- 10.3.4 Documentación y formulación de requisitos
- 10.3.5 ¿De dónde proceden los valores de los requisitos?
- 10.4 Formulación de requisitos para moveHUB
- 10.5 Formulación de requisitos para BusinessBooster
- 10.6 Formulación de requisitos para Healthyfy
- 11 Diseño de UX basado en datos en detalle: desarrollo de soluciones de diseño
- 11.1 Recordatorio: ¿Cuál es el objetivo del diseño y cómo lo abordamos?
- 11.2 Investigación sobre diseño
- 11.3 De grueso a fino
- 11.4 Desarrollo de opciones de solución básicas
- 11.4.1 Cómo convertir un 2 en un 3
- 11.4.2 Cómo lidiar con demasiadas ideas de tres puntos
- 11.4.3 Conclusión
- 11.5 Trabajar con prototipos
- 11.5.1 Prototipos horizontales y verticales
- 11.5.2 Prototipos de alta y baja fidelidad
- 11.5.3 ¿Qué prototipo se debe utilizar y cuándo?
- 11.6 Esquemas funcionales
- 11.6.1 Botones
- 11.6.2 Menús desplegables
- 11.6.3 Botones de radio
- 11.6.4 Campos de entrada o campos de texto
- 11.6.5 Cuadros combinados
- 11.6.6 Casillas de verificación
- 11.6.7 Acordeones
- 11.6.8 Botones de alternancia
- 11.6.9 Deslizadores
- 11.6.10 Calendarios
- 11.6.11 Seleccionadores de hora
- 11.6.12 Selección de colores
- 11.6.13 Botones de información, botones de datos y consejos sobre herramientas
- 11.6.14 Ventanas emergentes
- 11.6.15 Barras de menú
- 11.6.16 Carruseles
- 11.6.17 Control deslizante de la página web
- 11.6.18 Etiquetas y bloques de texto
- 11.6.19 Imágenes, íconos y marcadores de posición
- 11.6.20 Caso especial: advertencias
- 11.6.21 Conclusión
- 11.7 Control de calidad de la interfaz de usuario: la cuadrícula de diseño
- 11.8 Flujos de pantalla
- 11.9 Hacer clic en maniquíes
- 11.9.1 Herramientas para crear maniquíes de clic
- 11.9.2 Hacer que el diseño sea comprobable
- 11.10 ¿Primero el ordenador, el móvil o el reloj inteligente?
- 11.11 Diseño adaptable
- 11.12 Diseño visual
- 11.12.1 Investigación sobre diseño visual
- 11.12.2 El Espacio de la Asociación
- 11.12.3 Tableros de inspiración
- 11.12.4 Cerrar brechas en el tablero de estado de ánimo prototipo
- 11.12.5 De los tableros de inspiración prototipo a los tableros de inspiración
- 11.12.6 El concepto de diseño visual
- 11.12.7 Creación de prototipos visuales (maquetas interactivas)
- 11.12.8 La guía de estilo
- 11.13 Excursión: Low-Code y No-Code
- 11.14 Ejemplo: Posibles pasos de diseño para moveHUB
- 11.15 Ejemplo: Posibles pasos de diseño para BusinessBooster
- 11.16 Ejemplo: Posibles pasos de diseño para Healthyfy
- 12 Diseño de UX basado en datos en detalle: evaluación de soluciones de diseño
- 12.1 Evaluación formativa frente a evaluación sumativa
- 12.2 Identificación de lagunas de conocimiento
- 12.3 Evaluación del usuario frente a evaluación del experto
- 12.4 Remoto frente a in situ
- 12.4.1 Dependencia de la infraestructura técnica
- 12.4.2 Pérdida de información importante
- 12.4.3 Menor control sobre la confidencialidad
- 12.4.4 Los productos no digitales no se pueden probar sin sesgos
- 12.4.5 Conclusión
- 12.5 Diseño de casos de prueba
- 12.5.1 Requisitos previos
- 12.5.2 Instrucciones para el usuario
- 12.5.3 Ejecución correcta de la tarea
- 12.5.4 Postcondición tras una ejecución correcta
- 12.5.5 Determinar el número de casos de prueba
- 12.6 Los métodos presentados
- 12.7 Prueba de usabilidad y experiencia de usuario
- 12.7.1 ¿Cómo funciona?
- 12.7.2 ¿Cuándo se utiliza?
- 12.7.3 ¿Qué necesitas?
- 12.7.4 ¿Cuáles son las ventajas?
- 12.7.5 ¿Cuáles son las desventajas?
- 12.7.6 ¿Cuáles son las alternativas?
- 12.8 Usabilidad y UX Sprint
- 12.8.1 ¿Cómo funciona?
- 12.8.2 ¿Cuándo se utiliza?
- 12.8.3 ¿Qué necesitas?
- 12.8.4 ¿Cuáles son las ventajas?
- 12.8.5 ¿Cuáles son las desventajas?
- 12.8.6 ¿Cuáles son las alternativas?
- 12.9 Pruebas rápidas de usuario
- 12.9.1 ¿Cómo funciona?
- 12.9.2 ¿Cuándo se utiliza?
- 12.9.3 ¿Qué necesitas?
- 12.9.4 ¿Cuáles son las ventajas?
- 12.9.5 ¿Cuáles son las desventajas?
- 12.9.6 ¿Cuáles son las alternativas?
- 12.10 Pruebas A/B
- 12.10.1 ¿Cómo funciona?
- 12.10.2 ¿Cuándo se utiliza?
- 12.10.3 ¿Qué necesitas?
- 12.10.4 ¿Cuáles son las ventajas?
- 12.10.5 ¿Cuáles son las desventajas?
- 12.10.6 ¿Cuáles son las alternativas?
- 12.11 Evaluación comparativa de la experiencia de usuario
- 12.11.1 ¿Cómo funciona?
- 12.11.2 ¿Cuándo se utiliza?
- 12.11.3 ¿Qué necesitas?
- 12.11.4 ¿Cuáles son las ventajas?
- 12.11.5 ¿Cuáles son las desventajas?
- 12.11.6 ¿Cuáles son las alternativas?
- 12.12 Prueba de 5 segundos
- 12.12.1 ¿Cómo funciona?
- 12.12.2 ¿Cuándo se utiliza?
- 12.12.3 ¿Qué necesitas?
- 12.12.4 ¿Cuáles son las ventajas?
- 12.12.5 ¿Cuáles son las desventajas?
- 12.12.6 ¿Cuáles son las alternativas?
- 12.13 Cuestionarios estandarizados
- 12.13.1 ¿Cómo funciona?
- 12.13.2 ¿Cuándo se utiliza?
- 12.13.3 ¿Qué necesitas?
- 12.13.4 ¿Cuáles son las ventajas?
- 12.13.5 ¿Cuáles son las desventajas?
- 12.13.6 ¿Cuáles son las alternativas?
- 12.14 Análisis de datos cuantitativos de uso
- 12.14.1 ¿Cómo funciona?
- 12.14.2 ¿Cuándo se utiliza?
- 12.14.3 ¿Qué necesitas?
- 12.14.4 ¿Cuáles son las ventajas?
- 12.14.5 ¿Cuáles son las desventajas?
- 12.14.6 ¿Cuáles son las alternativas?
- 12.15 Seguimiento web/Análisis de clics
- 12.16 Estudio del diario
- 12.16.1 ¿Cómo funciona?
- 12.16.2 ¿Cuándo se utiliza?
- 12.16.3 ¿Qué necesitas?
- 12.16.4 ¿Cuáles son las ventajas?
- 12.16.5 ¿Cuáles son las desventajas?
- 12.16.6 ¿Cuáles son las alternativas?
- 12.17 Clasificación de tarjetas
- 12.17.1 ¿Cómo funciona?
- 12.17.2 ¿Cuándo se utiliza?
- 12.17.3 ¿Qué necesitas?
- 12.17.4 ¿Cuáles son las ventajas?
- 12.17.5 ¿Cuáles son las desventajas?
- 12.17.6 ¿Cuáles son las alternativas?
- 12.18 Revisión por expertos
- 12.18.1 ¿Cómo funciona?
- 12.18.2 ¿Cuándo se utiliza?
- 12.18.3 ¿Qué necesitas?
- 12.18.4 ¿Cuáles son las ventajas?
- 12.18.5 ¿Cuáles son las desventajas?
- 12.18.6 ¿Cuáles son las alternativas?
- 12.19 Prueba del espacio de asociación
- 12.19.1 ¿Cómo funciona?
- 12.19.2 ¿Cuándo se utiliza?
- 12.19.3 ¿Qué necesitas?
- 12.19.4 ¿Cuáles son las ventajas?
- 12.19.5 ¿Cuáles son las desventajas?
- 12.19.6 ¿Cuáles son las alternativas?
- 12.20 Seguimiento ocular
- 12.20.1 ¿Cómo funciona?
- 12.20.2 ¿Cuándo se utiliza?
- 12.20.3 ¿Qué necesitas?
- 12.20.4 ¿Cuáles son las ventajas?
- 12.20.5 ¿Cuáles son las desventajas?
- 12.20.6 ¿Cuáles son las alternativas?
- 12.21 Métodos de medición fisiológica
- 12.21.1 ¿Cómo funciona?
- 12.21.2 ¿Cuándo se utiliza?
- 12.21.3 ¿Qué necesitas?
- 12.21.4 ¿Cuáles son las ventajas?
- 12.21.5 ¿Cuáles son las desventajas?
- 12.21.6 ¿Cuáles son las alternativas?
- 12.22 Análisis de errores mediante el análisis de la causa raíz
- 12.23 Aprender de los datos y tomar decisiones informadas
- 12.23.1 Implementación de comentarios
- 12.23.2 Documentación de las decisiones
- 12.24 Evaluaciones en el desarrollo de dispositivos médicos
- 12.25 Ejemplo: Métodos de evaluación para moveHUB
- 12.26 Ejemplo: Métodos de evaluación para BusinessBooster
- 12.27 Ejemplo: Métodos de evaluación para Healthyfy
- 13 Diseñar, obtener datos, repetir: ¿cuándo es suficiente?
- 13.1 Determinación de la transición basada en la calidad
- 13.2 Determinación de la transición en función del tiempo
- 13.3 ¿Deberías reajustar? La flexibilidad y la matriz de riesgos como ayuda
- 13.4 Elegir el enfoque adecuado
- 13.5 ¿Qué le depara el futuro a moveHUB?
- 13.6 ¿Qué le depara el futuro a BusinessBooster?
- 13.7 ¿Qué le depara el futuro a Healthyfy?
- 14 Matriz de decisión para la selección del método
- 15 Resumen y conclusión
- 15.1 Todo gira en torno a los usuarios
- 15.2 La usabilidad y el diseño de la experiencia de usuario son interdisciplinarios
- 15.3 La experiencia de usuario no se diseña, se vive.
- 15.4 El camino hacia un producto sobresaliente es iterativo
- 15.5 Una vez que empiezas con el diseño de usabilidad y UX, nunca paras.
- 15.6 Diseño basado en datos
- 15.7 Palabras finales y convocatoria a participar
- Anexos
- Glosario
- B Bibliografía
- C Los autores
- Índice
Usability and User Experience Design
Calling all designers and developers! This is your all-in-one guide to data-driven UX design for digital products. See how an effective user experience incorporates insights from psychology, design principles, and practical data. Follow a proven approach for selecting your design methods, and then walk through the data-driven UX design process in detail: perform context analysis, specify requirements, develop solution prototypes, and test your products. Learn from example case studies and full-color illustrations to take your design to the next level!
- Design digital products for B2C, B2B, and medical applications that provide outstanding user experience
- Plan your design, perform context of use analyses, and identify requirements
- Develop and evaluate design solutions, from the prototyping phase to the testing and review stage
You'll learn about:
- Theory of Design:
What makes design effective? Get to know the building blocks that create an incredible user experience: ergonomics and usability, data evaluation, user research, human information processing, design principles, and more.
- UX Design Process:
Master data-driven UX design. Explore methods to analyze the context of use for your design project. Use techniques such as prototypes and wireframes to develop a design solution, and then refine it through usability and UX testing.
- Design in Action:
See examples of design come to life! Follow three case studies that illustrate the design process for digital products: a B2C mobility application, a B2B customer relationship management application, and a B2C/B2B medical appointment portal.
Key Highlights:
- Data-driven UX design
- B2B and B2C applications
- User researcher skills
- Psychological foundations
- Design principles
- Context of use analysis
- Requirements formulation
- Prototypes and wireframes
- Design testing and evaluation
- Decision matrices
- Use cases
View Full Table of Contents
- Foreword
- 1 Introduction
- 1.1 Who Is This Book Written For?
- 1.2 Why Should You Read This Book?
- 1.3 How Should You Read This Book?
- 1.4 Your Constant Companions: Our Three Examples
- 1.4.1 moveHUB: The Mobility App for Every Occasion
- 1.4.2 BusinessBooster: The CRM BI Tool for Small and Medium-Sized Enterprises
- 1.4.3 Healthyfy: The Platform for Connecting Patients and Healthcare Professionals
- 2 The Most Important Terms and Their History
- 2.1 The (Pre-)History of Usability and UX
- 2.1.1 Ancient Greece and Hippocrates of Kos
- 2.1.2 The Renaissance and Leonardo da Vinci
- 2.1.3 The Industrial Revolution
- 2.1.4 Work Science
- 2.1.5 Ergonomics
- 2.1.6 Human Factors
- 2.1.7 Software Ergonomics
- 2.1.8 Human-Machine Interaction
- 2.1.9 Human-Computer Interaction
- 2.1.10 Conclusion
- 2.2 Usability and UX Design: The Core Concepts
- 2.2.1 Usability
- 2.2.2 User Experience
- 2.2.3 Design
- 2.2.4 Users
- 2.2.5 Context of Use
- 2.3 The Interplay of Ergonomics, Usability, and UX
- 2.3.1 The Tree Metaphor
- 2.3.2 The Kano Model
- 2.3.3 Ergonomics versus Usability versus UX at moveHUB
- 2.3.4 Ergonomics versus Usability versus UX at BusinessBooster
- 2.3.5 Ergonomics versus Usability versus UX at Healthyfy
- 3 Usability and UX as Key Factors for Outstanding Products
- 3.1 What Is Return on Investment?
- 3.2 Metrics for Business Success
- 3.2.1 Metrics Related to Systems, Products, or Services
- 3.2.2 User- and Customer-Related Measures
- 3.2.3 Service-Related Metrics
- 3.2.4 Choosing the Appropriate Metrics
- 3.3 Planning instead of Discovering ROI
- 3.4 Metrics for Business Success: B2C versus B2B Sectors
- 3.5 What ROI Is Achievable through Usability and UX Design?
- 3.5.1 Studies on the ROI of Usability and UX Design
- 3.5.2 Feedback from Our Customers on the ROI of Usability and UX Design
- 3.6 Case Study: Measuring ROI at moveHUB
- 3.7 Case Study: Measuring ROI at BusinessBooster
- 3.8 Case Study: Measuring ROI at Healthyfy
- 4 How to “Do” Usability and UX Design
- 4.1 The ISO 9241-210 Standard: Human-Centered Design for Interactive Systems
- 4.1.1 Step 1: Plan the Human-Centered Design Process
- 4.1.2 Step 2: Understand and Specify the Context of Use
- 4.1.3 Step 3: Specify the User Requirements
- 4.1.4 Step 4: Producing Design Solutions
- 4.1.5 Step 5: Evaluating the Design
- 4.1.6 Conclusion
- 4.2 Design Thinking
- 4.2.1 Step 1: Understand
- 4.2.2 Step 2: Observe
- 4.2.3 Step 3: Define Point of View
- 4.2.4 Step 4: Ideate
- 4.2.5 Step 5: Prototype
- 4.2.6 Step 6: Test
- 4.2.7 Conclusion
- 4.3 Minimum Viable Product
- 4.3.1 Step 1: Build
- 4.3.2 Step 2: Measure
- 4.3.3 Step 3: Learn
- 4.3.4 Conclusion
- 4.4 Double Diamond
- 4.4.1 Phase 1: Discover
- 4.4.2 Phase 2: Define
- 4.4.3 Phase 3: Develop
- 4.4.4 Phase 4: Deliver
- 4.4.5 Key Principles
- 4.4.6 Conclusion
- 4.5 Usability Engineering for Medical Devices According to the IEC 62366-1 Standard
- 4.6 Commonalities among Methods
- 4.6.1 Analysis of Customer Needs
- 4.6.2 Iterative Optimization of the Solution
- 4.6.3 Learning from Direct User/Customer Feedback
- 4.6.4 Speed as an Objective
- 4.6.5 Success through Collaboration
- 4.6.6 Visualization as a Means of Choice
- 5 Data-Driven UX Design
- 5.1 The Goal of the Data-Driven UX Design Process
- 5.2 The Data-Driven UX Design Process
- 5.2.1 How to Get the Most Value from the Process
- 5.2.2 Brief Overview of the Data-Driven UX Design Process
- 5.2.3 Context of Use Analysis, Including Risk Assessment and Documentation
- 5.2.4 Deriving and Documenting Usage Requirements
- 5.2.5 Developing Design Solutions Based on Risk and Usage
- 5.2.6 Evaluation of Design Solutions Prioritized by Risk and Frequency of Use
- 5.3 The Flexibility and Risk Matrix: How Much Data Do You Really Need?
- 5.3.1 The Flexibility of Your Solution
- 5.3.2 The Risk of Your Solution
- 5.3.3 Working with the Flexibility and Risk Matrix
- 5.4 Objective versus Subjective Data
- 5.5 Quantitative versus Qualitative Data
- 5.6 Critically Evaluating Data
- 5.6.1 Where Does the Data Come From?
- 5.6.2 Objective Data or Interpretation
- 5.6.3 Is the Frame of Reference Correct?
- 5.6.4 Have You Had Value Judgments or Statements Explained?
- 5.6.5 Is the Data Complete and Meaningful?
- 5.7 Quick Help for Categorization
- 5.7.1 Do You Need Data during Development?
- 5.7.2 How Much Data Do You Need?
- 5.7.3 What Type of Data Do You Need?
- 5.7.4 Conclusion
- 6 A Helpful Mindset for Usability and UX Design
- 6.1 Assumptions versus Knowledge
- 6.1.1 Clearly Revealing One’s Own Assumptions
- 6.1.2 Distinguishing Assumptions from Knowledge
- 6.1.3 Why Do I Need Data for This?
- 6.1.4 Examples of Mostly-False-and-Seldom-True Assumptions
- 6.2 Users Don’t Know What They Want!
- 6.2.1 Task and Goal Expertise versus Design Expertise
- 6.2.2 Bringing Together the Expertise
- 6.2.3 Creating Outstanding Solutions with Users
- 6.3 Key Skills for User Researchers: Observe, Ask Questions, and Listen
- 6.3.1 Observing
- 6.3.2 Asking Questions
- 6.3.3 Listening
- 6.3.4 Your Mindset as a User Researcher
- 6.4 Design as a Learnable Process
- 6.4.1 The Role of Creativity
- 6.4.2 The Role of Talent, Practice, Experience, and Knowledge
- 6.4.3 What Do I Need to Learn to Become a Usability and UX Designer?
- 6.5 Testing and Corporate Culture
- 7 Foundations
- 7.1 Psychological Foundations: Don’t Worry, It’s about People
- 7.2 Perception: The Human Sensory System
- 7.2.1 The Eye
- 7.2.2 The Ear
- 7.2.3 The Skin
- 7.2.4 The Tongue
- 7.2.5 The Nose
- 7.2.6 Conclusion
- 7.3 Human Information Processing
- 7.3.1 Basics of the Model
- 7.3.2 Stimulus
- 7.3.3 Discover
- 7.3.4 Recognize
- 7.3.5 Decide
- 7.3.6 Act
- 7.3.7 Reaction
- 7.3.8 Memory
- 7.3.9 Conclusion
- 7.4 Design Basics
- 7.4.1 Impact of Design
- 7.4.2 Basic Elements of Visual Design
- 7.4.3 Gestalt Principles
- 7.4.4 Interaction Principles
- 8 Data-Driven UX Design in Detail: Preparation
- 8.1 Planning the Data-Driven UX Design Process
- 8.1.1 Who Should Participate in the Stakeholder Workshop?
- 8.1.2 The Agenda of the Stakeholder Workshop
- 8.2 Integrating Data-Driven UX Design into Agile Development Projects
- 8.3 Plan for the Appropriate Amount of Effort
- 9 Data-Driven UX Design in Detail: Context of Use Analysis
- 9.1 What Questions Should the Context of Use Analysis Answer?
- 9.2 What Is the Context of Use Anyway?
- 9.2.1 The Users
- 9.2.2 The Patients (Medical Devices)
- 9.2.3 The Task
- 9.2.4 The Goals
- 9.2.5 The Resources
- 9.2.6 The Environment
- 9.2.7 Risk, Frequency, and Conclusion
- 9.3 Methods of Context of Use Analysis
- 9.3.1 Secondary Research/Desk Research
- 9.3.2 Field Observation
- 9.3.3 Interview/Jobs-to-Be-Done
- 9.3.4 Group Discussions/Focus Groups
- 9.3.5 Quantitative Survey/Questionnaires
- 9.3.6 Contextual Inquiry
- 9.3.7 Analysis of Quantitative Usage Data
- 9.3.8 Web Tracking/Click Analysis
- 9.3.9 Ticket and Feedback Analysis
- 9.4 Analytical Methods of the Context of Use Analysis
- 9.4.1 Task Analysis
- 9.4.2 User or Customer Journey Mapping/Touchpoint Analysis
- 9.4.3 Personas and Empathy Maps
- 9.5 Practical Examples for Context Analysis
- 9.5.1 Context Analysis at moveHUB
- 9.5.2 Context Analysis at BusinessBooster
- 9.5.3 Context Analysis at Healthyfy
- 10 Data-Driven UX Design in Detail: Specifying Usage Requirements
- 10.1 Consider Your Personas or Empathy Maps
- 10.2 Use Cases and User Stories: How Not to Do It and How to Do It Anyway
- 10.2.1 Use Cases
- 10.2.2 User Stories
- 10.3 From User Stories to Requirements
- 10.3.1 Fixed Requirements
- 10.3.2 Range Requirements
- 10.3.3 Requirement versus Wish
- 10.3.4 Documenting and Formulating Requirements
- 10.3.5 Where Do the Values in the Requirements Come From?
- 10.4 Formulating Requirements for moveHUB
- 10.5 Formulating Requirements for BusinessBooster
- 10.6 Formulating Requirements for Healthyfy
- 11 Data-Driven UX Design in Detail: Developing Design Solutions
- 11.1 Reminder: What Is the Goal of Design, and How Do We Go About It?
- 11.2 Design Research
- 11.3 From Coarse to Fine
- 11.4 Developing Basic Solution Options
- 11.4.1 How to Turn a 2 into a 3
- 11.4.2 How to Deal with Too Many 3-Point Ideas
- 11.4.3 Conclusion
- 11.5 Working with Prototypes
- 11.5.1 Horizontal and Vertical Prototypes
- 11.5.2 High- and Low-Fidelity Prototypes
- 11.5.3 Which Prototype Should Be Used and When?
- 11.6 Wireframes
- 11.6.1 Buttons
- 11.6.2 Dropdowns
- 11.6.3 Radio Buttons
- 11.6.4 Input Fields or Text Fields
- 11.6.5 Combo Boxes
- 11.6.6 Checkboxes
- 11.6.7 Accordions
- 11.6.8 Toggle Buttons
- 11.6.9 Sliders
- 11.6.10 Calendars
- 11.6.11 Time Pickers
- 11.6.12 Color Selection
- 11.6.13 Information Buttons, Info Buttons, and Tool Tips
- 11.6.14 Popups
- 11.6.15 Menu Bars
- 11.6.16 Carousels
- 11.6.17 Webpage Sliders
- 11.6.18 Labels and Text Blocks
- 11.6.19 Images, Icons, and Placeholders
- 11.6.20 Special Case: Warnings
- 11.6.21 Conclusion
- 11.7 User Interface Quality Check: The Design Grid
- 11.8 Screen Flows
- 11.9 Click Dummies
- 11.9.1 Tools for Creating Click Dummies
- 11.9.2 Making the Design Testable
- 11.10 Desktop, Mobile, or Smartwatch First?
- 11.11 Responsive Design
- 11.12 Visual Design
- 11.12.1 Visual Design Research
- 11.12.2 The Association Space
- 11.12.3 Proto-Mood Boards
- 11.12.4 Closing Gaps in the Proto-Mood Board
- 11.12.5 From Proto-Mood Boards to Mood Boards
- 11.12.6 The Visual Design Concept
- 11.12.7 Creating Visual Prototypes (Click Dummies)
- 11.12.8 The Style Guide
- 11.13 Excursion: Low-Code and No-Code
- 11.14 Example: Possible Design Steps for moveHUB
- 11.15 Example: Possible Design Steps for BusinessBooster
- 11.16 Example: Possible Design Steps for Healthyfy
- 12 Data-Driven UX Design in Detail: Evaluating Design Solutions
- 12.1 Formative versus Summative Testing
- 12.2 Identifying Knowledge Gaps
- 12.3 User Evaluation versus Expert Evaluation
- 12.4 Remote versus On-Site
- 12.4.1 Dependence on Technical Infrastructure
- 12.4.2 Loss of Important Information
- 12.4.3 Less Control over Confidentiality
- 12.4.4 Non-Digital Products Cannot Be Tested without Bias
- 12.4.5 Conclusion
- 12.5 Designing Test Cases
- 12.5.1 Preconditions
- 12.5.2 Instructions for the User
- 12.5.3 Correct Execution of the Task
- 12.5.4 Postcondition after Correct Execution
- 12.5.5 Determine the Number of Test Cases
- 12.6 The Methods Presented
- 12.7 The Usability and UX Test
- 12.7.1 How Does It Work?
- 12.7.2 When Is It Used?
- 12.7.3 What Do You Need?
- 12.7.4 What Are the Advantages?
- 12.7.5 What Are the Disadvantages?
- 12.7.6 What Are the Alternatives?
- 12.8 Usability and UX Sprint
- 12.8.1 How Does It Work?
- 12.8.2 When Is It Used?
- 12.8.3 What Do You Need?
- 12.8.4 What Are the Advantages?
- 12.8.5 What Are the Disadvantages?
- 12.8.6 What Are the Alternatives?
- 12.9 Rapid User Tests
- 12.9.1 How Does It Work?
- 12.9.2 When Is It Used?
- 12.9.3 What Do You Need?
- 12.9.4 What Are the Advantages?
- 12.9.5 What Are the Disadvantages?
- 12.9.6 What Are the Alternatives?
- 12.10 A/B Testing
- 12.10.1 How Does It Work?
- 12.10.2 When Is It Used?
- 12.10.3 What Do You Need?
- 12.10.4 What Are the Advantages?
- 12.10.5 What Are the Disadvantages?
- 12.10.6 What Are the Alternatives?
- 12.11 UX Benchmarking
- 12.11.1 How Does It Work?
- 12.11.2 When Is It Used?
- 12.11.3 What Do You Need?
- 12.11.4 What Are the Advantages?
- 12.11.5 What Are the Disadvantages?
- 12.11.6 What Are the Alternatives?
- 12.12 5-Second Test
- 12.12.1 How Does It Work?
- 12.12.2 When Is It Used?
- 12.12.3 What Do You Need?
- 12.12.4 What Are the Advantages?
- 12.12.5 What Are the Disadvantages?
- 12.12.6 What Are the Alternatives?
- 12.13 Standardized Questionnaires
- 12.13.1 How Does It Work?
- 12.13.2 When Is It Used?
- 12.13.3 What Do You Need?
- 12.13.4 What Are the Advantages?
- 12.13.5 What Are the Disadvantages?
- 12.13.6 What Are the Alternatives?
- 12.14 Analysis of Quantitative Usage Data
- 12.14.1 How Does It Work?
- 12.14.2 When Is It Used?
- 12.14.3 What Do You Need?
- 12.14.4 What Are the Advantages?
- 12.14.5 What Are the Disadvantages?
- 12.14.6 What Are the Alternatives?
- 12.15 Web Tracking/Click Analysis
- 12.16 Diary Study
- 12.16.1 How Does It Work?
- 12.16.2 When Is It Used?
- 12.16.3 What Do You Need?
- 12.16.4 What Are the Advantages?
- 12.16.5 What Are the Disadvantages?
- 12.16.6 What Are the Alternatives?
- 12.17 Card Sorting
- 12.17.1 How Does It Work?
- 12.17.2 When Is It Used?
- 12.17.3 What Do You Need?
- 12.17.4 What Are the Advantages?
- 12.17.5 What Are the Disadvantages?
- 12.17.6 What Are the Alternatives?
- 12.18 Expert Review
- 12.18.1 How Does It Work?
- 12.18.2 When Is It Used?
- 12.18.3 What Do You Need?
- 12.18.4 What Are the Advantages?
- 12.18.5 What Are the Disadvantages?
- 12.18.6 What Are the Alternatives?
- 12.19 Association Space Test
- 12.19.1 How Does It Work?
- 12.19.2 When Is It Used?
- 12.19.3 What Do You Need?
- 12.19.4 What Are the Advantages?
- 12.19.5 What Are the Disadvantages?
- 12.19.6 What Are the Alternatives?
- 12.20 Eye Tracking
- 12.20.1 How Does It Work?
- 12.20.2 When Is It Used?
- 12.20.3 What Do You Need?
- 12.20.4 What Are the Advantages?
- 12.20.5 What Are the Disadvantages?
- 12.20.6 What Are the Alternatives?
- 12.21 Physiological Measurement Methods
- 12.21.1 How Does It Work?
- 12.21.2 When Is It Used?
- 12.21.3 What Do You Need?
- 12.21.4 What Are the Advantages?
- 12.21.5 What Are the Disadvantages?
- 12.21.6 What Are the Alternatives?
- 12.22 Analyzing Errors Using Root Cause Analysis
- 12.23 Learning from the Data and Making Informed Decisions
- 12.23.1 Implementing Feedback
- 12.23.2 Documenting Decisions
- 12.24 Evaluations in Medical Device Development
- 12.25 Example: Evaluation Methods for moveHUB
- 12.26 Example: Evaluation Methods for BusinessBooster
- 12.27 Example: Evaluation Methods for Healthyfy
- 13 Design, Get Data, Repeat: When Is It Enough?
- 13.1 Determining the Transition Based on Quality
- 13.2 Determining the Transition Based on Time
- 13.3 Should You Readjust? The Flexibility and Risk Matrix as an Aid
- 13.4 Choosing the Right Approach
- 13.5 What’s Next for moveHUB
- 13.6 What’s Next for BusinessBooster
- 13.7 What’s Next for Healthyfy
- 14 Decision Matrix for Method Selection
- 15 Wrap-Up and Conclusion
- 15.1 It’s All about the Users
- 15.2 Usability and UX Design Is Interdisciplinary
- 15.3 UX Is Not Designed, It Is Experienced
- 15.4 The Path to an Outstanding Product Is Iterative
- 15.5 Once You Start with Usability and UX Design, You Never Stop
- 15.6 Design Based on Data
- 15.7 Closing Words and Call for Participation
- Appendices
- A Glossary
- B Bibliography
- C The Authors
- Index
