Design
Pantallas
Para qué

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

Audiencia

Diseño e ingeniería.

Lista de Resultados

Laboratorios -> Paso 3: Explorar Resultados

Propósito: Mostrar todos los resultados de exámenes filtrables por fecha, estado y categoría
JTBD: “Quiero encontrar un resultado específico sin buscar demasiado”
Ruta: /paciente/laboratorio/resultados
Módulo: PAM-4

Features

# Feature Descripción Prioridad
1 Lista de biomarcadores Cards con nombre, valor, estado (óptimo/revisar/fuera) P0
2 Filtro por fecha Selector de rango: última medición, últimos 6 meses, todo P0
3 Filtro por estado Óptimo, Revisar, Fuera de rango P1
4 Filtro por categoría Metabólico, Lipidos, Hepatico, Renal, Hormonal, etc. P1
5 Botón comparar Seleccionar 2 fechas para comparación lado a lado P1
6 Búsqueda rápida Input para buscar biomarcador por nombre P2

States

Cargando

  • Visual: Skeleton shimmer en lista de 6 cards
  • Copy: “Cargando tus exámenes…”

Normal (Lista Cargada)

  • Visual: Cards agrupadas por categoría, cada una con semaforo de estado
  • Ejemplo: Glucosa 98 mg/dL (óptimo), Colesterol 245 mg/dL (revisar)

Sin Resultados

  • Trigger: No hay resultados para los filtros aplicados
  • Copy: “No encontramos resultados con estos filtros”
  • CTA: [Limpiar filtros]

Lista Parcial

  • Trigger: Algunos biomarcadores aun en procesamiento
  • Visual: Cards procesadas + cards grises con “En análisis…”
  • Copy parcial: “3 de 8 biomarcadores listos. Los demas están en análisis.”

Datos Mostrados

Dato Objeto Propiedad Ejemplo
Nombre biomarcador Biomarcador nombre Glucosa
Valor Biomarcador valor_actual 98 mg/dL
Estado Biomarcador estado Óptimo
Fecha medición Medición fecha 15 Mar, 2026
Categoría Biomarcador categoría Metabólico

Acciones

Acción Tipo Resultado
Tap biomarcador Navegación Abre detalle del resultado
Filtrar por fecha Filtro Actualiza lista
Filtrar por estado Filtro Actualiza lista
Tap “Comparar” Navegación Abre selector de fechas para comparación
Cargar nuevos exámenes Primaria Navega a upload
  • Origen: Tab Progreso > Tus Exámenes / Notificación “Resultados listos”
  • Destino tap biomarcador: Detalle Resultado (/paciente/laboratorio/resultado/:id)
  • Destino comparar: Comparación (/paciente/laboratorio/comparación)
  • Back: Progreso overview