En el primer apartado se expone la problemática existente relacionada con la anterior página web de la Escuela de Biodanza SRT Puembo - Quito, en base a ello se establecen los objetivos, alcances y marco teórico del proyecto. En la primera sección se presenta la problemática existente respecto al anterior sitio web de la Escuela de Biodanza SRT Puembo - Quito.
Objetivo general
Al día de hoy, Escuela de Biodanza SRT Puembo - Quito no cuenta con un sitio web actualizado, y al tener información desactualizada o incorrecta, los usuarios finales interesados abandonan la página y buscan el servicio en otros sitios similares que cumplan con los requisitos de búsqueda. El sitio web que actualmente utiliza la Escuela de Biodanza SRT Puembo - Quito es completamente informativo, no cuenta con una plataforma que le permita administrar o actualizar la información existente, esto reduce el alcance de los usuarios finales al no poder conocer datos específicos como. : no se puede ver horario de atención, fechas de nuevas sesiones de baile virtuales o presenciales, promociones e incluso el material grabado en cada sesión.
Objetivos específicos
Dentro de la experiencia del usuario, se pueden enfatizar conceptos clave como el caso de uso y las métricas [8]. Este rol lo representa María Susana Vela Vit, directora de la Escuela de Biodanza SRT Puembo - Quito, quien ha brindado todos los datos necesarios para llevar a cabo la creación de la página web. A continuación, en la TABLA III se presentan las herramientas utilizadas durante el desarrollo de este trabajo de Integración Curricular, definiendo cada una de estas herramientas necesarias para la codificación de la interfaz en el frontend.
Dentro de "Alpha0" tanto el personal administrativo como el usuario final pueden visualizar la información general de la Escuela de Biodanza SRT Puembo - Quito. Consumo de endpoints para gestionar información principal de la página informativa Cuando el usuario administrador inicia sesión con las credenciales correspondientes, tiene acceso al consumo de varios endpoints, lo que le permite cambiar la página informativa en cuanto al carrusel de imágenes y contactos. Asimismo, el usuario administrador consume el punto final para cerrar la sesión y, finalmente, para la recuperación de la contraseña, el usuario administrador debe completar un formulario proporcionando su dirección de correo electrónico, la nueva contraseña y la confirmación de la nueva contraseña que se creará.
Para la gestión de anuncios, el usuario administrador utiliza varios puntos finales para ver, modificar, eliminar y crear. Alpha0” cumple con el objetivo y alcance previamente definido, lo que hace que los usuarios finales conozcan los servicios de la Escuela Biodanza. El uso del método Scrum ha facilitado la organización del grupo de trabajo, conseguido el objetivo propuesto y ha permitido completar la fase de desarrollo en el tiempo estipulado.
En las diversas pruebas de desempeño del frontend se obtuvieron resultados favorables, comprobando el correcto funcionamiento del sitio web Alpha0.
Alcance
Marco Teórico
El front-end se comunica directamente con los usuarios finales y tiene el control de la experiencia del usuario; un desarrollador frontend trabaja esencialmente con tres lenguajes de programación los cuales son: HTML, CSS y JavaScript debido a que estos son lenguajes que se consideran como base para poder desarrollar y tener una buena práctica frontend [4]. Los beneficios de aplicar la usabilidad son lograr una mayor duración de las visitas, reducir la tasa de rebote, mayor comunicación, feedback con el usuario y aumento de las ventas a través de la web [10].
Metodología de Desarrollo
La historia de usuario consiste en dar una explicación más detallada de las diferentes necesidades del software, el propósito de crear historias de usuario es describir la funcionalidad desde la perspectiva del usuario [26]. Luego, la TABLA II da un ejemplo de las historias de usuarios del trabajo actual de Integración Curricular, además todas las historias de usuarios están incluidas en el ANEXO II - Manual Técnico, sección Historias de Usuarios.
Diseño de interfaces
El objetivo del Sprint Backlog es comprometerse con los sprints de acuerdo con una lista predeterminada que muestra el trabajo total en cada una de las iteraciones, pero también muestra el trabajo pendiente, en curso o completado de cada miembro del equipo [28]. El Sprint Backlog se detalla en el ANEXO II - Manual Técnico Sprint Backlog sección.
Diseño de la arquitectura
Es una herramienta que permite el consumo de servicios en aplicaciones externas [37], se utiliza en el proyecto de almacenamiento de datos "Alpha0". Es un framework que finalmente se utiliza para desarrollar interfaces de una forma más interactiva con el usuario, esta herramienta utiliza elementos HTML, CSS y JavaScript [38].
Sprint 0. Configuración del ambiente de desarrollo
Dentro del frontend, el perfil de administrador consume varios endpoints para administrar contenido multimedia, lo que permite eliminar, actualizar o agregar nueva música dentro de una sección de emociones, además de consumir endpoints para administrar videos de clases grabados y/o videos explicativos de bailes de biodanza. El administrador consume varios puntos finales de gestión de reservas donde puede crear, actualizar o ver nuevas reservas con restricciones en el número máximo de personas para un evento o si la sesión es virtual o presencial, esto solo es posible siempre que el usuario final ha registrado una solicitud para participar en un evento de biodanza desde la aplicación móvil.
Sprint 1. Página informativa – Autentificación
Una parte fundamental para asegurar que la tarea se ha completado con éxito son las pruebas unitarias. Este tipo de prueba verifica que una pieza específica de código funciona correctamente. Cypress es una herramienta que permite una ejecución más automatizada de pruebas unitarias, su implementación es sencilla debido a una sintaxis clara y fácil de entender, además de depurar el código desarrollado para cada componente.
Sprint 2. Gestión página informativa y Modificación de Perfil
La segunda sección que se muestra es contactos, en esta sección se utilizan varios puntos finales para eliminar, ver, cambiar y crear un nuevo contacto, para crear un nuevo contacto son necesarios los parámetros: nombre, apellido, correo electrónico, cargo y teléfono. 12 muestra el componente de contacto, mientras que el procedimiento completo se presenta en el ANEXO II - Manual técnico, sección sobre diseño de interfaz. Para cambiar el perfil personal, cada uno de los usuarios con perfil administrativo puede actualizar datos personales tales como: nombre, apellido, nombre de usuario, teléfono móvil, teléfono de casa, dirección y foto de perfil.
El funcionamiento más detallado se muestra en el ANEXO II – Manual Técnico, sección Diseño de Interfaz.
Sprint 3. Gestión Módulos Emoción - Multimedia - Eventos - Publicidad
En la figura 16 se muestra una prueba unitaria que se realizó para el uso de navegación de contenido multimedia, también en el ANEXO II - Manual Técnico, sección Diseño de Interfaz, se describe en detalle la funcionalidad completa. Un usuario con perfil de administrador utiliza múltiples endpoints para extraer, modificar y crear contenido multimedia, y para crear nuevo contenido multimedia se deben ingresar los datos requeridos, los datos son: tema, género, descripción, duración, imagen y sonido. . 18 mientras que todo el proceso de gestión de contenidos multimedia se presenta en el ANEXO II - Manual Técnico, sección Diseño de la interfaz.
Mientras que el proceso completo de gestión de eventos se presenta en el ANEXO II – Manual Técnico, sección de diseño de interfaz. Asimismo, el usuario administrador consume el punto final para poder ver todos los usuarios finales registrados en cada evento para realizar un seguimiento de las cuotas recibidas, como se muestra en la Fig. 29, se muestran las pruebas unitarias, el proceso completo se muestra en el ANEXO II – Manual Técnico, sección diseño de interfaz.
Sprint 4. Gestión Sugerencias - Usuarios
El usuario administrador puede ver una lista de todos los usuarios registrados en la aplicación móvil "Alpha0" mediante el uso de un punto final, se muestran los datos del usuario, que son: nombre, apellido, usuario, número de teléfono personal, número de teléfono de casa y dirección, el usuario administrador también puede deshabilitar la cuenta de un usuario final si ha incumplido reglas como registrarse en múltiples cursos de biodanza y no participar en ninguno o dejar comentarios ofensivos. El procedimiento de desactivación de la cuenta se realiza por un período de tiempo y se comunica mediante el envío de un correo electrónico al usuario final indicando por qué se ha desactivado su cuenta, todo este procedimiento se realiza consumiendo el endpoint en el backend. En la figura 31 se muestra este consumo, mientras que el procedimiento completo se adjunta en el ANEXO II – Manual Técnico, apartado diseño de interfaces.
Sprint 5. Ejecución de pruebas en el frontend
Seguir estas prácticas no es obligatorio, pero mejora la experiencia de usuario de Alpha0 y sobre todo muestra su desempeño. Es recomendable implementar un sistema de respaldo de la información y recuperación de datos que garantice la seguridad. Disponible: https://revistaempresarial.com/tecnologia/la-importancia-de-las-aplicaciones-web-y-moviles-en-el-exito-empresarial/.
Disponible: https://www.certus.edu.pe/blog/beneficios-plataformas-digitales/#Ventajas-de-las-plataformas-digitales. A continuación, se presentan todos los implementos que se utilizaron para desarrollar el front end, detallados a continuación:
Certificado de originalidad
Manual técnico
Para que el administrador pueda utilizar los distintos endpoints, debe iniciar sesión con las credenciales requeridas, además de llenar cada campo con las especificaciones descritas. El usuario administrador puede cambiar el perfil personal cuando inicia sesión, para cambiar el perfil se le presentará un formulario para los datos y el avatar. El usuario administrador es el responsable de realizar los cambios en la multimedia, para ello debe iniciar sesión y seleccionar específicamente en qué módulo de emoción desea realizar los cambios.
El usuario administrador es el responsable de modificar el módulo de emociones, para lo cual debe estar logueado. El administrador puede cambiar la publicidad después del registro y debe rellenar los campos correctamente para que los datos se guarden correctamente. Un usuario administrador debe iniciar sesión para ver todos los comentarios y eliminar los comentarios si son ofensivos.
El administrador puede habilitar o deshabilitar usuarios con la condición de que envíe un comentario a la dirección de correo electrónico del mencionado usuario, en el que indique el motivo del cambio de estado. Todos los módulos front-end se muestran a continuación, donde cada diseño diferente se muestra con el rol de administrador.
Manual de usuario
Manual de instalación
