Pantalla: Configuracion de Notificaciones
Identificador: SCR-ONB-006
Modulo: MTS-ONB-001 - Onboarding
Version: 1.0.0
Fecha: 2025-12-05
Autor: MobileUxUiDrone (Eight of Eight)
Estado: Especificado
| Atributo |
Valor |
| Nombre |
Configuracion de Notificaciones |
| Proposito |
Configurar preferencias de alertas y recordatorios |
| Tipo |
Full Screen (paso 6 de onboarding) |
| Acceso |
Desde SCR-ONB-005 (o SCR-ONB-004 para CS) |
| Prioridad |
Alta |
NOTA: Esta pantalla incluye el request de permisos del sistema para notificaciones.
2. Wireframe ASCII
2.1. Estado: Solicitud de Permiso
+------------------------------------------+
| [<-] Paso 6 de 8 ============---- |
+------------------------------------------+
| |
| [Icono campana grande] |
| |
| Nunca olvides un medicamento |
| |
| MedTime necesita enviarte |
| notificaciones para recordarte |
| tus medicamentos a tiempo. |
| |
| |
| +------------------------------------+ |
| | | |
| | [Bell] Recordatorios | |
| | Te avisamos cuando es hora | |
| | de tomar tu medicamento | |
| | | |
| +------------------------------------+ |
| | | |
| | [Clock] Alertas de reposicion | |
| | Te avisamos cuando tu | |
| | medicamento esta por | |
| | terminarse | |
| | | |
| +------------------------------------+ |
| | | |
| | [Heart] Actualizaciones de salud | |
| | Consejos y recordatorios | |
| | personalizados | |
| | | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | Activar notificaciones | | <- Triggers system permission
| +------------------------------------+ |
| |
| Ahora no |
| |
+------------------------------------------+
2.2. Estado: Configuracion Post-Permiso
+------------------------------------------+
| [<-] Paso 6 de 8 ============---- |
+------------------------------------------+
| |
| [Check verde] Notificaciones activas |
| |
| Personaliza tus alertas |
| |
| |
| Recordatorios de medicamentos |
| +------------------------------------+ |
| | [Bell] Activados [ON] | |
| +------------------------------------+ |
| |
| Tiempo antes del recordatorio |
| +------------------------------------+ |
| | 15 minutos antes [v] | |
| +------------------------------------+ |
| |
| Sonido de notificacion |
| +------------------------------------+ |
| | Tono suave [v] | |
| +------------------------------------+ |
| |
| Vibracion |
| +------------------------------------+ |
| | [Vibrate] Activada [ON] | |
| +------------------------------------+ |
| |
| Modo silencioso nocturno |
| +------------------------------------+ |
| | [Moon] 10:00 PM - 7:00 AM [ON] | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | Continuar | |
| +------------------------------------+ |
| |
+------------------------------------------+
2.3. Estado: Permiso Denegado
+------------------------------------------+
| [<-] Paso 6 de 8 ============---- |
+------------------------------------------+
| |
| [Warning icon amarillo] |
| |
| Notificaciones desactivadas |
| |
| Sin notificaciones, podrias olvidar |
| tomar tus medicamentos. |
| |
| +------------------------------------+ |
| | | |
| | Puedes activarlas mas tarde en | |
| | Configuracion > Notificaciones | |
| | | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | Abrir configuracion del | |
| | dispositivo | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | Continuar sin | |
| | notificaciones | |
| +------------------------------------+ |
| |
+------------------------------------------+
2.4. Estado: CS - Simplificado
+------------------------------------------+
| [<-] Configuracion rapida |
+------------------------------------------+
| |
| Activar recordatorios? |
| |
| Te enviaremos notificaciones cuando |
| sea hora de tomar medicamentos. |
| |
| +------------------------------------+ |
| | Si, activar | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | No, gracias | |
| +------------------------------------+ |
| |
+------------------------------------------+
3. Componentes UI
3.1. Icono Principal
| Propiedad |
Valor |
| Tipo |
Lottie animado |
| Size |
120x120dp |
| Animacion |
Campana con ondas |
| Color |
primary |
3.2. Beneficio Card
| Propiedad |
Valor |
| Componente |
CMP-CRD-010 (Feature Card) |
| Icon size |
32x32dp |
| Title |
md (16sp), medium |
| Description |
sm (14sp), regular, neutral.600 |
| Background |
neutral.50 |
| Border radius |
12dp |
3.3. Toggle Switch
| Propiedad |
Valor |
| Componente |
CMP-INP-009 (Toggle Switch) |
| Size |
52x32dp |
| Color on |
primary |
| Color off |
neutral.300 |
| Thumb |
white |
3.4. Dropdown Tiempo
| Propiedad |
Valor |
| Componente |
CMP-INP-006 (Dropdown Select) |
| Options |
5 min, 10 min, 15 min, 30 min, 1 hora |
| Default |
15 minutos |
3.5. Dropdown Sonido
| Propiedad |
Valor |
| Componente |
CMP-INP-006 (Dropdown Select) |
| Options |
Tono suave, Tono moderado, Tono fuerte, Silencio |
| Default |
Tono suave |
| Preview |
Reproducir muestra al seleccionar |
3.6. Time Range Picker
| Propiedad |
Valor |
| Componente |
CMP-INP-010 (Time Range) |
| Format |
HH:MM AM/PM |
| Default start |
10:00 PM |
| Default end |
7:00 AM |
4. Comportamientos
4.1. Flujo de Permisos
flowchart TD
A[Pantalla cargada] --> B{Permiso ya otorgado?}
B -->|Si| C[Mostrar configuracion]
B -->|No| D[Mostrar solicitud]
D --> E{Tap Activar?}
E -->|Si| F[Trigger system permission]
E -->|No/Skip| G[Marcar como rechazado]
F --> H{Usuario acepta?}
H -->|Si| I[Guardar permiso OK]
I --> C
H -->|No| J[Mostrar pantalla denegado]
J --> K{Abrir settings?}
K -->|Si| L[Deep link a settings]
K -->|No| M[Continuar sin notificaciones]
G --> M
C --> N[Usuario configura]
N --> O[Guardar preferencias]
O --> P[Navegar a ONB-007]
M --> P
4.2. Preview de Sonido
flowchart TD
A[Tap dropdown sonido] --> B[Mostrar opciones]
B --> C{Selecciona opcion?}
C -->|Si| D[Reproducir muestra 1s]
D --> E[Actualizar seleccion]
E --> F[Cerrar dropdown]
4.3. Gestos
| Gesto |
Elemento |
Accion |
| Tap |
Activar notificaciones |
Request permission |
| Tap |
Toggle |
Toggle on/off |
| Tap |
Dropdown |
Abrir opciones |
| Tap |
Time range |
Abrir picker |
| Tap |
Abrir settings |
Deep link |
| Tap |
Continuar |
Guardar y navegar |
4.4. Validaciones
| Validacion |
Condicion |
Accion |
| Silencio nocturno |
End time > Start time |
Ajustar automatico |
| Todas desactivadas |
Todos toggles OFF |
Mostrar warning |
5. Estados
5.1. Estados de la Pantalla
| Estado |
Condicion |
Visual |
| Request |
Permiso no solicitado |
Pantalla solicitud |
| Settings |
Permiso otorgado |
Pantalla configuracion |
| Denied |
Permiso denegado |
Pantalla warning |
5.2. Estados de Toggle
| Estado |
Visual |
| On |
Track primary, thumb derecha |
| Off |
Track neutral.300, thumb izquierda |
| Disabled |
Opacity 50%, no interactivo |
6. Accesibilidad
6.1. Labels y Hints
| Elemento |
accessibilityLabel |
accessibilityHint |
| Toggle recordatorios |
"Recordatorios de medicamentos, {estado}" |
"Toca para {activar/desactivar}" |
| Dropdown tiempo |
"Tiempo antes del recordatorio, {valor}" |
"Toca para cambiar" |
| Dropdown sonido |
"Sonido de notificacion, {valor}" |
"Toca para cambiar" |
| Toggle vibracion |
"Vibracion, {estado}" |
"Toca para {activar/desactivar}" |
| Toggle silencio |
"Modo silencioso nocturno, {estado}" |
"Toca para {activar/desactivar}" |
6.2. Orden de Foco
6.2.1. Request State
- Back button
- Titulo
- Descripcion
- Beneficio 1 (Recordatorios)
- Beneficio 2 (Reposicion)
- Beneficio 3 (Actualizaciones)
- Boton Activar
- Link Ahora no
6.2.2. Settings State
- Back button
- Status notificaciones
- Toggle recordatorios
- Dropdown tiempo
- Dropdown sonido
- Toggle vibracion
- Toggle silencio nocturno
- Boton Continuar
6.3. Screen Reader
| Evento |
Anuncio |
| Permiso solicitado |
"Solicitud de permiso de notificaciones enviada" |
| Permiso aceptado |
"Notificaciones activadas exitosamente" |
| Permiso denegado |
"Notificaciones no activadas. Puedes activarlas despues en configuracion" |
| Toggle cambiado |
"{opcion} {activada/desactivada}" |
7. Permisos del Sistema
7.1. Android
<uses-permission android:name="android.permission.POST_NOTIFICATIONS" />
- Requerido desde Android 13 (API 33)
- Versiones anteriores: automatico
7.2. iOS
UNUserNotificationCenter.current().requestAuthorization(options: [.alert, .badge, .sound])
- Solicitar una sola vez
- Respetar decision del usuario
7.3. Deep Link a Settings
| Plataforma |
Accion |
| Android |
Intent(Settings.ACTION_APP_NOTIFICATION_SETTINGS) |
| iOS |
UIApplication.openSettingsURLString |
8. Datos Requeridos
interface NotificationConfigInput {
role: 'PI' | 'CR' | 'CS';
permission_status?: 'granted' | 'denied' | 'not_determined';
}
8.2. Output Data
interface NotificationConfigOutput {
permission_granted: boolean;
preferences: {
reminders_enabled: boolean;
advance_time_minutes: number;
sound: 'soft' | 'moderate' | 'loud' | 'silent';
vibration_enabled: boolean;
quiet_hours_enabled: boolean;
quiet_start?: string;
quiet_end?: string;
};
}
9. Metricas
9.1. Analytics Events
| Evento |
Parametros |
| screen_view |
screen_name: "onboarding_notifications" |
| notification_permission_requested |
- |
| notification_permission_granted |
- |
| notification_permission_denied |
- |
| notification_setting_changed |
setting, old_value, new_value |
| quiet_hours_configured |
start, end |
| step_completed |
step: 6, role, permission_status |
10. Consideraciones UX
10.1. Timing del Request
- Mostrar beneficios ANTES del request
- No solicitar en primera pantalla
- Usuario ya tiene contexto del valor
10.2. Manejo de Rechazo
- NO insistir multiples veces
- Ofrecer alternativa (settings)
- App debe funcionar sin notificaciones
10.3. Defaults Inteligentes
- 15 min antes: balance entre anticipacion y molestia
- Tono suave: no invasivo
- Silencio nocturno: respetar descanso
11. Referencias
Documento generado por MobileUxUiDrone (Eight of Eight)