Design
Pantallas
Para qué

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

Audiencia

Diseño e ingeniería.

Perfil Pendiente

Onboarding --> Post-Onboarding (Pantalla 8 de 8)

Propósito: Mantener al usuario informado mientras espera sus resultados de laboratorio.
JTBD: “Quiero saber si estoy enfermandome antes de síntomas”
Ruta: /perfil-pendiente
Módulo: PAM-5


Features

# Feature Descripción Prioridad
1 Timeline de estado 3 pasos: cita, muestras, resultados (con estados) P0
2 Próxima cita Card con fecha, hora, clínica, preparación P0
3 Recordatorio ayuno Alerta visible antes de la cita P0
4 Subir labs existentes CTA para cargar resultados previos (PDF/foto) P1
5 Explorar la app Links para conocer funcionalidades mientras espera P2
6 Contactar soporte Si algo sale mal o hay dudas P1

States

Loading

  • Visual: Skeleton shimmer en timeline y card de cita (500ms)
  • Duración: <800ms
  • Copy: “Cargando tu estado…”

Loaded (Normal)

  • Visual: Timeline con paso activo resaltado + card de cita + CTA secundarios
  • Datos: Estado del proceso, fecha de cita, tiempo restante

Esperando Cita

  • Trigger: Cita agendada pero aun no llega la fecha
  • Visual: Timeline en paso 1, countdown a la cita
  • Copy: “Tu cita es en 3 días. Recuerda el ayuno de 12 horas.”
  • CTA: [Agregar a calendario] / [Ver preparación]

Muestras Tomadas

  • Trigger: Post-cita, labs en procesamiento
  • Visual: Timeline en paso 2, indicador de procesamiento
  • Copy: “Tus muestras están siendo analizadas. Te avisaremos cuando estén listas.”

Resultados Listos

  • Trigger: Engine completo el Health Score
  • Visual: Timeline completa, animación de celebración
  • Copy: “Tus resultados están listos.”
  • CTA: [Ver mi salud] --> /inicio

Error

  • Trigger: Labs no procesados después de 5 días
  • Copy: “Tus resultados están tardando más de lo esperado.”
  • CTA: [Cargar exámenes manualmente] / [Contactar soporte]

Datos Mostrados

Dato Objeto OOUX Propiedad Ejemplo
Estado proceso Sistema estado_onboarding Esperando cita
Fecha cita Cita fecha Martes 15 de abril, 7:00 AM
Clínica Cita sede Clínica ADEN Medellín
Tiempo restante Cita tiempo_relativo En 3 días
Preparación Cita preparación Ayuno de 12 horas

Acciones

Acción Tipo Resultado
Agregar a calendario Tap botón Abre sheet de calendario nativo
Cargar labs Tap botón Navega a flujo de upload (PDF/foto)
Contactar soporte Tap link Abre chat/email de soporte
Ver mi salud Tap botón (cuando disponible) Navega a /inicio (dashboard)

  • Viene de: Confirmación (Step 6)
  • Va a: Dashboard (cuando resultados listos), Upload (si sube labs manuales)
  • Back: No disponible (esta es la pantalla principal del estado de espera)