Saltar a contenido

Pantalla: Lista de Cuidadores

Identificador: SCR-USR-004 Nombre: Lista de Cuidadores Modulo: MTS-USR-001 - Gestion de Usuarios Version: 1.0.0 Fecha: 2025-12-05 Autor: MobileUxUiDrone (Eight of Eight)


1. Informacion General

Atributo Valor
Tipo Lista con acciones
Acceso SCR-USR-001 > Mis Cuidadores
Roles PI (gestionar CS), CR (gestionar CS de dependientes)
Tiers Pro, Perfect
Prioridad Alta

2. Proposito

Muestra la lista de cuidadores solidarios vinculados al paciente, con su estado (activo, pendiente) y permite gestionar permisos, invitar nuevos o revocar acceso.


3. Wireframe - Estado con Cuidadores

+--------------------------------------------------+
| [<]  Mis Cuidadores                        [+]   |
+--------------------------------------------------+
|                                                   |
|  Tienes 3 de 5 cuidadores     [Pro badge]        |
|                                                   |
+--------------------------------------------------+
| ACTIVOS (3)                                       |
+--------------------------------------------------+
|  +--------------------------------------------+  |
|  | [Avatar]  Juan Garcia                      |  |
|  |           Pareja                           |  |
|  |           Activo desde hace 6 meses    [>] |  |
|  +--------------------------------------------+  |
|                                                   |
|  +--------------------------------------------+  |
|  | [Avatar]  Maria Lopez                      |  |
|  |           Hija                             |  |
|  |           Activo desde hace 2 meses    [>] |  |
|  +--------------------------------------------+  |
|                                                   |
|  +--------------------------------------------+  |
|  | [Avatar]  Pedro Martinez                   |  |
|  |           Amigo                            |  |
|  |           Activo desde hace 1 semana   [>] |  |
|  +--------------------------------------------+  |
|                                                   |
+--------------------------------------------------+
| PENDIENTES (1)                                    |
+--------------------------------------------------+
|  +--------------------------------------------+  |
|  | [clock]  laura@email.com                   |  |
|  |          Hermana                           |  |
|  |          Invitacion enviada hace 2 dias    |  |
|  |          [Reenviar]        [Cancelar]      |  |
|  +--------------------------------------------+  |
|                                                   |
+--------------------------------------------------+

4. Wireframe - Estado Vacio

+--------------------------------------------------+
| [<]  Mis Cuidadores                        [+]   |
+--------------------------------------------------+
|                                                   |
|                                                   |
|           [Ilustracion: personas]                 |
|                                                   |
|           Aun no tienes cuidadores                |
|                                                   |
|     Los cuidadores solidarios son personas        |
|     de confianza que pueden recibir alertas       |
|     sobre tu medicacion y ayudarte a              |
|     mantener tu tratamiento al dia.               |
|                                                   |
|         [+ Invitar Cuidador]                      |
|                                                   |
|                                                   |
+--------------------------------------------------+

5. Elementos de UI

5.1. Componentes

ID Componente Tipo Requerido
header Top App Bar CMP-NAV-002 Si
btn_add Icon Button (+) CMP-BTN-004 Si
counter Text - Si
section_active Section Header Text Si
caregiver_card Caregiver Card Custom Dinamico
section_pending Section Header Text Condicional
pending_card Pending Invite Card Custom Dinamico
empty_state Empty State Custom Condicional

5.2. Card de Cuidador Activo

+--------------------------------------------------+
| [Avatar]  Nombre Apellido                         |
|           Relacion                                |
|           Estado/tiempo                       [>] |
+--------------------------------------------------+

Especificaciones:
- Avatar: 48x48dp circular
- Nombre: 16sp medium
- Relacion: 14sp regular, neutral.600
- Estado: 12sp regular, success color
- Chevron: 24x24dp
- Height: 80dp
- Padding: 16dp

5.3. Card de Invitacion Pendiente

+--------------------------------------------------+
| [clock]  email/telefono                           |
|          Relacion                                 |
|          "Invitacion enviada hace X dias"         |
|          [Reenviar]        [Cancelar]             |
+--------------------------------------------------+

Especificaciones:
- Icon clock: 48x48dp, warning color
- Email/tel: 16sp medium
- Botones: Text buttons, 48dp touch target
- Background: warning.light (muy sutil)

6. Estados

6.1. Estados de la Lista

Estado Condicion Visual
Vacio 0 cuidadores Empty state con CTA
Con activos >= 1 activo Lista con seccion activos
Con pendientes >= 1 pendiente Seccion pendientes visible
Limite alcanzado count == max tier Banner + desactivar [+]
Solo pendientes 0 activos, >= 1 pendiente Empty activos + pendientes

6.2. Limites por Tier

Tier Max Cuidadores Mensaje
Free 0 Upsell a Pro
Pro 5 "X de 5 cuidadores"
Perfect 10 "X de 10 cuidadores"

6.3. Limite Alcanzado

+--------------------------------------------------+
| [!] Has alcanzado el limite de cuidadores        |
|     Actualiza a Perfect para agregar mas         |
|                                  [Ver planes]     |
+--------------------------------------------------+

7. Interacciones

7.1. Gestos

Gesto Elemento Accion
Tap Card cuidador Navegar a SCR-USR-006
Tap [+] header Navegar a SCR-USR-005
Tap Reenviar Reenviar invitacion
Tap Cancelar Confirmar y cancelar
Swipe left Card activo Revelar [Revocar]
Long press Card Mostrar opciones

7.2. Flujo Revocar Acceso

flowchart TD
    A[Swipe left en card] --> B[Revelar boton Revocar]
    B --> C[Tap Revocar]
    C --> D[Modal Confirmacion]
    D --> E{Confirmar?}
    E -->|Si| F[Revocar permisos]
    F --> G[Notificar cuidador]
    G --> H[Remover de lista]
    E -->|No| I[Cerrar modal]

7.3. Confirmacion de Revocacion

+--------------------------------------------------+
| Revocar acceso de Juan?                           |
+--------------------------------------------------+
|                                                   |
| Juan Garcia dejara de:                            |
| - Recibir alertas sobre tu medicacion             |
| - Ver tu informacion de salud                     |
| - Registrar tomas en tu nombre                    |
|                                                   |
| Esta accion es inmediata. Juan sera               |
| notificado de la revocacion.                      |
|                                                   |
| [Cancelar]                    [Revocar Acceso]    |
+--------------------------------------------------+

8. Modo Cuidador Responsable

Para CR gestionando cuidadores de dependientes:

+--------------------------------------------------+
| [<]  Cuidadores de Sofia                   [+]   |
+--------------------------------------------------+
|                                                   |
|  Perfil: Sofia Garcia (hija, 8 anos)             |
|                                                   |
|  Cuidadores solidarios de Sofia:                  |
|  (Personas que pueden recibir alertas)            |
|                                                   |
+--------------------------------------------------+
| ACTIVOS (2)                                       |
+--------------------------------------------------+
|  [Avatar]  Abuela Maria                       [>] |
|  [Avatar]  Tia Laura                          [>] |
+--------------------------------------------------+

9. Accesibilidad

9.1. Screen Reader

Elemento Label Hint
btn_add "Invitar cuidador" "Abre formulario de invitacion"
caregiver_card "[Nombre], [relacion], activo desde [fecha]" "Toca para ver permisos"
pending_card "Invitacion pendiente a [email]" "Puedes reenviar o cancelar"
swipe_action "Revocar acceso" -

9.2. Acciones Alternativas

Para usuarios que no pueden hacer swipe:

  • Long press en card muestra menu contextual con opcion "Revocar"
  • Tap en card > pantalla detalle > boton "Revocar Acceso"

10. Eventos de Analytics

Evento Trigger Parametros
caregivers_list_viewed Abrir pantalla count: [n], pending: [m]
caregiver_card_tapped Tap en card -
invite_button_tapped Tap [+] -
invite_resent Reenviar invitacion -
invite_cancelled Cancelar invitacion -
caregiver_revoked Confirmar revocacion -

11. Casos de Prueba

ID Caso Resultado Esperado
TC-001 Usuario Free accede Redirect a upsell
TC-002 Lista vacia Empty state con CTA
TC-003 Swipe izquierda card Revelar revocar
TC-004 Confirmar revocacion Cuidador removido
TC-005 Reenviar invitacion Confirmacion enviado
TC-006 Limite 5/5 cuidadores Banner limite, [+] disabled

12. Referencias


Documento generado por MobileUxUiDrone (Eight of Eight)