Design
Pantallas
Para qué

Especificación detallada de cada pantalla: datos mostrados, estados, acciones disponibles y navegación.

Audiencia

Diseño e ingeniería.

Historial Médico

Onboarding --> Step 2 (Pantalla 3 de 8)

Propósito: Capturar condiciones previas, medicamentos, alergias y antecedentes familiares.
JTBD: “Quiero saber si estoy enfermandome antes de síntomas”
Ruta: /onboarding/historial-médico
Módulo: PAM-4


Features

# Feature Descripción Prioridad
1 Condiciones previas Checkboxes: diabetes, hipertension, tiroides, etc. P0
2 Medicamentos actuales Input con autocomplete + “Ninguno” P0
3 Alergias Tags input con sugerencias comunes P0
4 Antecedentes familiares Checkboxes por condición + parentesco P1
5 Opción “No tengo” Toggle rápido para saltar secciones vacias P0
6 Progress bar Step 2 de 6 P0

States

Loading

  • Visual: Skeleton shimmer en secciones de checkboxes (300ms)
  • Duración: <500ms
  • Copy: “Cargando…”

Loaded (Normal)

  • Visual: 4 secciones colapsables, cada una con checkboxes/tags, progress bar 2/6
  • Datos: Lista predefinida de condiciones y medicamentos

Empty

  • Trigger: Sin selecciones
  • Visual: Todas las secciones colapsadas, toggle “No tengo” visible
  • Copy: “Cuentanos tu historial de salud”
  • CTA: [Siguiente] (habilitado: se puede continuar sin datos)

Error

  • Trigger: Error de conexión al guardar
  • Copy: “No pudimos guardar tus datos. Intenta de nuevo.”
  • CTA: [Reintentar]

Datos Mostrados

Dato Objeto OOUX Propiedad Ejemplo
Condiciones Paciente condiciones Hipotiroidismo
Medicamentos Paciente medicamentos Levotiroxina 50mcg
Alergias Paciente alergias Penicilina
Familia: padre Paciente antecedentes_familiares Diabetes tipo 2

Acciones

Acción Tipo Resultado
Seleccionar condición Tap checkbox Agrega a la lista
Agregar medicamento Input + autocomplete Agrega tag
Marcar “No tengo” Toggle Salta sección, marca vacio
Siguiente Tap botón Guarda datos, navega a Step 3

  • Viene de: Datos Personales (Step 1)
  • Va a: Estilo de Vida (Step 3)
  • Back: /onboarding/datos-personales