wordpress.com€¦  · web viewfigura 10- resultados obtenidos figura 11 – gráficos de...

12
DÉCIMA COMPETENCIA DE PROYECTOS ACADÉMICOS Facultad de Ingeniería Industrial Universidad de Guayaquil 29 de septiembre al 1 de octubre del 2020 SERVICIOS DE TRANSFERENCIAS BANCARIAS Y PAGOS DE SERVICIOS BÁSICOS EN LA WEB: CASO DE ESTUDIO BIGBANK. Felipe Choez Choez, Johnny Vélez Sánchez, Joel olivos Méndez, Elvis Calderón Vera, Fernando Maldonado Prado Carrera de Licenciatura en Sistemas en Información, Facultad de Industrial, Universidad de Guayaquil. Email de contacto: [email protected] Resumen. En el presente proyecto académico consiste en desarrollar e implementar una aplicación web de servicios de transferencias bancarias y pagos de servicios básicos en la entidad Bigbank, dedicado a la gestión de pagos de servicios básicos (agua, luz y internet), transferencias bancarias y atención al usuario sobre las preguntas frecuentes que se realizan al momento de interactuar con la aplicación estas preguntas serán respondidas por medio de una chat virtual donde el usuario podrá realizar diferentes consultas, El presente proyecto implica tres ramas. La primera de estas ramas es la Programación Web siendo esta la base principal del proyecto, se apoyará en la rama de Diseño Web y sustentará toda su información en la rama de Base de Datos. Palabras Claves. Implementar, gestión, chat virtual, Programación web, Diseño web, Base de Datos. VIII Jornadas de Ciencia, Tecnología y Sociedad Décima Competencia de Proyectos Académicos http://www.fi.ug.edu.ec/ https://gifii.wordpress.com/ Página | 1

Upload: others

Post on 18-Aug-2021

3 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: WordPress.com€¦  · Web viewFigura 10- resultados obtenidos Figura 11 – gráficos de procesos. 4. DISCUSIÓN . Se comprueba que la metodología de investigación y de desarrollo

DÉCIMA COMPETENCIA DE PROYECTOS ACADÉMICOSFacultad de Ingeniería Industrial

Universidad de Guayaquil29 de septiembre al 1 de octubre del 2020

SERVICIOS DE TRANSFERENCIAS BANCARIAS Y PAGOS DE SERVICIOS BÁSICOS EN LA WEB: CASO DE ESTUDIO BIGBANK.

Felipe Choez Choez, Johnny Vélez Sánchez, Joel olivos Méndez, Elvis Calderón Vera, Fernando Maldonado Prado

Carrera de Licenciatura en Sistemas en Información, Facultad de Industrial, Universidad de Guayaquil.Email de contacto: [email protected]

Resumen.

En el presente proyecto académico consiste en desarrollar e implementar una aplicación web de servicios de transferencias bancarias y pagos de servicios básicos en la entidad Bigbank, dedicado a la gestión de pagos de servicios básicos (agua, luz y internet), transferencias bancarias y atención al usuario sobre las preguntas frecuentes que se realizan al momento de interactuar con la aplicación estas preguntas serán respondidas por medio de una chat virtual donde el usuario podrá realizar diferentes consultas, El presente proyecto implica tres ramas. La primera de estas ramas es la Programación Web siendo esta la base principal del proyecto, se apoyará en la rama de Diseño Web y sustentará toda su información en la rama de Base de Datos.

Palabras Claves. Implementar, gestión, chat virtual, Programación web, Diseño web, Base de Datos.

VIII Jornadas de Ciencia, Tecnología y SociedadDécima Competencia de Proyectos Académicoshttp://www.fi.ug.edu.ec/https://gifii.wordpress.com/

P á g i n a | 1

Page 2: WordPress.com€¦  · Web viewFigura 10- resultados obtenidos Figura 11 – gráficos de procesos. 4. DISCUSIÓN . Se comprueba que la metodología de investigación y de desarrollo

DÉCIMA COMPETENCIA DE PROYECTOS ACADÉMICOSFacultad de Ingeniería Industrial

Universidad de Guayaquil29 de septiembre al 1 de octubre del 2020

1. INTRODUCCIÓN

Hoy día Internet se ha convertido en un medio de comunicación importante, una herramienta para el trabajo o la universidad, un diccionario en donde puedes consultar información sobre cualquier tema o término que te interese. Es por eso, por lo que Internet se ha convertido en un potente y económico recurso para publicitar cualquier tipo de trabajo o servicio. De tal modo que no se concibe empresa sin página Web por tal motivo emos decidido implementar una aplicación web para el trabajo, beneficios al usuario y optimización de procesos en dicha entidad.

En la entidad se observó que existe ciertos problemas que afectar al usuario y trabajadores por tal motivo se decidió realizar una implantación de una aplicación web que permite manejar ciertos procesos que realiza diariamente un usuario, esta aplicación esta basada en una metodología donde todos los responsables fueron sometidos a diferentes pruebas para la debida recopilación de información.

El objetivo de este artículo es presentar una metodología de investigación, diseño de aplicaciones web, el cual nos permitirá analizar las diferentes fases que se realizan al momento de desarrollo de una aplicación web [1].

2. METODOLOGIA La metodología de investigación utilizada es la Exploratoria ya que nos permite estudiar el problema para poder llevar un control especifico, en el caso se utilizó la investigación primaria ya que nos permite realizar entrevistas, encuestas, cuestuarios al personal, usuarios los cuales son los afectados en la entidad para poder obtener los resultados, conclusiones para la implementación debida.

La metodología OOHDM (OBJECT ORIENTED HYPERMEDIA DESIGN METHODOLOGY) permite desarrollar aplicaciones Web a partir de la utilización de modelos especializados como: conceptual, navegación e interfaz de usuario teniendo como objetivo simplificar y hacer más eficaz el diseño de aplicaciones.

OOHDM propone el desarrollo de aplicaciones hipermedia a través de un proceso compuesto por cinco etapas: obtención de requerimientos, diseño conceptual, diseño navegacional, diseño de interfaces abstractas e implementación en la figura 1 se muestra el esquema de la metodología utilizada [2].

VIII Jornadas de Ciencia, Tecnología y SociedadDécima Competencia de Proyectos Académicoshttp://www.fi.ug.edu.ec/https://gifii.wordpress.com/

P á g i n a | 2

Page 3: WordPress.com€¦  · Web viewFigura 10- resultados obtenidos Figura 11 – gráficos de procesos. 4. DISCUSIÓN . Se comprueba que la metodología de investigación y de desarrollo

DÉCIMA COMPETENCIA DE PROYECTOS ACADÉMICOSFacultad de Ingeniería Industrial

Universidad de Guayaquil29 de septiembre al 1 de octubre del 2020

Figura 1 – esquema de la metodología OOHDM

2.1 obtención de requerimientos

En la figura 1 se muestra la realización del respetivo caso de uso realizado de acuerdo a la información obtenida por medio de entrevista, cuestionarios y observaciones a las trabajadores y usuarios los cuales van a manejar dicha aplicación.La entrevista es de gran utilidad para obtener información cualitativa como opiniones, o descripciones generales de lo que se quiere analizarEl uso de cuestionarios permite reunir información proveniente de un grupo grande de personas.Por medio de las observaciones se obtiene información de primera mano sobre la forma en que se efectúan las actividades en la entidad [3].

Figura 2- diagrama de caso de uso

VIII Jornadas de Ciencia, Tecnología y SociedadDécima Competencia de Proyectos Académicoshttp://www.fi.ug.edu.ec/https://gifii.wordpress.com/

P á g i n a | 3

Page 4: WordPress.com€¦  · Web viewFigura 10- resultados obtenidos Figura 11 – gráficos de procesos. 4. DISCUSIÓN . Se comprueba que la metodología de investigación y de desarrollo

DÉCIMA COMPETENCIA DE PROYECTOS ACADÉMICOSFacultad de Ingeniería Industrial

Universidad de Guayaquil29 de septiembre al 1 de octubre del 2020

2.2 Diseño conceptual

En el modelo de entidad relación - figura 3, nos permite representar, conocer de manera simplificada los componentes que participan en un proceso de la creación de las debidas entidades que estarán incluidas en la aplicación web y el modo en el que estos se relacionan entre sí.Este modelo facilita la creación de la base de datos donde se van a almacenar los datos respectivos que el usuario va a ingresar, las entidades se la obtuvieron gracias a la debida realización de la fase numero uno de esta metodología

Figura 3- Modelo de entidad relación

2.3 Diseño de navegación

En la figura 4 se muestra como está estructurado el diseño de navegación de la aplicación webLos diseños de navegación nos permiten conocer la navegación de nuestro contenido en el sitio y facilitar el recorrido, gracias a ello podemos realizar acciones a través de enlaces, vínculos o

VIII Jornadas de Ciencia, Tecnología y SociedadDécima Competencia de Proyectos Académicoshttp://www.fi.ug.edu.ec/https://gifii.wordpress.com/

P á g i n a | 4

Page 5: WordPress.com€¦  · Web viewFigura 10- resultados obtenidos Figura 11 – gráficos de procesos. 4. DISCUSIÓN . Se comprueba que la metodología de investigación y de desarrollo

DÉCIMA COMPETENCIA DE PROYECTOS ACADÉMICOSFacultad de Ingeniería Industrial

Universidad de Guayaquil29 de septiembre al 1 de octubre del 2020

índices que están relación dentro de la aplicación web y dependen del registro de usuario para mostrar las vistas correspondientes.El diseño web permite a los usuarios de la entidad realizar las siguientes acciones dentro del sitio web, Permite a los usuarios elegir que pestañas o opciones desea acceder, mostrar al usuario en que parte de la web se encuentra y como volver a una pagina principal o una página a elegir.

Figura 4 - diseño de navegación

2.4 Diseño de la interfaz

En el diseño de interfaz se especifica entidades que tienen mas interacción sobre otras, en este caso será la de usuarios, porque permite a las otras entidades heredar atributos con los cuales va a realizar su respectivo funcionamiento, esto permite que en la página web se visualicen campos que ya fueron registrado en otro sitio permitiendo tener un control sobre el flujo de datos que se maneja el sitio web en la figura 5 – se representa el diseño mencionado.

VIII Jornadas de Ciencia, Tecnología y SociedadDécima Competencia de Proyectos Académicoshttp://www.fi.ug.edu.ec/https://gifii.wordpress.com/

P á g i n a | 5

Page 6: WordPress.com€¦  · Web viewFigura 10- resultados obtenidos Figura 11 – gráficos de procesos. 4. DISCUSIÓN . Se comprueba que la metodología de investigación y de desarrollo

DÉCIMA COMPETENCIA DE PROYECTOS ACADÉMICOSFacultad de Ingeniería Industrial

Universidad de Guayaquil29 de septiembre al 1 de octubre del 2020

Figura 5 – diseño de interfaz

2.5 Implementación Luego de finalizadas las fases de nuestra metodología se procese a la compilación y ejecución de la aplicación web, Dado el tema presentado en este trabajo se basa en generar código en HTML y CSS, en resultado de la compilación se presentará script de pantalla, presentando los sitios web de mayor acercamiento al usuario, figura 6 – Login de la aplicación, figura 7 – pantalla

principal, figura 8 - chat virtual, figura 9- pantalla de pagos de servicios varios.

VIII Jornadas de Ciencia, Tecnología y SociedadDécima Competencia de Proyectos Académicoshttp://www.fi.ug.edu.ec/https://gifii.wordpress.com/

P á g i n a | 6

Page 7: WordPress.com€¦  · Web viewFigura 10- resultados obtenidos Figura 11 – gráficos de procesos. 4. DISCUSIÓN . Se comprueba que la metodología de investigación y de desarrollo

DÉCIMA COMPETENCIA DE PROYECTOS ACADÉMICOSFacultad de Ingeniería Industrial

Universidad de Guayaquil29 de septiembre al 1 de octubre del 2020

Figura 6 -login Figura 7 -pantalla principal

Figura 8 -chat virtual figura 9 - pantalla de pagos de servicios varios.

3. RESULTADOS

En la figura 10 se expresa gráficamente como la implementación de la aplicación web, tubo cambios esperados ya que permitió la optimización de proceso y el control de la integridad de los datos dando como resultado que la aplicación de la metodología de investigación y de desarrollo.Nos permitan manejar manera ordenada la información la cual se utilizará para creación de la aplicación web. Se puede observar que durante las pruebas la seguridad de información fue unos de los procesos con mayor cambio, eficiencia y excelentes resultados a continuación le sigue el control de datos y por último el funcionamiento de la base de datos, en la figura 11 se muestra los procesos más realizados en la aplicación web [4].

VIII Jornadas de Ciencia, Tecnología y SociedadDécima Competencia de Proyectos Académicoshttp://www.fi.ug.edu.ec/https://gifii.wordpress.com/

P á g i n a | 7

Page 8: WordPress.com€¦  · Web viewFigura 10- resultados obtenidos Figura 11 – gráficos de procesos. 4. DISCUSIÓN . Se comprueba que la metodología de investigación y de desarrollo

DÉCIMA COMPETENCIA DE PROYECTOS ACADÉMICOSFacultad de Ingeniería Industrial

Universidad de Guayaquil29 de septiembre al 1 de octubre del 2020

Figura 10- resultados obtenidos Figura 11 – gráficos de procesos

4. DISCUSIÓN

Se comprueba que la metodología de investigación y de desarrollo de aplicaciones web definen claramente la sistemática que debe seguir el proyecto desde su etapa inicial hasta su culminación, minimiza errores y reduce el esfuerzo en las fases subsiguientes de construcción, garantiza todas las ventajas que la orientación a objetos, modularidad, encapsulamiento, herencia etc. La metodología establece cómo debe ser construido el sistema y en qué orden divide claramente lo conceptual, lo navegacional y lo visual, esta independencia hace que el mantenimiento de la aplicación sea mucho más sencillo por el modularidad.Se recomienda ser muy paciente y cumplir uno a unos de fases de la metodología con el fin de lograr los resultados esperados ya que la metodología implementada corresponde a una variedad de procesos a seguir.

REFERENCIAS

1. Delgado, Hugo. (2014). Metodología para la Creación y Desarrollo de Sitios Web. Recuperado 20 de septiembre, 2020, de https://disenowebakus.net/metodologia-para-la-creacion-de-sitios-web.php

2. Matehuala, I. T. (2018, 20 junio). metodología web. metodología web.

https://programacionwebisc.wordpress.com/2-5-metodologias-para-el-desarrollo-de-aplicaciones-web/.

3. María Jesús Lamarca Lapuente, M. J. (2013, 13 diciembre). MODELO OOHDM o Método de Diseño de Hipermedia Orientado a Objetos. MODELO OOHDM o Método de Diseño de Hipermedia Orientado a Objetos. http://www.hipertexto.info/documentos/oohdm.htm.

4. Mateo, B. L. (2011, 23 julio). Metodologías Para el Desarrollo de Aplicaciones Web. Metodologías Para el Desarrollo de Aplicaciones Web. https://sites.google.com/site/bahenagonzalez4vb/metodologias-para-el-desarrollo-de-aplicaciones-web.

VIII Jornadas de Ciencia, Tecnología y SociedadDécima Competencia de Proyectos Académicoshttp://www.fi.ug.edu.ec/https://gifii.wordpress.com/

P á g i n a | 8

Page 9: WordPress.com€¦  · Web viewFigura 10- resultados obtenidos Figura 11 – gráficos de procesos. 4. DISCUSIÓN . Se comprueba que la metodología de investigación y de desarrollo

DÉCIMA COMPETENCIA DE PROYECTOS ACADÉMICOSFacultad de Ingeniería Industrial

Universidad de Guayaquil29 de septiembre al 1 de octubre del 2020

VIII Jornadas de Ciencia, Tecnología y SociedadDécima Competencia de Proyectos Académicoshttp://www.fi.ug.edu.ec/https://gifii.wordpress.com/

P á g i n a | 9