REFI UPN.

2018; 4(2): 1-11

REFI
Revista Electrónica de la Facultad de Ingeniería
Website: https://refi.upn.edu.pe/index.php/refi/index

PLATAFORMA WEB PARA VENTAS ONLINE

Web platform for online sales
Ludeña Gavino B.S
1
Faculta de Ingeniería, Universidad Privada del Norte, Lima, Perú

Correspondencia: N00103062@upn.pe (Ludeña-Gavino B.S)

RESUMEN

El principal problema que afecta a la empresa SISCOM, la cual se encarga de vender dispositivos
electrónicos, es la falta de un sistema que agilice el proceso de venta. Los empleados de la empresa
apuntan en cuadernos todo el producto que tienen disponible y los clientes tienen que acercarse a la tienda
para que puedan adquirir el producto que desean obtener y a pesar de ser un proceso simple, se pierde
tiempo que fácilmente podría ser utilizado de mejor manera. Al hacer uso de este sistema podrán
monitorear todos estos procesos de manera mucho más fácil y eficiente.

Para poder lograr un mejor entendimiento de los procesos dentro de la empresa se hará uso de los diversos
patrones de prueba y los estándares de calidad con diagramas aprendidos durante el curso, siendo estos:
Diagrama de Casos de Uso, Especificación de Casos de Uso, Pruebas Unitarias, diagrama de paquetes,
Casos de Prueba, entre otros. Por otro lado, para el software se utilizará MYSQL, Java Web, Servlet,
Jasper Reports.

En dicho software, los clientes serán capaces de poder realizar compras por internet en las que podrán
comprar los dispositivos que deseen sin necesidad de ir a la tienda para ver si lo que buscan se encuentra
disponible o no, aparte de poder saber si se encuentra disponible o no. Por otra parte, los trabajadores
sabrán con exactitud la cantidad de productos que tienen disponible como ya se mencionó anteriormente.

Palabras clave: Software, MYSQL, Java Web, Servlet, Jasper Reports

ABSTRACT

The main problem affecting the SISCOM company, which is in charge of selling electronic devices, is the
lack of a system that streamlines the sales process. The employees of the company write down in
notebooks all the product that they have available and the clients have to go to the store so that they can
buy the product that they want to obtain and despite being a simple process, time is lost that could easily
be used in a better way. way. By using this system they will be able to monitor all these processes much
more easily and efficiently.
 In order to achieve a better understanding of the processes within the company, the different test patterns
and quality standards will be used with diagrams learned during the course, these being: Diagram of Use
Cases, Specification of Use Cases, Tests Unit, package diagram, Test Cases, among others. On the other
hand, MYSQL, Java Web, Servlet, Jasper Reports will be used for the software.

In this software, customers will be able to make purchases online where they can buy the devices they
want without having to go to the store to see if what they are looking for is available or not, apart from
being able to know if it is available or not. On the other hand, workers will know exactly how many
products they have available as already mentioned above.

Keywords: Software, MYSQL, Java Web, Servlet, Jasper Reports

1 1. Introducción
2 Nuestro proyecto se basó en el uso de modelos para entender lo que verdaderamente requería el software
3 con propósitos realistas. “El propósito del modelo es estimular la discusión entre los ingenieros de
4 software que intervienen en el desarrollo del sistema. Los modelos pueden ser incompletos (siempre que
5 cubran los puntos clave de la discusión) y utilizar de manera informal la notación de modelado. Así es
6 como se utilizan en general los modelos en el llamado, modelado ágil” (Ambler y Jeffries, 2002). Por ello
7 nuestro grupo entro en discusión para ver cuál era el modelo de software adecuado con el que debíamos
8 trabajar.
9
10 Dentro de los modelados encontramos distintos casos dentro de ellos se encuentra el modelado de casos de
11 uso. “el modelado de casos de uso se utiliza ampliamente para apoyar la adquisición de requerimientos.
12 Un caso de uso puede tomarse como un simple escenario que describa lo que espera el usuario de un
13 sistema. Cada caso de uso representa una tarea discreta que implica interacción externa con un sistema. En
14 su forma más simple, un caso de uso se muestra como una elipse, con los actores que intervienen en el ca
15 (Vidal, 2012) (Lopez, 2011) (Sommerville, 2011) (Gómez, 2010) (Gonzalez, 2012)so de uso
16 representados como figuras humanas” (Lan, 2011), Ingeniería de Software, México: PEARSON
17 EDUCACIÓN) de la cita que acabamos de leer el modelado sirve para ser mucho más meticuloso con los
18 detalles de la interacción usuario-sistema.
19
20 Para realizar el proceso de negocio necesitamos tener una idea de cómo será visualizado y como vamos a
21 realizar paso a paso para ello se utilizan los diagramas que es valga la redundancia una representación
22 gráfica y simbólica de los pasos que realizaremos en el proceso de negocio y como vamos a
23 implementarlos. “Para conocer cada uno de los escenarios de funcionamiento de una aplicación y derivar
24 el estado de los objetos y del sistema mismo, los diagramas de secuencias son los indicados. Esta es una
25 justificación pseudo-formal para el uso de diagramas de secuencias UML” (Vidal, 2012). En otras
26 palabras, el diagrama es una herramienta que nos permite gestionar nuestro software paso a paso. Esto nos
27 va a ayudar a detector los problemas que podría presentar el sistema al momento de la elaboración y nos
28 ayudara a corregirlo.
29
30 2. Materiales y métodos
31 Para la creación de la página web utilizaremos un conjunto de herramientas ya desarrolladas para facilitar
32 la realización de este proyecto. Primero, en cuanto a la base de datos se utilizo el programa MySQL.
33 Luego, el lenguaje que se utilizo fue Java web, con el IDE Netbeans, ya que este funciona en cualquier
34 sistema operativo o servidor, es decir es multiplataforma. Además de ofrecernos una cantidad mayor de
35 utilidades para extender su funcionalidad en comparación a otras.

Revista de la Universidad Nacional de Trujillo

8
 Ludeña et al. REFI UPN.2020

36
37 El modelado y desarrollo del sistema se dividen en 5 módulos
38 • El primer módulo (ver anexo 5) se especifican los pasos para el desarrollo del registro de clientes
39 • CRUD catálogo (ver anexo 6) se especifican todos los pasos que se realizaron para realizar el
40 CRUD de catálogo de productos
41 • Venta (ver anexo 7) se especifican todos los pasos que se realizaron para realizar las ventas
42 • Reportes (ver anexo 8) se especifican todos los pasos que se realizaron para realizar los reportes
43 de ventas y de citas.
44
45 Para el modelado del sistema y posterior desarrollo fueron necesarios realizar:
46
47 • El diagrama de Casos de Uso, sirven para especificar la comunicación y comportamiento de un
48 sistema mediante la interacción con los usuarios u otros sistemas. Es decir, un diagrama que
49 muestra relación entre actores y casos de uso.
50 • Especificación de Casos de Uso, es la descripción de cada una de las partes definidas para lograr
51 su descripción completa. Esto busca simplificar la explicación del sistema y es el primer
52 acercamiento para contemplar la reutilización y la modularizarían en la definición de diagrama de
53 clases.
54 • Diagrama de tablas, que es un modelo de datos que permite representar cualquier abstracción,
55 percepción y conocimientos en un sistema de objetos denominados entidades y relaciones,
56 incorporando una representación visual.
57 • Pruebas Unitarias, es una forma de comprobar el correcto funcionamiento de una unidad o
58 fracción de código. Es un procedimiento más de los que se llevan a cabo dentro de una
59 metodología ágil de trabajo.
60 • Diagrama de paquetes, muestra la división de un sistema en agrupaciones lógicas mostrando las
61 dependencias entre paquetes, Dado que normalmente un paquete está pensado como un directorio,
62 los diagramas de paquetes suministran una descomposición de la jerarquía lógica de un sistema.
63 • Casos de Prueba, comprenden un conjunto de actividades que se realizan para identificar posibles
64 fallos de funcionamiento, configuración de un programa.
65
66
67 3. Resultados y discusión
68 En el análisis del tema se logró realizar interfaces en la cual se enfocará la implementación de un sistema
69 web sobre ventas de productos.
70
71 Interfaz de Login: Esta interfaz permitirá al usuario o administrador que pueda ingresar al sistema web.
72 (Ver Anexo 9)
73
74 Interfaz de Registrar producto: Interfaz que permitirá gestionar a los empleados u administradores. En la
75 versión 1, no se logró realizar las validaciones respectivas en los diferentes atributos. (Ver Anexo 10)
76
77 Interfaz Editar Producto: Se brinda la actualización del producto ya sea el precio, nombre y la descripción
78 requerida para la apreciación de los clientes (Ver Anexo 11)
79
80 Interfaz de Carrito de compras: Es donde se almacena los productos con su respectivo precio, cantidad.
81 (Ver Anexo 12)
82
83
 Ludeña et al. REFI UPN.2020

84 Interfaz detalle de ventas: Esta interfaz muestra las compras que se han hecho detalladamente. (Ver Anexo
85 13 y 14)
86
87 Interfaz de reportes: En esta interfaz se implementa los reportes ya sea de un ranking de productos,
88 usuarios registrados en el sistema, ventas entre otros. (Ver Anexo 15)
89
90 A continuación, se mostrarán gráficos obtenidos mediante la herramienta Understand, desarrollada por
91 SCITools. Dicha herramienta fue utilizada para poder obtener datos que demuestren el correcto
92 funcionamiento del software programado.

93 En este primer gráfico se puede apreciar un porcentaje que representa al código que se encuentra en el
94 software. El área mayor está indicando que un 81% del software está conformado por el código fuente, un
95 9% está conformado por comentarios que sirven como guía para los usuarios y el otro 9% son líneas en
96 blanco.

97
98 Anexo 1 Detalles del código
99

100

101

102

103

104

105

106
 Ludeña et al. REFI UPN.2020

107 En este gráfico se están mostrando los porcentajes de acuerdo a las funciones que se encuentran en el
108 software. 21% de las funciones programadas son públicas, mientras que el 79% restante está conformado
109 por otro tipo de funciones que no están siendo especificadas.

110
111 Anexo 2 Detalles de las clases
112

113 En este gráfico se están mostrando detalles más específicos de las funciones que se encuentran dentro del
114 software. Lo que más predomina son las funciones públicas, que abarcan un 80% del código en general. El
115 13% que se puede apreciar está representando a las funciones privadas; mientras que el 8% restante
116 pertenece a las funciones protegidas.

117
118 Anexo 3 Detalles de las funciones
119

120

121
 Ludeña et al. REFI UPN.2020

122 Esta tabla muestra de manera más detallada las especificaciones del software. Muestra que hay 73
123 archivos, 1129 unidades de programación, 16681 líneas, 599 líneas en blanco, 5291 líneas de código, 604
124 líneas de comentario y 5506 declaraciones.

125
126 Anexo 4 Métricas del proyecto
127
128 Con respecto a la calidad del software se detectó 38 defectos con respecto al software e implementación
129 de código en la base de datos (tamaño de caracteres, tipo de número integer-flotante-double), además en el
130 sistema web con respecto a la creación de sesiones de usuario (servlets y jsp de vista según el usuario
131 correspondiente). Validación de datos incorrectos en los campos de entrada y valores limite.
132
133 4. Conclusiones
134 Llegados a este punto del proyecto podemos concluir que la empresa tiene una gran diversidad de
135 productos que requerían una rápida inclusión dentro de una Base de Datos ya que el sistema no
136 digitalizado que utilizaban era propenso a que se cometan errores.
137
138 Agradecimientos
139 Agradezco a mi padre y a mi madre por haberme dado la vida.
140
141 Referencias
142 Ambler, S. (2009). Agile modeling. New York, N.Y.: J. Wiley & Sons.
143
144 Gómez, O. T. (2010). Criterios de selección de metodologías de desarrollo de software. Lima:
145 UNMSM
146
147 Gonzalez, Y. D. (2012). Patrón Modelo-Vista-Controlador. Telem@tica, 47-57.
148
149 Lopez, P. (2011). INGENIERÍA DEL SOFTWARE I. Santander: Universidad Cantabria
150
151 Sommerville. (2011). INGENIERÍA DE SOFTWARE. Juárez: PEARSON EDUCACIÓN
152
153 Vidal, C. (2012). Extensión del Diagrama de Secuencias UML (Lenguaje de Modelado Unificado)
154 para el Modelado Orientado a Aspectos. Talca: Universidad de Talca.
 Ludeña et al. REFI UPN.2020

155 Anexos
156

157
158 Anexo 5
159
160

161
162 Anexo 6
163

164
165 Anexo 7
166
 Ludeña et al. REFI UPN.2020

167
168 Anexo 8
169
170

171
172 Anexo 9 Interfaz login
173
174
175
176
177
178
179
 Ludeña et al. REFI UPN.2020

180
181 Anexo 10 Interfaz de Registrar producto
182
183

184
185 Anexo 11 Interfaz Editar Producto
186

187
188 Anexo 12 Interfaz de carrito de compras
189
190
 Ludeña et al. REFI UPN.2020

191
192 Anexo 13 Interfaz detalle de ventas
193

194
195 Anexo 14 Interfaz detalle de ventas
196
197

198
199 Anexo 15 Interfaz de reportes