Aplicación web para la reserva de salas y tiempo de trabajo

Al equipo de Desarrollo de Alto Nivel, simplemente GRACIAS por recibirme y hacerme sentir como uno más de la familia. A todas las personas que se han cruzado conmigo a lo largo de la carrera, ya que sería muy aburrido vivir estas aventuras solo.

Introducción al documento

Introducción a las tecnologías web

En este capítulo se presenta una idea de lo que el lector encontrará a lo largo de este TFG. En este TFG se demostrarán todas las ventajas de algunas de estas tecnologías web a través del desarrollo de una aplicación para la empresa ZENNIO.

Descripción de la empresa

Además de los proyectos comerciales, ZENNIO también cuenta con un amplio listado de proyectos internos de la compañía, como los desarrollados en este TFG. Una cualidad a destacar en esta empresa es el deseo de evolucionar y crecer, apostando siempre por las tecnologías más avanzadas que existen en el mercado actual.

Estructura del documento

Esta arquitectura se puede ver en el diagrama de casos de uso de la aplicación (ver Figura 5.1). La Figura 5.4 muestra el diagrama Entidad-Relación de la base de datos adquirida, que será implementada en la aplicación final.

Objetivos 5

Desarrollo de un módulo de comunicaciones entre la aplicación y la

Se implementará un módulo que realiza la comunicación entre la aplicación y la BD, permitiendo en el futuro realizar un cambio en la tecnología de implementación de la BD sin cambiar el código de la aplicación.

Desarrollo de un módulo de comunicaciones cliente-servidor

Desarrollo del cliente de la aplicación

Justificación

El backend es la parte de la aplicación cuyas funcionalidades se ejecutan en el servidor. Sequelize5 es el ORM que se utilizará en la implementación de la aplicación objetivo de este TFG.

Estado de la cuestión 7

Introducción a las reuniones de trabajo

Una reunión [6] consiste en agrupar a un grupo de personas en un lugar o canal común (si no todas las personas están en el mismo lugar), para discutir un tema específico. La convocatoria es el procedimiento mediante el cual se notifica su existencia a todos los participantes en una reunión.

Procedimiento de realización de una reunión en Z ENNIO

Este es el punto más importante de todo el procedimiento, ya que en él se basarán todas las decisiones que se tomen en la reunión. Luego de la reunión se elabora un documento llamado “acta de la reunión”, que contendrá todo el contenido que se discutió, las decisiones tomadas y las conclusiones.

Estudio de aplicaciones similares

GoToMeeting
Doodle
Joan
Google Calendar
Tabla comparativa de las aplicaciones estudiadas
Conclusiones del estudio de aplicaciones similares

En este apartado se realizará una comparativa entre las aplicaciones, analizando tanto el tipo de licencia necesaria para utilizarlas como la posibilidad o no de realizar determinadas funciones que se necesitan en la aplicación a desarrollar. en este TFG. En primer lugar, cabe señalar que ninguna de las aplicaciones estudiadas cumple plenamente con los requisitos que debería cumplir la aplicación que necesita ZENNIO.

Tecnologías

Node.js
Express.js
Angular

Paradigma visual[27], utilizado para crear modelos en la fase de diseño de la aplicación. En la Figura 5.3 se muestra cómo será la arquitectura de la aplicación, agrupando las tecnologías que se utilizarán en el lado del cliente (en adelante esta parte se llamará Frontend) y en el lado del servidor (en adelante esta parte se llamará Frontend). como backend). Para el desarrollo de aplicaciones se utilizará Visual Studio Code del Entorno de Desarrollo Integrado (IDE) [28] y para la gestión de BD, MySQL Workbench [21].

Si el usuario participa en la discusión, podrá ver sus detalles desde la vista que se muestra en la Figura 5.29. El primer paso que debe realizar el usuario al crear una discusión es seleccionar los participantes de la discusión. Si el usuario es el propietario de la reserva (Figura A.41), verá toda la información desplegada, además de los iconos de 'ver detalles de la reserva' (icono de ojo), y 'editar reserva' (cuadro con lápiz) ... .

Método de trabajo 21

Características de Modelo de Proceso de Ingeniería de la Usabilidad y Ac-

Fases de trabajo

La particularidad de esta metodología se encuentra en la forma de definir el diseño del sistema; En primer lugar se definirá cuál será la interfaz, y a partir de esa decisión se modelará el sistema hasta alcanzar el nivel más bajo, condicionando todas las partes siguientes a ser diseñadas por la primera. Prototipado: Esta fase estará ligada a las tres fases descritas anteriormente, y será decisiva para obtener un buen resultado final en el sistema a desarrollar. A la hora de evaluar los prototipos o el sistema final se utilizarán técnicas para obtener información importante de los usuarios o evaluadores, que será de gran ayuda en el caso de que sea necesario cambiar aspectos del diseño si no son viables.

Medios utilizados

Medios hardware
Medios software

Si hace clic en la pestaña "Resumen" en el menú de navegación del formulario de reserva, la aplicación mostrará una vista como se muestra en la Figura 5.27.

Resultados 29

Análisis de la situación actual

Antes de iniciar el desarrollo del proyecto, es necesario estudiar y analizar la situación de ZENNIO en el momento de su entrada a la empresa. ZENNIO cuenta con herramientas web desarrolladas por su departamento interno de aplicaciones, y las utilizan a diario para llevar la gestión de aspectos importantes de la empresa, como gestión de personal, gestión de proyectos, gestión de inventarios, entre otras tareas. Estas herramientas han contribuido en gran medida al crecimiento de la empresa en los últimos años y se han convertido en una parte central de la vida diaria de empleados y directivos.

Identificación del problema

Identificación de los usuarios finales de la aplicación

Requisitos del sistema

La aplicación incluirá un listado de usuarios ordenados por su área dentro de la empresa. RF_1.3 Selección de día La aplicación le permitirá seleccionar un día en un calendario mensual. RF_2.1 Lista de Reservas La aplicación permitirá mostrar al usuario una lista de reservas en las que aparecen.

Diagrama de casos de uso de la aplicación

Diseño

Diseño del sistema
Diseño de la base de datos
Diseño de la interfaz
Candidatos seleccionados para el diseño final

En la parte superior de la tabla están los campos que le permiten filtrar la información de la tabla. Vista de inicio: Candidato 1 (Figura 5.5), que expande los elementos en la parte superior para llenar todo el ancho de la página. Además, se agregará una parte central donde se ubican los enlaces y archivos adjuntos, moviéndolos así desde el lado izquierdo.

Implementación

Estructuración del backend
Implementación del Object-Relational mapping ( ORM )
Estructuración del frontend
Implementación de la Interfaz de Programación de Aplicaciones ( API )
Implementación de la API para Protocolo de Transferencia de Hiper-

Un archivo de entorno es aquel que almacena todas las variables globales que pueden cambiar según el entorno de ejecución en el que reside la aplicación. Socket.io7 es una biblioteca de sockets web que se utilizará en el desarrollo de la capa de comunicación en tiempo real de la aplicación objetivo de este TFG. Descarga de archivos almacenados en el servidor: Cuando el usuario quiere descargar un archivo que está adjunto a una reserva, envía una solicitud al servidor con el nombre del recurso al que desea acceder y la reserva en la que se encuentra.

Aplicación desarrollada

Vista de inicio
Vista de creación/edición de reserva
Meta-información de reservas
Vista de detalles de la reserva
Vista de mis reservas

Lo primero que verá el usuario al pulsar en “nueva reserva” será lo que muestra la Figura 5.17. La aplicación le permite seleccionar un intervalo de tiempo para una habitación específica (ver Figura 5.20). Información de la reserva”, que será la dirección, tipo de reserva, contenido, nota privada, ubicación en el caso de elegir sala virtual, campos de archivos adjuntos y enlaces.

Pruebas realizadas

Desde la vista 'Detalles de la reserva', haga clic en el botón 'EDITAR' en el pie de página (Figura A.38). Desde la vista 'mis reservas', haz clic en el icono de 'papelera' en el campo 'ACCIONES' (Figura A.37). Desde la vista 'Detalles de la reserva', haga clic en el botón 'ELIMINAR' en el pie de página (Figura A.38).

Conclusiones 69

Mejoras futuras

Durante el desarrollo de este TFG a través del acuerdo FORTE surgieron nuevas ideas que se materializarán en un futuro como nuevas funcionalidades de la aplicación desarrollada. Esta plantilla almacenaría a los participantes y sus roles, así como toda la información de la reunión (título, contenido y tipo de reunión). Estas plantillas se pueden cargar fácilmente desde el iniciador en algún lugar de la vista de creación de reservas o de la vista de inicio de la aplicación.

Opinión personal

La selección que se ha realizado quedará marcada en verde en la tabla de habitaciones (Figura A.14). Inmediatamente después de que se muestre el mensaje mostrado en la Figura A.32, el usuario será redirigido a la vista de detalles de la reserva (Figura A.33). Desde la vista 'mis reservas', pulsando sobre el icono 'papel' situado en el menú 'ACCIONES' de cada registro de la tabla (Figura A.37).

Alta de reserva

Selección de participantes, fechas, horas y salas
Formulario de datos de la reserva
Resumen de la reserva
Posibles problemas al crear reserva
Confirmación de reserva

Una vez realizada la selección, se activará el botón 'AÑADIR SELECCIÓN', lo que permitirá al usuario guardar la selección en la lista justo encima del botón (Figura A.12). Una vez cumplimentados los datos obligatorios (Figura A.18), y tras realizar correctamente el paso anterior, se activará el botón 'CONFIRMAR RESERVA' para que se pueda completar la reserva (Figura A.19). El error mostrado en la Figura A.27 indica al usuario que otro usuario ha reservado un slot que el usuario que realizó la reserva ha guardado.

Gestión de Mis Reservas

Modificar reserva

Una vez dentro de la reserva de edición se abrirá una vista similar a “creando reserva”, solo que se cargarán todos los datos contenidos en la reserva a editar (Figura A.39). Editar una reserva implica seguir las mismas pautas que se encuentran en la función REGISTRO DE RESERVA. Una vez modificados los datos que así lo requieren, si se muestra el mensaje de la Figura A.40, la reserva se habrá modificado sin error.

Eliminar reserva/registro de datos de la reserva

Previsualización de reserva

Ver detalles de reserva

Adjuntar/eliminar acta de reunión

Capacidad para comprender el entorno de una organización y sus necesidades en tecnologías de la información y las comunicaciones. Uno de los objetivos de este proyecto era conocer desde dentro cómo funciona ZENNIO y ver qué necesidades tienen en el día a día, principalmente relacionadas con las tecnologías de la información y la comunicación. Capacidad para utilizar metodologías orientadas al usuario y a la organización para el desarrollo, evaluación y gestión de aplicaciones y sistemas basados en tecnologías de la información que aseguren la accesibilidad, ergonomía y usabilidad de los sistemas.