UNIVERSIDAD POLITÉCNICA ESTATAL DEL CARCHI

FACULTAD DE INDUSTRIAS AGROPECUARIAS Y CIENCIAS AMBIENTALES

CARRERA DE INGENIERÌA EN INFORMÁTICA

PROYECTO INTEGRADOR

Tema: “Desarrollo de una Aplicación Web para la Gestión de Agremiados para la Federación de
Artesanos de la provincia del Carchi”

AUTOR (a): Alvaro Castillo, Isaac Obando, Fernando Farinango

TUTOR (a): MSC. Milton Del Hierro

Tulcán, 2018
 ÍNDICE
I. PROBLEMA.............................................................................................................................3
1.1. PLANTEAMIENTO DEL PROBLEMA..........................................................................4
1.2. FORMULACIÓN DEL PROBLEMA...............................................................................5
1.3. JUSTIFICACIÓN..............................................................................................................5
1.4. OBJETIVOS Y PREGUNTAS DE INVESTIGACIÓN....................................................6
1.4.1. Objetivo General.............................................................................................................6
1.4.2. Objetivos Específicos......................................................................................................6
1.4.3. Preguntas de Investigación .............................................................................................6
II. FUNDAMENTACIÓN TEÓRICA..........................................................................................7
2.1. ANTECEDENTES INVESTIGATIVOS...............................................................................7
2.2. MARCO TEÓRICO..............................................................................................................8
2.3 MARCO CONCEPTUAL....................................................................................................11
III. METODOLOGÍA.................................................................................................................14
3.1. ENFOQUE METODOLÓGICO.........................................................................................14
3.1.1. Enfoque de investigación.................................................................................................14
3.1.2. Tipo de Investigación.......................................................................................................14
3.1.3. Clase de Investigación......................................................................................................15
3.2. HIPÓTESIS O IDEA A DEFENDER..................................................................................15
3.3. DEFINICIÓN Y OPERACIONALIZACIÓN DE VARIABLES........................................15
3.4. MÉTODOS UTILIZADOS.................................................................................................15
3.4.1. Análisis Estadístico...........................................................................................................16
IV RESULTADOS Y DISCUSIÓN................................................................................................20
V CONCLUSIONES Y RECOMENDACIONES.........................................................................20
VI PROPUESTA DEL PROYECTO..............................................................................................21
6.1 Desarrollo de la propuesta....................................................................................................21
6.1 1 Alcance cronograma..........................................................................................................21
6.1.2 Trello..................................................................................................................................22
6.1.3 Diagrama de Base De Datos..............................................................................................23
6.1.4 Diagrama de Proceso BPM...............................................................................................24
6.1.5 Matriz de Involucrados......................................................................................................25
6.1.6 Cronograma y Matriz de Responsabilidad........................................................................26
6.1.7 Diseño de la Aplicación/Prototipo (Balsamiq)..................................................................29
6.1.8 Diccionario de datos..........................................................................................................32
6.2Requerimientos......................................................................................................................36
6.2.1 Modelado conceptual.....................................................................................................36
6.2.1.1 Diagrama entidad – Atributos.....................................................................................36
6.2.1.2 Tablas de identidades..................................................................................................37
6.3.1 Cardinalidad...................................................................................................................39
6.3.2 Normalización................................................................................................................39
6.3.2.1 Primera forma normal.................................................................................................39

2
 6.3.2.2 Segunda forma normal................................................................................................40
6.3.2.3 Tercera forma normal..................................................................................................41
VII. REFERENCIAS BIBLIOGRÁFICAS....................................................................................42
7.1 Bibliografía.......................................................................................................................42
VIII. ANEXOS...............................................................................................................................43
8.1. Manual de usuario............................................................................................................43
8.1.2 Código Fuente Index......................................................................................................48

3
 I. PROBLEMA

1.1. PLANTEAMIENTO DEL PROBLEMA

Borges (2015) sostiene que, en el norte del planeta, la artesanía la practican personas instruidas
que buscan su autoexpresión. Al contrario en Latinoamérica, la artesanía no sólo es una actividad
difundida en el campo, sino en la periferia y en barrios informales de sus pobladas ciudades como
las favelas, donde colectivamente, los artesanos se enfrentan a múltiples condiciones adversas
Esto dificulta de sobre manera una implementación a corto plazo En ese sentido, José Sabogal
sostuvo que “artesano es el que dispone libremente de su fuerza de trabajo y no el que trabaja
para un patrón o por encargo de un contratista”, refiriéndose a aquellos reclutados en las zonas
más deprimidas del país, en las barriadas que circulan Lima y en otras capitales sudamericanas
para un pequeño empresario que tiene una fábrica y produce algo que se sindica como artesanía
(Sabogal, 1974). También para Sabogal (1982), “artesano es el que esencialmente crea y recrea
en la elaboración de su obra y no el que simplemente produce.”
A nivel nacional la Secretaria de Estado sostuvo que los artesanos, además de contribuir al
desarrollo económico del país, son actores claves en la preservación material e inmaterial del
Patrimonio cultural de nuestro pueblo. Precisando la participación de los artesanos en el ámbito
productivo, informó que el sector está constituido en más del 80% por unidades básicas
familiares y, que el aporte a la generación de empleo, llega al 12.3% de la población urbana a
nivel nacional. (Iriarte, 2013).
Actualmente la Federación de artesanos de la ciudad de Tulcán cuenta con los recursos
informáticos necesarios pasa su desempeño, recursos los cuales no están bien aprovechados, tal
es el caso que al momento de realizar un registro de un nuevo gremio o agremiado se lo hace de
una manera poco convencional, únicamente en una hoja de Excel siendo inaccesible al resto de
gremios y agremiados, lo que genera que los datos estén desactualizados dentro de los mismos
gremios, existen varios gremios registrados con sus respectivos miembros con posibles nuevos
entrantes y/o salientes los cuales son registrados dentro de varias hojas de Excel respectivamente
lo cual genera una desorganización general de datos debido a que las hojas de Excel no pueden
ser vistas por todos los integrantes, generando incomodidad a los artesanos al momento de
comprobar su respectivo registro, además que al momento de ingresar a nuevos miembros la
información se altera en cada miembro.

4
En la federación de artesanos se puede observar un desconocimiento sobre nuevos aplicaciones
web con conexión a base de datos que ayude a brindar comodidad y calidad al momento de
realizar las inscripciones de nuevos miembros.
En la federación de artesanos de la ciudad de Tulcán, existen los recursos informáticos los cuales
no son bien aprovechados debido a que estos pueden hacer que su procesos sean más agiles y
eficientes, pocas son las personas que conocen o están al tanto del uso de las herramientas
informáticas, los usuarios piensan que la implementación de este tipo de servicios creen
dificultad al momento de realizar el proceso informático, ya que no todas las personas tienen
acceso a la red ya sea mediante un dispositivo Smartphone o una computadora personal, sin
enterarse de las diferentes ventajas y ahorro de tiempo que esta aplicación ofrece.
Es así como realizar un registro de un agremiado se convierte en un problema ya que implica
desorganizar los datos existentes y posible pérdida de información.
Con la implementación de una aplicación web realizar el registro de agremiados se lo realizará de
una más ágil, ordenada y fácil de usar.

1.2. FORMULACIÓN DEL PROBLEMA

Escasa digitalización en el registro y control en el personal administrativo debido a que día a día
manejan mucha documentación desorganizada, dispersa, soporte de papel inaccesible, y
contenido digital confuso encontrándose con varios desafíos al momento de registros en la
Federación de Artesanos de la provincia del Carchi en la ciudad de Tulcán.

1.3. JUSTIFICACIÓN

Al implementar una aplicación Web para el control de registro de agremiados de la Federación

de Artesanos del Carchi, agilizaría principalmente los procesos de registro y búsqueda de
información, facilitará la asignación de nuevos usuarios y agremiados debido a que contará con
una base de datos actualizada que cumplen con los requisitos para impartir cada información,
disminuyendo el riesgo de fácil manipulación de información así también proporcionando
consultas o reportes de la información relacionada con la Federación. Debido que la aplicación
estará en un ambiente Web, facilitaría realizar las tareas propias del sistema desde cualquier parte
con la condición de que haya disponibilidad de internet.

5
Un aspecto positivo de mejora en relación con la manera en que actualmente se registra y
controla a los agremiados, es la identificación del o los usuarios autorizados en aquellos procesos
relevantes, evitando así una fácil manipulación de los datos y de personas no vinculadas al
proceso o que puedan identificarse los cambios por ellas efectuadas.

1.4. OBJETIVOS Y PREGUNTAS DE INVESTIGACIÓN

1.4.1. Objetivo General

Sistematización de registros y control para los agremiados de la asociación de artesanados de la

provincia del Carchi.

1.4.2. Objetivos Específicos

 Fundamentar bibliográficamente la aplicación basada en un lenguaje de programación

para el desarrollo de una aplicación WEB.
 Diseñar la aplicación con el fin de dar una mejor atención a los clientes asociado,
mediante la programación Visual Studio APN.net, y para la base de datos SQL Server.
 Evaluar el funcionamiento de la aplicación correctamente.

1.4.3. Preguntas de Investigación (3 preguntas)

¿Cuáles es el proceso de registro para los agremiados de la asociación de artesanados de la

provincia del Carchi??
¿Por qué utilizar un estándar de modelo, vista controlador?
¿En que beneficia a la asociación de artesanos el desarrollo de la aplicación web?

6
 II. FUNDAMENTACIÓN TEÓRICA

2.1. ANTECEDENTES INVESTIGATIVOS

Como antecedentes investigativos tomamos en cuenta el trabajo de investigación de la

Universidad Nacional Autónoma de México que pertenece al autor Ing. Mora Hernández José
Alfredo publicada en el año 2012 con el título de Sistema de Administración de Inventarios de
una Empresa de Salud. Utilizando el Visual Basic con ASP.net y el manejador de bases de datos
SQL Server, cuyo objetivo principal es gestionar y administrar los inventarios de la empresa con
el fin de llevar el control de las actividades y obligaciones que llevan a cabo cada uno del
personal administrativo de dicha empresa y así transformar los insumos en los productos en un
bien final.

Como segundo documento de ayuda para la realización de este proyecto, se encuentra el de

trabajo de Instituto Politécnica Nacional de la Escuela Superior de Ingeniería de la ciudad de
México con autoría del ing. Catalina Patiño Gallegos publicada en el año 2009 y titulada
Desarrollo Directorio usando un servicio Web por medio de un servicio web que se utilice para
consultar, agregar y modificar datos de los profesores de las bases de datos del directorio del
departamento de horarios del lugar determinado.

El tercer trabajo investigativo que se tomó en cuenta es la Universidad Pontificia Católica del
Perú realizada por el Ing. Giancarlo Borjas Giraldo publicada en Lima en el año del 2013 y
titulada análisis, diseño e implementación de un registro informático utilizado lenguajes de
programación y herramientas para la gestión y administración a la hora de registrar, modificar
elementos o gremios establecidos de acuerdo al establecimiento propuesto e implantado, en la
cual su objetivo principal es buscar mejor la gestión para un bien común y de igual manera evitar
confusos errores que cotidianamente lo realizan sin utilizar esta aplicación, provocando hasta la
demora impertinente y molestosa como para los usuarios como para el personal administrativo.

7
2.2. MARCO TEÓRICO

RESEÑA HISTORICA DE LA FEDERACIÓN DE ARTESANOS DE TULCÁN

Según (Burbano, 2018) La Federación de Artesanos es una agrupación de gremio a nivel de la

provincia del Carchi ordenados por diferentes ramas como panificadores mecánicos, maestros,
muebles y conexos. La Federación cuenta con 13 agrupaciones estables.
La federación de Artesanos resulta ser de mucha ayuda para todo aquel artesano que inicia su
negocio pueda disfrutar de derechos que brinda la ley de defensa del artesano.

ARTESANO

Según (Viena, 2015) Un artesano es aquella persona que trabaja algún material con sus manos o
con herramientas manuales, como puede ser un cincel, aunque a veces se vale de herramientas
eléctricas para hacer detalles, como por ejemplo un taladro.
Los objetos que son fruto de su trabajo son llamados artesanías, que suelen ser objetos
decorativos (como cuadros) o de uso diario (como cuchillos o tablas de cortar).
Estas piezas son bastantes diferentes a las que se produce industrialmente, no solo en el acabado,
sino también en la calidad (aunque no siempre es mejor algo artesanal que una pieza industrial).
Generalmente las artesanías son vendidas en puestos callejeros o en ferias, exposiciones, etcétera.

PROBLEMÁTICA DE LA FEDERACIÓN DE ARTESANOS DE LA PROVINCIA DEL

CARCHI.

Desde su creación hasta la fecha la federación de artesanos ha sufrido pérdida y desorganización

de información en varios casos valiosa lo cual ocasiona que los registros que se hacen se vuelvan
a repetir o de plano se elimine el mismo.
Existen 13 gremios en la actualidad los cuales están registrados únicamente en un documento de
Excel exponiéndose a una pérdida total de información de los gremios con sus respectivos
agremiados.

8
FEDERACIÓN DE ARTESANOS

La federación de artesanos de la provincia del Carchi agrupa a todos los artesanos de distintas
ramas y los une a lo que les llaman “Gremios” los cuales están encabezados por su respectivo
presidente, vicepresidente, secretario y vocales. Estos gremios pueden gozar de los derechos que
brinda la ley de defensa del artesano del Ecuador.

DESORGANIZACION Y PÉRDIDA DE DATOS

Dentro de las oficinas de la federación de artesanos se llevan los registros en una hoja de Excel o
fotografías de los listados lo cual por una falla de la computadora administrativa puede perder
toda la información y nuevamente hacer todos los registros causando un desorden en los
agremiados, una gran pérdida de tiempo y malestar por parte de los agremiados.

APLICAION WEB

El éxito espectacular de la web se basa en dos puntales fundamentales: el protocolo HTTP y el

lenguaje HTML.

Uno permite una implementación simple y sencilla de un sistema de comunicaciones que nos
permite enviar cualquier tipo de ficheros de una forma fácil, simplificando el funcionamiento del
servidor y permitiendo que servidores poco potentes atiendan miles de peticiones y reduzcan los
costes de despliegue. El otro nos proporciona un mecanismo de composición de páginas
enlazadas simple y fácil, altamente eficiente y de uso muy simple. (Mateu, 2004).

WWW
La WWW (World Wide Web) o, de forma más coloquial, la web, se ha convertido, junto con el
correo electrónico, en el principal caballo de batalla de Internet. Ésta ha dejado de ser una
inmensa “biblioteca” de páginas estáticas para convertirse en un servicio que permite acceder a
multitud de prestaciones y funciones, así como a infinidad de servicios, programas, tiendas, etc.
(Mateu, 2004).

9
BASE DE DATOS

Una base de datos consiste en un conjunto de datos relacionados y organizados lógicamente en un

dispositivo de almacenamiento (archivero, disco duro, cintas magnéticas, discos ópticos, etc.). En
nuestro caso estamos hablando de bases de datos computarizadas donde el principal dispositivo
de almacenamiento será el disco duro (Rodrìguez, 2010).
Una base de datos está compuesta por los siguientes elementos: dato, campo, registro, tabla y
archivo.
Un dato es la parte esencial de la información, es decir, la información que llega a la base de
datos. Los datos pueden ser de distintos tipos como: texto, numérico, alfanumérico, lógico,
memo, etc. (Rodrìguez, 2010).
Un campo es la unidad más pequeña de datos. Estos los representan las columnas de las tablas.
Registro es un conjunto de campos o atributos relacionados entre sí. Representan las filas de las
tablas.
Tabla: Es el lugar donde la base de datos organiza la información. Esta esa compuesta por filas
(registros) y columnas (campos).
Archivo: es un conjunto de registros relacionados.

SQL SERVER

Rouse,M (2016) Afirma que SQL Server es un sistema de gestión de bases de datos relacionales
(RDBMS) de Microsoft que está diseñado para el entorno empresarial. SQL Server se ejecuta en
T-SQL (Transact -SQL), un conjunto de extensiones de programación de Sybase y Microsoft que
añaden varias características a SQL estándar, incluyendo control de transacciones, excepción y
manejo de errores, procesamiento fila, así como variables declaradas.
Bajo el nombre código Yukon en su etapa de desarrollo, SQL Server 2005 fue lanzado en
noviembre de 2005. Se dice que el producto 2005 proporcionó una mayor flexibilidad,
escalabilidad, confiabilidad y seguridad a las aplicaciones de base de datos, y permitió que fueran
más fáciles de crear y desplegar, lo que reduce la complejidad y el tedio involucrado en la gestión
de bases de datos. SQL Server 2005 también incluía más soporte administrativo.

10
El código original de SQL Server ha sido desarrollado por Sybase; a finales de 1980, Microsoft,
Sybase y Ashton-Tate colaboraron para producir la primera versión del producto, SQL Server 4.2
para OS/2. Posteriormente, tanto Sybase como Microsoft ofrecieron productos de SQL Server.
Sybase cambió después el nombre de su producto a Adaptive Server Enterprise.

VENTAJAS DE SQL SERVER

 Soporte de transacciones.
 Escalabilidad, estabilidad y seguridad.
 Soporta procedimientos almacenados.
 Incluye también un potente entorno gráfico de administración, que Permite el uso de
comandos DDL y DML gráficamente.
 Permite trabajar en modo cliente-servidor, donde la información y datos se alojan en el
servidor y las terminales o clientes de la red sólo acceden a la información.
 Permite administrar información de otros servidores de datos.

2.3 MARCO CONCEPTUAL

ASP.NET: Es un proyecto de Microsoft para crear una nueva plataforma de desarrollo de

software con énfasis en transparencia de redes, con independencia de plataforma de hardware y
que permita un rápido desarrollo de aplicaciones. Basado en ella, la empresa intenta desarrollar
una estrategia horizontal que integre todos sus productos, desde el sistema operativo hasta las
herramientas de mercado.

SQL SERVER: Es un sistema de gestión de bases de datos relacionales (RDBMS) de Microsoft

que está diseñado para el entorno empresarial. SQL Server se ejecuta en T-SQL (Transact -SQL),
un conjunto de extensiones de programación de Sybase y Microsoft que añaden varias
características a SQL estándar, incluyendo control de transacciones, excepción y manejo de
errores, procesamiento fila, así como variables declaradas.
APLICACIONES WEB: En la ingeniería de software se denomina aplicación web a aquellas
herramientas que los usuarios pueden utilizar accediendo a un servidor web a través de Internet o
de una intranet mediante un navegador.

11
NAVEGADOR WEB: Es un programa o Software, por lo general gratuito, que nos permite
visualizar páginas web a través de Internet o en el propio ordenador, además posibilita acceder a
otros recursos de información alojados también en Servidores Web, como pueden ser videos,
imágenes, audio y archivos XML.

SERVIDOR WEB: Es un programa que gestiona cualquier aplicación en el lado del

servidor realizando conexiones bidireccionales y/o unidireccionales y síncronas o asíncronas con
el cliente generando una respuesta en cualquier lenguaje o aplicación en el lado del cliente.

INFORMATICA: la informática se refiere al procesamiento automático de información

mediante dispositivos electrónicos y sistemas computacionales. Los sistemas informáticos deben
contar con la capacidad de cumplir tres tareas básicas: entrada (captación de la
información), procesamiento y salida (transmisión de los resultados). El conjunto de estas tres
tareas se conoce como algoritmo.

BASE DE DATOS: Una base de datos es un conjunto de datos pertenecientes a un mismo

contexto y almacenados sistemáticamente para su posterior uso.

SISTEMA GESTOR DE BASE DE DATOS: es un conjunto de programas que permiten el

almacenamiento, modificación y extracción de la información en una base de datos, además de
proporcionar herramientas para añadir, borrar, modificar y analizar los datos.

ARQUITECTURA CLIENTE SERVIDOR: Esta arquitectura consiste básicamente en un

cliente que realiza peticiones a otro programa (el servidor) que le da respuesta.

FRAMEWORK: En el desarrollo de software, un framework es una estructura de soporte

definida en la cual otro proyecto de software para ayudar a desarrollar y unir los diferentes
componentes de un proyecto.

12
MVC (MODELO VISTA CONTROLADOR): El Modelo Vista Controlador es un patrón de
arquitectura de software que separa los datos y la lógica de negocio de una aplicación de la
interfaz de usuario y el módulo encargado de gestionar los eventos y las comunicaciones.

API: Conjunto de convenciones internacionales que definen como debe invocarse una determina
función de un programa desde una aplicación. Cuando se intenta estandarizar una plataforma, se
estipulas unos API comunes a los que deben ajustarse todos los desarrolladores.

CODIGO FUENTE: Programa en su forma original, tal y como fue escrito por el programador,
el código fuente no es ejecutable por el computador, debe convertirse en lenguaje de maquina
compiladores, ensambladores o intérpretes.

LENGUAJE C#: Es un lenguaje de programación orientado a objetos desarrollado y

estandarizado por Microsoft como parte de su plataforma. Net, que después fue aprobada como
un estándar por la ECMA e ISO. Su sintaxis básica deriva de C/C ++ y utiliza el modelo de
objetos de la plataforma.NET el cual es similar al de Java, aunque incluye mejoras derivadas de
otros lenguajes.

III. METODOLOGÍA

3.1. ENFOQUE METODOLÓGICO

3.1.1. Enfoque de investigación

13
El presente proyecto integrador utiliza un enfoque cuantitativo porque requiere un manejo de
cantidades de datos y cifras para el caso de las administración y control de agremiados de cada
gremio de la Federación de Artesanos al momento de acumulación en la base de datos como en la
interfaz gráfica con el fin de establecer patrones de comportamiento y probar teorías, además de
contar y registrar a los agremiados, las cantidades tanto en el gestor como en el motor que va a
tener la aplicación para la atención al cliente.
También hace referencia al enfoque cualitativo puesto que el programa contiene características y
puede ser descrito mediante palabras o condiciones específicas.

3.1.2. Tipo de Investigación

El tipo de investigación que se ha implementado es la mixta ya que se realizó tanto cantidades a

la hora establecer cantidad de datos como características y cualidades que se ingresaron a la hora
de implementar al proyecto.

El tipo de indagación utilizado para la investigación fue exploratoria al momento de

familiarizarnos con fenómenos desconocidos y obtener información para realizar una
investigación más al momento de revisar, recopilar y analizar información de distintas fuentes
bibliográficas como libros, revistas, tesis y sitios web, para de esta manera cumplir con el
objetivo de fundamentar teóricamente el desarrollo del sistema.
Conjuntamente es de tipo descriptivo porque conocemos las distintas necesidades que presenta el
la Federación de Artesanos de la ciudad de Tulcán además de sus servicios de atención al cliente
y procesos de control de registros de los distintos grupos en el que pertenecen; también se
puntualizan las características del aplicativo.

3.1.3. Clase de Investigación

Para el proyecto propuesto se ha llevado dos tipos de investigación las cuales fueron
investigación básica la cual se nos limita a describir una situación basándose en el desarrollo de
una teoría, y la investigación aplicada la cual depende de los descubrimientos y avances de la

14
investigación básica, pero se caracteriza por su interés en la aplicación, utilización y puesta en
práctica de los conocimientos.

3.2. HIPÓTESIS O IDEA A DEFENDER

El desarrollo de la aplicación web conectada a una base de datos generando mayor eficiencia al
momento de generar un registro y control en el personal administrativo de la Federación de
Artesanos de la provincia del Carchi en la ciudad de Tulcán.

3.3. DEFINICIÓN Y OPERACIONALIZACIÓN DE VARIABLES

Dependiente

Dar recursos técnicos a una actividad determinada para mejorarla e innovarla.

Independiente

El desarrollo de una aplicación web a través de la programación que permiten al usuario entender
el aplicativo a través de una interfaz gráfica.

3.4. MÉTODOS UTILIZADOS

La investigación empírica permite al investigador hace una serie de investigación referente a su

problemática, retomando experiencia de otros autores, para de ahí a partir con sus exploraciones,
también conlleva efectuar el análisis preliminar de la información, así como verificar y
comprobar las concepciones teóricas. Existen varias técnicas para facilitar la recolección de
información, en este caso usamos los más comunes como son: entrevista utilizada para el
levantamiento de requerimientos y encuesta para la recolección de datos.
3.4.1. Análisis Estadístico

GRÁFICO 1
¿Existe alguna plataforma que brinde una comodidad y sencillez al momento de registrarse en el
gremio respectivo de su trabajo?

15
 Fuente: Encuesta realizada en 40 artesanos de la federación.
Elaboración: Grupo De Proyecto.

Se puede apreciar que los artesanos no poseen una herramienta que brinde la comodidad que
merecen al hacer un tipo de registro.
GRÁFICO 2
¿Se actualizan los registros o datos de cada personal de la Federación De Artesanos del Carchi en
un tiempo determinado?

Fuente: Encuesta realizada en 40 artesanos de la federación.

Elaboración: Grupo De Proyecto.
Se observa que una mitas de artesanos actualizan los registros mientras que la otra mitad no lo
hace.

GRÁFICO 3

16
 ¿Lo considera funcional el registro a los diferentes gremios a través de una plataforma
convencional como es el anotarlo en un libro y luego trasladarlo a Excel como plataforma de
almacenamiento de datos?

Fuente: Encuesta realizada en 40 artesanos de la federación.

Elaboración: Grupo De Proyecto.

En la encuesta queda claro que los artesanos no estan tan satisfechos con la manera en que se
llevan los registros.

GRÁFICO 4
¿A parte del registro cree usted que esencial implementar otra funcionalidad ya se le colocar su
cargo o algún otro valor crucial para la asignación del gremio al que pertenecen?

17
 Fuente: Encuesta realizada en 40 artesanos de la federación.
Elaboración: Grupo De Proyecto.

Es importante para los artesanos colocar funciones adicionales en la aplicación para la asignación
del gremio al que pertenecen.
GRÁFICO 5
¿Cree que debería existir el cambio y la modificación de datos tanto el administrador como el
usuario en sí?

Fuente: Encuesta realizada en 40 artesanos de la federación.

Elaboración: Grupo De Proyecto.

La mayoria de artesanos esta en contra de que un usuario pueda alterar datos del administrador y
viseversa.

18
 GRÁFICO 6
¿Es probable que existan confusiones de ingresar los datos al manejar nuestra aplicación web?

Fuente: Encuesta realizada en 40 artesanos de la federación.

Elaboración: Grupo De Proyecto.

La mayoría de artesanos puensa que va a tener confusiones en manejar la aplicación.

GRÁFICO 7

19
¿Cree usted que es recomendable un curso didáctico el funcionamiento de nuestra aplicación web
como fuente de retroalimentación y generar mayor entendimiento a la Federación De Artesanos
del Carchi?

Fuente: Encuesta realizada en 40 artesanos de la federación.

Elaboración: Grupo De Proyecto.

Por el inconveniente de que se puedan dar fallos al hacer registros los artesanos estan de acuerdo
en recibir una capacitacion para poder usar la aplicación.

IV RESULTADOS Y DISCUSIÓN

20
 V CONCLUSIONES Y RECOMENDACIONES

Conclusiones

Una vez desarrollado y finalizado la aplicación web se obtuvieron varias conclusiones que se
citan a continuación:

 Con la implementación de la aplicación web se resolvió el problema que tenían los

usuarios de la Federación de Artesanos de la ciudad de Tulcán, en el registro a sus
diferentes gremios, satisfaciendo sus necesidades, evitando la mala implementación de
asignación y confundirse al momento de registrar a los empleados de estos y así
permitiendo hacerlo desde una forma cómoda y sencilla plan forma como es el internet.

 La aplicación web permite a que el administrador de la empresa en este caso a la

Federación de Artesanos asignarles el gremio correspondiente de su trabajo, además de
facilitar el registro con solo ingresar su número de cedula y datos personales y otros
valores agregados.

 Con la utilización de la aplicación web se logró resolver el problema de los

usuarios(empleados), al tener que ir personalmente a registrarse y tal vez exponiéndose a
malas atenciones o confusiones de administradores o personal encardo del registro de los
gremios.

Recomendaciones

El presente proyecto integrador plantea mejorar el servicio de los usuarios en la Federación de

Artesanos del Carchi, por medio de esta aplicación web, para generar satisfacer las necesidades
de todos los usuarios principalmente los agremiados correspondientes de cada profesión de la
ciudad de Tulcán que son siguientes recomendaciones:

21
  Deberían implementar una aplicación web similar, con la finalidad de fortalecer la
actividad comercial e industrial como también generar al empleado comodidad y
tranquilidad a la hora del registro de los diferentes agremiados.

 Verificar bien sus datos al momento de registrar para evitar posibles malentendidos y
fallas en el sistema.

 Incluir otras opciones como es el caso de ingresar más gremios en el caso de posibles y
nuevas profesiones.

VI PROPUESTA DEL PROYECTO

Se asistió a la federación de artesanos del Carchi con un oficio con el fin de adquirir información
que nos sirvió para la realización de la base de datos, como por ejemplo para la creación de las
tablas, relaciones y cardinalidad. La información y la documentación brindada por el propietario
fueron de mucha ayuda para la realización de la interfaz de la aplicación que facilitaron la
organización y la seguridad de la documentación, con el fin de asegurar una mejor funcionalidad
sobre la aplicación y brindar así lo requerido por la Federación.

6.1 Desarrollo de la propuesta

6.1 1 Alcance cronograma

La aplicación web logró realizar el registro de gremios como: fotógrafos, interprofesionales 15 de

mayo, interprofesionales 15 de agosto, interprofesional cantón espejo, maestros mecánicos,
panificadores, belleza y conexos del Carchi, maestros profesionales en belleza y afines del
Carchi, maestros eléctricos y sastres.

En el caso de crear nuevos gremios en línea no fue posible realizarla por motivos de que nos
enfocamos más en el registro de los gremios ya existentes de la Federación de Artesanos.

22
6.1.2 Trello

Url de la herramienta: https://trello.com/b/m4WhiHEv/federaci%C3%B3n-de-artesanos-del-

carchi

23
6.1.3 Diagrama de Base De Datos

Contiene
n
1

Contiene

n
Registra n

n
Contiene
n

Tiene 1

1
Está

24
6.1.4 Diagrama de Proceso BPM

25
6.1.5 Matriz de Involucrados

Grupos
Problemas Intereses Estrategias Acuerdos y Compromiso
Involucrados
Tiempo escaso para Generar espacios de
dirigirse a la Federación dialogo para compartir Realizar un trabajo Construcción de un espacio p
Personal
de artesanos del Carchi sus ideas y contribuir colaborativo que compartir cualquier duda e
Artesano
al correspondiente con el social del otro ayude a sobrellevar inquietud generada en la
registro. gremio. la carga de trabajo. Federación.
Exista mayor tolerancia Aprender en un
Dificultad a la hora de y respeto frente a sus ambiente seguro y
Agremiado seleccionar el gremio ideas por parte de sin presión. Establecer relaciones de tole
perteneciente para cada todo el personal quien y respeto frente a los demás
personal artesano. lo conforman. gremios.
Falta de organización por Realicen sus labores Generar un
parte de los gremios y correspondientes. ambiente de dialogo
Gremios
muy poco interés en el y cooperación. organizas las tareas de labor
Pertenecientes
bienestar de la correspondientes evitando
institución. confusiones.
Mejore la motivación Mayor organización
personal no quieren de la institución para y compromiso así la
Cantón de
asistir a una ubicación así tener un mejor institución. Apoyar y motivar a la instituc
Ubicación
determinada por rendimiento de con mentalidad de sobresalir
motivos de lejanía. trabajo. día más.

26
27
 6.1.6 Cronograma y Matriz de Responsabilidad

Periodo académico
Actividad Mes 1 Mes 2 Mes 3 Mes 4 Mes 5
1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4
Levantamiento de requerimientos
Procesos
Cronograma de actividades
Base de datos
Modelo Conceptual
Modelo Lógico
Modelo Físico
Desarrollo de aplicación
UML
Menús
Interfaces
Pruebas
Programación
Revisión final del documento
Revisión final de la aplicación
Entrega del proyecto integrador de saberes

Defensa del proyecto integrador de saberes

28
 Gestión de Proyectos Integral
Contribuye C
Responsable Primordial ℗
N° del Proyecto: PRO-001

Nombre del Proyecto: Desarrollo de una Aplicación Web para la Gestión de Agremiados para
la Federación de Artesanos de la provincia del Carchi

Director del Proyecto: Alvaro Castillo - Isaac Obando - Fernando Farinango

DIRECTOR

Técnico 1

Técnico 2
ALVARO CASTILLO
PATROCINADORA

ISAAC OBANDO

FARINANGO
FERANDO

1. Análisis de
Requerimientos
1.1. Levantar requisitos de
hardware ℗ ℗ ℗
1.1.1. Requerimientos mínimos
de hardware: características
mínimas indispensables para ℗ ℗ C
ejecutar la aplicación
correctamente
1.1.2. Requerimientos
recomendados de hardware:
características más apropiadas
que debe tener el hardware para ℗ ℗
poder ejecutar una aplicación
específica.

29
2 Levantar requisitos en
software ℗ ℗ ℗
2.1. Obtención de información
sobre los requerimientos
funcionales y requerimientos no C ℗ C
funcionales de software

2.2. Estudio del entorno de

trabajo de los usuarios, clientes e
interesados de proyecto C ℗ C ℗
(Stakeholders).

2.3. Entrevistas con los usuarios

o interesados clave C ℗ C ℗
2.4. Deseos y necesidades de los
interesados C ℗ C

2.5. Recopilación de los

requerimientos C ℗ C ℗
2.6. Mesas de trabajo
(Workshops) Obtención de C ℗ C
información rápida

2.7. Sesiones de trabajo

estructurada orientada para
obtener la mayor cantidad de C ℗
ideas posibles

2.8. Historia de usuarios (Rol, la

funcionalidad y el resultado
esperado de la aplicación en una C C ℗
frase corta.)

3. Levantar Procedimientos a
Automatizar ℗ ℗ ℗
3.1. Definición de la información
clave y actividades C ℗ ℗ ℗
3.2. Modelación del proceso en
una herramienta de ℗ C ℗
automatización
3.3. Capacitación a los usuarios,
prueba de los procesos. ℗ C ℗

30
3.4. Monitoreo del rendimiento ℗ ℗ ℗
3.5. Revisión del proceso e
identificación del área a mejorar C ℗ C C

6.1.7 Diseño de la Aplicación/Prototipo (Balsamiq)

31
32
6.1.8 Diccionario de datos

33
Como primer paso en base a los requerimientos levantados se procedió a la elaboración de las
tablas que contiene nuestra base de datos, esta base está conformada por seis tablas las cuales están
relacionadas de la forma adecuada para así poder satisfacer la gestión y control de registros que
presta la federación de Artesanos de la provincia del Carchi; además estas tablas cuentan con sus
atributos respectivamente.

DICCIONARIO DE DATOS

Empleados
Column Name Data Type Allow Nulls
idEmpleado int
Artesanos
Nombre varchar(50) Column Name Data Type
Cargo varchar(50) idEmpleado int
FechadeNacimiento varchar(30) idGremio int
Edad varchar(10)
Telefono varchar(10)

Gremios
Canton Column Name Data Type Allow Nulls
Column Name Data Type
idGremio int
idCanton int
Nombregremio varchar(50)
nombrecanton varchar(40)
Descripcion varchar(50)
Fechacreacion varchar(30)
idAgremiado int

Agremiados
Column Name Data Type
idAgremiado int Local
Nombre varchar(50) Column Name Data Type Allow Nulls

Fechanacimiento varchar(30) idLocal int

Edad nchar(10) Nombre varchar(50)

Email varchar(60) Ruc varchar(15)
Cargo varchar(50) Direccion varchar(80)
idCanton int Telefono nchar(10)
idLocal int

Gráfico 8: Modelo de la base de datos

34
 TABLA 1: EMPLEADOS

Gráfico 9: Tabla de Empleados

En la tabla empleados se encuentran las siguientes entidades: id del Empleado, Nombre, Cargo,
Fecha de Nacimiento, Edad, Teléfono. Básicamente esta tabla se encarga de almacenar un listado
de los empleados que tiene la federación de artesanos del Carchi.

TABLA 2: ARTESANOS

Gráfico 10: Tabla Artesanos

La tabla artesanos contiene los empleados y los gremios de la federación la cual se podría decir
que es una tabla intermedia.

TABLA 3: CANTÓN

35
 Gráfico 11: Tabla Cantón

La tabla Canton unicamente almacena las entidades de id del canton y el Nombre del Canton no
sirve para almacenar el listado de cantones de los diferentes negocios de cada uno de los artesanos.

TABLA 4: GREMIOS

Gráfico 12: Tabla Gremios

La tabla gremios contiene las entidades de id del gremio, nombre del gremio, descripcion, fecha de
creacion del gremio y el ide del agremiado. Esta tabla almacena los gremios registrados de la
federación de artesanos con su clave foranea de id del agremiado para poder hacer algun tipos de
subconsulta.

TABLA 5: AGREMIADOS

36
 Gráfico 13: Tabla agremiados

La tabla agremiados tiene las entidades de id del agremiado, nombre, fecha de nacimiento, edad, e-
mail, cargo, id del canton, id del local. Esta tabla almacena un listado de los agremiados de la
federación de artesanos, tabla anexada con las tablas de canton y local para futuras subconsultas.

TABLA 6: LOCAL

Gráfico 14: Tabla Local

La tabla local posee las entidades de id del local, nombre, ruc, direccion, telefono. Tabla que
servirá para almacenar un listado de los locales que pertenecen a los artesanos con sus respectivos
campos.

6.2Requerimientos

37
Se asistió a la Federación de Artesanos del Carchi con un oficio con el fin de adquirir información
que nos sirvió para la realización de la base de datos, como por ejemplo para la creación de tablas,
relaciones y cardinalidad. La información y la documentación brindada por el propietario fueron de
mucha ayuda para la realización de la interfaz de la aplicación que facilitaron la organización y
seguridad de la documentación, con el fin de asegurar una mejor funcionalidad sobre la aplicación
y brindar así lo requerido por la Federación.

6.2.1 Modelado conceptual

6.2.1.1 Diagrama entidad – Atributos

6.2.1.2 Tablas de identidades

38
Para la creación de nuestra base de datos obtuvimos la creación de seis tablas con sus respectivas
entidades las cuales van a ser indicadas a continuación.

Tabla 7

Tabla 7-Empleados

Tabla 8

Tabla 8-Gremios

Tabla 9

Tabla 9-Artesanos

Tabla 10

39
 Tabla 10-Canton

Tabla 11

Tabla 11-Agremiados

Tabla 12

Tabla 12-Local

6.3.1 Cardinalidad

40
6.3.2 Normalización

La normalización es el proceso de organizar los datos de una base de datos. Se incluye la creación
de tablas y el establecimiento de relaciones entre ellas según reglas diseñadas tanto para proteger
los datos como para hacer que la base de datos sea más flexible al eliminar la redundancia y las
dependencias incoherentes. Estas 3 reglas de Normalización se las conoce como las 3 FORMAS
NORMALES. (López, 2015)

6.3.2.1 Primera forma normal

Esta primera Forma Normal, nos lleva a no repetir datos en nuestras tablas. Los famosos
maestros –detalle, deben aplicarse a la estructura de la tabla. Si nuestra tabla de ventas repite una y
otra vez (por cada registro) el nombre, gremio y otros datos del, es que no hemos aplicado esta
Normalización. (López, 2015)
Tabla 13

41
 Tabla13.- Tabla con datos completos

6.3.2.2 Segunda forma normal

(Si o si debe estar previamente aplicada la Primera Forma Normal) La Segunda Forma Normal nos
habla de que cada columna de la tabla debe depender de la clave. Esto significa que todo un
registro debe depender únicamente de la clave principal, si tuviéramos alguna columna que se
repite a lo largo de todos los registros, dichos datos deberían atomizarse en una nueva tabla.
Veamos un ejemplo: (López, 2015)
Tabla 14

Tabla14.-Tabla con datos normalizados

42
Una tabla 1 estará en tabla 2 si y solo si, dada una clave primaria y cualquier atributo que no sea un
constituyente de la clave primaria, el atributo no clave depende de toda la clave primaria en vez de
solo una parte de ella.

6.3.2.3 Tercera forma normal

Cumple con las 3 formas normales, ya que la 3ra Forma Normal nos habla de que:
1) Ninguna Columna puede depender de una columna que no tenga una clave
2) No puede haber datos derivados (López, 2015)

Tabla 15

Tabla15.-Tabla normalizada

43
 VII. REFERENCIAS BIBLIOGRÁFICAS

7.1 Bibliografía

Duque, A. E. (2008). programa enserio con visual basic . Obtenido de programa enserio con visual
basic : https://infopadresjag.files.wordpress.com/2009/03/funciones-de-visual.pdf

Mateu, C. (2004). desarrollo de aplicaciones web. Obtenido de desarrollo de aplicaciones web:

http://libros.metabiblioteca.org/bitstream/001/591/1/004%20Desarrollo%20de
%20aplicaciones%20web.pdf

Mendioroz, M. A. (2017). sistema de gestion de incidencias. Obtenido de sistema de gestion de

incidencias: http://oa.upm.es/47458/3/TFC_MIGUEL_AMBROS_MENDIORORZ.pdf

ROBERTO, A. G. (2015). SISTEMA INFORMATICO CON INTERFAZ WEB PARA EL

REGISTRO. Obtenido de SISTEMA INFORMATICO CON INTERFAZ WEB PARA EL
REGISTRO: http://ri.ues.edu.sv/id/eprint/8401/1/Tesis%20Siadace.pdf

TASÉ, R. O. (2013). SISTEMA DE CONTROL DE ASISTENCIA. Obtenido de SISTEMA DE

CONTROL DE ASISTENCIA: http://repositorio.utc.edu.ec/bitstream/27000/1653/1/T-
UTC-1527.pdf

Urrutia, V. I. (2016). Sistema de control de asistencia de personal. Obtenido de Sistema de control

de asistencia de personal:
http://repobib.ubiobio.cl/jspui/bitstream/123456789/1592/1/Cantillana%20Flores
%20Felipe.pdf

VELA, W. E. (2010). Automatización de procesos de ingreso . Obtenido de Automatización de

procesos de ingreso : http://biblioteca.usac.edu.gt/tesis/08/08_0485_CS.pdf

44
 VIII. ANEXOS

ENCUESTA AL PERSONAL FEDERACIÓN DE ARTESANOS DEL CARCHI EN LA CIUDAD

DE TULCAN

N° Registro De Personal Federación De Artesanos del Carchi 100% 50% 0%

¿Existe alguna plataforma que brinde una comodidad y

1 sencillez al momento de registrarse en el gremio respectivo de
su trabajo?
X
¿Se actualizan los registros o datos de cada personal de la
2 Federación De Artesanos del Carchi en un tiempo
determinado?
X
¿Lo considera funcional el registro a los diferentes gremios a
3
través de una plataforma convencional como es el anotarlo en
un libro y luego trasladarlo a Excel como plataforma de X
almacenamiento de datos?
¿A parte del registro cree usted que esencial implementar otra
4 funcionalidad ya se le colocar su cargo o algún otro valor
crucial para la asignación del gremio al que pertenecen?
X
5
¿Cree que debería existir el cambio y la modificación de datos
tanto el administrador como el usuario en sí? X
6
¿Es probable que exista confusiones de ingresar los datos al
manejar nuestra aplicación web? X
¿Cree usted que es recomendable un curso didáctico el
7
funcionamiento de nuestra aplicación web como fuente de
retroalimentación y generar mayor entendimiento a la X
Federación De Artesanos del Carchi?

8.1. Manual de usuario

MANUAL DE USUARIO

Introduccion
La aplicación web de gestión de registro, está pensada y diseñada para facilitar a los usuarios de la
federación de agremiados, los mecanismos de actualización de datos y gestión de sus usuarios.
Actualmente existen dos roles para acceder a la aplicación: USUARIO ESTANDAR y USUARIO
ADMINISTRADOR.

45
ENTRADA AL SISTEMA
Para acceder a la aplicación, el usuario debe de hacer uso de sus credenciales de acceso (usuario y
contraseña).
 IMPORTANTE:
o En caso el cliente no tenga credenciales de acceso y la entidad ya existiese dada de alta en
nuestra base de datos, debe registrarse en el apartado de registro.

Portal de entrada
Para acceder a la aplicación se utilizará el siguiente enlace:
http://localhost:49812/Inicio
Al dar clic en la URL podrá ver el portal de entrada a la aplicación, desde donde puede acceder a la
aplicación con sus credenciales y/o acceder a los formularios de registro en caso de que sea
administrador.

Interfaz de inicio

Inicio: Nos redijera a la página principal

Acerca de: Nos mostrara información acerca de la federación
Registro: Podremos agregar un nuevo agremiado
Registrarse: Podremos registrarnos como clientes
Inicia sesión: En caso de ya tener un usuario y contraseña podremos acceder a la demás
información.

46
Interfaz de detalle

Detalle: Nos dará información acerca de cada ocupación

Interfaz de registro

IdGremio: Asignaremos un id a cada gremio

Nombre: Ingresaremos el nombre del gremio al que pertenece el agremiado
Descripción: Ingresaremos un detalle rápido del gremio
Fecha Registro: Se ingresará la fecha en la que se registró un nuevo agremiado

47
Guardar: Guardara toda la información agregada en la base de datos
Lista: Mostrara una interfaz de todos los gremios registrados
Interfaz de Lista

Crear Nuevo: Nos redirigirá a la página de registro

Editar: Editara un registro
Detalles: Mostrara los detalles del registro
Eliminar: Eliminara el registro
Interfaz de Editar

48
En esta interfaz podremos Editar si algún registro fue mal ingresado.
Guardar: Guardara el registro corregido

Interfaz de detalles

Nos mostrara de forma detallada el registro ingresado, en donde también podremos editar o
regresar a la lista general.

49
8.1.2 Código Fuente Index

@{
ViewBag.Title = "Index";
}
<link href="~/css/estiloportada.css" rel="stylesheet" type="text/css" />
<link href="~/css/tabla.css" rel='stylesheet' type='text/css' />
<link href="~/css/tooplate_style.css" rel="stylesheet" type="text/css" />
<link href="~/css/producto.css" media="screen" title="shadow" rel="stylesheet"
type="text/css" />
<link href="~/css/stilosproductos.css" rel="stylesheet" type="text/css" />

<body>
<br>
<br>
<br>
<style type="text/css">
body {
background-image: url('../../img/1516578954.jpg');
background-size: 100% 100%;
background-attachment: fixed;
}
</style>

<div class="jumbotron text-center">

<font face="Bookman Old Style"><h1>FEDERACIÓN DE ARTESANOS DEL CARCHI</h1></font>

<div class="slider">

<ul>

<li>
<img src="~/img/imagen1.jpg" alt="" />
</li>
<li>
<img src="~/img/artesania-compras.jpg" alt="" />
</li>
<li>
<img src="~/img/panadero-en-accion.jpg" alt="" />
</li>

<li>
<img src="~/img/594175f8ed077.jpg" alt="" />
</li>
</ul>
</div>

</div>

50
<center>
<img src="http://www.artesanos.gob.ec/institutos/wp-content/uploads/2018/10/5.jpg" alt="Junta
Nacional de Defensa del Artesano" longdesc="logdesc/longdesc.html">
</center>

<div class="conten-all">

<table border="0">
<tr>

<th>
<div class="content-img">
<img src="~/img/171128_CASA_ARTESANIAS2.jpg">
<div class="conten-txt">
<h2>Carpintero</h2>
<p>No muchas frutas le ganan al durazno en su seductora deleitabilidad.</p>
</div>
<div class="conten-1"></div>
<div class="conten-2"></div>
<div class="conten-3"></div>
<div class="conten-4"></div>
</div>
<center>

<input type="button" value="Detalles" class="boton_personalizado">

</center>
</th>

<th>
<div class="conten-all">
<div class="content-img">
<img src="~/img/artesanos.jpg">
<div class="conten-txt">
<h2>Pintor</h2>
<p>Se conocen en el mundo más de 1.000 variedades de fresón, fruto de la gran capacidad de
hibridación que tiene esta especie.</p>
</div>
<div class="conten-1"></div>
<div class="conten-2"></div>
<div class="conten-3"></div>
<div class="conten-4"></div>
</div>
</div>
<center>

<input type="button" value="Detalles" class="boton_personalizado">

</center>
</th>

<td>
<div class="conten-all">

51
<div class="content-img">
<img src="~/img/agricultor-sembrando.jpg">
<div class="conten-txt">
<h2>Agricultor</h2>
<p>De su composición nutritiva, destaca su escaso valor energético, gracias a su elevado
contenido en agua y su riqueza de vitamina C, ácido fólico y minerales como el potasio, el
magnesio y calcio.</p>
</div>
<div class="conten-1"></div>
<div class="conten-2"></div>
<div class="conten-3"></div>
<div class="conten-4"></div>
</div>
</div>
<center>

<input type="button" value="Detalles" onclick="location.href = 'detalleNaranja.jsp'"

class="boton_personalizado">
</center>
</td>
</tr>

<tbody>
<tr>
<td>
<div class="conten-all">
<div class="content-img">
<img src="img/uva.jpg">
<div class="conten-txt">
<h2>Uva</h2>
<p>Las uvas contienen altas cantidades de ácido elágico y cafeico que desactivan los
carcinógenos, así como son ricas en potasio y en azúcares.</p>
</div>
<div class="conten-1"></div>
<div class="conten-2"></div>
<div class="conten-3"></div>
<div class="conten-4"></div>
</div>
</div>

<center>
<input type="button" value="Comprar" class="boton_personalizado">
<input type="button" value="Detalles" class="boton_personalizado">
</center>

<br>

<tbody />
</table>

</div>

52
</body>

53