Design
Pantallas
Para qué

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

Audiencia

Diseño e ingeniería.

Detalle Suplemento

Planes → Ficha del Suplemento

Propósito: Mostrar nombre, dosis, horario, razón, evidencia y efectos esperados de un suplemento.
JTBD: Saber qué hacer hoy en <30 segundos
Ruta: /paciente/plan/suplemento/:id
Módulo: PAM-4


Features

# Feature Descripción Prioridad
1 Info principal Nombre, dosis, horario, instrucciones de toma P0
2 Por qué lo tomas Explicación personalizada basada en biomarcadores de María P0
3 Evidencia Nivel de evidencia (alta/media), resumen de estudios clave P2
4 Efectos esperados Timeline: que esperar a 30d, 60d, 90d P1
5 Interacciones Notas sobre interacciones con otros suplementos o medicamentos P1

States

Loading

  • Visual: Skeleton: título + 4 secciones con 2 líneas cada una shimmer
  • Copy: “Cargando información…”

Loaded (Normal)

  • Datos: Nombre, dosis, horario, razón, evidencia, timeline efectos

Error

  • Copy: “No pudimos cargar la información de este suplemento”
  • CTA: Reintentar

Datos Mostrados

Dato Objeto OOUX Propiedad Ejemplo
Nombre Suplemento nombre Vitamina D3
Dosis Suplemento dosis 2000 UI
Horario Suplemento horario Mañana, con desayuno
Instrucción Suplemento instrucción “Tomar con grasas para mejor absorción”
Razón Suplemento razon_personalizada “Tu Vitamina D estaba en 22 ng/mL, necesitas subir a 40+”
Evidencia Suplemento nivel_evidencia, resumen Alta, “Meta-análisis 2024, n=12,000”
Efecto 30d Suplemento efecto_30d “Mejora energía y estado de animo”
Efecto 90d Suplemento efecto_90d “Niveles óptimos de Vitamina D (40-60 ng/mL)”

Acciones

Acción Tipo Resultado
Tap “Ver biomarcador” Navegación → Detalle Biomarcador relacionado
Tap evidencia Expandir Muestra resumen de estudios
Tap “Preguntar al Health Coach” Navegación → Health Coach Chat

  • Viene de: Plan del Dia (tap suplemento), Plan Completo (tab suplementos)
  • Va a: Detalle Biomarcador, Health Coach Chat
  • Back: Pantalla anterior