Pantalla: Configuracion de Gamificacion
Identificador: SCR-GAM-006
Modulo: MTS-GAM-001 - Gamificacion
Version: 1.0.0
Fecha: 2025-12-05
Autor: MobileUxUiDrone (Eight of Eight)
Estado: Especificado
| Atributo |
Valor |
| Nombre |
Configuracion de Gamificacion |
| Proposito |
Personalizar o desactivar elementos de gamificacion |
| Tipo |
Full Screen |
| Acceso |
Centro de Logros > Gear / Configuracion > Gamificacion |
| Prioridad |
Media |
| Tier |
Pro/Perfect |
2. Wireframe ASCII
2.1. Vista Principal
+------------------------------------------+
| [<] Gamificacion |
+------------------------------------------+
| |
| +------------------------------------+ |
| | ESTADO DE GAMIFICACION | |
| | | |
| | Gamificacion activa [ON/OFF] | |
| | | |
| | [i] Al desactivar, tu progreso | |
| | se mantiene invisible. Puedes | |
| | reactivar en cualquier | |
| | momento. | |
| +------------------------------------+ |
| |
| ELEMENTOS VISIBLES |
| |
| +------------------------------------+ |
| | Mostrar puntos [ON/OFF]| |
| | Ver puntos en dashboard y perfil | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | Mostrar racha [ON/OFF]| |
| | Ver racha en pantalla principal | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | Mostrar nivel [ON/OFF] | |
| | Ver nivel y progreso | |
| +------------------------------------+ |
| |
| NOTIFICACIONES Y EFECTOS |
| |
| +------------------------------------+ |
| | Notificar logros [ON/OFF] | |
| | Alertas al obtener logros | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | Animaciones [ON/OFF] | |
| | Efectos visuales de celebracion | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | Sonidos de logro [ON/OFF] | |
| | Sonido al obtener logro | |
| +------------------------------------+ |
| |
| GAMIFICACION POR CATEGORIA |
| |
| +------------------------------------+ |
| | Medicamentos [ON/OFF] | |
| | Puntos y logros de tomas | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | Mediciones de salud [ON/OFF] | |
| | Logros de registro de mediciones | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | Tratamientos [ON/OFF] | |
| | Logros de tratamientos | |
| +------------------------------------+ |
| |
+------------------------------------------+
2.2. Gamificacion Desactivada
+------------------------------------------+
| [<] Gamificacion |
+------------------------------------------+
| |
| +------------------------------------+ |
| | ESTADO DE GAMIFICACION | |
| | | |
| | Gamificacion activa [ OFF] | |
| | | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | [i] La gamificacion esta | |
| | desactivada. | |
| | | |
| | Tu progreso actual: | |
| | | |
| | - 4,200 puntos | |
| | - Nivel 4: Dedicado | |
| | - 14 logros obtenidos | |
| | | |
| | Este progreso se conserva | |
| | y estara disponible cuando | |
| | reactives la gamificacion. | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | [Reactivar] | |
| +------------------------------------+ |
| |
+------------------------------------------+
2.3. Confirmacion Desactivar
+------------------------------------------+
| |
| +------------------------------------+ |
| | Desactivar Gamificacion? | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | | |
| | Al desactivar la gamificacion: | |
| | | |
| | [Check] Tu progreso se guarda | |
| | [Check] Puntos y logros se | |
| | mantienen | |
| | [Check] Puedes reactivar | |
| | cuando quieras | |
| | | |
| | [X] No veras puntos ni racha | |
| | [X] No recibiras notificaciones | |
| | de logros | |
| | [X] No veras celebraciones | |
| | | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | [Desactivar] | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | [Cancelar] | |
| +------------------------------------+ |
| |
+------------------------------------------+
2.4. Desactivar por Categoria
+------------------------------------------+
| |
| +------------------------------------+ |
| | Desactivar para Mediciones? | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | | |
| | [Heart] Mediciones de Salud | |
| | | |
| | Al desactivar: | |
| | | |
| | - No veras logros de mediciones | |
| | - Tu progreso se mantiene | |
| | (invisible) | |
| | - Puedes reactivar cuando quieras | |
| | | |
| | [i] Los logros de medicamentos | |
| | y tratamientos seguiran | |
| | activos. | |
| | | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | [Desactivar] | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | [Cancelar] | |
| +------------------------------------+ |
| |
+------------------------------------------+
2.5. Personalizacion Visual
+------------------------------------------+
| [<] Personalizacion |
+------------------------------------------+
| |
| TEMA DE COLOR |
| |
| +------------------------------------+ |
| | [*Blue] [*Dark] [*Green] [*Purple] | |
| | [*Coral] [*Navy] [Lock] [Lock] | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | [i] Desbloquea mas temas subiendo | |
| | de nivel. | |
| | Nivel 6: Dorado, Cristal | |
| +------------------------------------+ |
| |
| SONIDO DE NOTIFICACION |
| |
| +------------------------------------+ |
| | (*) Estandar [>] | |
| | ( ) Suave [>] | |
| | ( ) Campana [>] | |
| | ( ) Arpa [>] | |
| | ( ) Gota [>] | |
| | [Lock] Melodia (Nivel 5) [>] | |
| | [Lock] Zen (Nivel 5) [>] | |
| +------------------------------------+ |
| |
| ICONO DE APP (iOS) |
| |
| +------------------------------------+ |
| | [*Clasico] | |
| | [Lock Minimal] Nivel 5 | |
| | [Lock Dark] Nivel 5 | |
| | [Lock Gradient] Nivel 8 | |
| | [Lock Gold] Nivel 8 | |
| +------------------------------------+ |
| |
+------------------------------------------+
2.6. Seleccionar Sonido
+------------------------------------------+
| |
| +------------------------------------+ |
| | Sonido de Notificacion | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | (*) Estandar [Play] | |
| +------------------------------------+ |
| | ( ) Suave [Play] | |
| +------------------------------------+ |
| | ( ) Campana [Play] | |
| +------------------------------------+ |
| | ( ) Arpa [Play] | |
| +------------------------------------+ |
| | ( ) Gota [Play] | |
| +------------------------------------+ |
| |
| BLOQUEADOS |
| |
| +------------------------------------+ |
| | [Lock] Melodia [Play] | |
| | Disponible en Nivel 5 | |
| +------------------------------------+ |
| | [Lock] Zen [Play] | |
| | Disponible en Nivel 5 | |
| +------------------------------------+ |
| | [Lock] Naturaleza [Play] | |
| | Disponible en Nivel 5 | |
| +------------------------------------+ |
| |
| +------------------------------------+ |
| | [Guardar] | |
| +------------------------------------+ |
| |
+------------------------------------------+
3. Componentes UI
3.1. Master Toggle
| Propiedad |
Valor |
| Componente |
CMP-TGL-005 (Master Toggle) |
| Label |
"Gamificacion activa" |
| Info |
Texto explicativo debajo |
| Confirmation |
Modal al desactivar |
3.2. Setting Row
| Propiedad |
Valor |
| Componente |
CMP-LST-040 (Setting Row) |
| Label |
Nombre de la opcion |
| Subtitle |
Descripcion breve |
| Toggle |
ON/OFF |
3.3. Category Toggle
| Propiedad |
Valor |
| Componente |
CMP-TGL-006 (Category Toggle) |
| Icon |
Por categoria |
| Label |
Nombre categoria |
| Confirmation |
Modal al desactivar |
3.4. Theme Selector
| Propiedad |
Valor |
| Componente |
CMP-SEL-007 (Theme Selector) |
| Layout |
Grid 4 columnas |
| Item |
Circulo de color |
| Locked |
Lock icon + nivel |
| Selected |
Check overlay |
3.5. Sound Selector
| Propiedad |
Valor |
| Componente |
CMP-RAD-007 (Sound Selector) |
| Radio |
Seleccion unica |
| Play |
Boton preview |
| Lock |
Nivel requerido |
3.6. App Icon Selector (iOS)
| Propiedad |
Valor |
| Componente |
CMP-SEL-008 (Icon Selector) |
| Layout |
Grid |
| Preview |
Icono miniatura |
| Locked |
Nivel requerido |
4. Opciones de Configuracion
| Opcion |
Default |
Efecto |
| Gamificacion activa |
ON |
Master switch |
| Mostrar puntos |
ON |
Puntos visibles en UI |
| Mostrar racha |
ON |
Racha en dashboard |
| Mostrar nivel |
ON |
Nivel en perfil |
| Notificar logros |
ON |
Push/in-app alerts |
| Animaciones |
ON |
Efectos de celebracion |
| Sonidos |
ON |
Sonido al obtener logro |
| Medicamentos |
ON |
Gamificar tomas |
| Mediciones |
ON |
Gamificar mediciones |
| Tratamientos |
ON |
Gamificar tratamientos |
5. Comportamientos
5.1. Desactivar Gamificacion
- Usuario toca toggle master
- Modal de confirmacion
- Si confirma: oculta todos elementos
- Progreso se mantiene en backend
- Puede reactivar en cualquier momento
5.2. Desactivar por Categoria
- Usuario desactiva categoria especifica
- Modal explicativo
- Solo afecta esa categoria
- Otras categorias siguen activas
- Progreso se mantiene (invisible)
5.3. Cambiar Tema
- Tap en color disponible
- Preview instantaneo
- Cambio aplica inmediatamente
- Colores bloqueados muestran nivel requerido
5.4. Cambiar Sonido
- Tap en Play para preview
- Seleccionar con radio
- Tap Guardar para aplicar
- Sonidos bloqueados se pueden previewear
5.5. Cambiar Icono (iOS)
- Seleccionar icono disponible
- Sistema pide confirmacion
- Icono cambia en home screen
- Iconos bloqueados muestran nivel
6. Datos Requeridos
interface GamificationSettingsState {
isEnabled: boolean;
displaySettings: DisplaySettings;
notificationSettings: NotificationSettings;
categorySettings: CategorySettings;
customization: CustomizationSettings;
savedProgress: SavedProgress;
}
interface DisplaySettings {
showPoints: boolean;
showStreak: boolean;
showLevel: boolean;
}
interface NotificationSettings {
notifyAchievements: boolean;
showAnimations: boolean;
playSounds: boolean;
}
interface CategorySettings {
medications: boolean;
measurements: boolean;
treatments: boolean;
}
interface CustomizationSettings {
selectedTheme: string;
selectedSound: string;
selectedIcon: string; // iOS only
availableThemes: ThemeOption[];
availableSounds: SoundOption[];
availableIcons: IconOption[];
}
interface ThemeOption {
id: string;
name: string;
color: string;
levelRequired: number;
isUnlocked: boolean;
}
interface SoundOption {
id: string;
name: string;
previewUrl: string;
levelRequired: number;
isUnlocked: boolean;
}
interface IconOption {
id: string;
name: string;
previewImage: string;
levelRequired: number;
isUnlocked: boolean;
}
interface SavedProgress {
totalPoints: number;
currentLevel: number;
levelName: string;
achievementsObtained: number;
currentStreak: number;
}
7. Reglas de Negocio
| Regla |
Descripcion |
| RN-GAM-007 |
Gamificacion desactivable sin perder progreso |
| RN-GAM-015 |
Usuario puede desactivar por categoria |
| Tema |
Requiere nivel para desbloquear |
| Sonido |
Requiere nivel para seleccionar |
| Icono |
Solo iOS, requiere nivel |
8. Accesibilidad
8.1. Labels
| Elemento |
accessibilityLabel |
| Master toggle |
"Gamificacion, {activa/desactivada}" |
| Setting row |
"{nombre}: {estado}" |
| Theme |
"Tema {nombre}, {disponible/bloqueado nivel X}" |
| Sound |
"Sonido {nombre}, reproducir preview" |
8.2. Anuncios
- Al desactivar: "Gamificacion desactivada, progreso guardado"
- Al cambiar tema: "Tema {nombre} aplicado"
- Al cambiar sonido: "Sonido {nombre} seleccionado"
9. Referencias
Documento generado por MobileUxUiDrone (Eight of Eight)