Design
Pantallas
Para qué

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

Audiencia

Diseño e ingeniería.

Panel de Análisis

Onboarding --> Step 4 (Pantalla 5 de 8)

Propósito: El usuario selecciona que exámenes de laboratorio se va a realizar. Pico de complejidad del onboarding (80% de completitud).
JTBD: “Quiero saber si estoy enfermandome antes de síntomas”
Ruta: /onboarding/panel-análisis
Módulo: PAM-4


Features

# Feature Descripción Prioridad
1 Panel recomendado Selección por defecto basada en perfil del usuario P0
2 Categorías por tab Sangre, hormonal, genómica, etc. P0
3 Búsqueda por síntoma “Me siento cansado” sugiere panel tiroideo P1
4 Contador de análisis “72+ análisis seleccionados” con precio P0
5 Tooltip por análisis Tap en cada uno muestra explicación simple P1
6 Chatbot de ayuda “Te ayudo a elegir?” para reducir abandono P2
7 Progress bar Step 4 de 6 P0

States

Loading

  • Visual: Skeleton shimmer en tabs y lista de análisis (500ms)
  • Duración: <800ms
  • Copy: “Cargando tus análisis recomendados…”

Loaded (Normal)

  • Visual: Tabs por categoría, lista de análisis con checkboxes, panel “Recomendado” preseleccionado, progress bar 4/6
  • Datos: Panel recomendado según edad, sexo, historial médico

Empty

  • Trigger: Ningun análisis seleccionado
  • Visual: Lista sin checkboxes marcados
  • Copy: “Selecciona al menos un panel de análisis”
  • CTA: [Usar recomendado] --> preselecciona automáticamente

Error

  • Trigger: Error cargando catalogo de análisis
  • Copy: “No pudimos cargar los análisis disponibles.”
  • CTA: [Reintentar]

Abandono potencial

  • Trigger: Usuario pasa >90s sin interactuar o intenta volver atrás
  • Visual: Modal con chatbot
  • Copy: “Esto puede parecer mucho. Quieres que te recomiende algo basado en lo que nos contaste?”
  • CTA: [Si, recomiendame] / [Ya escogi]

Datos Mostrados

Dato Objeto OOUX Propiedad Ejemplo
Panel recomendado Sistema panel_default Panel Integral (72 análisis)
Categoría Resultado categorías Sangre, Hormonal, Genómica
Análisis individual Biomarcador nombre Glucosa en ayunas
Precio total Sistema precio_panel $890.000 COP
Total seleccionados Sistema count 72 análisis

Acciones

Acción Tipo Resultado
Cambiar tab Tap Filtra análisis por categoría
Seleccionar análisis Tap checkbox Agrega/quita del panel, actualiza precio
Usar recomendado Tap botón Preselecciona panel por defecto
Buscar por síntoma Input texto Sugiere análisis relevantes
Ver detalle Tap en tooltip Muestra explicación del análisis
Siguiente Tap botón Confirma selección, navega a Step 5

  • Viene de: Estilo de Vida (Step 3)
  • Va a: Agendar (Step 5)
  • Back: /onboarding/estilo-vida