Wireframes de pantallas principales

Los siguientes wireframes muestran la estructura visual y la disposición de los componentes principales de cada pantalla. Se representan con Mermaid para mantener la coherencia con el resto de la documentación y permitir su evolución a mockups de alta fidelidad.

Convenciones

• 🔲 = Zona de contenido
• 📋 = Listado / tabla
• ✏️ = Formulario
• 🔘 = Botón de acción
• 📎 = Carga de archivos
• ⓘ = Información contextual
• ⚠️ = Mensaje de validación

Login

flowchart TB
    subgraph Login
        Header[🔲 Encabezado institucional]
        Form[✏️ Formulario]
        Actions[🔘 Acciones]
    end

    Form --> Campo1[Correo]
    Form --> Campo2[Contraseña]
    Form --> Link[¿Olvidó su contraseña?]
    Actions --> B1[🔘 Iniciar sesión]
    Actions --> B2[🔘 Ingresar con RegID]
    Header -.-> Logo[Logo UC + Posgrado]

Panel del Aspirante

flowchart LR
    subgraph Sidebar
        M1[🔘 Inicio]
        M2[🔘 Convocatorias]
        M3[🔘 Mis solicitudes]
        M4[🔘 Mi expediente]
        M5[🔘 Documentos]
        M6[🔘 Notificaciones]
    end

    subgraph Main
        H[🔲 Bienvenida]
        Cards[🔲 Tarjetas]
        T1[📋 Convocatorias activas]
        T2[📋 Estado de solicitudes]
    end

    Cards --> C1[ⓘ Próxima convocatoria]
    Cards --> C2[ⓘ Solicitud en revisión]
    Cards --> C3[ⓘ Alerta documental]

Formulario de solicitud de matrícula

flowchart TB
    subgraph Form
        Step[🔲 Stepper 1/4]
        P1[✏️ Datos personales]
        P2[✏️ Programa y edición]
        P3[📎 Documentos]
        P4[🔲 Resumen y envío]
    end

    P1 --> F1[Nombre, apellidos, identidad]
    P1 --> F2[Correo, teléfono]
    P2 --> F3[Programa, edición, modalidad]
    P3 --> F4[Título universitario 📎]
    P3 --> F5[Identidad 📎]
    P3 --> F6[Autorización 📎]
    P4 --> F7[ⓘ Resumen de la solicitud]
    P4 --> B1[🔘 Guardar borrador]
    P4 --> B2[🔘 Enviar solicitud]
    P4 --> W1[⚠️ Validación en línea]

Panel del Estudiante

flowchart LR
    subgraph Sidebar
        S1[🔘 Inicio]
        S2[🔘 Mi matrícula]
        S3[🔘 Expediente]
        S4[🔘 Asistencia]
        S5[🔘 Calificaciones]
        S6[🔘 Evaluación final]
        S7[🔘 Certificación]
    end

    subgraph Main
        Banner[🔲 Estado académico]
        KPIS[🔲 Indicadores]
        Charts[🔲 Gráficos de progreso]
        T1[📋 Próximas actividades]
    end

    Banner -.-> S[ⓘ En curso · 65% créditos]
    KPIS --> K1[Créditos]
    KPIS --> K2[Asistencia]
    KPIS --> K3[Promedio]

Validación documental (Secretaría)

flowchart TB
    subgraph Toolbar
        F[🔲 Filtros]
        B1[🔘 Exportar]
    end

    subgraph Listado
        T[📋 Solicitudes pendientes]
        T --> R1[Fila solicitud]
        T --> R2[Fila solicitud]
        T --> R3[Fila solicitud]
    end

    R1 --> Detalle[🔲 Detalle]
    Detalle --> Docs[📎 Documentos adjuntos]
    Detalle --> Acc[🔘 Aprobar docs]
    Detalle --> Rec[🔘 Solicitar corrección]
    Detalle --> Aud[⓲ Auditoría visible]

Registro de calificaciones (Profesor)

flowchart TB
    subgraph Select
        A[🔲 Seleccionar programa]
        B[🔲 Seleccionar actividad]
    end

    subgraph Tabla
        T[📋 Estudiantes]
        T --> E1[Estudiante · valor · obs]
        T --> E2[Estudiante · valor · obs]
        T --> E3[Estudiante · valor · obs]
    end

    subgraph Acciones
        Save[🔘 Guardar borrador]
        Send[🔘 Enviar a expediente]
        Sync[🔘 Sincronizar con Moodle]
    end

Evaluación de solicitudes (Comité)

flowchart TB
    subgraph Listado
        L[📋 Solicitudes en evaluación]
        L --> S1[Solicitud]
        L --> S2[Solicitud]
    end

    S1 --> Panel[🔲 Panel de evaluación]
    Panel --> Info[⓲ Datos del aspirante]
    Panel --> Docs[📎 Documentos validados]
    Panel --> Dec[🔘 Aprobar]
    Panel --> DecR[🔘 Rechazar]
    Panel --> Mot[✏️ Motivo]
    Panel --> Pla[⓲ Plazas disponibles]

Certificación y titulación

flowchart TB
    subgraph Verificacion
        V[⓲ Verificación automática]
        V1[✔ Créditos cumplidos]
        V2[✔ Evaluación final aprobada]
        V3[✔ Documentación completa]
    end

    subgraph Emision
        Tipo{Tipo de programa}
        Cert[🔘 Generar certificado]
        Tit[🔘 Generar título]
    end

    subgraph Salida
        Cod[⓲ Código de validación]
        Hist[🔘 Registrar en histórico]
        Desc[🔘 Permitir descarga]
    end

    V --> Tipo
    Tipo -->|Curso/Entren./Diplomado| Cert
    Tipo -->|Maestría/Especialidad| Tit
    Cert --> Cod
    Tit --> Cod
    Cod --> Hist
    Cod --> Desc

Dashboard institucional (Dirección)

flowchart LR
    subgraph KPIs
        K1[⓲ Matriculados]
        K2[⓲ Graduados]
        K3[⓲ Eficiencia terminal]
        K4[⓲ Deserción]
        K5[⓲ Aprobación]
        K6[⓲ Asistencia promedio]
    end

    subgraph Graficos
        G1[📊 Programas por tipo]
        G2[📊 Evolución por edición]
        G3[📊 Distribución por facultad]
    end

    subgraph Acciones
        A1[🔘 Exportar PDF]
        A2[🔘 Exportar Excel]
        A3[🔘 Exportar XML]
    end

Administración de usuarios

flowchart TB
    subgraph Toolbar
        F[🔲 Filtros y búsqueda]
        New[🔘 Nuevo usuario]
    end

    subgraph Tabla
        U[📋 Usuarios]
        U --> R1[Usuario · rol · estado]
        U --> R2[Usuario · rol · estado]
    end

    R1 --> Det[🔲 Detalle]
    Det --> Edit[🔘 Editar]
    Det --> Rol[🔘 Asignar rol]
    Det --> Bloq[🔘 Bloquear]
    Det --> Aud[⓲ Auditoría del usuario]