Plataforma de autoservicio 7bytes Kadyha Paz Gutierrez Informe de prácticas para optar por título de Ingeniero de sistemas Asesor interno Roberto Flórez Rueda Asesor externo Eduardo Enrique Morales Martinez Universidad de Antioquia Facultad de ingeniería, UdeA Ingeniería de sistemas Medellín, Antioquia, Colombia 2022 Cita Paz Gutierrez [1] Referencia Estilo IEEE (2020) [1] K. Paz Gutierrez, “Plataforma de autoservicio 7bytes”, Semestre de industria, Ingeniería de Sistemas, Universidad de Antioquia, Medellín, Antioquia, Colombia, 2022. Centro de Documentación Ingeniería (CENDOI) Repositorio Institucional: http://bibliotecadigital.udea.edu.co Universidad de Antioquia - www.udea.edu.co Rector: John Jairo Arboleda Céspedes Decano/Director: Jesús Francisco Vargas Bonilla Jefe departamento: Diego José Luis Botía Valderrama El contenido de esta obra corresponde al derecho de expresión de los autores y no compromete el pensamiento institucional de la Universidad de Antioquia ni desata su responsabilidad frente a terceros. Los autores asumen la responsabilidad por los derechos de autor y conexos. Agradecimientos Agradecimiento especial al profesor Roberto Flórez Rueda, asesor interno y a OCXCI S.A.S y todos sus integrantes, especialmente a Eduardo Enrique Morales Martinez, quien figura como asesor interno. Tabla de contenido RESUMEN 7 ABSTRACT 8 I. INTRODUCCIÓN 9 II. OBJETIVOS 10 III. MARCO TEÓRICO 11 IV. METODOLOGÍA 12 V. RESULTADOS 13 VI. ANÁLISIS 18 VII. CONCLUSIONES 19 REFERENCIAS 20 LISTA DE FIGURAS Fig. 1. Boceto plataforma de autoservicios, sección para agregar preguntas 13 Fig. 2. Comparación entre una pregunta al crearla y al ser vista por un usuario 14 Fig. 3. Ejemplo de encuesta de 7Bytes 14 Fig. 4. Esquema inicial de base de datos 15 Fig. 5. Nueva página principal de 7bytes 16 Fig. 6. Página post encuesta 16 Fig. 7. Plataforma de autoservicios, sección para agregar preguntas 17 Fig. 8. Login para la plataforma 17 SIGLAS, ACRÓNIMOS Y ABREVIATURAS GCP Google Cloud Computing CRUD Create, Read, Update, Delete UdeA Universidad de Antioquia Plataforma de autoservicio 7bytes 7 RESUMEN 7Bytes es un producto digital que permite la realización de encuestas dinámicas a los usuarios mediante diferentes canales de comunicación y con un grado alto de personalización. El proceso de implementación requiere de un conjunto de configuraciones donde hay un gran recurso humano involucrado para dar el producto final a los clientes de acuerdo a sus especificaciones, de ahí nació la idea de tener una plataforma de autoservicio 7Bytes. En este documento se ilustra el proceso seguido para realizar la plataforma de autoservicios, donde los clientes podrán realizar las operaciones del CRUD sobre las encuestas y visualizar un dashboard con información útil extraída de las respuestas de los usuarios. La plataforma se realizó con éxito cumpliendo con el planteamiento inicial, desde una sección para agregar y editar preguntas, permitir visualizar el dashboard e incluso un login para restringir el acceso, sin embargo, se presentan algunos inconvenientes que afectan el rendimiento, especialmente por la cantidad de datos que se deben procesar y algunas herramientas usadas. La solución podría ser usar herramientas basadas en R o Python, ya que estos lenguajes facilitan el procesamiento de datos, haciéndolo de forma eficiente y contienen múltiples librerías que permiten realizar todo tipo de gráficas para extraer información. Palabras clave — encuestas, 7Bytes, software, autoservicio, metodología ágil. Plataforma de autoservicio 7bytes 8 ABSTRACT 7Bytes is a digital product that allows users to carry out dynamic surveys through different communication channels and with a high degree of customization. The implementation process requires a set of configurations where a large human resource is involved to provide the final product to customers according to their specifications, therefore the idea of ​​having a 7Bytes self-service platform was born. In this document the process followed to create the self-service platform is illustrated, where customers can perform CRUD operations on surveys and view a dashboard with useful information extracted from user responses. The platform was carried out successfully, complying with the initial approach, from a section to add and edit questions, to allow the visualization of the dashboard and even a login to control access, however, there are some drawbacks that reduce performance, especially due to the amount of data to be processed and some of the tools used. The solution could be to use tools based on R or Python, since these languages ​​facilitate data processing by doing it efficiently and contain multiple libraries that allow drawing all kinds of graphs to extract information. Keywords — surveys, 7Bytes, software, self-service, agile methodology. Plataforma de autoservicio 7bytes 9 I. INTRODUCCIÓN Este documento fue desarrollado con el fin de ilustrar el proceso seguido durante el desarrollo de la práctica, la cual consiste en crear un sistema de autoservicio para los clientes de la empresa 7bytes, donde podrán realizar las operaciones del CRUD sobre las encuestas y visualizar un dashboard con información obtenida de las respuestas de los usuarios. Para lograrlo se elaboró un proceso de planeación, desarrollo, pruebas y finalmente despliegue. Se detallan algunas dificultades que en general tienen que ver con el rendimiento, lo que impide realizar el último paso de la metodología planteada, ya que esto afecta en gran medida la experiencia de usuario, por lo que se propone migrar a otras herramientas y mejorar la plataforma antes de exponerla al público general. Plataforma de autoservicio 7bytes 10 II. OBJETIVOS A. Objetivo general Desarrollar plataforma web de autoservicio para clientes de 7Bytes. B. Objetivos específicos ● Analizar los requerimientos e información existente del proyecto. ● Crear esquema inicial y genérico de la plataforma que permita orientar a todo el equipo implicado en su desarrollo. ● Organizar esquema de base de datos involucradas para dar origen a las funciones de la plataforma web. ● Desarrollar los módulos y funcionalidades de la plataforma web Realizar pruebas funcionales para identificar correcciones necesarias. ● Documentar el proceso realizado durante el desarrollo de la plataforma web. ● Aplicar técnicas de seguridad de la información, con el fin de crear una plataforma con estándares apropiados de seguridad. Plataforma de autoservicio 7bytes 11 III. MARCO TEÓRICO Como marco teórico se usan principalmente algunos cursos de coursera que se ven complementados con un curso en youtube. A. HTML, CSS, and Javascript for Web Developers, ofrecido por la universidad Johns Hopkins. [1] En este curso se da una introducción al desarrollo de páginas web modernas con HTML y CSS, además se aborda también el lenguaje Javascript y aplicaciones web asíncronas utilizando Ajax para exponer la funcionalidad y los datos del lado del servidor al usuario final. B. PostgreSQL for Everybody, ofrecido por la universidad de Michigan. [2] En este curso se habla sobre el diseño histórico de bases de datos y el uso de SQL en el entorno PostgreSQL. También se abarcan algunos comandos comunes (INSERT INTO, WHERE, ORDER BY, ON DELETE CASCADE, etc.) que permiten crear tablas, tipos de columnas y definir el esquema de datos en PostgreSQL. Por último se da una explicación sobre el modelado de datos y cómo representar relaciones de uno a muchos y de muchos a muchos en PostgreSQL. C. Developing Applications with Google Cloud, ofrecido por Google Cloud. [3] Se presentan conceptos y terminología importantes para trabajar con Google Cloud. A través de videos y laboratorios prácticos, este curso ilustra y compara muchos de los servicios informáticos, de almacenamiento de Google Cloud y herramientas de administración de políticas y recursos. Entre otras cosas se puede identificar el propósito y valor de los productos y servicios de google, como las opciones de almacenamiento e implementación de aplicaciones. D. Curso React, ofrecido por Mircha. [4] Se presenta la herramienta reactjs, su sintaxis, componentes, propiedades, formas de uso, conexión con otras herramientas y muchos ejemplos que aportan al aprendizaje de React. Plataforma de autoservicio 7bytes 12 IV. METODOLOGÍA Para realizar el proyecto se usa una metodología en cuatro pasos los cuales son: Planeación, desarrollo, pruebas y despliegue. A. Planeación Entender el objetivo de la plataforma web y plantear la planeación mediante metodología ágil scrum con el apoyo de la plataforma web de organización de tareas Asana. B. Desarrollo Etapa donde se Ponen en marcha las actividades definidas para lograr obtener la funcionalidad de la plataforma, en esta etapa se revisan los avances con reuniones llamadas dailys cada 2 días a lo largo de la semana de 10 minutos y una reunión una vez a la semana de 1 hora para discutir detalles como obstáculos o dificultades que se pueden presentar en el desarrollo de las actividades. C. Pruebas En esta fase se hacen pruebas funcionales a la plataforma con todo el equipo de apoyo. D. Despliegue Se pone en producción el producto desarrollado para los clientes de 7Bytes, en esta etapa se realiza un monitoreo de las funciones y se obtiene retroalimentación de los usuarios. Plataforma de autoservicio 7bytes 13 V. RESULTADOS Como paso inicial se realizaron los cursos presentados en el marco teórico, los cuales sirvieron como base para avanzar al siguiente proceso, el cual fue realizar una plantilla de la plataforma que se pretende crear, la cual puede ser usada como una guía del resultado esperado. Para lograrlo se realizó una reunión en la cual fue definido que se quería contar con una página en la que los usuarios pudieran agregar sus propias preguntas a los formularios y otra en la cual se pudieran visualizar los resultados, estas ideas pueden cambiar durante el desarrollo del proyecto, sin embargo se realizó la página a modo de boceto o guia. A continuación se puede ver el diseño general de la página (Fig. 1) y una comparación entre la apariencia de las preguntas al momento de crearlas y la forma en que será vista por los usuarios (Fig. 2). Fig. 1. Boceto plataforma de autoservicios, sección para agregar preguntas Plataforma de autoservicio 7bytes 14 Fig. 2. Comparación entre una pregunta al crearla y al ser vista por un usuario Los usuarios de los clientes de 7Bytes sólo tienen acceso al área en que se responden las encuestas (Fig. 3), que es el producto principal de 7Bytes, mientras que los clientes tendrán acceso a la nueva plataforma mediante un login. Fig. 3. Ejemplo de encuesta de 7Bytes Adicionalmente la empresa ya cuenta con una plataforma que permite visualizar las gráficas, sin embargo se desea crear otro entorno que facilite el acceso a estas para el usuario, por lo que en el desarrollo final se contaría además con este otro entorno como otra de las páginas a las que podrán acceder los clientes en la plataforma de autoservicio. Plataforma de autoservicio 7bytes 15 Al mismo tiempo en el equipo de trabajo se realizó un esquema inicial de base de datos (Fig. 4). Fig. 4. Esquema inicial de base de datos Seguidamente se desarrollaron algunas APIs, con el propósito de realizar las operaciones del CRUD sobre las encuestas y preguntas, estas APIs fueron probadas en postman y sobre una base de datos de pruebas antes de ser puestas en producción. Después de realizar los pasos anteriores se desarrolló un dashboard en datastudio usando como base otro dashboard hecho en power BI. Este dashboard podrá ser visualizado por los usuarios que se encuentren registrados en la plataforma de autoservicio y contendrá un análisis completo sobre las respuestas de las encuestas. Una de las mayores dificultades que se encontró en este punto fue la enorme cantidad de datos, ya que esto limita fuertemente la capacidad de datastudio, haciendo que el proceso de consulta sea muy lento, para solucionarlo se propone realizar un nuevo dashboard, usando otro tipo de herramienta, con lenguajes especializados como R o python, los cuales permiten manejar estos grandes volúmenes de datos con mayor velocidad. Otro cambio importante que se realizó fue actualizar la plataforma web de la empresa, la cual existía en wordpress y con otro dominio. Esta última fue usada como base para actualizar la página del dominio principal con el fin de usar google adsense próximamente, además se cuenta con páginas de contacto, quienes somos y política de datos. Los resultados pueden visualizarse en todo tipo de pantallas (Fig. 5). Plataforma de autoservicio 7bytes 16 Fig. 5. Nueva página principal de 7bytes Otro cambio realizado fue en la página post encuesta (Fig. 6), la cual se adapta según el cliente, mostrando un video y un formulario, o una evaluación con estrellas. Fig. 6. Página post encuesta Plataforma de autoservicio 7bytes 17 Como siguiente paso se desarrolló la plataforma para realizar las operaciones del CRUD sobre los formularios (Fig. 7), además del login que permitirá ingresar solamente a los usuarios registrados (Fig. 8). Como trabajo futuro se desea mejorar la funcionalidad de la plataforma de autoservicio agregando más opciones y características, además de probar otras herramientas para crear el dashboard, que puedan cubrir las necesidades de la empresa ofreciendo una mayor capacidad y tiempo de respuesta. Fig. 7. Plataforma de autoservicios, sección para agregar preguntas Fig. 8. Login para la plataforma Plataforma de autoservicio 7bytes 18 VI. ANÁLISIS Durante el desarrollo del proyecto y la plataforma de autoservicio se presentaron todo tipo de problemas y muchos aprendizajes que no se esperaban inicialmente, relacionados con las herramientas elegidas o el plan de acción, algunos problemas están relacionados con el rendimiento, lo que los hace de vital importancia. Por lo que se deben corregir en un futuro cercano. En el caso del dashboard de datastudio, se encontró que la herramienta presenta muchas limitaciones cuando se trata de una base de datos con mucha información. La solución podría ser usar herramientas basadas en R o Python, ya que estos lenguajes facilitan el procesamiento de datos, haciéndolo de forma eficiente y contienen múltiples librerías que permiten realizar todo tipo de gráficas para extraer información. Plataforma de autoservicio 7bytes 19 VII. CONCLUSIONES A grandes rasgos se cumplieron todos los objetivos propuestos, realizar un plan inicial facilitó mucho el proceso y sirvió para orientar el trabajo realizado. Este proyecto fue una oportunidad para conocer multiples herramientas y aplicar conocimientos adquiridos en la universidad, encontrando algunas diferencias entre la teoría y la práctica, generando grandes aprendizajes durante el proceso. En general se concluye que un correcto análisis de requisitos y una serie de pasos predefinidos facilita enormemente el proceso de construcción del software, de no ser así pueden surgir problemas inesperados o se pueden desarrollar herramientas innecesarias. Informar a tiempo los problemas y contar con un equipo dispuesto a ayudar también facilita mucho el proceso de aprendizaje y un buen resultado para cualquier proyecto. Plataforma de autoservicio 7bytes 20 REFERENCIAS [1] Johns Hopkins University, “HTML, CSS, and Javascript for Web Developers” Coursera. 2022. Disponible en: https://bit.ly/3yGsLcE [2] University of Michigan, “PostgreSQL for Everybody” Coursera. 2022. Disponible en: https://bit.ly/3nAqM3p [3] Google Cloud, “Developing Applications with Google Cloud” Coursera. 2022. Disponible en: https://bit.ly/3umwARy [4] J. Mircha, “Curso React.js” Youtube. 2021. Disponible en: https://bit.ly/3aen24p https://bit.ly/3yGsLcE https://bit.ly/3nAqM3p https://bit.ly/3umwARy https://bit.ly/3aen24p