Propósito: El usuario confirma su correo ingresando el código de 6 dígitos.
JTBD: “Cuando quiero acceder a mi salud, quiero entrar rápido y seguro”
Ruta: /verificar-email
Módulo: PAM-2
| # |
Feature |
Descripción |
Prioridad |
| 1 |
Código 6 dígitos |
6 input boxes individuales, auto-avance |
P0 |
| 2 |
Timer de reenvio |
Countdown 60s antes de permitir reenviar |
P0 |
| 3 |
Reenviar código |
Botón habilitado después del timer |
P0 |
| 4 |
Indicador de email |
Muestra el email al que se envió, parcialmente oculto |
P0 |
| 5 |
Revisar spam |
Sugerencia de revisar carpeta spam |
P1 |
- Visual: Skeleton en área de inputs (300ms)
- Duración: <500ms
- Copy: “Cargando…”
- Visual: Ilustración de correo + 6 input boxes + timer + copy
- Datos: Email destino (parcialmente oculto: m***a@ejemplo.com)
- Trigger: Pantalla recien cargada, esperando input
- Visual: 6 boxes vacias con borde azul, foco en la primera
- Copy: “Revisa tu correo”
- CTA: Reenviar código (deshabilitado, timer 60s)
- Trigger: Código incorrecto, código expirado (15 min)
- Copy: “Código incorrecto. Revisa e intenta de nuevo.” / “Este código ya expiró.”
- CTA: [Reenviar código]
- Trigger: 6 dígitos correctos
- Visual: Animación de check verde, auto-redirect en 1.5s
- Copy: “Correo verificado”
| Dato |
Objeto OOUX |
Propiedad |
Ejemplo |
| Email destino |
Paciente |
email |
m***a@ejemplo.com |
| Timer reenvio |
Sistema |
countdown |
45s restantes |
| Expiración |
Sistema |
ttl |
15 minutos |
| Acción |
Tipo |
Resultado |
| Ingresar dígito |
Input numerico |
Auto-avanza al siguiente box |
| Pegar código |
Paste |
Llena las 6 boxes automáticamente |
| Reenviar código |
Tap botón |
Nuevo código enviado, timer reinicia |
| Revisar email |
Tap link |
Abre app de correo nativa |
- Viene de: Registro (post-crear cuenta), Login (magic link flow)
- Va a: Onboarding Step 1 (nuevo usuario), Dashboard (usuario existente)
- Back: /registro o /login