Pantalla: Configuracion de Notificaciones
Identificador: SCR-ALT-004
Modulo: MTS-ALT-001 - Alertas y Notificaciones
Version: 1.0.0
Fecha: 2025-12-05
Autor: MobileUxUiDrone (Eight of Eight)
Estado: Especificado
| Atributo |
Valor |
| Nombre |
Configuracion de Notificaciones |
| Proposito |
Permitir al usuario personalizar todas las preferencias de alertas |
| Tipo |
Full Screen (settings) |
| Acceso |
Configuracion > Notificaciones |
| Prioridad |
Alta |
2. Wireframe ASCII
2.1. Estado: Vista Principal
+------------------------------------------+
| [<] Notificaciones [?] | <- Top App Bar
+------------------------------------------+
| |
| RECORDATORIOS | <- Section
| +------------------------------------+ |
| | Pre-alerta | |
| | Desactivada [>] | |
| +------------------------------------+ |
| | Primer recordatorio | |
| | 15 minutos despues [>] | |
| +------------------------------------+ |
| | Segundo recordatorio | |
| | 30 minutos despues [>] | |
| +------------------------------------+ |
| | Marcar como omitida | |
| | 60 minutos despues [>] | |
| +------------------------------------+ |
| |
| SONIDO Y VIBRACION |
| +------------------------------------+ |
| | Sonido de alerta | |
| | MedTime Default [>] | |
| +------------------------------------+ |
| | Vibracion | |
| | [ON] | |
| +------------------------------------+ |
| | Patron de vibracion | |
| | Doble pulso [>] | |
| +------------------------------------+ |
| | LED (Android) | |
| | Azul [>] | |
| +------------------------------------+ |
| |
| PRIVACIDAD |
| +------------------------------------+ |
| | Mostrar nombres de medicamentos | |
| | [ON] | |
| +------------------------------------+ |
| | Mostrar en pantalla de bloqueo | |
| | [ON] | |
| +------------------------------------+ |
| |
| ESCALAMIENTO (Pro/Perfect) |
| +------------------------------------+ |
| | Escalar a cuidadores | |
| | [ON] | |
| +------------------------------------+ |
| | Ventana de espera | |
| | 30 minutos [>] | |
| +------------------------------------+ |
| | Configurar cuidadores [>] | |
| +------------------------------------+ |
| |
| AVANZADO |
| +------------------------------------+ |
| | Modo no molestar [>] | |
| +------------------------------------+ |
| | Contactos de emergencia [>] | |
| +------------------------------------+ |
| | Probar alertas [>] | |
| +------------------------------------+ |
| |
+------------------------------------------+
2.2. Selector de Tiempo (Bottom Sheet)
+------------------------------------------+
| Pre-alerta [X] |
+------------------------------------------+
| |
| Recibe una notificacion antes de la |
| hora de tu medicamento. |
| |
| +------------------------------------+ |
| | ( ) Desactivada | |
| +------------------------------------+ |
| | ( ) 5 minutos antes | |
| +------------------------------------+ |
| | (o) 10 minutos antes | | <- Selected
| +------------------------------------+ |
| | ( ) 15 minutos antes | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | [Guardar] | |
| +------------------------------------+ |
| |
+------------------------------------------+
2.3. Selector de Sonido
+------------------------------------------+
| Sonido de alerta [X] |
+------------------------------------------+
| |
| +------------------------------------+ |
| | (o) MedTime Default [>] | | <- Preview on tap
| +------------------------------------+ |
| | ( ) Suave [>] | |
| +------------------------------------+ |
| | ( ) Urgente [>] | |
| +------------------------------------+ |
| | ( ) Campanilla [>] | | <- Pro+
| +------------------------------------+ |
| | ( ) Naturaleza [>] | | <- Pro+
| +------------------------------------+ |
| | ( ) Personalizado... [>] | | <- Perfect only
| +------------------------------------+ |
| |
| [Pro/Perfect badge para opciones locked] |
| |
+------------------------------------------+
2.4. Vista Tier Free (Limitada)
+------------------------------------------+
| [<] Notificaciones [?] |
+------------------------------------------+
| |
| RECORDATORIOS |
| [Opciones normales...] |
| |
| SONIDO Y VIBRACION |
| +------------------------------------+ |
| | Sonido de alerta | |
| | MedTime Default [>] | |
| +------------------------------------+ |
| | Vibracion [ON] | |
| +------------------------------------+ |
| |
| PRIVACIDAD |
| [Opciones normales...] |
| |
| +====================================+ |
| | QUIERES MAS OPCIONES? | | <- Upsell card
| | | |
| | Con Pro obtendras: | |
| | - Escalamiento a cuidadores | |
| | - Mas sonidos y personalizacion | |
| | - Modo no molestar inteligente | |
| | | |
| | [Ver planes] | |
| +====================================+ |
| |
+------------------------------------------+
3. Componentes UI
3.1. Top App Bar
| Propiedad |
Valor |
| Componente |
CMP-NAV-002 (Top App Bar) |
| Variante |
regular |
| Titulo |
"Notificaciones" |
| Leading |
Back arrow |
| Trailing |
Help icon (?) |
| Propiedad |
Valor |
| Componente |
CMP-TYP-003 (Section Header) |
| Tipografia |
sm, uppercase, medium |
| Color |
neutral.500 |
| Padding |
16dp top, 8dp bottom |
3.3. Settings Row
| Propiedad |
Valor |
| Componente |
CMP-LST-002 (Settings Item) |
| Variante |
navigation (con chevron) o toggle (con switch) |
| Height |
56dp minimo |
| Touch target |
Full row |
Elementos:
| Elemento |
Descripcion |
| Label |
Nombre de la configuracion |
| Value |
Valor actual (si aplica) |
| Chevron |
Para navegacion |
| Switch |
Para toggles |
| Lock icon |
Si feature bloqueada por tier |
3.4. Toggle Switch
| Propiedad |
Valor |
| Componente |
CMP-INP-007 (Switch) |
| Variante |
default |
| Estados |
ON (primary), OFF (neutral) |
| Touch target |
48x48dp |
| Propiedad |
Valor |
| Componente |
CMP-INP-008 (Radio Group) |
| Variante |
vertical |
| Selection |
Single |
3.6. Upsell Card
| Propiedad |
Valor |
| Componente |
CMP-CRD-006 (Promo Card) |
| Variante |
highlight |
| Background |
gradient primary |
| CTA |
Text button "Ver planes" |
4. Comportamientos
4.1. Gestos
| Gesto |
Elemento |
Accion |
| Tap |
Row con chevron |
Abrir selector/pantalla |
| Tap |
Row con switch |
Toggle ON/OFF |
| Tap |
Sound preview |
Reproducir sonido |
| Tap |
Help icon |
Mostrar tooltip/sheet explicativo |
| Tap |
Lock icon |
Mostrar upsell modal |
4.2. Validaciones
| Campo |
Validacion |
| Ventana de espera |
15-90 minutos |
| Pre-alerta |
0, 5, 10, 15 minutos |
| Recordatorio 1 |
5-30 minutos |
| Recordatorio 2 |
15-60 minutos |
| Marcar omitida |
30-120 minutos |
4.3. Guardado Automatico
- Cada cambio se guarda automaticamente
- Feedback con snackbar breve "Guardado"
- Sin boton de guardar explicito
- Cambios se sincronizan al servidor (Pro+)
5. Configuraciones por Tier
5.1. Disponibilidad de Opciones
| Opcion |
Free |
Pro |
Perfect |
| Pre-alerta |
Si |
Si |
Si |
| Recordatorios |
Si |
Si |
Si |
| Sonidos (3 basicos) |
Si |
Si |
Si |
| Sonidos (10 opciones) |
No |
Si |
Si |
| Sonido personalizado |
No |
No |
Si |
| Vibracion |
Si |
Si |
Si |
| Patrones vibracion (2) |
Si |
Si |
Si |
| Patrones vibracion (5+) |
No |
Si |
Si |
| LED Android |
Fijo |
3 colores |
Custom |
| Privacidad |
Si |
Si |
Si |
| Escalamiento cuidadores |
No |
Si |
Si |
| Modo no molestar |
Basico |
Completo |
Completo |
| Contactos emergencia |
2 max |
10 max |
10 max |
6. Datos Requeridos
interface NotificationSettings {
// Recordatorios
pre_alert_minutes: 0 | 5 | 10 | 15;
reminder_1_minutes: number; // 5-30
reminder_2_minutes: number; // 15-60
mark_omitted_minutes: number; // 30-120
// Sonido y vibracion
sound_id: string;
vibration_enabled: boolean;
vibration_pattern: VibrationPattern;
led_color?: string; // Android only
// Privacidad
show_medication_names: boolean;
show_on_lock_screen: boolean;
// Escalamiento (Pro+)
escalation_enabled: boolean;
escalation_window_minutes: number; // 15-90
carer_ids: string[];
// Tier info
user_tier: 'FREE' | 'PRO' | 'PERFECT';
}
6.2. Output Events
| Evento |
Payload |
Destino |
| onSettingChange |
setting_key, new_value |
Save + Sync |
| onNavigate |
screen_id |
Navigation |
| onPreviewSound |
sound_id |
Audio player |
| onTestAlert |
- |
Trigger test notification |
| onUpgrade |
- |
Open paywall |
7. Accesibilidad
7.1. Labels y Hints
| Elemento |
accessibilityLabel |
accessibilityHint |
| Setting row |
"{nombre}, {valor actual}" |
"Toca para cambiar" |
| Toggle |
"{nombre}, {estado}" |
"Doble tap para cambiar" |
| Sound preview |
"Reproducir {nombre}" |
"Toca para escuchar el sonido" |
| Lock icon |
"Requiere {tier}" |
"Toca para ver opciones de mejora" |
| Help icon |
"Ayuda" |
"Toca para ver mas informacion" |
7.2. Orden de Foco
- Back button
- Help button
- Primera seccion header
- Primer setting row
- ... (continua secuencialmente)
- Upsell card (si visible)
7.3. Screen Reader Announcements
| Evento |
Anuncio |
| Toggle cambiado |
"{nombre} {activado/desactivado}" |
| Valor seleccionado |
"{nombre} cambiado a {valor}" |
| Guardado |
"Configuracion guardada" |
8. Metricas
8.1. Analytics Events
| Evento |
Parametros |
| settings_view |
section |
| setting_changed |
setting_key, old_value, new_value |
| sound_preview |
sound_id |
| test_alert_sent |
- |
| upsell_viewed |
from_setting |
| upsell_tapped |
- |
9. Referencias
Documento generado por MobileUxUiDrone (Eight of Eight)