Design
Pantallas
Para qué

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

Audiencia

Diseño e ingeniería.

Tus Exámenes

Progreso → Lista Biomarcadores (L2)

Propósito: Listar todos los biomarcadores con filtros, barras de zona y sparklines.
JTBD: Explorar mi salud sin sentirme abrumado
Ruta: /paciente/progreso/exámenes
Módulo: PAM-3


Features

# Feature Descripción Prioridad
1 Lista filtrable Filtros: Todos, Óptimo, Revisar, Atención, Por dominio P0
2 Barra 3 zonas Rojo (atención) / Azul (revisar) / Verde (óptimo) con marcador P0
3 Sparkline 90d Mini gráfico de tendencia por biomarcador, 7 puntos P1
4 Delta badge Cambio vs último ciclo: “+17”, “-25” con flecha P0
5 Búsqueda Input de búsqueda por nombre de biomarcador P2

States

Loading

  • Visual: Skeleton: filtros pill + 6 filas con barra y sparkline shimmer
  • Copy: “Cargando tus exámenes…”

Loaded (Normal)

  • Datos: 15-25 biomarcadores, cada uno con valor, rango, tendencia, estado

Empty

  • Trigger: Sin resultados de laboratorio
  • Copy: “Aun no tenemos resultados de tus exámenes”
  • CTA: Agendar toma de muestra → /paciente/laboratorio

Filtered Empty

  • Trigger: Filtro activo sin resultados (ej: “Atención” y todos están óptimos)
  • Copy: “No tienes exámenes en este estado. Excelente!”

Error

  • Copy: “No pudimos cargar tus exámenes”
  • CTA: Reintentar

Datos Mostrados

Dato Objeto OOUX Propiedad Ejemplo
Nombre Biomarcador nombre Glucosa
Valor actual Biomarcador valor, unidad 98 mg/dL
Estado Biomarcador estado óptimo
Rango Biomarcador rango_min, rango_max 70-100 mg/dL
Delta Biomarcador delta_ciclo -17
Tendencia Biomarcador histórico[] [115, 110, 105, 102, 100, 99, 98]

Acciones

Acción Tipo Resultado
Tap biomarcador Navegación → Detalle Biomarcador (bottom sheet)
Tap filtro Filtro Lista se filtra por estado o dominio
Buscar Filtro Filtrado por texto en nombre

  • Viene de: Progreso Overview (strip exámenes, “Ver todos”), Nivel de Salud (tap dominio)
  • Va a: Detalle Biomarcador
  • Back: Progreso Overview