DOCENTE DE LA CARRERA DE TECNOLOGÍA SUPERIOR EN DESARROLLO DE SOFTWARE DEL INSTITUTO SUPERIOR TECNOLÓGICO PRIMERO DE MAYO.

(1)

“DESARROLLO E IMPLEMENTACIÓN DE UNA APLICACIÓN WEB PARA LA ADMINISTRACIÓN DE PAGOS DE AGUA DEL

BARRIO EL ZARZA - CANTÓN YANTZAZA”

LÍNEA DE INVESTIGACIÓN:

ADAPTACIÓN TECNOLÓGICA E INNOVACIÓN

SUB-LÍNEA DE INVESTIGACIÓN SISTEMAS DE INFORMACIÓN

CARRERA:

TECNOLOGÍA SUPERIOR EN DESARROLLO DE SOFTWARE

AUTOR:

ALEJANDRO CAMACHO LIDIA MARITZA

DIRECTOR:

ING. YANDRY RAMÍREZ

FECHA:

13 de agosto de 2021

YANTZAZA - ZAMORA CHINCHIPE – ECUADOR 2021

Proyecto de Tesis previo a la obtención del título de Tecnóloga Superior en Desarrollo de Software

¡Forjando un mejor Futuro!

(2)

II

CERTIFICACIÓN

Ing. Yandry Ramírez Saritama.

DOCENTE DE LA CARRERA DE TECNOLOGÍA SUPERIOR EN DESARROLLO DE SOFTWARE DEL INSTITUTO SUPERIOR TECNOLÓGICO PRIMERO DE MAYO.

CERTIFICA:

Haber asesorado y revisado detenida y minuciosamente durante todo su desarrollo, el Proyecto de Fin de Carrera titulado: “DESARROLLO E IMPLEMENTACIÓN DE UNA APLICACIÓN WEB PARA LA ADMINISTRACIÓN DE PAGOS DE AGUA DEL BARRIO EL ZARZA - CANTÓN YANTZAZA”. Realizado por la postulante Alejandro Camacho Lidia Maritza.

Por lo tanto, autorizo proseguir los trámites legales pertinentes para su presentación y defensa.

Yantzaza 13 de Agosto de 2021

………

Ing. Yandry Ramírez Saritama.

DIRECTOR

(3)

III

MIEMBROS DEL TRIBUNAL

………

Ing. Nelly Cueva Reategui Presidente Del Tribunal

………

Ing. Diego Jhonatan Chamba Saca Miembro Del Tribunal

………

Ing. Diego Vicente Guamán Jima Miembro Del Tribunal

(4)

IV

AUTORÍA

El presente trabajo de investigación titulado: “DESARROLLO E IMPLEMENTACION DE UNA APLICACIÓN WEB PARA LA ADMINISTRACIÓN DE PAGOS DE AGUA DEL BARRIO EL ZARZA – CANTÓN YANTZAZA”. Es absolutamente original, autentico y personal, en tal virtud el contenido, efectos legales y académicos que se desprenden del mismo son de exclusiva responsabilidad del autor.

………

Lidia Maritza Alejandro Camacho C.I: 1900768522

(5)

V

SESIÓN DE DERECHOS

Yo, LIDIA MARITZA ALEJANDRO CAMACHO, con cedula de ciudadanía Nº 1900768522, en calidad de autor del trabajo de grado denominado

“DESARROLLO E IMPLEMENTACIÓN DE UNA APLICACIÓN WEB PARA LA ADMINISTRACIÓN DE PAGOS DE AGUA DEL BARRIO EL ZARZA – CANTÓN YANTZAZA”, trabajo de investigación elaborado para optar por el título de Tecnóloga Superior en Desarrollo de Software, manifiesto mi voluntad de ceder todos mis derechos al Instituto Superior Tecnológico “Primero de Mayo” para que este haga uso de la investigación de forma libre y sin ninguna consecuencia legal, en pro al desarrollo de la institución y de la sociedad.

Quedando el Instituto facultado para ejercer plenamente los derechos cedidos.

………

Lidia Maritza Alejandro Camacho C.I: 1900768522

(6)

VI

DEDICATORIA

Este trabajo de investigación va dedicado a todas las personas que confiaron en mí en especial a mi madre y padre quienes me han dado apoyo motivacional en este proceso de formación académica, a mis hermanos, amigos e ingenieros de carrera los cuales con su conocimiento impartido en el aula y adicional fuera de las clases han hecho posible que se pueda culminar con una meta más y a Dios por darme la vida para que yo pudiera ser posible este sueño que como cualquier otro aunque tuvo obstáculos se los pudo sobrellevar.

Lidia Maritza Alejandro Camacho

(7)

VII

AGRADECIMIENTO

En primer lugar, a Dios por darme la vida y llenarla de muchas bendiciones.

A mis padres, familiares y amigos, por todo su amor, comprensión y apoyo incondicional.

A mis ingenieros de carrera, quienes contribuyeron a este proceso de formación académica y que supieron brindar todo su conocimiento para ello.

A mi director de tesis, Ing. Yandry Ramírez, quien con sus consejos supo guiar y motivar durante todo el desarrollo del trabajo de investigación.

A la Junta Directiva de Agua del Barrio El Zarza, la cual abrió sus puertas e hizo posible la elaboración de este trabajo de investigación.

Lidia Maritza Alejandro Camacho

(8)

VIII

ÍNDICE DE CONTENIDOS

CERTIFICACIÓN………...II MIEMBROS DEL TRIBUNAL ……...……….III AUTORÍA ... IV SESIÓN DE DERECHOS ... V DEDICATORIA ... VI AGRADECIMIENTO ... VII ÍNDICE DE CONTENIDOS ... VIII ÍNDICE DE TABLAS ... X

ÍNDICE DE FIGURAS ... 11

1. TÍTULO ... 13

2. RESUMEN ... 14

3. INTRODUCCIÓN ... 17

4. REVISIÓN DE LITERATURA ... 18

4.1 LENGUAJE UNIFICADO DE MODELADO (UML)... 18

4.1.1 Enterprise Architect ... 18

4.2 LENGUAJES DE PROGRAMACIÓN... 18

4.2.1 Python ... 19

4.3 BASES DE DATOS ... 20

4.3.1 PostgreSQL... 20

4.4 HTML ... 21

4.5 CSS... 22

4.6 BOOTSTRAP ... 23

4.7 DJANGO ... 23

4.8 SERVIDOR ... 25

4.8.1 Nginx ... 25

4.9 HOSTING ... 26

4.9.1 Hostinger ... 28

4.10 DOMINIO ... 29

5. MATERIALES Y MÉTODOS ... 31

5.1 MATERIALES ... 31

(9)

IX

5.2 MÉTODOS ... 32

5.2.1 Método Inductivo ... 32

5.2.2 Método Deductivo ... 33

5.2.3 Método Descriptivo... 33

5.3 TÉCNICAS ... 33

5.3.1 Entrevista y encuesta ... 33

5.3.2 Observación Directa ... 33

5.4 METODOLOGÍA ICONIX ... 33

6. RESULTADOS ... 36

6.1.1 Identificación de actores ... 42

6.1.2 Requerimientos Funcionales ... 42

6.1.3 Requerimientos No Funcionales... 44

6.1.4 Identificación de Casos de Uso ... 44

6.1.5 Diagrama de Casos de Uso ... 46

6.1.6 Modelo de dominio ... 47

6.1.7 Prototipado de pantalla y descripción de casos de uso ... 47

6.1.8 Modelo de clases ... 70

7. CONCLUSIONES ... 79

8. RECOMENDACIONES ... 80

9. BIBLIOGRAFÍA ... 81

GLOSARIO ... 83

ANEXOS ... 84

(10)

X

ÍNDICE DE TABLAS

Tabla 1. Tabla comparativa de lenguajes de programación... 20

Tabla 2. Tabla comparativa de las bases de datos. ... 21

Tabla 3. Tabla comparativa de los servidores web ... 26

Tabla 4. Tabla comparativa de los hostings... 29

Tabla 5. Tabla de recursos humanos ... 32

Tabla 6. Tabla de recursos hardware ... 32

Tabla 7. Tabla de recursos software ... 32

Tabla 8. Tabla de recursos materiales... 33

Tabla 9. Tabla de recursos varios ... 33

Tabla 10. Tabla de recursos totales ... 33

Tabla 11. Identificación de autores. ... 43

Tabla 12. Tabla de requerimientos funcionales. ... 44

Tabla 13. Tabla de requerimientos no funcionales. ... 45

Tabla 14. Tabla de identificación de casos de uso. ... 45

Tabla 15. Descripción de caso de uso: Ingresar al Sistema. ... 49

Tabla 16. Descripción de caso de uso: Gestionar Usuarios... 53

Tabla 17. Descripción de caso de uso: Gestionar Tesoreros. ... 57

Tabla 18. Descripción de caso de uso: Administrar Pagos de Agua. ... 61

Tabla 19. Descripción de caso de uso: Administrar Servicios de Agua. ... 65

Tabla 20. Descripción de caso de uso: Consultar Información. ... 69

Tabla 21. Requerimientos cubiertos por la aplicación. ... 78

(11)

XI

ÍNDICE DE FIGURAS

Figura 1. Resumen de la Encuesta – Pregunta 1. ... 36

Figura 11. Elaboración de diagramas y pantallas en Enterprise Architect ... 45

Figura 12. Modelo de casos de uso ... 46

Figura 13. Modelo de dominio.. ... 47

Figura 14. Ingreso al sistema.. ... 47

Figura 15. Diagrama de secuencia: Ingresar al Sistema – Curso Normal ... 49

Figura 16. Diagrama de secuencia: Ingresar al Sistema – Curso Alterno .... 49

Figura 17. Curso Normal de Eventos: Ingresar al Sistema ... 50

Figura 18. Curso Alterno de Eventos: Ingresar al Sistema ... 50

Figura 19. Gestionar Usuarios ... 51

Figura 20. Diagrama de secuencia: Gestionar Usuarios – Curso Normal .... 53

Figura 21. Diagrama de secuencia: Gestionar Usuarios – Curso Alterno .... 54

Figura 22. Curso Normal de Eventos: Gestionar Usuarios ... 54

Figura 23. Curso Alterno de Eventos: Gestionar Usuarios. ... 55

Figura 24. Gestionar Tesoreros. ... 55

Figura 25. Diagrama de secuencia: Gestionar Tesoreros – Curso Normal. . 57

Figura 26. Diagrama de secuencia: Gestionar Tesoreros – Curso Alterno. . 57

Figura 27. Curso normal de eventos: Gestionar Tesoreros ... 58

Figura 28. Curso alterno de eventos: Gestionar Tesoreros ... 58

Figura 29. Administrar Pagos de Agua. ... 59

Figura 30. Diagrama de secuencia: Administrar Pagos de Agua C.N. ... 61

Figura 31. Diagrama de secuencia: Administrar Pagos de Agua C.A. ... 61

Figura 32. Curso normal de eventos: Administrar Pagos de Agua ... 62

(12)

XII

Figura 33. Curso alterno de eventos: Administrar Pagos de Agua ... 62

Figura 34. Administrar Servicios de Agua ... 63

Figura 35. Diagrama de secuencia: Administrar Servicios de Agua C.N ... 65

Figura 36. Diagrama de secuencia: Administrar Servicios de Agua C.A ... 66

Figura 37. Curso normal de eventos: Administrar Servicios de Agua ... 66

Figura 38. Curso alterno de eventos: Administrar Servicios de Agua. ... 67

Figura 39. Consultar Información ... 67

Figura 40. Diagrama de secuencia: Consultar Información C.N ... 69

Figura 41. Curso normal de eventos: Consultar Información ... 69

Figura 42. Modelo de Clases ... 70

Figura 43. Editor de Visual Studio Code ... 71

Figura 44. Añadiendo las clases del modelo de dominio a models.py. ... 72

Figura 45. Configurando el archivo views.py. ... 72

Figura 46. Configurando el template de login. ... 73

Figura 47. Mostrando el login de la aplicación ... 74

Figura 48. Mostrando la lista de usuarios ... 74

Figura 49. Mostrando la lista de tesoreros ... 75

Figura 50. Mostrando la lista de los pagos de agua. ... 75

Figura 51. Mostrando la lista de los servicios de agua de los usuarios ... 76

Figura 52. Mostrando la lista de pagos de agua del usuario logueado ... 76

Figura 53. Prueba de carga de inisiar sesión ... 77

Figura 54. Prueba de carga de crear usuario ... 77

(13)

13

1. TÍTULO

“DESARROLLO E IMPLEMENTACIÓN DE UNA APLICACIÓN

WEB PARA LA ADMINISTRACIÓN DE PAGOS DE AGUA DEL

BARRIO EL ZARZA - CANTÓN YANTZAZA”

(14)

14

2. RESUMEN

El presente proyecto de tesis consiste en desarrollar e implementar una aplicación web para la Junta Directiva de Agua del Barrio El Zarza- Cantón Yantzaza, permitiendo el asesoramiento de los pagos de agua a sus usuarios que ingresan al sistema para verificar sus pagos de agua y a su vez que el tesorero pueda enviarles o imprimirles el recibo de agua, registrar servicios de agua como también el crearles las respectivas cuentas de usuario para que puedan acceder al sistema, resolviendo asi necesidades de los usuarios y de la Junta Directiva ayudando a optimizar su trabajo y tiempo.

El software a más de ser una aplicación web de fácil manejo y optimizar los procesos que se llevaban en la Junta Directiva de Agua del Barrio El Zarza, está haciendo que se reduzca el uso de papel en los recibos que se les entregaban a los usuarios, un punto clave e importante de los sistemas que se están desarrollando en la actualidad por los distintos programadores que toman en cuenta este factor. El afán de hacer de este mundo un lugar más tecnológico para la sociedad hace que día por día sigan apareciendo nuevas tecnologías cada vez más mejores que otras.

Razón por la cual para la realización de la tesis es necesario apoyarse en una metodología para guiarse de mejor manera en la construcción del software.

ICONIX que se encuentra entre RUP (Rational Unified Process) y XP (eXtreme Programming), ofrece un uso dinámico del UML sin tener que hacer uso de todos los diagramas UML podemos diseñar el software que servirá como base para la programación. Las herramientas tecnológicas utilizadas en el desarrollo son: Enterprise Architect para el modelado, Bootstrap para el FrontEnd, Postgres para la base de datos, Nginx para el servidor, Hostinger para el hosting, Python como lenguaje de programación y Django como Framework.

Palabras Clave:

aplicación web, software, tecnologías, metodología, herramientas tecnológicas.

(15)

15 ABSTRACT

This thesis project consists of developing and implementing a web application for the “Junta Directiva del Agua” of Barrio El Zarza - Canton Yantzaza, allowing the advice of water payments to users who enter the system to verify their water payments and in turn that the treasurer can send or print the water bill, register water services as well as creating the respective user accounts so they can access the system, thus solving the needs of users and the Board of Directors helping to optimize their work and time.

The software, in addition to being an easy to use web application and optimize the processes that were carried in the “Junta Directiva de Agua” of El Zarza, is reducing the use of paper in the receipts that were given to users, a key and important point of the systems that are being developed today by the various programmers who take into account this factor. The eagerness to make this world a more technological place for the society makes that day by day new technologies keep appearing, each time better than others.

Reason for which for the realization of the thesis it is necessary to rely on a methodology to be guided in a better way in the construction of the software.

ICONIX, which is between RUP (Rational Unified Process) and XP (eXtreme Programming), offers a dynamic use of the UML without having to make use of all the UML diagrams we can design the software that will serve as a basis for programming. The technological tools used in the development are:

Enterprise Architect for modeling, Bootstrap for the FrontEnd, Postgres for the database, Nginx for the server, Hostinger for hosting, Python as programming language and Django as Framework.

Keywords:

web application, software, technologies, methodology, technological tools.

(16)

16

Jimmi Fabricio Celi Díaz

LICENCIADO EN CIENCIAS DE LA EDUCACIÓN MENCIÓN IDIOMA INGLÉS

Registro Profesional SENESCYT N°: 1008-20216-1695863

CERTIFICA

Que, en la ciudad de Yantzaza, a los 24 días del mes de agosto del dos mil veintiuno, se ha procedido a realizar la revisión del documento RESUMEN, perteneciente a la señorita, LIDIA MARITZA ALEJANDRO CAMACHO, con número de cedula: 1900768522. Documento que consta de 320 palabras en español y 300 palabras en idioma ingles y que está traducido en su integridad, manteniendo el mismo mensaje de su originalidad en español.

Es todo lo que puedo certificar en honor a la verdad.

Yantzaza 27 de agosto del 2021

……….

Lic. Jimmi Fabricio Celi Díaz LICENCIADO EN IDIOMA INGLÉS

Cedula: 1104797715

(17)

17

3. INTRODUCCIÓN

En el presente proyecto de investigación de la carrera Tecnología Superior en Desarrollo de Software, se puso en práctica los conocimientos adquiridos en el transcurso de la formación académica para lo cual se desarrolló e implementó un proyecto construido con las tecnologías de Python con su framework Django para luego alojarlo en un VPS contratado y a la vez mostrar la app web con su dominio respectivo.

Para muchos desarrolladores de software que están en proceso de aprendizaje, es importante conocer las distintas tecnologías que se pueden usar para el desarrollo de una app ya sea web o móvil y sobre todo el llevarlo a modo producción para lo cual es necesario conocer los distintos servidores VPS que nos ofrecen alojamientos web y dominios en donde estará funcionando la app una vez que se realice la respectiva compra y configuración del mismo.

También es importante trabajar de la mano con una metodología que permita llevar los procesos de forma organizada durante todo el desarrollo del software, que se adapte a las necesidades del sistema y que sea apto para el desarrollo de proyectos a corto, mediano o largo plazo. ICONIX al ser una metodología de corto – mediano plazo es ideal para el desarrollo del presente proyecto al contar con 4 fases que nos permite llevar todo el desarrollo de la aplicación, estructurando de una forma clara y ordenada.

Siendo así que en la revisión de literatura se dará a conocer los siguientes temas: lenguaje de programación Python, framework Django, Enterprise Architect, base de datos PostgreSQL, HTML, CSS, Bootstrap, Servidor Nginx, Hosting Hostinger y el dominio. Todo esto con la finalidad de conocer más a fondo las tecnologías con las que se puede desarrollar una app web, como poner en modo producción a dicha aplicación y que se encuentre accesible por medio de un dominio.

(18)

18

4. REVISIÓN DE LITERATURA

4.1 LENGUAJE UNIFICADO DE MODELADO (UML)

UML es un estandar internacional adoptado por muchas organizaciones y empresas para la creación de diagramas, gráficos y documentos relacionados con el desarrollo de software (programas informáticos). (Krall, 2019) refiere a esto como una herramienta propia de personas que tienen conocimientos relativamente avanzados de programación y es frecuentemente usada por analistas funcionales y analistas programadores. Por lo tanto, si estas realizando las primeras etapas de la programación, es recomendable que te olvides de UML hasta que tenga un conocimiento mínimo de las condiciones, los bucles y como utilizar sus conocimientos de programación, pero eso no quiere decir que no lo pueda usar cualquiera ya que UML también se lo puede usar para crear diagramas y documentos para procesos que no están relacionados con la computadora.

4.1.1 Enterprise Architect

Es una plataforma colaborativa de modelado, diseño y gestión basada en UML 2.5 y estándares relacionados. (Sparx Systems, 2021) refiere a Enterprise Architect como ágil, intuitiva y extensible, con poderosas características para dominios específicos totalmente integradas a una fracción del costo de muchos competidores. Una solución para toda la empresa que permite visualizar, analizar, modelar, probar y mantener un amplio rango de sistemas, software, procesos y arquitecturas. Por lo tanto, Enterprise Architect es un conjunto de herramientas escalable y basado en estándares, herramienta que puede usar para su próximo proyecto de desarrollo.

4.2 LENGUAJES DE PROGRAMACIÓN

Un lenguaje de programación es un lenguaje formal que permite a los programadores escribir un conjunto de secuencias, acciones continuas, datos y algoritmos a través de un conjunto de instrucciones para escribir programas que controlan el comportamiento físico y la lógica de una máquina. (Rock Content, 2019) refiere a esto como un conjunto de símbolos y códigos usados para orientar la programación de estructuras en el desarrollo web. Por lo tanto,

(19)

19 este lenguaje permite a programadores y máquinas comunicarse y determinar con precisión aspectos como: ¿Con qué datos trabaja un software en particular?, ¿Cómo almacena o envía esos datos? y si el software realiza las acciones en una variedad de situaciones.

Tabla 1.Tabla comparativa de lenguajes de programación

TABLA COMPARATIVA DE LENGUAJES DE PROGRAMACIÓN

Lenguajes de programación

Registros: 16 Nro. De Tabla: 1

Detalles Java Python JavaScript Utilizado

para crear

 Aplicaciones Android, páginas web grandes

 Frameworks

 Scripting

 Aplicaciones web

 Páginas web dinámicas

Ventajas  Máquina virtual de Java

 Robusto

 Seguro

 Multihilo de alto rendimiento

 Fácil de leer

 Fácil de aprender

 Velocidad

 Simplicidad

 Versatilidad

 Carga del servidor

Desventajas  Reglas estrictas reducen flexibilidad

 Utiliza más memoria que C++

 Más lento que los demás

 El mal uso de identación puede causar problemas ocasionales

 Seguridad

 Confianza en el usuario

Total de datos: 16 Nota: Elaboración Propia

El lenguaje de programación que se va a usar será Python.

4.2.1 Python

Python es un lenguaje de programación interpretado y su filosofía enfatiza la legibilidad del código. (Belido, 2021) refiere a esto como un lenguaje de programación de alto nivel que consiste en una sintaxis muy sencilla de comprender. Además, su lenguaje es dinámico, multiplataforma, libre y de código abierto y es orientado a objetos por lo que es ideal para desarrollar aplicaciones web. Python se ha convertido en uno de los lenguajes de origen usado por programadores que se enseñan en escuelas y universidades de todo el mundo. Entre otras de sus características está el automatizar procesos y realizar tareas en entornos de cliente-servidor.

(20)

20

4.3 BASES DE DATOS

Una base de datos es una colección organizada de información o datos estructurados, generalmente almacenados en forma electrónica en un sistema informático. (Peiró R. , 2021) menciona que una base de datos hace referencia al conjunto de datos o informaciones determinadas que se pueden consultar de manera ágil, y segmentando las características que se quieran destacar para concretar más la información que se pretende revisar.

En la que nos da un ejemplo, que si tenemos una clínica veterinaria tendremos una base de datos de todos los clientes, en la que se pueden incluir campos como el nombre del animal, su historia médica, su número de teléfono, calendario de vacunación y datos de gran relevancia. De tal forma que cuando se quiera consultar cualquier aspecto concreto, se podrá seleccionar el campo y obtener una información inmediata sobre ello. Es por eso que cuando se habla de bases de datos en el contexto de las computadoras, debe tenerse en cuenta que la información es un programa o archivo electrónico organizado y estructurado en un dominio particular útil para el usuario.

Tabla 2. Tabla comparativa de las bases de datos.

TABLA COMPARATIVA DE BASES DE DATOS

Bases de Datos

Características MySQL PostgreSQL SQL Server

Grandes capacidades de memoria X X

Es orientado a objetos X X X

Funcionan en diferentes plataformas X Permite restaurar nuestra base de

datos a cualquier punto en el tiempo

X Permite trabajar en modo cliente-

servidor

X

Tiene texto de largo ilimitado X

Tiene licencia gratis X X

Total de datos: 32 Nota: Elaboración Propia.

La Base de Datos a usarse en este proyecto de tesis es PostgreSQL.

4.3.1 PostgreSQL

PostgreSQL es un sistema gestor de bases de datos relacional y orientado a objetos. (Borges, 2019) menciona que PostgreSQL es un sistema de código abierto de administración de base de datos del tipo relacional, aunque también

(21)

21 es posible ejecutar consultas que sean no relacionales. En este sistema, las consultas relacionales se basan en SQL, mientras que las no relacionales hacen uso de JSON.

(reicek, 2015) hace referencia a que Michael Stonebraker inicio el proyecto bajo el nombre Post Ingres a mediados de los 80’s con la idea de solucionar problemas existentes en las bases de datos en esa época. MySQL fue por mucho tiempo el motor más popular; pero hoy es propiedad de Oracle y esto limita su evolución.

También nos dice que en Postgres no se requiere usar bloqueos de lectura al realizar una transacción lo que nos brinda una mayor escalabilidad, aporta mucha flexibilidad a nuestros proyectos ya que nos permite definir funciones personalizadas por medio de varios lenguajes (pgSQL, Tcl, Perl, Python, PHP, Ruby, Java) y está disponible para muchas plataformas.

Deduciendo lo antes mencionado por los autores, PostgreSQL es actualmente reconocido como uno de los sistemas de gestión de bases de datos relacionales más potentes del mercado al ser de fácil acceso, multiplataforma y que se puede utilizar con casi cualquier sistema operativo actualmente que este en uso sin afectar el rendimiento.

4.4 HTML

HTML es considerado un estandar web oficial por W3C (Consorcio World Wide Web). (B., 2021) hace mención que el lenguaje de marcado de hipertexto (HTML) es un lenguaje informático que forma parte de la mayoría de las páginas web y aplicaciones en línea. Un hipertexto es un texto que se utiliza para enlazar con otros textos, mientras que un lenguaje de marcado es una serie de marcas que indican a los servidores web la estructura y el estilo de un documento.

El HTML no es considerado un lenguaje de programación, ya que no puede crear funcionalidades dinámicas. En su lugar, con HTML, los usuarios web pueden crear y estructurar secciones, párrafos y enlaces mediante elementos, etiquetas y atributos.

Estos son algunos de los usos más comunes de HTML:

(22)

22

Desarrollo web: Los desarrolladores utilizan el código HTML para diseñar la forma en que un navegador muestra los elementos de la página web, como el texto, los hipervínculos y los archivos multimedia.

Navegación por Internet: Los visitantes pueden navegar fácilmente y seguir enlaces entre páginas y sitios web relacionados, ya que el HTML se utiliza en gran medida para incrustar hipervínculos.

Documentación web: HTML permite organizar y dar formato a los documentos, de forma similar a Microsoft Word.

Por lo tanto, HTML es el lenguaje de marcado líder en Internet. Cada página HTML tiene un conjunto de elementos que crean la estructura del contenido de una página web o aplicación. También es un lenguaje muy popular para principiantes y se usa principalmente en sitios web estáticos, para que HTML funcione mejor es necesario combinar CSS para el estilo y JavaScript para la funcionalidad.

4.5 CSS

Hojas de estilo en cascada (CSS), simplemente aplica estilos (colores, formas, márgenes, etc.) a uno o más documentos HTML o páginas webs el cual se basa en un concepto muy poderoso que es el de recolectar. (Manz) menciona que se le denomina estilos en cascada porque se aplican de arriba a abajo (siguiendo un patrón denominado herencia) y en el caso de existir ambigüedad, se siguen una serie de normas para resolverla.

La idea de CSS es la de utilizar el concepto de separación de presentación y contenido, intentando que los documentos HTML incluyan sólo información y datos, relativos al significado de la información a transmitir (el contenido), y todos los aspectos relacionados con el estilo (diseño, colores, formas, etc.) se encuentren en un documento CSS independiente (la presentación).

De esta forma, se puede unificar todo lo relativo al diseño visual en un solo documento CSS, y con ello, varias ventajas:

 Si necesitamos hacer modificaciones visuales lo hacemos en un sólo lugar.

No necesitamos editar todo el HTML en cuestión por separado.

(23)

23

 Se reduce la duplicación de estilos en diferentes lugares, por lo que es más fácil de organizar y hacer cambios. Además, al final la información a transmitir es considerablemente menor (las páginas se descargan más rápido).

 Es más fácil crear versiones diferentes de presentación para otros tipos de dispositivos: tablets, smartphones o dispositivos móviles, etc.

Por lo tanto, las páginas web son en realidad documentos de texto. Este documento describe el código HTML para crear contenido web. Por otro lado, está el código CSS que se lo puede usar con código HTML para proporcionar la forma, el color, la posición de la página, entre otras características visuales.

4.6 BOOTSTRAP

Bootstrap es un conjunto de herramientas de código abierto para el desarrollo web receptivo utilizando HTML, CSS y JavaScript. (ARIMETRICS) menciona que Bootstrap es un framework CSS de código abierto que favorece el desarrollo web de un modo más sencillo y rápido. Incluye plantillas de diseño basadas en HTML y CSS con la que es posible modificar tipografías, formularios, botones, tablas, navegaciones, menús desplegables, etc.

También existe la posibilidad de utilizar extensiones de Javascript adicionales.

Nos da a conocer que fue desarrollado inicialmente por Twitter en 2011 y que este permite crear interfaces de usuario limpias y compatibles con todo tipo de dispositivos. Entre las ventajas que tiene Bootstrap es que favorece el design responsive, el cual se utiliza para mejorar la experiencia de los usuarios en el sitio web y en consecuencia el posicionamiento.

Entonces se puede decir que Bootstrap es una de las mejores herramientas que se puede utilizar para diseñar su sitio web. Por supuesto, siempre puede crear todo desde cero, pero Bootstrap puede ahorrarle mucho tiempo en algunas tareas (experiencia) y tiene una excelente comunidad que le da mantenimiento.

4.7 DJANGO

Cada lenguaje de programación tiene un framework determinado. Para Python, es las utilizado para desarrollo web es Django que se diseñó

(24)

24

originalmente para desarrollar sitios web de noticias, aunque también se lo puede usar para crear aplicaciones web con un peso considerable en lo que a posterior requiera añadir extensiones o modificaciones en su código.

(Camino Bueno, 2018) menciona que Django es un framework web diseñado para realizar aplicaciones de cualquier complejidad en unos tiempos muy razonables. Está escrito en Python y tiene una comunidad muy amplia, que está en continuo crecimiento.

Los motivos principales para usar Django son:

Es muy rápido: Si tenéis una startup, tenéis prisa por terminar vuestro proyecto o, simplemente, queréis reducir costes, con Django podéis construir una aplicación muy buena en poco tiempo.

Viene bien cargado: Cualquier cosa que necesitéis realizar, ya estará implementada, sólo hay que adaptarla a vuestras necesidades. Ya sea porque hay módulos de la comunidad, por cualquier paquete Python que encontréis o las propias aplicaciones que Django trae, que son muy útiles.

Es bastante seguro: Podemos estar tranquilos con Django, ya que implementa por defecto algunas medidas de seguridad, las más clásicas, para que no haya SQL Injection, no haya Cross site request forgery (CSRF) o no haya Clickjacking por JavaScript. Django se encarga de manejar todo esto de una manera realmente sencilla.

Es muy escalable: Podemos pasar desde muy poco a una aplicación enorme perfectamente, una aplicación que sea modular, que funcione rápido y sea estable.

Es increíblemente versátil: Es cierto que en un principio Django comienza siendo un Framework para almacenar noticias por sitios de prensa, blogs y este estilo de webs, pero con el tiempo ha ganado tanta popularidad que se puede usar para el propósito que queráis.

Por consiguiente, Django es uno de los frameworks de Python más populares y ofrece grandes beneficios a los desarrolladores que desean usarlo. Los frameworks son solo recursos para construir aplicaciones y deben usarse de acuerdo a las necesidades de cada proyecto.

(25)

25 4.8 SERVIDOR

Un servidor es un dispositivo virtual que almacena datos en una página web y proporciona el espacio y la estructura para administrar la página. (de Souza, 2019) menciona que un servidor web (server) es un ordenador de gran potencia que se encarga de “prestar el servicio” de transmitir la información pedida por sus clientes (otros ordenadores, dispositivos móviles, impresoras, personas, etc.)

Los servidores web (web server) son un componente de los servidores que tienen como principal función almacenar, en web hosting, todos los archivos propios de una página web (imágenes, textos, videos, etc.) y transmitirlos a los usuarios a través de los navegadores mediante el protocolo HTTP (Hipertext Transfer Protocol). La comunicación entre un servidor y sus clientes se basa en HTTP, es decir, en el protocolo de transferencia de hipertexto o en su variante codificada HTTPS.

Los servidores web le permiten no solo publicar su sitio web en Internet, sino también entregar contenido a sus lectores. Saber cuál es mejor para ti y tus lectores es fundamental para que el host que elijas realice su función correctamente.

Tabla 3. Tabla comparativa de los servidores web

TABLA COMPARATIVA DE SERVIDORES WEB

Servidores Web

Características GlassFish Apache Nginx

Tiene código abierto X X X

Fácil configuración X X X

Multiplataforma X X X

Es gratuito X X X

Es de alto rendimiento X X

Seguridad X X X

El servidor web a usarse en el proyecto es Nginx.

4.8.1 Nginx

Es un servidor web de código abierto y se ha utilizado como proxy inverso, caché HTTP y equilibrador de carga desde su primer éxito como servidor web.

(26)

26

(Kinsta Inc., 2021) menciona que Nginx está diseñado para ofrecer un bajo uso de memoria y alta concurrencia. En lugar de crear nuevos procesos para cada solicitud web, Nginx usa un enfoque asincrónico basado en eventos donde las solicitudes se manejan en un solo hilo.

Con Nginx, un proceso maestro puede controlar múltiples procesos de trabajo.

El proceso maestro mantiene los procesos de trabajo, y son estos lo que hacen el procesamiento real.

Algunas características comunes que se ven en Nginx incluyen:

 Proxy inverso con caché

 IPv6

 Balanceo de carga

 Soporte FastCGI con almacenamiento en caché

 Websockets

 Manejo de archivos estáticos, archivos de índice y auto indexación

 TLS / SSL con SIN

NGINX es un servidor web que funciona como proxy de correo, proxy inverso y equilibrador de carga. La arquitectura del software es asincrónica y controlada por eventos. Esto le permite manejar múltiples solicitudes al mismo tiempo. NGINX es altamente escalable, lo que quiere decir que los servicios de NGINX aumentan a la par con el tráfico de clientes.

4.9 HOSTING

El alojamiento web es el espacio donde se almacena un sitio web para que cualquiera pueda explorarlo en Internet. (Ruben, 2021) menciona que hosting web se refiere al «espacio» donde se mantiene un sitio web, es decir, que un hosting sirve para alojar una web y que todo el mundo pueda verla en Internet a través del dominio que tenga.

De esta forma, cualquiera que meta el dominio en su navegador, podrá ver la web que hay alojada en su hosting. El hosting es en verdad el uso que se hace de todos o parte de los recursos de un servidor web (memoria, espacio del disco duro, ancho de banda, etc.).

(27)

27 Hosting compartido o shared hosting

Éste es el tipo de hosting más común por ser uno de los más económicos.

La clave está precisamente en que varios hostings comparten el mismo servidor físico, esto quiere decir que comparten el procesador del servidor, la memoria, su disco duro, etc.

Hosting dedicado o servidor dedicado

Este tipo de hosting es de los más caros que hay porque suele usarse para sitios web con muchas visitas u otras aplicaciones empresariales que necesitan mucha potencia.

La clave de los servidores dedicados está precisamente en que todos los recursos de 1 servidor físico se le asignan única y exclusivamente a 1 hosting.

VPS o Servidor Virtual Privado

El hosting VPS es de los más usados cuando se busca un alojamiento web más potente que el hosting compartido y más barato que el servidor dedicado.

La clave está precisamente en que no se contrata un servidor físico sino 1 servidor virtual que se crea específicamente para 1 hosting con los recursos que se le hayan asignado (procesadores, memoria RAM, disco duro, etc.) del servidor físico.

Cloud hosting o hosting en la nube

Éste es el hosting más avanzado y que suele usarse para aplicaciones muy potentes y sitios web con muchísimas visitas. Más que de un producto se trata de contratar un servicio de hosting (como cuando contratas la luz, el agua o el gas en tu casa), ya que no se centra tanto en los servidores físicos sino en los recursos que necesite el hosting en cada momento.

La clave está en que el hosting usa una red de servidores físicos conectados entre sí (puede ser incluso desde sitios distintos de todo el mundo) que se

(28)

28

comportan como si fueran un súper-ordenador muy potente con recursos ilimitados.

Si vas a contratar un hosting es recomendable que solo contrates lo que vas a usar para tu aplicación o página web dependiendo de tus necesidades.

Tabla 4. Tabla comparativa de los hostings.

TABLA COMPARATIVA DE HOSTINGS

Hostings

Características Hostinger HostGator SiteGround

Migración del sitio web

Gratis Gratis No incluido

Almacenamiento SSD

100 GB 75 GB 10 GB

Copia de seguridad Diaria Semanal Diaria

Ancho de banda Ilimitado Ilimitado 10 000 visitas/mes

Creador de sitios Gratis Gratis Gratis

Certificados SSL Gratis Gratis Gratis

Dominio Gratis Gratis No incluido

Total de datos: 32 Nota: Elaboración Propia

El hosting en el que va a estar alojado el proyecto será Hostinger.

4.9.1 Hostinger

(TecnoGeekPro, 2019) menciona que Hostinger es una empresa de alojamiento web que se inició en 2004. En su sitio web, Hostinger se compromete a proporcionar un servicio de alojamiento web fácil de usar, fácil de desarrollar y fiable que garantiza características de primera clase y alta seguridad.

El compromiso con estos ideales en la teoría y en la práctica hace que el proveedor sea un proveedor de hosting de 4,5 estrellas.

Hostinger tiene cuatro servicios principales de alojamiento de sitios web:

alojamiento web compartido donde muchos sitios web residen en un servidor web, alojamiento de Servidores Privados Virtuales (VPS) que dedica recursos específicos del servidor a una cuenta de alojamiento, registro de dominios y certificados SSL (Secure Socket Layer).

(29)

29 Los certificados SSL son pequeños archivos de datos que enlazan digitalmente una clave criptográfica única a la información de una organización en un servidor.

Constructor de sitios web y nombre de dominio gratuitos de Hostinger Cuando usted selecciona los servicios de hosting de Hostinger, viene con un constructor de sitios web y un nombre de dominio gratuitos. El constructor de sitios web facilita la creación de un sitio web de alto valor sin necesidad de contratar a un desarrollador web.

Soporte al cliente multilingüe

En esta revisión de alojamiento web de hosting, me di cuenta de que una de las cosas que ha contribuido a su rápido crecimiento, tanto a nivel local como internacional, es su impresionante apoyo al cliente.

El hecho de que su servicio de atención al cliente sea multilingüe significa que incluso los clientes de fuera de los EE.UU. pueden disfrutar de los servicios de la empresa mientras hablan su lengua materna.

Respaldo Diario – Ups

Una de las características notables del plan de alojamiento de negocios es la copia de seguridad diaria. Esta es una característica muy importante que tiene como objetivo mantener su sitio web actualizado. Incluso si olvida hacer una copia de seguridad del sitio web, puede estar seguro de que no se perderá ningún detalle sobre las operaciones recientes.

Para saber si Hostinger es la opción correcta para su aplicación web o página web, es importante considerar sus necesidades individuales de alojamiento y asegurarse de que su empresa le brinde un buen servicio.

4.10 DOMINIO

Los dominios se utilizan para acceder a sitios web sin tener que recordar la dirección IP donde se encuentra la información del servidor. (©1999-2021 Webempresa, s.f.) menciona que un dominio web es el nombre único que recibe un sitio web en internet. Este nombre identifica a una página web

(30)

30

concreta sin que puedan existir dos o más sitios web que compartan el mismo nombre de dominio.

En el caso de Webempresa, el dominio web sería webempresa.com.

Un dominio web está compuesto por dos partes. La primera parte denominada nombre de dominio es el nombre que queremos dar a nuestro sitio web, la segunda parte denominada extensión de dominio hace referencia a una ubicación geográfica como .es (España), .mx (México), etc., o a un tipo web en concreto como .org (organizaciones), .net (tecnológicas).

 Nombre de dominio: Webempresa

 Extensión de dominio: .com

Los subdominios son dominios que creamos a partir de un dominio propio.

En el caso de webempresa.com un subdominio sería guias.webempresa.com.

Este tipo de dominios son especialmente útiles para realizar pruebas o en el caso de tener un dominio genérico como el .com para la web global, y después varios subdominios para las webs territoriales como es.dominio.com, uk.dominio.com, de.dominio.com, etc.

Importante que tu sitio web tenga un dominio fácil de recordar para que asi las personas recuerden el dominio de tu sitio web y logren acceder al mismo.

(31)

31

5. MATERIALES Y MÉTODOS

5.1 MATERIALES

Tabla 5. Tabla de recursos humanos

RECURSOS HUMANOS

Registros:12 Nro. De Tabla: 5

Nombre Cargo Función N° Horas P. Unitario P. Total

Lidia Alejandro Autor Desarrolladora del proyecto de

tesis

204 $10,00 $2.040,00

Ing. Yandry Ramírez

Director Supervisar el avance y desarrollo del proyecto de tesis

36 $10,00 $360,00

Subtotal: $2.400,00 Total de datos: 12 Nota: Elaboración Propia.

Tabla 6. Tabla de recursos hardware

RECURSOS HARDWARE

Cantidad Descripción P. Unitario P. Total

1 Laptop Dell Inspiron $548,00 $548,00

1 Impresora EPSON $495,00 $495,00

Subtotal: $1.043,00 Total de datos: 8 Nota: Elaboración Propia.

Tabla 7. Tabla de recursos software

RECURSOS SOFTWARE

Descripción Precio Unitario Precio Total

Python $0,00 $0,00

Enterprise Architec $0,00 $0,00

Hostinger $2,89 $17,34

Nginx $0,00 $0,00

Postgres $0,00 $0,00

Visual Code $0,00 $0,00

Django $0,00 $0,00

Windows $250,00 $250,00

Office $120,00 $120,00

Subtotal: $387,34 Total de datos: 27 Nota: Elaboración Propia

(32)

32

Tabla 8. Tabla de recursos materiales

RECURSOS MATERIALES

1 Resmas de papel

A4

$3,50 $3,50

4 Cartucho de

Impresión

$4,00 $16,00

Tabla 9. Tabla de recursos varios

RECURSOS VARIOS

6 meses Internet $25,00 $150,00

Tabla 10. Tabla de recursos totales

RECURSOS TOTALES

Descripción Precio Total

Recursos Humanos $2.040,00

Recursos Hardware $1.043,00

Recursos Software $387,34

Recursos Materiales $19,50

Recursos Varios $150,00

Total: $3.639,84 Total de datos: 10 Nota: Elaboración Propia

5.2 MÉTODOS

5.2.1 Método Inductivo

Se aplicará este método para conocer cómo se lleva la administración de los pagos de agua de la Junta Directiva. También permitirá conocer las personas involucradas en este proceso.

(33)

33 5.2.2 Método Deductivo

A través de este método se podrá conocer la tecnología y sus aspectos comunes en función al desarrollo del sistema, las actividades necesarias para modificar las aplicaciones y los datos obtenidos, y asi establecer una documentación correcta para el análisis de requisitos y la validación de la aplicación web.

5.2.3 Método Descriptivo

Por medio de este método se podrá describir paso a paso el desarrollo del trabajo de investigación de fin de carrera, usando algunas técnicas de recolección de datos que evidencien las necesidades y la problemática de la Junta Directiva para lo cual se realizará encuestas, entrevista y la observación directa.

5.3 TÉCNICAS

Para obtener los requerimientos del sistema web se recolectará información mediante las siguientes técnicas:

5.3.1 Entrevista y encuesta

Por medio de esta técnica se realizará una serie de preguntas con la finalidad de conocer la opinión de las personas que hacen uso del servicio que ofrece la Junta Directiva y a su vez conocer el proceso que realiza el encargado de registrar los pagos de agua de los usuarios. Todo esto para establecer los requerimientos funcionales de la aplicación.

5.3.2 Observación Directa

Con esta técnica se podrá observar de cerca y conocer los elementos y/o procesos que se llevan a cabo en la Junta Directiva para administrar los pagos de agua de los usuarios.

5.4 METODOLOGÍA ICONIX

Iconix es un proceso simplificado en comparación con otras metodologías tradicionales, unifica un conjunto de métodos de orientación a objetos con el

(34)

34

objetivo de abarcar todo ciclo de vida de un proyecto. Es una metodología pesada – ligera de Desarrollo del Software.

En este tipo de metodología podemos encontrar cuatro fases:

Fase 1: Análisis de Requisitos: se analizará todos los requisitos que formarán parte del sistema y así poder construir el diagrama de clases, que representan las agrupaciones funcionales que estructuran el sistema en desarrollo. Para esta fase utilizaremos tres herramientas:

 Modelo de Dominio: para identificar objetos y cosas del mundo real que intervienen en nuestro sistema.

 Modelo de casos de uso: en donde vamos a describir las acciones que un usuario realiza dentro del sistema, aquí encontramos elementos como los actores, casos de uso y el sistema.

 Prototipo de interfaz de usuario: en este paso crearemos un modelo o modelos operativos del trabajo de nuestro sistema, en el que el analista y cliente deben estar de acuerdo.

Fase 2: Análisis y diseño preliminar

En esta fase a partir de cada caso de uso se obtendrá una ficha de caso de uso, formada por un nombre, una descripción, una precondición que debe cumplir antes de iniciarse, una post-condición que debe cumplir al terminar.

Se deben describir los casos de uso, como un flujo principal de acciones, pudiendo contener los flujos alternativos y los flujos de excepción. Debe usarse un estilo consistente que sea adecuado al contexto del proyecto.

Realizar un Diagrama de Robustez, el cual es un híbrido entre un Diagrama de Clases y un Diagrama de Actividades, una herramienta que nos permite capturar el Que hacer y a partir de eso él Como hacerlo.

Facilita el reconocimiento de objetos y hace más sencilla la lectura del sistema. Ayuda a identificar los objetos que participan en cada caso de uso.

El diagrama de Robustez se divide en:

 Objetos fronterizos: usado por los actores para comunicarse con el sistema.

 Objetos entidad: son objetos del modelo del dominio.

(35)

35

 Objetos de Control: es la unión entre la interfaz y los objetos de entidad.

 Diagrama de Clases: describe la estructura de un sistema mostrando sus clases, atributos y las relaciones entre ellos.

Fase 3: Diseño

En esta fase se reconocen todos los elementos que forman parte del sistema, como lo son los Diagramas de Secuencia, los cuales muestran los métodos que llevaran las clases de nuestro sistema. Muestra todos los cursos alternos que pueden tomar todos los casos de uso. Se debe terminar el modelo estático, añadiendo los detalles del diseño en el diagrama de clases y verificar si el diseño satisface todos los requisitos identificados.

Fase 4: Implementación

En este paso a partir del diseño se procede a la creación del software. Se utilizará el diagrama de componentes de ser necesario como un apoyo del desarrollo.

En esta etapa se deben tomar en cuenta los siguientes factores:

 Reusabilidad: hace referencia a la posibilidad de usar los componentes en diferentes aplicaciones.

 Extensibilidad: consiste en la facilidad de modificación del Software

 Confiabilidad: se relaciona a la realización del Software descartando posibles errores.

Realizar pruebas: se realizan test de unidades, de casos, datos, resultados, de integración con los usuarios para verificar la aceptación de los resultados.

(36)

36

6. RESULTADOS

Para dar cumplimiento a cada uno de los objetivos planteados en el proyecto de investigación, se llevó a cabo una serie de tareas las mismas que se detallan a continuación:

Realizar un análisis preliminar y levantamiento de información para establecer requerimientos necesarios de la aplicación a desarrollar.

Para dar cumplimiento a este objetivo se llevó a cabo una encuesta que se aplicó a los usuarios que forman parte de la Junta Directiva del Barrio El Zarza y también se aplicó una entrevista directa al tesorero de la Junta Directiva. La encuesta consta de 10 preguntas la cual se aplicó a 26 personas, resultados que se detallan a continuación:

En la primera pregunta el 88.5% muestra que los usuarios que hacen uso del servicio de agua son de 30 a 55 años de edad mientras que el 11.5% son de 56 años en adelante. (Ver Figura 1)

Figura 1. Resumen de la Encuesta – Pregunta 1. Elaboración Propia.

0%

88%

12%

Indique su edad según el rango establecido. Su edad esta entre:

18 a 29 años 30 a 55 años 56 años en adelante

(37)

37 En la segunda pregunta se muestra que el 100% de los encuestados hacen uso del servicio de agua que ofrece la Junta Directiva de Agua del Barrio El Zarza. (Ver Figura 2)

En la tercera pregunta se muestra claramente que los procesos de pagos de agua se los lleva 100% de forma manual. (Ver Figura 3)

En la cuarta pregunta se constata que el 100% de los documentos que se entregan a los usuarios para constancia de sus pagos de agua son por entrega de recibo físico. (Ver Figura 4)

100%

0%

¿Usted hace uso del servicio de agua que ofrece la Junta Directiva del Barrio El Zarza?

Si No

100%

0%

Hasta la fecha actual, ¿Cómo se lleva a cabo el proceso de pagos de agua?

Manual (papel y lápiz) Sistema Informático

(38)

38

En la quinta pregunta, el 61.5% a elegido que prefiere recibir el recibo de pago de agua por correo electrónico, el 30.8% prefiere seguir recibiendo el recibo físico mientras que el 7.7% quiere recibir el recibo de agua por WhatsApp.

(Ver Figura 5)

En la sexta pregunta se pudo notar las posibles causas que podría tener el realizar y registrar los pagos de agua de forma manual en la que el 73.1%

indico que una posible causa es la perdida de información, el 69.2% dijo que este proceso manual conlleva más tiempo, el 61.5% indico que otra posible causa sería tener información alterada en los registros mientras que el 7.7%

100%

0%

¿A través de que medios o documentos se constata el pago de agua cancelado al

tesorero de la Junta Directiva?

Entrega de recibo físico Notificación al correo Ninguno

61%

31%

8%

¿Por que medio le gustaría a usted que se le envié el recibo del pago de agua?

Por recibo físico Por correo electrónico WhatsApp

(39)

39 no señalo ninguna causa al momento de llevar los procesos de forma manual.

(Ver Figura 6)

En la séptima pregunta se muestra que el 61.5% ha recibido una atención buena al momento de ir a realizar el pago de agua, el 34.6% ha recibido una atención excelente, el 3.8% ha recibido una atención regular mientras que el 0% a recibido una atención mala. (Ver Figura 7)

En la octava pregunta se constata los beneficios que tendría el implementar un sistema web en el Barrio El Zarza en la cual, el 92.3% indico que esto

0 10 20 30 40 50 60 70 80

Perdida de información Conlleva más tiempo Información alterada Ninguno

Indique las posibles causas que podría tener el realizar y registrar los pagos de agua de forma manual:

61%

35%

4%

0%

¿Cómo ha sido la atención que ha recibido usted al momento de realizar el

pago de agua?

Excelente Bueno Regular Malo

(40)

40

contribuiría al medio ambiente, el 76.9% dijo que esto ayudaría a tener un mejor control de la información, el 42.3% indico que esto optimizaría tiempo mientras que el 0% indico que ninguno. (Ver Figura 8)

En la novena pregunta se pudo constatar la implementación del sistema web en la que el 100% de los encuestados estuvo de acuerdo que se implementara la aplicación web en la Junta Directiva de Agua del Barrio El Zarza. (Ver Figura 9)

En la décima pregunta se obtuvo opiniones de las distintas personas encuestadas que pusieron a conocimiento las mejoras que debería tener el

0 10 20 30 40 50 60 70 80 90 100

Optimización de tiempo Contribución al medio ambiente Mayor control de la información Ninguno

¿Qué beneficios tendría el implementar un sistema web?2

100%

0%

¿Considera usted necesario la implementación de un sistema web para el control de pagos de agua

en el Barrio El Zarza?

Si No

(41)

41 sistema web para que se trabaje de mejor manera en la Junta Directiva de Agua del Barrio El Zarza. (Ver Figura 10)

La entrevista consta de 7 preguntas aplicada al tesorero de la Junta Directiva, información que se detalla a continuación:

1. ¿Cómo se encuentra estructurada la Junta Directiva de Agua?

La Junta Directiva de Agua se encuentra estructurada por un presidente, secretario, tesorero y dos vocales.

2. ¿Cómo se realiza el proceso de pagos de agua?

El pago lo realizan los usuarios mensualmente, pagan una base de $2,50 y no se cobra cúbicos.

3. ¿En qué queda registrado todos los pagos de agua de los usuarios?

Queda registrado en una recibera, una constancia que se le da al usuario y aparte se archiva en un cuaderno para mayor seguridad.

4. ¿Cada cuánto tiempo se registran los pagos de agua?

El usuario paga mensualmente, existen algunos usuarios que se acercan a pagar en 2 o 3 meses pero que luego se igualan con sus mensualidades.

5. ¿De cuánto es la multa que se le carga al usuario por retraso en los pagos de agua?

Los usuarios no tienen ninguna multa solo tiene que igualarse y en el caso de no querer el servicio, se acercan y piden la suspensión del servicio y cuando quieran nuevamente activarse tienen una multa de $50,00 para ser un socio activo.

Según su opinión personal para tener un mejor control de los pagos de agua, ¿Qué considera usted necesario que se deba mejorar?

No es necesario mejorar nada.

Se debería mejorar el tratamiento del agua.

Entrega de recibo físico y digital por cualquier medio.

Sería bueno tener una plataforma web de la junta de agua para información al cliente.

(42)

42

6. ¿Cuál es la problemática que se busca solucionar a través del sistema web?

Que el sistema permita registrar usuarios, registrar pagos de agua, generar un recibo de agua y registrar el servicio del usuario para mantener un control del mismo cuando este servicio se encuentre activo o suspendido.

7. ¿Se ha implementado anteriormente algún sistema parecido para el control de pagos de agua?

Hasta el momento no se ha implementado ningún sistema para el control de pagos de agua.

Una vez realizada la encuesta y la entrevista se logró determinar que actores van a intervenir en el sistema, los requerimientos funcionales y no funcionales con los que debía cumplir la aplicación, y la identificación de casos de uso en la que se englobarían ciertos requerimientos funcionales que darían cumplimiento a las necesidades de los usuarios y de la Junta Directiva de Agua. (Ver Tabla 11, Tabla 12, Tabla 13 y Tabla 14)

6.1.1 Identificación de actores

Tabla 11. Identificación de autores.

Actor Rol

Tesorero Gestionar los pagos de agua, gestionar usuarios, gestionar tesoreros, generar recibos de pago de cada usuario, activar/suspender el servicio de agua y ver historial de servicios.

Usuarios Consultar información sobre sus pagos de agua.

6.1.2 Requerimientos Funcionales El sistema permitirá:

(43)

43 Tabla 12. Tabla de requerimientos funcionales.

CÓDIGO DESCRIPCIÓN ESTADO

RF 001 Ingresar al sistema a través de un usuario y contraseña.

Evidente RF 002 Al tesorero crear cuentas de usuario para

cada usuario del agua.

Evidente RF 003 Al tesorero editar, buscar usuarios del agua

registrados en el sistema.

Evidente RF 004 Al tesorero ver el listado de usuarios

Evidente RF 005 Al tesorero validar cuentas de usuario a

traves del usuario.

Oculto RF 006 Al tesorero crear, editar y buscar tesoreros

de la Junta Directiva del Agua.

Evidente RF 007 Al tesorero ver el listado de tesoreros

Evidente RF 008 Al tesorero crear, buscar los pagos de agua

de cada usuario.

Evidente RF 009 Al tesoreo ver el listado de pagos de agua

Evidente RF 010 Al tesorero generar el recibo de pago de

agua de cada usuario.

Evidente RF 011 Al tesorero crear, buscar servicios de agua

de cada usuario.

Evidente RF 012 Al tesorero ver el listado de servicios de

agua de los usuarios.

Evidente RF 013 Al tesorero validar registro del servicio de

agua de cada usuario a traves del usuario del agua.

Oculto

RF 014 Al tesorero suspender el servicio de agua del usuario.

Evidente RF 015 Al tesorero activar el servicio de agua de un

usuario que tenga suspendido su servicio.

Evidente RF 016 Al tesorero ver historial de los servicios de

suspensiones de los usuarios.

Evidente RF 017 Al usuario buscar los registros de pagos de

agua registrados por el tesorero.

Evidente RF 018 Al usuario ver el listado de todos sus pagos

de agua registrados en el sistema.

Evidente