Diseño de Interfaces · Unidad I · Tema 2
El Factor
Humano
Diseño centrado en las personas
Cognición
Percepción
Memoria
UX/UI
HCI
Continuación

¿Por qué algunas interfaces
son fáciles y otras frustrantes?

🧠
El cerebro manda
Las interfaces no interactúan con computadoras… interactúan con cerebros humanos. La experiencia depende de cómo pensamos y sentimos.
📱
Apps que "se sienten bien"
Spotify, Duolingo, Notion — están diseñadas para aprovechar cómo percibimos, recordamos y decidimos.
😤
Apps frustrantes
Formularios complejos, botones confusos, menús interminables. Ignoraron al factor humano.
💡 Las interfaces se diseñan para personas, no para computadoras.
Definición

¿Qué es el Factor Humano?

El Factor Humano estudia el conjunto de capacidades, limitaciones y comportamientos de las personas que influyen en cómo interactuamos con sistemas, productos y tecnologías digitales.

— Disciplina aplicada en ergonomía, psicología cognitiva y UX

Conducta
Emociones
Percepción
Atención
Memoria
Cognición
Sensación
Conducta

¿Cómo reaccionan
las personas ante interfaces?

♾️
Scroll infinito
TikTok e Instagram usaron la conducta impulsiva para que sigas haciendo scroll sin darte cuenta.
🔔
Notificaciones
Generan urgencia y activan el comportamiento de revisar el teléfono automáticamente.
❤️
Likes y recompensas
El "me gusta" activa dopamina. La interfaz usa la conducta emocional para generar retención.
🎯
Botones llamativos
El color, tamaño y posición de un botón modifica la conducta del usuario hacia la acción deseada.
Sensación

Los sentidos, primer
contacto con la interfaz

La sensación es el proceso mediante el cual nuestros órganos sensoriales captan estímulos del entorno digital.

👁️
Visual
Colores, formas, tipografía, animaciones en pantalla
🔊
Auditivo
Notificaciones, efectos de sonido, música en apps
✋
Táctil
Teclado, pantalla táctil, botones físicos de dispositivo
🌀
Movimiento
Gestos, swipe, pinch-to-zoom, rotación de pantalla
📳
Háptico
Vibración de confirmación, feedback físico al tocar
📱 Ejemplo: Cuando tu teléfono vibra al recibir un mensaje, estás experimentando sensación háptica.
Percepción

Percibir ≠ Sentir

Sensación (recibir)
  • El ojo detecta un color rojo en pantalla
  • El oído escucha un sonido de alerta
  • El dedo siente una vibración
  • Es automático e inmediato
Percepción (interpretar)
  • El cerebro interpreta el rojo como "peligro"
  • El sonido significa "hay un error"
  • La vibración indica "confirmación exitosa"
  • Depende del contexto y experiencia previa
🔴 Rojo = Peligro / Error
🟢 Verde = Éxito / OK
🟡 Amarillo = Advertencia
🔵 Azul = Enlace / Acción
Memoria

Tipos de memoria y su
impacto en el diseño

Memoria sensorial
~0.5 seg
Retiene estímulos visuales o auditivos por un instante. Determina qué captura la atención.
Memoria a corto plazo
7 ± 2 ítems
Capacidad limitada. Por eso los menús deben tener pocas opciones y los formularios, pasos cortos.
Memoria a largo plazo
Ilimitada
Patrones repetitivos, íconos reconocibles y layouts consistentes facilitan el aprendizaje.
🧠 Regla de diseño: "Una buena interfaz reduce la carga de memoria." El usuario no debería tener que recordar cómo usarla.
Cognición

Cómo piensa el usuario
cuando usa tu app

💭
Pensar
El usuario analiza opciones. Demasiadas opciones = parálisis por análisis.
🔍
Razonar
¿Tiene lógica este flujo? Un checkout confuso hace que el usuario abandone el carrito.
📚
Aprender
Los usuarios aprenden patrones. Cambiar de lugar el botón de guardar genera frustración.
⚡
Decidir
El diseño debe guiar decisiones. CTAs claros, jerarquía visual y feedback inmediato ayudan.
🔥 Carga cognitiva: El esfuerzo mental que requiere usar una interfaz. Buena UX = mínima carga cognitiva.
Memorización

¿Por qué todas las apps
se parecen un poco?

Patrones UI reconocibles
  • Barra de navegación abajo en móvil
  • Hamburguesa (☰) para el menú lateral
  • Corazón o estrella para favoritos
  • Lupa para buscar, campana para notificaciones
  • Foto de perfil arriba a la derecha
¿Por qué se repiten?
  • El usuario ya los memorizó de otras apps
  • Reducen el tiempo de aprendizaje
  • Generan familiaridad y confianza
  • Instagram, Facebook y TikTok comparten patrones base
  • Romper el patrón sin razón = frustración
🎯 Principio de UX: "No me hagas pensar" — Steve Krug. El usuario espera lo que ya conoce.
Modelo cognitivo

El flujo de interacción
en el cerebro del usuario

👁️
Percibe
Ve el botón, color y texto en pantalla
🧠
Interpreta
¿Qué hace este botón? ¿Es seguro?
⚖️
Decide
Evalúa opciones y elige la acción
👆
Actúa
Hace clic, toca o escribe en la interfaz
✅
Feedback
Recibe respuesta: animación, mensaje, cambio
💡 El diseño UX debe facilitar cada paso de este flujo. Si uno falla, la experiencia se rompe.
Aplicación práctica

El Factor Humano aplicado
al diseño UI/UX

🎨
Colores y percepción
Usa el significado cultural de los colores para guiar la atención y comunicar estados.
🔤
Tipografía y lectura
El tamaño, contraste y espaciado afectan directamente la carga cognitiva al leer.
🗂️
Menús simples
Máximo 5–7 opciones en un menú. Más opciones saturan la memoria de trabajo.
♿
Accesibilidad
Diseñar para distintas capacidades sensoriales y cognitivas amplía el alcance del producto.
🔁
Consistencia
Mismos patrones en toda la app reduce el tiempo de aprendizaje y la carga de memoria.
Errores comunes

Cuando el diseño
ignora al humano

Mal diseño
  • ❌ Interfaces saturadas con demasiada información
  • ❌ 15+ opciones en un menú principal
  • ❌ Colores sin contraste (texto gris sobre fondo gris)
  • ❌ Botones pequeños en zona no táctil
  • ❌ Navegación inconsistente entre secciones
  • ❌ Formularios de 30 pasos sin indicador de progreso
Buen diseño
  • ✅ Jerarquía visual clara, espacio en blanco generoso
  • ✅ Máximo 5–7 opciones de menú con íconos
  • ✅ Alto contraste, tipografía legible (WCAG AA)
  • ✅ Botones grandes con área de toque mínima 44px
  • ✅ Patrones consistentes y predecibles
  • ✅ Formularios paso a paso con barra de progreso
Actividad en clase

🧠 Analizando el cerebro
del usuario

  1. 1
    Elige una app que uses todos los días (WhatsApp, TikTok, YouTube, Spotify, Instagram…).
  2. 2
    Abre la app e identifica: ¿qué elemento llama tu atención primero? ¿Por qué crees que lo diseñaron así?
  3. 3
    Detecta colores, íconos y patrones repetitivos. ¿Cuáles ya memorizaste sin darte cuenta?
  4. 4
    Analiza: ¿cómo guía la app tu conducta? ¿Te da ganas de quedarte más tiempo?
  5. 5
    Escribe 1 elemento que usa el factor humano de forma positiva y 1 mejora de UX que propondrías.
  6. 6
    Comparte tu análisis con el grupo en 2 minutos. 🎤
Conclusiones

Lo que aprendimos hoy

👤
El usuario primero
Toda decisión de diseño debe estar basada en cómo piensan y sienten las personas.
👁️
Percepción es diseño
Colores, formas y movimiento no son decoración: comunican significado y guían conducta.
🧠
La memoria importa
Los patrones repetitivos y la consistencia reducen la carga mental del usuario.
⚡
Menos esfuerzo mental
Una buena interfaz se usa sin pensar. El diseño hace el trabajo por el usuario.
🎯
UX depende del humano
Sin entender conducta, sensación, percepción y memoria, no hay buena experiencia de usuario.
🧠

"No diseñes interfaces para pantallas.
Diseña experiencias para personas."

— Principio fundamental del Factor Humano en UX

Diseño de Interfaces
Tema 2 · El Factor Humano
¡Hasta la próxima clase!