GA5-220501095-AA1-EV07

ELABORACIÓN DE INTERFAZ GRÁFICA Y MAPA DE NAVEGACIÓN CUMPLIENDO

CON REGLAS DE USABILIDAD Y ACCESIBILIDAD APP MÓVIL

Integrantes:
FABIAN LONDOÑO VASQUEZ
HEIDY TATIANA SEÑA MANCO
ANDRES FABIAN SARMIENTO

ANALISIS Y DESARROLLO DE SOFTWARE. (2627085)

Tutor: LINA MARIA GIRALDO TAPIERO

2023
 2

CONTENIDO

1. INTRODUCCIÓN ..................................................................................................................................... 4
2. TIPO DE APLICACIÓN ............................................................................................................................. 4
3. IDENTIDAD VISUAL CORPORATIVA ........................................................................................................ 4
4. PERSPECTIVA DEL PRODUCTO ............................................................................................................... 5
5. FUNCIONES DEL PRODUCTO ................................................................................................................. 5
6. CARACTERÍSTICAS DE LOS USUARIOS.................................................................................................... 6
7. RESTRICCIONES...................................................................................................................................... 7
8. SUPOSICIONES Y DEPENDENCIAS .......................................................................................................... 7
9. EVOLUCIÓN PREVISIBLE DEL SISTEMA ................................................................................................... 7
10. REQUISITOS FUNCIONALES ............................................................................................................... 7
10.1. Requisito funcional 1 ................................................................................................................. 7
10.2. Requisito funcional 2 ................................................................................................................. 8
10.3. Requisito funcional 3 ................................................................................................................. 8
10.4. Requisito funcional 4 ................................................................................................................. 8
10.5. Requisito funcional 5 ................................................................................................................. 9
10.6. Requisito funcional 6 ................................................................................................................. 9
10.7. Requisito funcional 7 ................................................................................................................. 9
10.8. Requisito funcional 8 ................................................................................................................. 9
10.9. Requisito funcional 9 ............................................................................................................... 10
11. REQUISITOS NO FUNCIONALES ....................................................................................................... 11
11.1. Requisitos de rendimiento ...................................................................................................... 11
11.2. Seguridad ................................................................................................................................. 11
11.3. Fiabilidad ................................................................................................................................. 11
11.4. Disponibilidad .......................................................................................................................... 11
11.5. Mantenibilidad ........................................................................................................................ 12
11.6. Portabilidad ............................................................................................................................. 12
12. PROTOTIPOS .................................................................................................................................... 13
12.1. Interfaz - Inicio de sesión......................................................................................................... 13
12.2. Interfaz - Acudiente ................................................................................................................. 14
12.3. Interfaz – Estudiante ............................................................................................................... 15
12.4. Interfaz – Docente ................................................................................................................... 16
 3

12.5. Interfaz – Coordinador Académico.......................................................................................... 17

12.6. Interfaz – Coordinador Administrativo y Financiero ............................................................... 18
12.7. Interfaz – Secretario (a) ........................................................................................................... 19
12.8. Interfaz – Rector ...................................................................................................................... 20
13. MAPAS DE NAVEGACIÓN................................................................................................................. 21

IMÁGENES
Imagen 1 Logotipo ..................................................................................................................................... 4
Imagen 1 Mapa de navegación general ............................................................................................... 21
Imagen 2 Mapa de navegación - Rector .............................................................................................. 22
Imagen 3 Mapa de navegación – Secretario (a) ................................................................................. 22
Imagen 4 Mapa de navegación – Coordinador académico ............................................................... 23
Imagen 5 Mapa de navegación – Coordinador Administrativo y Financiero .................................. 23
Imagen 6 Mapa de navegación – Docente .......................................................................................... 24
Imagen 7 Mapa de navegación – Estudiante ...................................................................................... 24
Imagen 8 Mapa de navegación – Acudiente ....................................................................................... 25
 4

1. INTRODUCCIÓN
Después de haber identificado y validado los requisitos del software, el siguiente paso
es el diseño de la interfaz gráfica mediante prototipos. Se realiza de esta manera con el
objetivo de definir el aspecto visual que tendrá el sistema, y servir como boceto para la
maquetación en XML.

En el presente documento se mostrará los prototipos de la aplicación móvil del sistema

SIGAA, de acuerdo con los requisitos identificados y validados previamente.

2. TIPO DE APLICACIÓN

SIGAA – Sistema Integrado de Gestión Administrativa y Financiera, es un aplicativo

móvil, el cual se desarrollará para el sistema operativo android para su funcionamiento
e interacción con los usuarios.

3. IDENTIDAD VISUAL CORPORATIVA

Imagen 1 Logotipo

Los colores corporativos seleccionados son:

 5

#0078AF #FFFFFF
- La tipografía será “Arial”.

- Se implementará botones, menús desplegables, mensajes informativos,

mensajes de error y formularios para ingreso de información.

4. PERSPECTIVA DEL PRODUCTO

El producto denominado SIGAA es un subsistema del sistema Institución Educativa
Francisco de Paula Santander, debido a que se identificó una serie de necesidades en la
gestión de los procesos de matrícula, reporte de notas, control de asistencia,
organización, almacenamiento y consulta de información.

SIGAA es un producto destinado a la web y app móvil, con responsive design, sencillo,
minimalista, y de fácil usabilidad.

5. FUNCIONES DEL PRODUCTO

El producto debe facilitar los procesos de matrícula de los estudiantes tanto para el
personal administrativo, como para los acudientes quienes son los que realizan la
solicitud y pago.

Debe organizar, almacenar y permitir consultas de información, archivos y/o datos

académicos, administrativos y/o de proyectos institucionales de forma integrada con las
áreas de la entidad.
 6

6. CARACTERÍSTICAS DE LOS USUARIOS

Se identificaron 6 usuarios que interactúan con el sistema, algunos permanentemente,
otros como el acudiente, lo realizan eventualmente.
Los usuarios son los siguientes:
USUARIO 1
Tipo de usuario Rector
Formación Doctorado y/o Maestría
Habilidades Ofimática, servicios web.
Actividades Consultar información de los proyectos institucionales, académicos etc.

USUARIO 2
Tipo de usuario Secretaria (o)
Formación Pregrado
Habilidades Ofimática, archivo.
Actividades Cargar información relevante del área. Realizar consultas.

USUARIO 3
Tipo de usuario Docentes
Formación Pregrado/Maestría
Habilidades Ofimática.
Actividades Calificar trabajos de estudiantes, almacenar notas, consultar notas.

USUARIO 4
Tipo de usuario Coordinador Académico
Formación Pregrado/Maestría
Habilidades Liderazgo, planeación y ofimática.
Actividades Supervisar, gestionar y consultar información acdémica.

USUARIO 5
Tipo de usuario Coordinador Administrativo y Financiero
Formación Pregrado/Maestría
Habilidades Liderazgo, planeación y ofimática.
Supervisar y gestionar los procesos de matrícula, contratación y
Actividades
finanzas.

USUARIO 6
Tipo de usuario Estudiante
Formación N/A
Habilidades Mínimas habilidades en informática y computación
Actividades Consultar notas

USUARIO 7
Tipo de usuario Acudiente
Formación N/A
Habilidades Mínimas habilidades en informática y computación
Cargar documentación
Realizar pagos
Actividades
Firmar digitalmente notas comportamentales
Consultar notas de estudiantes
 7

7. RESTRICCIONES
- Los servidores deberán tener la capacidad suficiente para atender

consultas concurrentes.

- El sistema debe diseñarse de una forma sencilla y sobria,

independientemente del lenguaje de programación implementado para

su desarrollo.

- Sistema es basado en cliente – servidor.

- El sistema contará con pasarela de pagos para las matrículas.

- Los reportes generados por el sistema serán en formato XLSX, CSV o

PDF.

- La aplicación móvil estará diseñada con Kotlin y XML.

8. SUPOSICIONES Y DEPENDENCIAS
El sistema está desarrollado para su funcionamiento y compatibilidad en dispositivos

con sistema operativo Android.

9. EVOLUCIÓN PREVISIBLE DEL SISTEMA

Recolectar información sobre feedback, sugerencias y comentarios de mejora de
usuarios para solucionar posibles errores y/o mejoras donde haya lugar

10. REQUISITOS FUNCIONALES

10.1. Requisito funcional 1

Número de requisito RF 1
Nombre de requisito Pre - registro de matrícula
Los usuarios (acudientes) podrán realizar un pre-registro de la
Característica
matrícula.
Fuente del requisito Coordinación administrativa y financiera
El sistema podrá recibir solicitudes de pre-registro de la matrícula
Descripción del requerimiento
de los estudiantes, por los acudientes.
Entrada Información personal del estudiante.
Proceso El sistema valida si es estudiante antiguo o nuevo.
 8

Salida Credenciales para iniciar sesión al sistema en rol de aspirante.

Prioridad del requisito ALTA

10.2. Requisito funcional 2

Número de requisito RF 2
Nombre de requisito Matrícula
Los acudientes podrán adjuntar la información solicitada por la
Característica
plataforma para continuar el proceso de matrícula.
Fuente del requisito Coordinación administrativa y financiera
El sistema identificará si el estudiante es nuevo o antiguo y así
mismo solicitara al acudiente adjuntar la documentación para
Descripción del requerimiento
realizar la matrícula. Allí validará la información y generará el
recibo de pago.
Entrada Documentos personales y académicos del aspirante.
Proceso Validación de los documentos.
Mensaje de resultado de la validación. Admitido para matrícula o
Salida
rechazo.
Prioridad del requisito ALTA

10.3. Requisito funcional 3

Número de requisito RF 3
Nombre de requisito Pago de matrícula
Característica Los acudientes podrán elegir la forma de pago más conveniente.
Fuente del requisito Coordinación administrativa y financiera
El sistema pondrá a disposición los medios de pago para la
Descripción del requerimiento
matrícula del aspirante.
Entrada Hacer clic en “pagar matrícula” y elegir la opción de preferencia.
Proceso Realizar la transacción.
Si es virtual el pago = Matrícula pagada.
Salida
Si eligió pagarla directamente en banco = Recibo de pago.
Prioridad del requisito ALTA

10.4. Requisito funcional 4

Número de requisito RF 4
Nombre de requisito Ingreso de notas
Los docentes podrán cargar las notas obtenidas de los
Característica
estudiantes.
Fuente del requisito Docentes.
El sistema tendrá la opción de cargar notas por estudiante
Descripción del requerimiento
matriculado según el curso asignado al docente.
Entrada Hacer clic en “Ingresar nota” y seleccionar la nota a asignar.
Proceso Guardar la nota para el estudiante asignado
Salida Nota registrada exitosamente.
Prioridad del requisito ALTA
 9

10.5. Requisito funcional 5

Número de requisito RF 5
Nombre de requisito Generación de boletines
El coordinador académico podrá generar los boletines de cada
Característica
estudiante por periodo académico.
Fuente del requisito Coordinador / Docente
Descripción del requerimiento El sistema tendrá la opción de generar los boletines de notas.
Entrada Seleccionar el curso y hacer clic en “generar boletín de notas”.
Generar un reporte de los boletines de los estudiantes del curso
Proceso
seleccionado.
Salida Boletines generados en formato PDF tamaño carta.
Prioridad del requisito ALTA

10.6. Requisito funcional 6

Número de requisito RF 6
Nombre de requisito Gestionar información
El usuario podrá organizar los módulos que requiera para la
Característica
organización de su documentación.
Fuente del requisito Secretaria / Coordinador
El sistema tendrá la opción de organizar documentos relevantes
Descripción del requerimiento
como proyectos institucionales, informes de gestión, etc.
Entrada Hacer clic en “crear”, “editar” o “eliminar”.
Proceso El sistema crea/edita/elimina un módulo.
Salida Módulo creado/editado/eliminado.
Prioridad del requisito ALTO

10.7. Requisito funcional 7

Número de requisito RF 7
Nombre de requisito Guardar documentación e información
Característica El usuario podrá almacenar
Fuente del requisito Secretario (a) de Rectoría / Coordinaciones / Docente / Acudiente
El sistema tendrá la opción de organizar documentos relevantes
Descripción del requerimiento como proyectos institucionales, obras civiles e informes de
gestión.
Entrada Seleccionar el archivo y hacer clic en “cargar”.
Proceso El archivo se carga desde el dispositivo hasta el servidor.
Salida Archivos cargados.
Prioridad del requisito ALTO

10.8. Requisito funcional 8

Número de requisito RF 8
Nombre de requisito Consultas
El usuario podrá realizar consultas y reportes generales de la
Característica
información almacenada.
Fuente del requisito Rectoría
 10

El sistema tendrá la opción de generar reportes utilizando filtros

Descripción del requerimiento como fecha, aprobados, reprobados, edad, curso, y cualquier otra
característica de la información almacenada.
Ingresar al módulo de reportes, seleccionar el área de
Entrada información deseada, configurar los filtros, y hacer clic en
“generar reporte”.
Organizar la información de acuerdo con los parámetros
Proceso
establecidos.
Salida Archivo en formato XLSX con el reporte.
Prioridad del requisito MEDIA

10.9. Requisito funcional 9

Número de requisito RF 9
Nombre de requisito Opción de registro
La opción de registro estará habilitada únicamente para
Característica estudiantes y/o acudientes en las fechas estipuladas durante la
matrícula.
Fuente del requisito Coordinación administrativa y financiera
Solamente se tendrá habilitado el botón de registro en las fechas
de matrícula, para estudiantes y acudientes. Las demás solicitudes
particulares de registro por fuera de la fecha de matrícula se
Descripción del requerimiento
realizarán presencialmente.
Los docentes y personal administrativo tendrán un registro de
manera interna.
Ingresar al login del sitio web, seleccionar el botón “Registro”,
Entrada
diligenciar el formulario, hacer clic en “Enviar”,
Proceso Registrar un nuevo estudiante y/o acudiente en la base de datos.
Salida Nuevo registro en la base de datos.
Prioridad del requisito ALTA
 11

11. REQUISITOS NO FUNCIONALES

11.1. Requisitos de rendimiento

o El tiempo de carga para los usuarios deberá ser menor de 3

segundos.

o El sistema deberá soportar el ingreso de hasta 1000 usuarios al

mismo tiempo.

11.2. Seguridad

o Los usuarios tendrán solo tendrán acceso al módulo del rol

asignado.

o El sistema tendrá autenticación en dos pasos para los roles de

Rectoría, coordinadores y docentes.

11.3. Fiabilidad
o La información como calificaciones, registros de estudiantes,

almacenamiento de documentos debe ser visible para todos los

usuarios que tengan los privilegios. Si un docente carga notas de

sus estudiantes, el coordinador académico desde su rol podrá

visualizarlas.

o Las horas de accesos de cada usuario será guardado para una

mejor trazabilidad.

11.4. Disponibilidad

o El sistema debe estar disponible todo el tiempo, 24/7.

 12

11.5. Mantenibilidad
o El sistema recibirá mantenimiento únicamente por el

personal TIC de la institución o un tercero previamente

autorizado por Rectoría.

o Semanalmente se realizará revisiones para analizare el

correcto funcionamiento del sistema.

11.6. Portabilidad

o El sistema se implementará con arquitectura responsive design para

que al momento de ser adaptado a dispositivos móviles no hallan

cambios.

o Se puede descargar desde Google Play Store.

 13

12. PROTOTIPOS

12.1. Interfaz - Inicio de sesión

 14

12.2. Interfaz - Acudiente

 15

12.3. Interfaz – Estudiante

 16

12.4. Interfaz – Docente

 17

12.5. Interfaz – Coordinador Académico

 18

12.6. Interfaz – Coordinador Administrativo y Financiero

 19

12.7. Interfaz – Secretario (a)

 20

12.8. Interfaz – Rector

 21

13. MAPAS DE NAVEGACIÓN

Los mapas de navegación son una representación gráfica del esquema o la estructura
que el usuario podrá acceder a través de los componentes de la aplicación.

Para la realización del mapa de navegación del sistema SIGAA, se seleccionó el modelo
jerárquico debido a la naturaleza de opciones que van desde lo general a lo especifico,
desplegando opciones específicas desde una opción raíz.

Imagen 2 Mapa de navegación general

En este mapa de navegación general, se observa la totalidad de usuarios que pueden

acceder por la aplicación móvil, con la particularidad que el único que accede a la opción
“Registro” es el acudiente.

Se observa la totalidad de opciones a las que cada usuario puede acceder de forma
preliminar.

A continuación, se mostrará el mapa de navegación individual por cada usuario:

 22

Imagen 3 Mapa de navegación - Rector

Imagen 4 Mapa de navegación – Secretario (a)

 23

Imagen 5 Mapa de navegación – Coordinador académico

Imagen 6 Mapa de navegación – Coordinador Administrativo y Financiero

 24

Imagen 7 Mapa de navegación – Docente

Imagen 8 Mapa de navegación – Estudiante

 25

Imagen 9 Mapa de navegación – Acudiente