UNIVERSIDAD PÚBLICA DE EL ALTO

CARRERA: INGENIERÍA DE SISTEMAS

PROYECTO DE GRADO

“PORTAL WEB COMO PLAN ESTRATÉGICO PARA EL ACCESO RÁPIDO

A RECURSOS Y SERVICIOS QUE BRINDA LA CIUDAD DE EL ALTO”

CASO: GOBIERNO AUTÓNOMO Y MUNICIPAL DE EL ALTO

Para optar el título de Licenciatura en Ingeniería de Sistemas

MENCIÓN: INFORMÁTICA Y COMUNICACIONES

Postulante: Univ. Oscar Alfredo Benito Mamani

Tutor Metodológico: Ing. Marisol Arguedas Balladares
Tutor Especialista: Lic. Freddy Salgueiro Trujillo
Tutor Revisor: Ing. Yolanda Escobar Mancilla
EL ALTO – BOLIVIA

2020
 I

DEDICATORIA

A Dios, que siempre ha estado a mi lado para fortalecerme, cuidarme,

enseñarme a no darme por vencido nunca y que todo es posible si vamos de
su mano.

A mis padres Oscar Benito Pongo y Brígida Mamani Huanca y mi hermano

Miguel Ángel, que siempre me alentaron para seguir adelante, apoyándome
todo el tiempo para culminar mis estudios.

A mis mamitas, mis tíos, tías, primas quienes me alentaron y confiaron en mí a

pesar de la distancia.

A todos mis amigos y compañeros por su ayuda desinteresada durante el

transcurso de nuestro tiempo en la carrera.
 II

AGRADECIMIENTOS

Agradezco a Dios por haberme ayudado siempre, por haberme permitido estar
en este punto de mi vida, haber guardado mi vida en todo este tiempo de
Universidad y por poner en mi vida a los mejores ejemplos que pude tener, mis
padres, mi hermano, toda mi familia, a los docentes que Dios puso en mi vida
para brindarme su conocimiento y a las personas que Dios puso en mi camino
para enseñarme algo siempre y que a pesar de todo nunca me desamparo ni
me dejo solo, gracias Dios.

A todos los Docentes de la Carrera Ingeniería de Sistemas, por haberme

inculcado sus conocimientos y valores.

A mi padre Oscar Benito Pongo, mi madre Brígida Mamani Huanca y mi

hermano Miguel Ángel, que siempre me brindaron su ayuda y apoyo en todo el
transcurso del tiempo de la Universidad, porque siempre me apoyaron sin
importar la situación en la que estuviera.

A la Ing. Marisol Arguedas Balladares, por su guía, sus recomendaciones y

colaboración para el desarrollo y culminación de este Proyecto de Grado.

Al Ing. Freddy Salgueiro Trujillo, por sus observaciones, colaboración y tiempo

proporcionado para el desarrollo y conclusión del presente Proyecto de Grado.

A la Ing. Yolanda Escobar Mancilla, por su guía, motivación, observaciones,

colaboración y recomendaciones para el desarrollo y culminación del presente
Proyecto de Grado.
 III

RESUMEN

La cultura y el turismo en la actualidad ha adquirido gran importancia, atractivos

turísticos como sitios naturales, monumentos históricos, museos, iglesias y
distintas manifestaciones culturales que forman parte del atractivo cultural y
turístico de una ciudad, por lo tanto, la difusión y la manera de acceder a la
información turística de estas es importante, no solo para su difusión sino para
su preservación y apreciación.

De esta manera se propone una forma distinta de conocer y realizar una visita
a actividades culturales, así también a lugares turísticos de la ciudad de El Alto,
en este caso las actividades culturales que existe dentro de la ciudad, lugares
turísticos, iglesias que forman parte del patrimonio histórico de la ciudad de El
Alto, haciendo uso de un Portal web y aprovechando que la mayor parte de la
población cuenta con dispositivos que tienen acceso a internet. Con la
implementación de un Portal Web se pretende que los visitantes y pobladores
puedan tener una mejor experiencia al realizar sus visitas, recorridos y puedan
tener al alcance la información sobre las actividades culturales, atractivos
turísticos y servicios que ofrece la ciudad de El Alto.

El presente proyecto tiene como finalidad el desarrollo de un portal web que

permita facilitar la obtención de información y ubicación de los principales
centros turísticos y servicios que ofrece la ciudad de El Alto, facilitando el
desplazamiento de los visitantes y pobladores; además de promover las
actividades culturales y atractivos turísticos. Para su implementación se utilizó
la metodología UWE, misma que nos guiará desde la recopilación de los
requerimientos, el diseño y su posterior desarrollo e implementación.
 IV

ÍNDICE GENERAL

Pág.

ÍNDICE GENERAL .......................................................................................................... IV

CAPÍTULO I
MARCO PRELIMINAR
1.1. INTRODUCCIÓN ............................................................................................................ 1
1.2. ANTECEDENTES ............................................................................................................ 2
1.2.1. Antecedentes de la Institución...................................................................................... 2
Figura Nro. 1.1: Organigrama Órgano Ejecutivo del GAMEA .......................................... 5
1.2.2. Antecedentes Académicos ............................................................................................ 6
Nacionales ................................................................................................................................ 7
1.3. PLANTEAMIENTO DEL PROBLEMA ................................................................................ 8
1.3.1. Problema Principal ....................................................................................................... 8
1.3.2. Problemas Secundarios................................................................................................. 9
1.4. OBJETIVOS .................................................................................................................. 10
1.4.1. Objetivo General ........................................................................................................ 10
1.4.2. Objetivos Específicos .................................................................................................. 10
1.5. JUSTIFICACIÓN............................................................................................................ 11
1.5.1. Justificación Técnica ................................................................................................... 11
1.5.2. Justificación Económica .............................................................................................. 12
1.5.3. Justificación Social ...................................................................................................... 12
1.6. METODOLOGÍA ........................................................................................................... 13
1.6.1. Método de Ingeniería ................................................................................................. 14
1.7. HERRAMIENTAS.......................................................................................................... 15
1.7.1. HTML5 ........................................................................................................................ 15
1.7.2. CSS ............................................................................................................................. 16
1.7.3. JavaScript ................................................................................................................... 16
1.7.4. Python ........................................................................................................................ 16
1.7.5. Gestor de Base de Datos ............................................................................................. 16
1.8. LIMITES Y ALCANCES ................................................................................................... 17
1.8.1. Limites........................................................................................................................ 17
 V

1.8.2. Alcances ..................................................................................................................... 17

1.9. APORTES .................................................................................................................... 18
CAPÍTULO II
MARCO TEORICO
2.1. INTRODUCCIÓN .......................................................................................................... 21
2.2. PORTAL WEB .............................................................................................................. 21
2.2.1. Definición ................................................................................................................... 21
2.2.2. Características del portal web ..................................................................................... 23
2.2.3. Portales Web más Populares 2020 .............................................................................. 25
2.3. PLAN ESTRATEGICO .................................................................................................... 26
2.4. PORTAL WEB COMO PLAN ESTRATEGICO .................................................................... 26
2.5. RECURSOS Y SERVICIOS .............................................................................................. 27
2.6. PORTAL WEB COMO PLAN ESTRATEGICO PARA EL ACCESO A RECURSOS Y SERVICIOS 27
2.7. INTERNET ................................................................................................................... 27
2.7.1. ELEMENTOS DE INTERNET .......................................................................................... 28
2.7.2. DIFERENCIAS ENTRE INTERNET, INTRANET Y EXTRANET .............................................. 29
Tabla N° 2.1: Comparación entre Internet, Intranet y Extranet.................................... 29
2.8. INGENIERIA DE SOFTWARE ......................................................................................... 30
2.8.1. MODELO DE DESARROLLO DE SOFTWARE ................................................................... 30
2.8.2. METODOLOGÍA TRADICIONALES .................................................................................... 31
2.8.3. METODOLOGÍAS AGILES ................................................................................................ 32
Figura N° 2.1: Calidad de una metodología .................................................................. 33
2.8.4. DIFERENCIAS ENTRE LAS METODOLOGÍAS ÁGILES Y LAS METODOLOGÍAS TRADICIONALES
34
Tabla N° 2.2: Diferencias entre metodologías agiles y tradicionales ............................ 34
2.9. METODOLOGIA DE DESARROLLO UWE ....................................................................... 34
2.9.1. ACTIVIDADES DE MODELADO DE UWE ........................................................................ 35
Figura Nro. 2. 2: Fases de la Metodología UWE ........................................................... 35
2.9.2. CARACTERISTICAS ....................................................................................................... 35
2.9.3. FASES DE LA METODOLOGÍA UWE .............................................................................. 36
2.9.4. CICLO DE VIDA DE LA METODOLOGIA UWE ................................................................. 37
2.9.5. DIAGRAMA DE CASO DE USO ...................................................................................... 37
 VI

2.10. Arquitectura de software ............................................................................................ 38

2.10.1. PATRÓN MODELO VISTA TEMPLATE .......................................................................... 38
Figura Nro. 2.3: Modelo Vista Template ...................................................................... 39
2.10.2. CICLO DE VIDA DEL MVT ............................................................................................. 39
Figura Nro. 2.4: Esquema Interno del ciclo de Vida del MVT ....................................... 40
2.10.3. VENTAJAS Y DESVENTAJAS DEL MVT ........................................................................... 40
2.11. MODELO CLIENTE SERVIDOR ...................................................................................... 41
Figura Nro. 2.5: Modelo cliente servidor ..................................................................... 41
2.12. METRICAS DE CALIDAD ............................................................................................... 41
Figura Nro. 2.6: Modelo cliente servidor ..................................................................... 43
2.12.1. FACTORES DE METRICAS DE CALIDAD ......................................................................... 43
Tabla 2.3: Métricas de Calidad .................................................................................... 43
2.13. MÉTODO DE ESTIMACIÓN DE COSTOS DEL SOFTWARE ............................................... 45
2.13.1. COCOMO I .................................................................................................................. 45
2.13.2. ANALISIS DE COSTO DE SOFTWARE CON COCOMO I ................................................... 46
2.13.3. METODO DE ESTIMACIÓN .......................................................................................... 46
Tabla 2.4: Ecuaciones del modelo COCOMO ............................................................... 47
Tabla 2.5: Ecuaciones del modelo intermedio de COCOMO ........................................ 48
2.13.4. COCOMO II ................................................................................................................. 50
Tabla N° 2.6. : Productividad para el modelo de composición de Aplicación................ 51
2.14. HERRAMIENTA DE DESARROLLO ................................................................................. 52
2.14.1. SERVIDOR APACHE ..................................................................................................... 54
2.14.2. Sistema Gestor Base de Datos (SGDB) ......................................................................... 54
2.14.3. LENGUAJE DE PROGRAMACION .................................................................................. 55
2.14.4. FRAMEWORK PARA EL DESARROLLO .......................................................................... 56
2.15. SEGURIDAD DEL SISTEMA ........................................................................................... 57
2.15.1. ESTANDAR ISO 27000 ................................................................................................. 57
2.15.2. CRIPTOGRAFIA MD5 ................................................................................................... 58
CAPÍTULO III
MARCO APLICATIVO
3.1. INTRODUCCION .......................................................................................................... 60
 VII

Tabla No 3.1: Fases y procesos metodología UWE ................................................................... 60

Fuente: (Elaboración propia) ................................................................................................... 61
3.2. ANÁLISIS DE LA SITUACIÓN ACTUAL ............................................................................ 61
Tabla N° 3.2. : Diagrama General de Flujo de Procesos del Portal Web .................................... 63
3.3. ANÁLISIS DE REQUERIMIENTOS .................................................................................. 64
3.3.1. Requerimiento de Hardware....................................................................................... 64
Tabla Nro. 3.3: Requisitos de Hardware .................................................................................. 64
3.3.2. Requerimiento de Software ........................................................................................ 66
3.3.3. Funciones del Sistema ................................................................................................ 66
3.3.4. Requerimientos del sistema........................................................................................ 67
3.3.5. Requisitos Funcionales............................................................................................... 67
3.3.6. Requerimientos No Funcionales ................................................................................. 67
3.3.7. ROLES ......................................................................................................................... 68
3.4. ANÁLISIS DE REQUERIMIENTOS Y DISEÑO DEL SISTEMA.............................................. 68
3.4.1. Diagrama de Clases..................................................................................................... 70
3.5. APLICACIÓN DE LA METODOLOGIA UWE .................................................................... 71
3.5.1. Análisis de Requerimientos ......................................................................................... 71
Figura Nro. 3. 3: Actores.............................................................................................. 72
Figura Nro. 3. 4: Actores del Portal web ...................................................................... 72
Figura Nro. 3. 5: Casos de uso del usuario ................................................................... 74
Figura Nro. 3. 6: Casos de uso del Portal Web ............................................................. 76
Figura Nro. 3. 8: Casos de uso de Ubicación ................................................................ 78
Figura Nro. 3. 9: Casos de uso de Búsqueda ................................................................ 79
Figura Nro. 3. 10: Casos de uso del módulo de Traducción .......................................... 80
Figura Nro. 3. 11: Casos de uso de los Recursos y Servicios ......................................... 81
Figura Nro. 3. 12: Casos de uso de los Reportes y estadísticas .................................... 81
Tabla N° 3.4. Administración del Sistema .................................................................... 82
Tabla N° 3.5. Usuario................................................................................................... 82
Tabla N° 3.6. Administración del Sistema .................................................................... 82
Tabla N° 3.7. Ubicación ............................................................................................... 83
Tabla N° 3.8. Búsqueda ............................................................................................... 83
 VIII

Tabla N° 3.9. Traducción ............................................................................................. 83

Tabla N° 3.10. Recursos y Servicios ............................................................................. 84
Tabla N° 3.11. Reportes y Estadísticas ......................................................................... 84
3.6. DISEÑO ....................................................................................................................... 84
3.6.1. Fase de Inicio .............................................................................................................. 84
3.6.2. Fase de Elaboración .................................................................................................... 85
Figura Nro. 3. 13: Diagrama de Clases ........................................................................ 85
3.7. DESARROLLO DEL MODELO ........................................................................................ 86
3.7.1. Modelo Conceptual .................................................................................................... 86
Figura Nro. 3. 14: Modelo conceptual con diagrama de clases .................................... 86
Figura Nro. 3. 15: Modelo conceptual general con diagrama de clases ........................ 87
3.7.2. Modelo de usuario ..................................................................................................... 88
Figura Nro. 3. 16: Modelo del usuario con diagrama de clases .................................... 88
3.7.3. Modelo de Navegación ............................................................................................... 89
Figura Nro. 3. 17: Modelo del panel de Administración con diagrama de clases .......... 89
3.7.4. Modelo de procesos ................................................................................................... 91
Figura Nro. 3. 19: Modelo de navegación de procesos con diagrama de clases ........... 91
3.7.5. Modelo de presentación ............................................................................................. 92
Figura Nro. 3. 20: Modelo de presentación del usuario ............................................... 92
Figura Nro. 3. 23: Modelo de presentación del panel administrativo........................... 94
Figura Nro. 3. 24: Modelo de presentación de recursos y servicios ............................. 95
3.8. FASE DE CONSTRUCCIÓN ............................................................................................ 95
3.8.1. Base de Datos ............................................................................................................. 95
Figura Nro. 3. 25: Modelo de lógico con diagrama de clases ....................................... 96
3.8.2. Patrón Modelo Vista Controlador ............................................................................... 96
3.8.3. Diseño de Interfaces ................................................................................................... 97
Figura Nro. 3. 26: Interface de la presentación en modo escritorio ............................. 98
Figura Nro. 3. 27: Interface de la presentación en modo móvil ................................... 99
3.9. LA INSTALACIÓN O FASE DE IMPLEMENTACIÓN ........................................................ 100
Figura Nro. 3. 28: Vista principal del Portal Web en el Servidor Local ........................ 100
Figura Nro. 3. 29: Vista principal del Portal Web con sus características .................... 101
 IX

Figura Nro. 3. 30: Vista principal del Portal Web responsive...................................... 102
Figura Nro. 3. 31: Vista Principal (Haciendo Click en el Botón “La ciudad más joven”) 102
Figura Nro. 3. 32: Vista Principal de las categorías de Turismo .................................. 103
Figura Nro. 3. 33: Navegando por el Portal con sus botones y funcionalidades ......... 103
Figura Nro. 3. 34: Dando Click en el botón traducir ................................................... 104
Figura Nro. 3. 35: Dando Click en el botón de Audio.................................................. 104
Figura Nro. 3. 36: Navegando por el Portal sección de Manifestaciones .................... 105
Figura Nro. 3. 37: Navegando por el Portal sección de Manifestaciones (vista 2) ...... 105
Figura Nro. 3. 38: Navegando por el Portal en Arte Alteño (vista 1) ........................... 106
Figura Nro. 3. 39: Navegando por el Portal en Arte Alteño dando click en Ver más
(vista 2) ..................................................................................................................... 106
Figura Nro. 3. 40: Navegando por el Portal en Noticias ............................................. 107
Figura Nro. 3. 41: Navegando por el Portal en Noticias > Coronavirus en Bolivia ....... 107
Figura Nro. 3. 42: Navegando por el Portal en Noticias > El mundo ........................... 108
3.10. PRUEBAS .................................................................................................................. 109
Figura Nro. 3. 43: Código Fuente del Login en el Lenguaje PHP ................................. 111
Figura Nro. 3. 44: Código de enlaces para los estilos del proyecto usando el editor de
código Sublime Text .................................................................................................. 112
Figura Nro. 3. 45: Código Fuente del Header del Proyecto ........................................ 112
Figura Nro. 3.46: Código Fuente del section de botones del Proyecto ....................... 113
Figura Nro. 3. 47: Código Fuente de Rutas para el uso del Portal web, haciendo uso de
uno del Framework de Python (Flask) ....................................................................... 113
Figura Nro. 3. 48: Dando estilos a nuestro Portal web con CSS3 ................................ 114
Figura Nro. 3. 49: Bcrypt en Django ........................................................................... 116
CAPÍTULO IV
ANÁLISIS DE CALIDAD Y COSTOS DEL SOFTWARE
4.1 INTRODUCCIÓN............................................................................................................... 119
4.1.1. CIBERMETRÍA ........................................................................................................... 119
Figura Nro. 4. 1: Áreas de la Cibermetria ................................................................... 120
4.1.2. WEBMETRIA ............................................................................................................. 120
Tabla Nro. 4. 1: Conceptos de webmetria ................................................................. 121
 X

4.2. METODOLOGÍA DE EVALUACIÓN DE CALIDAD DE SITIOS WEB................................... 122

4.2.1. FASES ....................................................................................................................... 123
Figura Nro. 4. 2: Elemento footer del portal web ...................................................... 123
Figura Nro. 4. 3: Ficha de análisis .............................................................................. 124
4.3. CALIDAD ................................................................................................................... 124
4.3.1. NORMA ISO 9126 ..................................................................................................... 125
4.3.2. RESULTADOS DE LA EVALUACIÓN ISO 9126 .............................................................. 125
Tabla 4.2: Resultados de la evaluación ISO 9126 ....................................................... 126
Tabla 4.3 Características de Funcionalidad ................................................................ 127
Tabla 4.4 Características de Fiabilidad ....................................................................... 127
Tabla 4.5 Características de Usabilidad ..................................................................... 128
Tabla 4.6 Características de Eficiencia ....................................................................... 128
Tabla 4.7 Características de Mantenibilidad .............................................................. 128
Tabla 4.8 Características de Portabilidad ................................................................... 129
Tabla 4.9 Características de Calidad de Uso ............................................................... 129
Tabla 4.10 Parámetro de medición para la Ecuación de Funcionalidad ...................... 130
Tabla 4.11.: Datos para la Ecuación de Fiabilidad ...................................................... 131
Tabla 4.12 Cuestionario simple de Usabilidad ........................................................... 132
4.4. ANALISIS DE COSTOS DE SOFTWARE ......................................................................... 134
4.4.1. METODO DE ESTIMACIÓN DE COSTOS COCOMO II ................................................... 135
Tabla 4.13: Productividad para el modelo Composición de Aplicación ...................... 135
Tabla 4.14: Ecuaciones del modelo COCOMO II ......................................................... 136
Tabla 4.15: Ecuaciones del modelo intermedio de COCOMO..................................... 136
4.4.2. PRUEBAS Y RESULTADOS .......................................................................................... 137
Figura Nro. 4. 4: Estimación de Costos haciendo uso del software USC - COCOMO
II.2000.4 .................................................................................................................... 137
4.4.3. Fórmulas de estimación ............................................................................................ 137
Tabla 4.16: Ecuaciones del modelo COCOMO............................................................ 137
Tabla 4.17: Resultados del modelo COCOMO ............................................................ 138
Tabla 4.18: Resultados del modelo COCOMO a nivel Intermedio .............................. 138
 XI

CAPÍTULO V
CONCLUSIONES Y RECOMENDACIONES
5.1. CONCLUSIONES .................................................................................................. 140
5.2. RECOMENDACIONES .................................................................................................... 142
BIBLIOGRAFIA ........................................................................................................... 143
ANEXOS

A. ÁRBOL DE PROBLEMAS
B. ÁRBOL DE OBJETIVOS
C. MANUAL DEL USUARIO
D. DOCUMENTACIÓN AVALES DE CONFORMIDAD
 XII

ÍNDICE DE FIGURAS

CAPÍTULO I
MARCO PRELIMINAR
Figura Nro. 1.1: Organigrama Órgano Ejecutivo del GAMEA .......................................... 5
CAPÍTULO II
MARCO TEORICO
Figura N° 2.1: Calidad de una metodología .................................................................. 33
Figura Nro. 2. 2: Fases de la Metodología UWE ........................................................... 35
Figura Nro. 2.3: Modelo Vista Template ...................................................................... 39
Figura Nro. 2.4: Esquema Interno del ciclo de Vida del MVT ....................................... 40
Figura Nro. 2.5: Modelo cliente servidor ..................................................................... 41
Figura Nro. 2.6: Modelo cliente servidor ..................................................................... 43
CAPÍTULO III
MARCO APLICATIVO
Figura Nro. 3. 1: Análisis Diagrama Entidad Relación .................................................. 72
Figura Nro. 3. 2: Diagrama de Clases ........................................................................... 72
Figura Nro. 3. 3: Actores.............................................................................................. 72
Figura Nro. 3. 4: Actores del Portal web ...................................................................... 72
Figura Nro. 3. 5: Casos de uso del usuario ................................................................... 74
Figura Nro. 3. 6: Casos de uso del Portal Web ............................................................. 76
Figura Nro. 3. 8: Casos de uso de Ubicación ................................................................ 78
Figura Nro. 3. 9: Casos de uso de Búsqueda ................................................................ 79
Figura Nro. 3. 10: Casos de uso del módulo de Traducción .......................................... 80
Figura Nro. 3. 11: Casos de uso de los Recursos y Servicios ......................................... 81
Figura Nro. 3. 12: Casos de uso de los Reportes y estadísticas .................................... 81
Figura Nro. 3. 13: Diagrama de Clases ........................................................................ 85
Figura Nro. 3. 14: Modelo conceptual con diagrama de clases .................................... 86
Figura Nro. 3. 15: Modelo conceptual general con diagrama de clases ........................ 87
Figura Nro. 3. 16: Modelo del usuario con diagrama de clases .................................... 88
 XIII

Figura Nro. 3. 17: Modelo del panel de Administración con diagrama de clases .......... 89
Figura Nro. 3. 18: Modelo de navegación con diagrama de clases ............................... 90
Figura Nro. 3. 19: Modelo de navegación de procesos con diagrama de clases ........... 91
Figura Nro. 3. 20: Modelo de presentación del usuario ............................................... 92
Figura Nro. 3. 21: Modelo de presentación del portal con diagrama de clase ..................... 92
Figura Nro. 3. 22: Modelo de presentación de la navegación ............................................ 92
Figura Nro. 3. 23: Modelo de presentación del panel administrativo........................... 94
Figura Nro. 3. 24: Modelo de presentación de recursos y servicios ............................. 95
Figura Nro. 3. 25: Modelo de lógico con diagrama de clases ....................................... 96
Figura Nro. 3. 26: Interface de la presentación en modo escritorio ............................. 98
Figura Nro. 3. 27: Interface de la presentación en modo móvil ................................... 99
Figura Nro. 3. 28: Vista principal del Portal Web en el Servidor Local ........................ 100
Figura Nro. 3. 29: Vista principal del Portal Web con sus características .................... 101
Figura Nro. 3. 30: Vista principal del Portal Web responsive...................................... 102
Figura Nro. 3. 31: Vista Principal (Haciendo Click en el Botón “La ciudad más joven”) 102
Figura Nro. 3. 32: Vista Principal de las categorías de Turismo .................................. 103
Figura Nro. 3. 33: Navegando por el Portal con sus botones y funcionalidades ......... 103
Figura Nro. 3. 34: Dando Click en el botón traducir ................................................... 104
Figura Nro. 3. 35: Dando Click en el botón de Audio .................................................. 104
Figura Nro. 3. 36: Navegando por el Portal sección de Manifestaciones .................... 105
Figura Nro. 3. 37: Navegando por el Portal sección de Manifestaciones (vista 2) ...... 105
Figura Nro. 3. 38: Navegando por el Portal en Arte Alteño (vista 1) ........................... 106
Figura Nro. 3. 39: Navegando por el Portal en Arte Alteño dando click en Ver más
(vista 2) ..................................................................................................................... 106
Figura Nro. 3. 40: Navegando por el Portal en Noticias ............................................. 107
Figura Nro. 3. 41: Navegando por el Portal en Noticias > Coronavirus en Bolivia ....... 107
Figura Nro. 3. 42: Navegando por el Portal en Noticias > El mundo ........................... 108
Figura Nro. 3. 43: Código Fuente del Login en el Lenguaje PHP ................................. 111
Figura Nro. 3. 44: Código de enlaces para los estilos del proyecto usando el editor de
código Sublime Text .................................................................................................. 112
 XIV

Figura Nro. 3. 45: Código Fuente del Header del Proyecto ........................................ 112
Figura Nro. 3.46: Código Fuente del section de botones del Proyecto ....................... 113
Figura Nro. 3. 47: Código Fuente de Rutas para el uso del Portal web, haciendo uso de
uno del Framework de Python (Flask) ....................................................................... 113
Figura Nro. 3. 48: Dando estilos a nuestro Portal web con CSS3 ................................ 114
Figura Nro. 3. 49: Bcrypt en Django ........................................................................... 116
CAPÍTULO IV
ANÁLISIS DE CALIDAD Y COSTOS DEL SOFTWARE
Figura Nro. 4. 1: Áreas de la Cibermetria ................................................................... 120
Figura Nro. 4. 2: Elemento footer del portal web ...................................................... 123
Figura Nro. 4. 3: Ficha de análisis .............................................................................. 124
Figura Nro. 4. 4: Estimación de Costos haciendo uso del software USC - COCOMO
II.2000.4 .................................................................................................................... 137
 XV

ÍNDICE DE TABLAS

CAPÍTULO I
MARCO PRELIMINAR
CAPÍTULO II
MARCO TEORICO
Tabla N° 2.1: Comparación entre Internet, Intranet y Extranet .................................... 29
Tabla N° 2.2: Diferencias entre metodologías agiles y tradicionales ............................ 34
Tabla N° 2.3: Métricas de Calidad ................................................................................ 43
Tabla N° 2.4: Ecuaciones del modelo COCOMO ........................................................... 47
Tabla N° 2.5: Ecuaciones del modelo intermedio de COCOMO .................................... 48
Tabla N° 2.6. : Productividad para el modelo de composición de Aplicación................ 51
CAPÍTULO III
MARCO APLICATIVO
Tabla No 3.1: Fases y procesos metodología UWE ................................................................... 60
Tabla N° 3.2. : Diagrama General de Flujo de Procesos del Portal Web .................................... 63
Tabla N° 3.3: Requisitos de Hardware ..................................................................................... 64
Tabla N° 3.4. Administración del Sistema .................................................................... 82
Tabla N° 3.5. Usuario................................................................................................... 82
Tabla N° 3.6. Administración del Sistema .................................................................... 82
Tabla N° 3.7. Ubicación ............................................................................................... 83
Tabla N° 3.8. Búsqueda ............................................................................................... 83
Tabla N° 3.9. Traducción ............................................................................................. 83
Tabla N° 3.10. Recursos y Servicios ............................................................................. 84
Tabla N° 3.11. Reportes y Estadísticas ......................................................................... 84
CAPÍTULO
I
MARCO PRELIMINAR
 1

1.1. INTRODUCCIÓN

En la actualidad las organizaciones han comprendido la importancia de

implementar algún sistema como medio de apoyo al acceso rápido a recursos y
servicios de la ciudad de El Alto, el cual les sirva como soporte para la toma de
decisiones del GAMEA1

La Dirección de Culturas del GAMEA se encarga de mantener y promover la

cultura dentro de la Ciudad de El Alto con actividades que puedan desenvolver
niños y jóvenes en diferentes ramas culturales en las que destacan las áreas
de Danza clásica, Danza Folklórica, Artes Plásticas, Artes Escénicas, Música
Clásica y Cinematografía, también con actividades socio culturales como ser el
Recorrido de Atractivos Turísticos dentro de la ciudad y la organización de
actividades de mayor impacto, como ser la entrada de la zona 16 de Julio en
honor a la Virgen del Carmen.

En el GAMEA2 se controla el acceso a la documentación por direcciones, como

en este caso los recursos y servicios que ofrece la ciudad de El Alto está
encargada por la Dirección de Culturas y unidad de Turismo, la inexistencia de
un portal limita la posibilidad de publicitar la cultura de la ciudad de El Alto. De
esta manera cobra importancia el uso de herramientas libres para mejorar el
control, seguimiento, análisis y mantenimiento de la información.

El presente Proyecto de Grado, propone solucionar las debilidades en la

inexistencia de información con respecto a la publicidad dentro de la dirección
de culturas de forma interna y externa mediante el uso de un Portal Web. La
falta de funciones que puedan facilitar las actividades culturales y socio
culturales online, desorganización y falsos anuncios provocan el descontento
del usuario, por lo que se desarrollara un portal Web, así mismo el proyecto

1
Gobierno Autónomo Municipal de El Alto es el nombre oficial de la instancia de gobierno del Municipio de El Alto,
o Alcaldía de El Alto que administra el territorio comprendido por el municipio homónimo., la entidad inició su
funcionamiento bajo el nombre de Alcaldía tras la creación de la entidad territorial en 1985.
 2

permitirá al usuario el acceso a toda la información concerniente a la dirección

de Culturas existente dentro de la ciudad de El Alto permitiendo a al usuario
visualizar los diferentes tipos de archivos, entre ellos, el portal Web como plan
estratégico para el acceso rápido a recursos y servicios logrando un paso más
a la modernización tecnológica de la Ciudad de El Alto.

Implementando el Portal Web, permitirá a la población en general conocer

lugares turísticos, lugares para comer con la familia, lugares de diversión para
jóvenes, festivales organizados por la Dirección de Culturas del GAMEA,
lugares donde puedan hospedarse los visitantes, el trabajo de personalidades
de la misma ciudad de El Alto, el museo que posee nuestra ciudad, los
diferentes medios de transporte incluida el aeropuerto y muchas cosas.

1.2. ANTECEDENTES

1.2.1. Antecedentes de la Institución

El Gobierno Autónomo Municipal de El Alto es el nombre oficial de la instancia

de GAMEA, que administra el territorio comprendido por el municipio.

La entidad inicio su funcionamiento bajo el nombre de Alcaldía tras la creación

de la entidad territorial en 1985. Previamente este territorio era administrado
como parte del municipio vecino de La Paz.

De acuerdo a la ley de Autonomías y la organización territorial de Bolivia los

municipios bolivianos tiene la potestad de elegir sus alcaldes en elecciones
locales.
El Gobierno Autónomo Municipal de El Alto, también conocido por sus siglas
GAMEA, se compone del poder ejecutivo, representado por el alcalde y su
equipo, y el consejo municipal constituido por representantes elegidos
igualmente por voto popular a través de elecciones municipales cada 5 años.
Para el periodo 2015-2020 se eligió a Soledad Chapetón como alcaldesa de
acuerdo a los resultados de las elecciones sub-nacionales en Bolivia.
 3

El municipio de El Alto se halla dividido para su administración, en 14 distritos,

4 de ellos rurales, cada uno bajo la tuición de una sub-alcaldía y una autoridad
denominada sub-alcalde, a través de esas entidades se descentralizan algunas
actividades administrativas e impositivas.(VER ANEXO C).

 Misión
La misión del GAMEA es lograr la visión del municipio y cumplir los objetivos, a
través de la formulación de acciones políticas públicas, definiendo objetivos
estratégicos institucionales, que se reflejan en programas y proyectos para la
gestión municipal.

 Visión
El Alto con cultura, valores y liderazgos propios, seguro, moderno, con equidad
e igualdad de oportunidades, impulsa el desarrollo sustentable de la ciudad y
se articula a la región.

 Objetivos
Los objetivos que se esperan lograr en el transcurso de la gestión 2016-2020
con la implementación del plan estratégico institucional son los siguientes:

o Objetivo 1: Apropiar un enfoque estratégico de gestión municipal en el

que confluyan de forma coordinada todos los esfuerzos y compromisos
institucionales focalizados en proyectos de impacto y servicios
articulados, impulsando una territorialización de servicios
desconcentrados a nivel distrital y aprovechando escala para la provisión
de servicios metropolitanos.

o Objetivo 2: Mejorar la capacidad institucional basada en reglas claras,

eficacia técnica y capacidad administrativa; operando sistemas con
información oportuna y en tiempo real para la gestión de trámites y el
 4

monitoreo, medición de impactos y retroalimentación de los servicios al

ciudadano y la inversión municipal.

o Objetivo 3: Consolidar una gestión fiscal y financiera viable y sostenible,

con un endeudamiento público responsable destinado a proyectos de
inversión y la prestación de servicios al ciudadano.

o Objetivo 4: Implementar procesos participativos rendición de cuentas

que permita consolidar un modelo de servicio público inclusivo,
transparente y eficaz; promoviendo una cultura ciudadana de deberes y
derechos, con capacidades para la resolución de conflictos y la
promoción de una cultura de paz.

La dirección de Culturas del GAMEA queda ubicada en plena Ceja - El Alto

donde la Alcaldía quemada, el cual se encarga de promover la cultura de la
Ciudad de El Alto organizando eventos como el recorrido en bicicleta
denominado Ciclo Turismo Alteño realizando su recorrido por centro culturales
como ser el Museo de Arte “Antonio Paredes Candía”, la Virgen Blanca,
Mirador Atipiris y otros; así mismo la organización de eventos de Danza
dirigidas por el Ballet Folklórico Municipal de El Alto, la Cinematografía cuyas
presentaciones se realizan en el teatro Raúl Salmon de la Barra y también se
promueve lo que es la famosa Feria de la Llajua realizada siempre en la Av.
Cívica (Prado Alteño) dirigidas por la Unidad de Turismo.
 5

 ORGANIGRAMA SEGÚN DS 70/2017

Figura Nro. 1.1: Organigrama Órgano Ejecutivo del GAMEA

DESPACHO
ALCALDESA

SECRETARÍA MUNICIPAL DE ATENCIÓN SECRETARÍA MUNICIPAL DE SECRETARÍA MUNICIPAL DE SECRETARÍA MUNICIPAL DE SECRETARÍA MUNICIPAL DE PLANIFICACION E
SECRETARÍA MUNICIPAL DE
CIUDADANA Y GOBERNANZA ADMINISTRACIÓN Y FINANZAS DESARROLLO HUMANO SEGURIDAD CIUDADANA INFRAESTRUCTURA URBANA
DESARROLLO SOCIAL
----------------------------------- ----------------------------------- ----------------------------------- ----------------------------------- -----------------------------------
-----------------------------------

DIRECCIÓN DE NIÑEZ, DIRECCIÓN DE CULTURAS

DIRECCIÓN DE DESARROLLO
GENERO Y ATENCIÓN ------------------------------------
INTEGRAL
SOCIAL
---------------------------------
---------------------------------

UNIDAD DE FOMENTO A INICIATIVAS

ARTÍSTICAS Y CULTURALES
UNIDAD DE LA INFANCIA, NIÑEZ Y -----------------------------------------------
UNIDAD DE LA JUVENTUD
ADOLESCENCIA
-----------------------------------------------
-----------------------------------------------

ESCUELA MUNICIPAL DE ARTES

UNIDAD DE LA MUJER ----------------------------------------------
----------------------------------------------- UNIDAD DE ADULTOS MAYORES
-----------------------------------------------

UNIDAD DE ATENCIÓN INTEGRAL A

UNIDAD DE ESPACIOS CULTURALES
LA FAMILIA
UNIDAD DE ATENCIÓN A PERSONAS CON -------------------------------------------------
-----------------------------------------------
DISCAPACIDAD
-----------------------------------------------
UNIDAD DE POBLACIONES
DIVERSAS
-----------------------------------------------

SECRETARIA MUNICIPAL DE SECRETARIA MUNICIPAL DE SECRETARIA MUNICIPAL DE AGUA Y SANEAMIENTO,

DESARROLLO ECONÓMICO MOVILIDAD URBANA SOSTENIBLE GESTIÓN AMBIENTAL Y RIESGOS
----------------------------------- ----------------------------------- -----------------------------------

Fuente: (Manual de Funciones, 2017)

La Dirección de Culturas promueve cambios y mejoras para lograr una mayor

promoción del Arte en la Ciudad; así mismo busca enlaces y alianzas con
diferentes organizaciones culturales que existen dentro de la ciudad de El Alto
y así responder a la demanda de actividad cultural existente en la Ciudad de El
Alto.
 6

1.2.2. Antecedentes Académicos

Haciendo referencia a trabajos realizados a nivel nacional e internacional con

anterioridad y como parte de la investigación bibliográfica podemos citar las
siguientes:

Internacional

 (Gauchat, 2017)“Propuestas de estrategias de marketing digital”. El

Objetivo General: Impulsar la comercialización de la tortilla de trigo en el
mercado nacional, a través de la implementación de estrategias de
marketing digital. Con la finalidad de alcanzar los objetivos previamente
establecidos, en los siguientes apartados se dará una descripción de las
características de la 7 investigación desarrollada, como lo es su
enfoque, el tamaño de la muestra con la que se trabajó, su temporalidad
y las fases en las se desarrolló. Instituto Politécnico Nacional, ubicado
en la Ciudad de México.
 (Uribe F., 2014)“Uso de redes sociales digitales como herramienta de
marketing”. El Objetivo General: Comprobar si el tipo de comentarios
online que hacen los usuarios sobre un determinado producto en
diferentes plataformas sociales y digitales afecta la intención de la
compra y la confianza en la marca de dicho producto. Como el objetivo
propuesto implica profundizar en los ¿por qué? Y ¿cómo? Respecto a
un fenómeno determinado – en la cuestión de determinar los usos y
aplicaciones que tienen las RSD como herramienta de marketing, el
estudio de casos es un método especialmente adecuado para ello,
puesto que permite profundizar en el conocimiento de cuestiones
complejas en el propio entorno de la empresa. Con este objetivo, se
utilizaran múltiples fuentes de información, con el fin de poder realizar
comparaciones, ofreciendo mayor validez al análisis. Universidad
Autóctona de Barcelona, ubicada en Barcelona – España.
 7

 (Sanchez L., 2014)“Análisis de información y toma de decisiones para

administración de negocios”. El Objetivo General: Determinar el uso de
BI para la toma de decisiones en las empresas haciendo uso de
indicadores. Con la finalidad de exponer la implementación de un
sistemas de BI, la cual puede ser aplicada a cualquier tipo de
organización, tomando como sistema fuente un Data Warehouse
montado en una base de Datos Oracle 11.2.0.1.0 y una herramienta de
análisis Oracle Business Intelligence 11.1.1.6.0, el cual está basado en
un Data Mart de Ventas. El sistema demostró que, mediante un
Dashboard, puede determinar la tendencia de la empresa con respecto
al tiempo, y si esta va en aumento en los últimos años. Universidad
Autónoma del Perú, ubicada en la Ciudad del Perú.

Nacionales

 (Zarco J., 2017)“Realidad Aumentada aplicada al turismo de las iglesias

de la ciudad de La Paz”. El Objetivo General: Desarrollar una aplicación
móvil de información turística haciendo uso de la realidad aumentada,
sobre las iglesias históricas de la Ciudad de La Paz, para mejorar la
experiencia turística de los visitantes. Con el fin de permitir a las
personas mejorara su experiencia turística en su visita a las iglesias de
la ciudad de La Paz con el uso de tecnologías. Universidad Mayor de
San Andrés, ubicada en la Ciudad de La Paz - Bolivia.
 (Yujra J., 2017)“Realidad Aumentada y Geolocalización en el ámbito del
Turismo”. El Objetivo General es: Desarrollar una aplicación para
dispositivos móviles que facilite encontrar los sitios turísticos y servicios
alrededor del punto de donde se encuentre el turista haciendo uso de la
realidad aumentada y geolocalización. Con la finalidad de facilitar la
ubicación y obtención de información de centros turísticos y servicios
que sean de su interés. Universidad Mayor de San Andrés, ubicada en la
ciudad de La Paz – Bolivia.
 8

 (Hector, 2018)“Conociendo nuestra Región: Manifestaciones Culturales

del Municipio de Pailón”. El Objetivo de la educación integral, en lo
departamental y nacional, es proporcionar una comprensión real de
nuestra diversidad; de carácter multiétnico, pluricultural y sobre todo
multibilingue. EL sistema tiene el propósito de proporcionar al Corredor
Bioceánico Santa Cruz – Puerto Quijarro, en particular y de Santa Cruz
como de Bolivia en general, una plataforma que permita conocer las
bases culturales, cívicas, costumbres y tradiciones culturales a través de
la plataforma. Gobierno Autónomo de Santa Cruz, ubicada en la ciudad
de Santa Cruz – Bolivia.

1.3. PLANTEAMIENTO DEL PROBLEMA

1.3.1. Problema Principal

El mundo de internet abarca una infinidad de plataformas, sistemas, sitios y

páginas web que ofrecen servicios y recursos de distintos tipos, como ser:
información, entretenimiento, compra online y otros. De tal modo que el acceso
a estos sitios es muy variada y más aún en el caso de servicios y consultas que
ofrecen distintos centros de atención al cliente, entretenimiento e incluso
turismo de una determinada ciudad, departamento o país. Sin embargo el
poder conocer nuestra ciudad no implica entrar a distintas páginas
desactualizadas y sitios en línea que brindan información innecesaria y
desordenada o adquirir algún servicio no se encuentre disponible que sea
ofrecido por el GAMEA ya que ingresar a estos sitios web genera pérdida de
confianza y pérdida de tiempo.

La dirección de Culturas y la unidad de Turismo no cuenta con medios

necesarios para hacer llegar la mayor cantidad de información a los alteños
sobre los espacios culturales y las actividades que se realizan y promueven
dentro de la ciudad, si bien existe el apoyo de Redes sociales como lo es
 9

Facebook principalmente, no es lo mismo que encontrar toda la información en

un mismo sitio como lo es un Portal web.

Lo mencionado se analiza en un árbol de problemas, el cual se describe en el

anexo A (ver anexo 1), se observa que el problema central se encuentra en la
falta de medios tecnológicos, el cual es producido por las siguientes causas y
sus respectivos efectos: identificación de dificultad de acceso rápido a la
información de las actividades culturales, sitios turísticos y servicios que
faciliten la apreciación de la ciudad de El Alto.

Después de analizar las distintas deficiencias se plantea la siguiente

interrogante:

¿Es posible generar un portal Web que permita el fácil y rápido acceso a los
recursos culturales que ofrece la dirección de Culturas y la unidad de Turismo,
manteniendo como plan estratégico de promover la cultura y los servicios en la
Ciudad de El Alto?

1.3.2. Problemas Secundarios

Algunos de los principales problemas son:

 La existencia de información variada, con temáticas no culturales debido

a publicaciones fuera del ámbito cultural
 La existencia de información desorganizada, el cual ocasiona que una
búsqueda sea tediosa.
 Los falsos anuncios que provocan el descontento del usuario,
generalmente lo que sucede en Facebook por no contar con un portal
oficial.
 La falta de medios que puedan brindar la información suficiente sobre
temas culturales dentro de la Ciudad de El Alto.
 10

 No existe una base de datos actualizada ni completa de las actividades

culturales y sitios turísticos de la Ciudad de El Alto.
 Inexistencia de un sitio en el idioma nativo AYMARA donde se pueda
interactuar.

1.4. OBJETIVOS

El objetivo del presente proyecto de grado nace con una respuesta a las
necesidades de la institución, luego de un análisis de los problemas y su
relación causa – efecto se realizó el árbol de objetivos (ver anexo 2)

1.4.1. Objetivo General

Desarrollar e implementar un Portal Web, que permita el acceso fácil y rápido a

los recursos culturales que ofrece la dirección de Culturas y la unidad de
Turismo, apoyando como plan estratégico, promover la cultura en la Ciudad de
El Alto a fin de satisfacer las necesidades de información a los usuarios en
general.

1.4.2. Objetivos Específicos

 Efectuar un módulo de contenido dinámico de fácil uso y acceso de

información cultural otorgada por el portal Web, evitando publicaciones
no culturales.
 Brindar la información organizada, específica y detallada de los eventos
culturales por medio del Portal Web
 Desarrollar un portal web que contenga anuncios referentes a la cultura.
 Proveer con información actualizada para promover los eventos
culturales.
 Mejorar el acceso a la información del patrimonio de la ciudad de El Alto.
 11

 Crear una base de datos actualizable de las actividades culturales y

sitios turísticos de la Ciudad de El Alto.
 Diseñar una plataforma de fácil uso y acceso para brindar una gran
comodidad a los usuarios del sistema.
 Integrar un modelo que contenga el idioma nativo.

1.5. JUSTIFICACIÓN

1.5.1. Justificación Técnica

En pleno XXI era tecnológica, se observa como la tecnología va creciendo a

pasos agigantados donde los sistemas de información son necesarios, además
de que los materiales y herramientas están al alcance de todos, lo cual es difícil
restringirse al uso de ellos y de las nuevas tecnologías. Es así que la dirección
de culturas del Gobierno Autónomo Municipal de El Alto hace uso de estas
tecnologías para que la Ciudad de El Alto se beneficie teniendo al alcance de
sus manos la información que en algún momento requiera.

Las herramientas y detalles tecnológicos a utilizar, como ser el servidor central

y su despliegue en la red se hará por dominios de GAMEA, mientras como
servidor local se hizo uso del servidor de Django de Python y NodeJS de
JavaScript y para el desarrollo de la plataforma como requerimiento de
hardware será cualquier dispositivo con acceso a internet3 y como software se
hizo uso del lenguaje de programación de JavaScript y Python haciendo uso de
sus frameworks.

3
INTERNET, es una red informática de nivel mundial que utiliza protocolos TCP/IP que permite la
interconexión descentralizada.
 12

1.5.2. Justificación Económica

Implementar un portal Web como un plan estratégico en el Dirección de

Culturas del GAMEA, se justifica económicamente porque se ahorrara tiempo y
recursos que se inviertan en el proceso y gestión de los mismos, maximizando
la popularidad de la Ciudad de El Alto haciendo uso de herramientas open
source4. Así también se debe considerar que el portal Web despertara el
interés de la sociedad en general con respecto a los servicios y recursos
culturales que existe en la Ciudad de El Alto, como ser: museos, áreas verdes,
centros gastronómicos y otros, incrementando la afluencia de clientes a dichas
instituciones elevando los ingresos económicos a las mismas, haciendo de la
misma una iniciativa para las instituciones existentes por parte del GAMEA.

La tecnología a usar, son de software libre5 sin costo en sus licencias.

1.5.3. Justificación Social

El presente proyecto contribuye al proceso de toma de decisiones para el

Gobierno Autónomo Municipal de El Alto con respecto a la información que
maneja cada entidad pública sobre los datos del usuario para poder tener un
mejor control de la ciudad y realzar los lugares turísticos que posee la Ciudad
de El Alto.

Los beneficios del presente proyecto están dirigidos a los visitantes turistas, a
los habitantes de la ciudad de El Alto, a los empresarios de hoteles,
restaurantes y otros; también está dirigido a los departamentos de marketing
que podrían difundir actividades sociales, comerciales y otros.

El poder implementar un portal web como plan estratégico en la Ciudad de El

Alto, cumplirá una labor social importante, porque dependiendo de la

4
OPEN SOURCE, llamado también código abierto, que permite al usuario final, utilizar el
código fuente para estudiarlo, modificarlo y realizar las mejoras en dicho sistemas
5
DESCRIBIR SOFT LIBRE
 13

información el Dirección de Culturas y unidad de Turismo - GAMEA, capturará

la atención de la población en general, brindando confianza y credibilidad ante
actividades culturales y sitios turísticos.

Los alteños de la Ciudad de El Alto y visitantes como los turistas son los
usuarios quienes se beneficiaran con la información otorgada por el portal web
en la visita de algún sitio turístico o participación de una actividad cultural.

1.6. METODOLOGÍA

El siguiente proyecto se llevara a cabo por medio de una metodología

investigativa y descriptiva, ya que se realizara en primera instancia un análisis
sobre la Ciudad de El Alto para luego proceder a la implementación del modelo
básico para el uso de la información geo-referencial que brinda dicho análisis.

La metodología a usar en el sistema será la UWE (UML-BASED WEB

ENGINEERING) porque se basa en el diseño de aplicaciones web con
Lenguaje de Modelo Unificado (UML) y esto permitirá el diseño del portal web
mediante modelos que permiten el diseño de la navegación, presentación y
adaptación, es así que UWE es una metodología basada en el proceso
Unificado y UML en español Lenguaje unificado de modelado para el desarrollo
de aplicaciones web, cubre todo el ciclo de vida de las aplicaciones web, la cual
consta de las siguientes fases:

1) Análisis de Requerimientos
2) Diseño del sistema
3) Codificación del software
4) Pruebas
5) La instalación o Fase de implementación
6) Mantenimiento
 14

1.6.1. Método de Ingeniería

El método de ingeniería nos permite analizar y realizar el presente proyecto de

una manera óptima de lo que es dentro de la ingeniería web permitiendo
profundizar de manera más detallada la elaboración de aplicaciones web, sitios
web y portales web haciendo buen uso de los recursos disponibles.

 Identificación del Problema

Plantear correctamente el problema es un paso muy importante en la solución.

Y ya mencionando anteriormente el problema se identifica de la siguiente
manera:

¿Cómo generar un plan estratégico que permita el acceso fácil y rápido a

recursos y servicios que brinda la Ciudad de El Alto?

 Recopilación de la información necesaria

Para la realización del proyecto se debe buscar la manera de reunir la

información necesaria para poder implementar un portal web como un plan
estratégico que permita el fácil acceso a recursos y servicios que brinda la
Ciudad de El Alto y así resolver las necesidades que tiene todo habitante o
usuario.

Y para la recopilación de datos se recurrirá a los diferentes tipos de

investigación, sea así en un principio, nuestra investigación será exploratoria,
ya que se efectuará en un campo poco de estudio. Después será una
investigación descriptiva, ya que en función a los resultados que muestra la
investigación exploratoria se conocerá la situación y actitudes predominantes a
través de la descripción exacta de las actividades, objetos, procesos y
personas involucradas. Se recogen los datos para luego analizar
minuciosamente los resultados a fin de extraer generalizaciones significativas
que contribuyen al conocimiento.
 15

 Búsqueda de soluciones creativas

En este punto es momento de comenzar a identificar las soluciones creativas.

En realidad el desarrollo de nuevas ideas, productos y dispositivos pueden ser
consecuencia de la creatividad, un esfuerzo subconsciente de la innovación y o
un esfuerzo consciente; sin embargo dar a conocer como solución el, presente
tema de investigación “Portal web como plan estratégico que permita el fácil
acceso a recursos y servicios que te brinda la Ciudad de El Alto”

 Evaluación y selección de la información

Ya dada a conocer la solución, es momento donde se empieza a diseñar el

modelo.

 Preparación de Reportes, planos y especificaciones

La preparación de reportes, planos y especificaciones se realiza al momento de

iniciar con la investigación y proyecto

 Implementación del diseño

Ya terminado el diseño, es donde comenzaremos a implementarlo.

1.7. HERRAMIENTAS

En cuanto a las herramientas tecnológicas, serán empleadas las siguientes:

1.7.1. HTML5

HTML es un lenguaje de marcado que se utiliza para el desarrollo de páginas

de internet. Se trata de las siglas que corresponden a Hyper Text Markup
Language, es decir: Lenguaje de marcas de Hipertexto.HTML5 es la
actualización de HTML, el lenguaje en el que es creada la web, también es un
término de marketing para agrupar las nuevas tecnologías de desarrollo de
aplicaciones web: HTML5 CSS3 y JS. (Gauchat, 2017)
 16

1.7.2. CSS
Se conoce como lenguaje de hojas en estilo cascada y se usa para estilizar
elementos escritos en un lenguaje de marcado como HTML y CSS separa el
contenido de la representación visual del sitio. CSS es un lenguaje que facilita
instrucciones que podemos usar para asignar estilos a los elementos HTML,
como colores, tipo de letra, tamaños, etc. (Gauchat, 2017)

1.7.3. JavaScript

Es uno de los lenguajes de programación más potentes e importantes en la

actualidad, por tres enfoques claros: es útil, práctico y está disponible en
cualquier navegador web.

El poder de JavaScript está disponible principalmente en el lado del FrontEnd,

agregando mayor interactividad a la web, también puedes usas las librerías y
framework como: Jquery, angular, backbone, react y otros, escritas sobre
JavaScript y que te ayuda a crear una mejor experiencia de usuarios en
nuestro sitio web; así mismo se puede utilizar en los servidores web como ser
Node.js. (Gauchat, 2017)

1.7.4. Python

Es un lenguaje de Programación interpretado, cuya filosofía hace hincapié en

una sintaxis que favorezca un código legible. Soporta programación orientada a
objetos e imperativa y su uso es del tipo dinámico y conteo de referencia para
la administración de memoria.

Python nos permite simplificar la codificación generando que el tiempo de

creación del proyecto sea menor y además trabaja muy bien con otras
herramientas así como diferentes Gestores de Base de Datos.

1.7.5. Gestor de Base de Datos

Postgresql: Permite la administración de datos con sus distintos servicios.

 17

MongoDB: es una base de datos de documentos que ofrece una gran

escalabilidad y flexibilidad, y un modelo de consultas e indexación avanzado.

El modelo de documentos de MongoDB resulta muy fácil de aprender y usar, y

proporciona a los desarrolladores todas las funcionalidades que necesitan para
satisfacer los requisitos más complejos a cualquier escala.

1.8. LIMITES Y ALCANCES

1.8.1. Limites

El presente proyecto se limitará al uso exclusivo y único de usuarios

pertenecientes a la dirección de culturas y unidad de turismo del GAMEA,
debido a que el sistema estará en un servidor propio de la institución, esto
implica que la administración realizará la gestión de información.
El portal web:

- No es un Data Warehouse siempre y cuando la cantidad de información

no vuelva deficiente el proyecto
- No es un traductor.
- No es una red Social
- No es un sitio de compra y venta.
- Es una herramienta específica para la gestión de recursos de
información cultural en la dirección de culturas y unidad de Turismo.

1.8.2. Alcances

El presente proyecto permitirá automatizar los siguientes procesos:

a) Módulo de Administración de información
 Organización de Eventos por funciones.
 Organización de Sitios Culturales
 Organización de obras resaltantes
b) Módulo de Ubicación
 Mostrar la ubicación de los lugares turísticos
 18

 Mostrar la descripción del Lugar Turístico

c) Módulo Bilingüe
 Mostrar parte de la Información en Aymara.
 Hacer conocer que el Aymara es parte de la cultura Alteña
d) Módulo de contenido dinámico
 Mostrar el contenido de forma dinámica para el gusto del usuario.
 Mostrar ilustraciones de los eventos realizados y por realizar.
e) Módulo de Recursos y Servicios
 Mostrar recursos de la Ciudad de El Alto
 Mostrar los servicios de la Ciudad de El Alto
f) Módulo de reportes y estadísticas
 Mostrar reportes
 Mostrar estadísticas
g) Módulo de Administración de Usuarios
 Gestión de Usuarios
 Gestión de Archivos

1.9. APORTES

Entre las ventajas de poder implementar un portal Web como un plan

estratégico que permita el fácil acceso a recursos y servicios que te brinda la
Ciudad de El Alto, brinda un aporte muy importante para el GAMEA en cuestión
de confianza y credibilidad y tiempos en la ejecución de procesos de
actualización; sin embargo el aporte más importante es brindar con
herramientas open source información robusta y eficientes en los procesos de
registros.

Para poder destacar los aportes deseables para la entidad pública en lo que es
a calidad de datos, el portal web como plan estratégico proporciona distintas
acciones, como ser:

- Lograr la calidad en la entidad Pública en cuestión de apariencia y

credibilidad.
 19

- Analizar los estándares en cuestión de necesidades del usuario para el

beneficio institucional.
- Medir cuantitativamente y gráficamente los resultados del sistema
conforme a los niveles de solicitudes del usuario o requerimientos de los
mismos.
 20

CAPÍTULO
II
MARCO TEORICO
 21

2.1. INTRODUCCIÓN

La aplicación de un portal web en una ciudad, posee varias particularidades de

las cuales, destacar lo más sobresaliente de la ciudad en un mismo sitio Web
es primordial en el presente proyecto; así mismo la necesidad de tener todo a
nuestro alcance nos facilita poder navegar con mayor sencillez dentro del portal
web. Es muy común creer que un portal Web es sinónimo de sitio Web; no
obstante, existen ciertas diferencias en cuanto a su funcionalidad y objetivos.
Incluye información que puede ser observada públicamente para generar
tráfico (un mayor número de visitas). Un buen ejemplo seria amazon.com.

En contraposición, el portal Web es útil para limitar ese tráfico a una porción
reducida y muy específica de público. Aunque no siempre es necesario hacer
uso de un panel de inicio de sesión; si es bastante recurrente verlo en este tipo
de implementación.

Suele usarse para mostrar contenido pago, empresarial u administrativo,

además de que el equipo de desarrollo suele darle un enfoque diferente para
mostrar el contenido, a veces alejándose del diseño principal de un sitio web.
Por si fuera poco es una herramienta de segmentación para el tráfico en cada
página.

El portal puede ser comparado a un embudo o filtro por el cual los usuarios
podrán conectarse, introducir sus credenciales y así poder navegar en un sitio
Web. Sencillamente incluirá la información necesaria para el público escogido.

2.2. PORTAL WEB

2.2.1. Definición

Un portal web es un sitio web cuyo objetivo principal es ofrecer al usuario de

forma fácil e integrada, el acceso a una gama de recursos y de servicios.
 22

El portal es considerado un intermediario de información que tiene como fuente

de ingreso la publicidad de empresas.

Según Millenium (2003), Portal es un término, sinónimo de puente, para

referirse a un sitio web que sirve o pretende servir como un sitio principal de
partida para las personas que se conectan al World Wide Web. Son sitios que
los usuarios tienden a visitar como sitios ancla. Los portales tienen gran
reconocimiento en internet por el poder de influencia que tienen sobre grandes
comunidades.

 ¿Cuáles son las diferencias que existen entre portal web, sitio web
y página web?
Existe un debate entre la definición del portal web y su diferencia con el sitio
web; sin embargo cabe destacar que el término de Sitio Web ha sido reutilizado
una infinidad de veces en comparación al termino de Portal web, que ya se lo
conocía desde hace años y que ahora vuelve a retomar fuerza por su amplia
gama de recursos en el campo de la navegación.
 Portal web, es el punto de entrada a internet donde se organizan y
concentran los sitios web, donde su finalidad es que el usuario encuentre lo
que necesita sin salir del mismo, para un uso continuo.
 Sitio web, es un conjunto de páginas web que se agrupan y
normalmente se conectan de varias maneras. A menudo llamado sitio web o
simplemente sitio.
 Página web, es un documento que se puede mostrar en un navegador
web como Chrome, Firefox, Brave, Edge, y otros.

2.2.3. Pilares fundamentales de un portal Web

El objetivo principal del Portal es ayudar a los usuarios a encontrar lo que

necesitan sin salir del mismo fidelizándoles e incentivándoles a utilizarlo de
forma continuada, de lo cual existen tres pilares fundamentales para atraer la
atención del usuario y son:
 23

a) Información (Buscadores, directorios, noticias, catálogos y servicios)

b) Participación (E-mail, foros y chat)
c) Comodidad (Brindar la mayor cantidad de información en un solo
espacio y tenerlo a la mano).

De esa forma el portal gana trafico constante, alto y se autofinancia con

publicidad.

2.2.2. Características del portal web

Los portales web poseen características de acuerdo a su implementación y

contenido de lo cual ha sido dividido de la siguiente manera:

 Portales Horizontales
Es un portal con carácter general orientado a todo tipo de usuario.
Incluye servicios como ser: Comunidades virtuales, Chat, E-mail, Espacio web
gratuito, Foros de discusión, noticias, Información, Buscadores, etc.
Son portales para usuarios no muy experimentados en el mundo de internet a
los que se brindad una gran gama de información y servicios, sin obligarles a
navegar por varios sitios para obtenerlos.
Como ejemplo de portales de esta categoría están: Google, Yahoo, Outlook,
Netfilx.
 Portales Verticales
Es un sitio web que provee de información y servicios a un sector en particular,
con contenidos concretos y centrados en un tema como puede ser un portal de
música, empleo, inmobiliario, un portal de finanzas, arte o deportes.
 Portales Diagonales
Se trata de una mezcla entre el portal Horizontal y Vertical.
Utilizan redes sociales o aplicaciones generalistas como Facebook, Linkedin,
Flickr o YouTube, complementadas con contenidos o utilidades dirigidas a un
público muy concreto.
 24

 Portales especializados

Surgen a partir de la demandad de los usuarios de un sitio más especializado

en sus áreas de interés tanto particulares como profesionales y que los portales
horizontales y verticales no son capaces de llenar por tener contenidos
demasiados generales o superficiales.

Hoy en día existen infinidad de portales exclusivos en temas específicos como

educación, zonas geográficas, aficiones, deportes, conocimiento, etc.

 Portales Corporativos

Son una prolongación de la intranet de las empresas, donde se potencia el

acceso a la información de la organización, contacto con clientes y
proveedores, material de trabajo a sus trabajadores, cuidando mucho el tipo de
información a presentar en función del tipo de usuario que la solicita por ser
muchas veces confidencial; también proveen de información de la empresa a
sus empleados así como también el acceso a web publicas u otros sectores de
portales verticales.

 Portales Móviles

Son sitios que permiten la conexión de los usuarios tanto desde internet como
de un teléfono móvil (celular) o PDA.
Dichos portales se están abriendo camino a nivel de empresas para realizar
negocios ofreciendo productos o servicios a los usuarios.

En la actualidad no existen muchos portales móviles, pero con la cantidad de

móviles existentes será uno de los modelos que crezca en la red durante estos
años.
 25

2.2.3. Portales Web más Populares 2020

 Primer lugar: el rey de los portales, Google

Google es sin duda el rey de los portales. No hay quien no conozca a este
gran gigante del internet. Este sitio web facilita a sus usuarios muchas
funciones, la más conocida de ella es su motor de búsqueda; también
ofrece servicios como Gmail que es un correo electrónico; también cuenta
con paginas como YouTube y Blogger. Por lo que hablamos que son tres
portales muy populares en el mundo.
A través de su buscador se le da acceso a los usuarios tanto información
como imágenes y videos.

 Segundo lugar: YouTube

Si se trata de ver videos, este es el sitio ideal. Google lo compro por al
menos mil 500 millones de dólares en 2006. En esta web se puede ver,
compartir y sobre todo subir videos a la red.

 Tercer lugar: Facebook

Es la red social con mayor popularidad, se creó en el 2004 por Mark
Zuckerberg desde su dormitorio universitario en Harvard. Desde que salió a
la luz pública no para de crecer, en la actualidad cuenta con al menos 2
millones de usuarios activos en el mundo, Este portal permite que usuario
pueda enviar mensajes, compartir imágenes y videos.

 Cuarto lugar: Baidu

Conocido como el Google de China, es el motor de búsqueda más popular
en China, les da a los usuarios la oportunidad de buscar lo que deseen de
una manera fiable y simple; también incluye contenido multimedia en su
búsqueda.
 26

 Quinto lugar: Wikipedia

En la actualidad se puede traducir como la enciclopedia más grande y
completa de todo el mundo que hay en internet. En este portal se
encuentra información o datos de cualquier tema de interés por lo que se
encuentra entre los primeros portales recomendados en los motores de
búsqueda.

2.3. PLAN ESTRATEGICO

El plan estratégico es un documento integrado en el plan de negocios que

recoge la planificación económico-financiera, estratégica y organizativa con la
que una empresa, institución u organización cuenta para abordar sus objetivos
y alcanzar su misión de futuro. A lo largo de su desarrollo, el plan estratégico
señala las bases para el funcionamiento de la institución en línea de una
consecución de objetivos futuros, aun desconociendo cual será el futuro. En
otras palabras, definirá que acciones tendrán que ser llevadas a cabo a nivel
empresarial u organizacional para poder afrontar los retos que vayan
apareciendo y finalmente conseguir los objetivos marcados previamente.

2.4. PORTAL WEB COMO PLAN ESTRATEGICO

La aplicación del Portal Web como plan estratégico, es poder unir toda la
información necesaria en un mismo lugar para su mejor manipulación y
navegación de los recursos culturales y servicios que ofrece la ciudad de El
Alto.
Conceptualmente es parecido al plan de Marketing, aunque este último
normalmente se suele referir a un proyecto individual de los que acomete la
empresa y el estratégico es más genérico englobando todas las líneas de
trabajo de la empresa. Si la meta es publicitar un producto también puede ser
el de publicitar una ciudad.
 27

2.5. RECURSOS Y SERVICIOS

Los recursos de una ciudad pueden ser del tipo turístico, cultural, folklórico y
otros, como un conjunto de bienes, riquezas de un determinado lugar, del cual
la región es beneficiada; sin embargo los servicios muy apartados de los
servicios públicos pueden ser: los servicios de hospedaje, gastronomía,
seguridad, salud, educación y otros, que se encuentran dentro de la ciudad.

2.6. PORTAL WEB COMO PLAN ESTRATEGICO PARA EL ACCESO A

RECURSOS Y SERVICIOS

El acceso a recursos y servicios de una ciudad en general comienza

publicitando la ciudad misma por diferentes medios como ser: Redes sociales,
afiches, anuncios y otros.

La publicidad comienza iniciando en el ámbito cultural y turístico de una ciudad,

la estrategia consiste en mostrar lo majestuoso del lugar, de los sitios turísticos
que existe, del arte que muestran los museos, la cultura que existe en la
población, lo colorido de la ciudad, en fin, existe una gran variedad de recursos
de los cuales se puede publicitar una ciudad no solo publicitándola si no que al
momento de la visita a estos lugares pueda encontrar diferentes servicios,
como ser gastronomía.

2.7. INTERNET

El internet, es una red masiva de redes, infraestructura de redes que conecta a

millones de computadoras unidas de forma global; formando una sola red en la
que una computadora puede comunicarse con otra siempre y cuando estén las
dos computadoras conectadas al internet. (Hector, 2018)
 28

2.7.1. ELEMENTOS DE INTERNET

Los elementos de internet son las herramientas que permiten a las personas
conectarse a la web y hacer uso de esta desde cualquier lugar del mundo.
Estos elementos están en constante evolución.
Internet contiene una variedad de información inmensa, y constantemente se
proveen nuevas formas de acceder, interactuar y conectarse. De manera
continua se agrega nuevo vocabulario a su desarrollo.
Los elementos principales de Internet son la nube, la conexión, el navegador, el
usuario, las páginas web y las redes sociales.
 La nube es una colección de computadoras interconectadas con un
protocolo de redes específico. Este protocolo permite la transmisión de
datos, que pueden ser sitios web, correos electrónicos, sonido o video e
imágenes.
 La conexión se refiere a un enlace que la nube con el dispositivo de un
usuario en particular.
 El Navegador es el programa que se utiliza para acceder a los sitios
web. El navegador más utilizado por los usuarios es Google Chrome.
 Usuario de internet es aquel que utiliza la red, sin importar en que parte
del mundo se encuentre.
 Página web, es un documento que compone la WWW6. Este documento
se encuentra escrito en el lenguaje de hipertexto HTML7 y son
traducidos por el navegador.
 Redes Sociales, son comunidades que se alojan en internet y permiten
que los usuarios interactúen uno con otros en línea.

6
World Wide Web, es una red informática mundial accesible a través de Internet.
7
Hyper Text Model Lenguage, es un lenguaje de etiquetas que permite diseñar una plantilla.
 29

2.7.2. DIFERENCIAS ENTRE INTERNET, INTRANET Y EXTRANET

 Internet: La comunicación se realiza de forma instantánea. Se define

como una red de redes que permite el intercambio de información de
forma pública. Podemos acceder de forma ilimitada a páginas web,
redes sociales, foros, etc. También podemos acceder a hostings o
servicios que proveen a los usuarios espacios para almacenar
información, imágenes, videos u otros.

 Intranet: A diferencia de Internet, se trata de una red privada. Se trata

de una herramienta de gestión muy útil para sus usuarios, permite la
difusión de información y la colaboración entre los mismos. Por motivos
de seguridad, su acceso suele estar restringido a los miembros que
forman parte de la misma. Normalmente se implementa a través de una
infraestructura de red local (LAN).
 Extranet: Es una red dinámica que conecta a los empleados, clientes,
proveedores y otros servicios empresariales con la empresa en un
entorno virtual seguro para el desarrollo de las comunicaciones y
transacciones empresariales.

Tabla N° 2.1: Comparación entre Internet, Intranet y Extranet

INTERNET INTRANET EXTRANET
ACCESO Público Privado Semi-Público
Usuarios de una
Colectividad
USUARIO Cualquiera misma
relacionadas
colectividad
Compartida entre
INFORMACION Fragmentada Propietaria
colectividades
Fuente: (Rivas J., 2017)
 30

2.8. INGENIERIA DE SOFTWARE

Es el estudio de los principios y metodologías para el desarrollo y

mantenimiento de sistemas de software. (Hector, 2018)

Es una de las ramas de la ciencia de la computación que estudia la creación de

software confiable y de calidad, basándose en métodos y técnicas de
ingeniería. Brindando soporte operacional y de mantenimiento, el campo de
estudio de software.

Así mismo es una disciplina formada por un conjunto de métodos, herramientas

y técnicas que se utilizan en el desarrollo de los programas informáticos. Esta
disciplina trasciende la actividad de programación, que es pilar fundamental a
la hora de crear una aplicación.

Los ingenieros de software se encargan de analizar, diseñar, crear y probar los

sistemas informáticos y de software. Además escriben programas de software
para satisfacer las necesidades de un cliente o para resolver un problema e
particular.

2.8.1. MODELO DE DESARROLLO DE SOFTWARE

Los modelos de desarrollo de software ofrecen un marco de trabajo usado para

controlar el proceso de desarrollo de sistemas de información, estos marcos de
trabajo consisten en una filosofía de desarrollo de programas la cual debe estar
con las herramientas necesarias para la asistencia de procesos de desarrollo.

Una metodología de desarrollo de software es un enfoque, una manera de

interpretar la realidad o disciplina en cuestión, que en un caso en particularidad
resaltaría la ingeniería de software. De hecho, la metodología destinada al
desarrollo de software se considera como una estructura utilizada para
 31

planificar controlar el procedimiento en cuestión de un sistema de información

especializada así como lo es el presente proyecto.
Dicho esto, para el presente proyecto que es un “Portal web como plan
estratégico para el acceso rápido a recursos y servicios que brinda la ciudad de
El Alto” se hará uso de la metodología UWE, que es la más adecuada para el
presente proyecto.

2.8.2. METODOLOGÍA TRADICIONALES

Las metodologías tradicionales imponen una disciplina de trabajo sobre el

proceso de desarrollo de software, para ello, se hace énfasis en la planificación
total de todo el trabajo a realizar y una vez que todo está todo detallado,
comienza el ciclo de desarrollo del producto de software.
Se centran especialmente en el control del proceso, mediante una rigurosa
definición de roles, actividades, artefactos, herramientas y notaciones para el
modelado y documentación detallada. Además, las metodologías tradicionales
no se adaptan adecuadamente a los cambios, por lo que no son métodos
adecuados cuando se trabaja en un entorno donde los requisitos no pueden
predecirse o bien pueden variar.
RUP, es una metodología de desarrollo tradicional por sus siglas en inglés
(Proceso de Desarrollo Unificado), es un proceso de desarrollo de software y
junto con UML constituye la metodología estándar más utilizada para el
análisis, implementación y documentación de sistemas orientado a objetos. El
RUP no es un sistema con pasos firmemente establecidos, sino un conjunto de
metodologías adaptables al contexto y necesidades de cada
organización.(SmartSoft, 2018)
MSF, Microsoft Solutions Framework es un arco de trabajo de referencia para
construir e implantar sistemas empresariales distribuidos basados en
herramientas y tecnologías de Microsoft. MSF comprende un conjunto de
modelos, conceptos y guías que constituyen a alinear los objetivos de negocio
 32

y tecnológicos, reducir los costos de la utilización de nuevas tecnologías y

asegurar el éxito de las tecnologías Microsoft.(Microsoft, 2017)

ESPIRAL, el desarrollo o modelo en espiral es un enfoque de desarrollo de

software que puede ser considerado como una respuesta a los inconvenientes
del desarrollo en cascada. El modelo en espiral describe el ciclo de vida de un
software por medio de espirales, que se repiten hasta que se puede entregar el
producto terminado. El modelo en espiral también se conoce como modelo
incremental. (es.ryte.com)
ICONIX, es una metodología simplificada en comparación a otras más
tradicionales, la cual unifica un conjunto de métodos de orientación a objetos
con el objetivo de tener un control estricto sobre todo el ciclo de vida del
software a realizar. (ecured.com)

Metodología en Cascada es un modelo lineal de diseño de software que

emplea un proceso de diseño secuencial. El desarrollo fluye secuencialmente
desde el punto inicial hasta el punto final, con varias etapas diferentes:
planteamiento, iniciación, análisis, diseño, construcción, pruebas,
implementación y mantenimiento.
Para proyectos donde el alcance puede cambiar durante el tiempo o donde no
se tiene muy claro el alcance desde un inicio, una metodología tradicional
podría repercutir en sobre-costos por tiempos en desarrollo, dado que solo
tendremos un producto para mostrar al cliente el final del ciclo de vida del
proyecto.

2.8.3. METODOLOGÍAS AGILES

Las metodologías ágiles son aquellas que permiten adaptar la forma de trabajo
a las condiciones del proyecto, consiguiendo flexibilidad e inmediatez en la
respuesta para amoldar el proyecto y su desarrollo a las circunstancias
específicas del entorno.
 33

Las metodologías ágiles son un conjunto de métodos que permiten adaptar el

modo de trabajo a las condiciones del proyecto, aportando flexibilidad,
eficiencia y por lo tanto, logrando un mejor producto a menor costo.

Figura N° 2.1: Calidad de una metodología

Fuente: iebschool.com

Las metodologías ágiles más conocidas y utilizadas son:

- La metodología Scrum
- La metodología Kanban
- Las Metodologías de Crystral

SCRUM, es una metodología de desarrollo ágil que tiene como base la idea de
creación de ciclos breves para el desarrollo, que comúnmente se llaman
iteraciones y que en Scrum se llamaría “Sprints”. (Trigas M., 2014)
XP, es una metodología ligera de desarrollo de aplicaciones que se basa en la
simplicidad, la comunicación y realimentación del código desarrollado.
(Meléndez, 2016)
KANBAN, nos dice que es una herramienta para alcanzar una producción justo
a tiempo. (Monden, 1983)
Es un concepto japonés al que se lo define como etiqueta de construcción,
como una metodología relacionada al orden de trabajo.
 34

2.8.4. DIFERENCIAS ENTRE LAS METODOLOGÍAS ÁGILES Y LAS

METODOLOGÍAS TRADICIONALES

Tabla N° 2.2: Diferencias entre metodologías agiles y tradicionales

METODOLOGIAS AGILES METODOLOGIAS TRADICIONALES
Están preparadas para cambios durante Son poco flexibles a los cambios
el proyecto
Proceso menos controlado, con pocos Proceso mucho más controlado, con
principios
numerosas normas.
No existe contrato tradicional o al menos Existe un contrato prefijado
es bastante flexible
El cliente es parte activa en el proceso de El cliente interactúa con el equipo solo
desarrollo
mediante reuniones de entrega.
Grupos pequeños, 10 integrantes o Grupos grandes y posiblemente
menos y trabajando en el mismo sitio en
distribuidos donde a cada integrante se le
el cual todos tienen conocimiento sobre
todo el proceso de desarrollo. asignan tareas específicas.
Menos énfasis en la arquitectura del La arquitectura del software es esencial y
software
se expresa mediante modelos
Fuente: (Camacho F., 2016)

2.9. METODOLOGIA DE DESARROLLO UWE

Es un proceso de desarrollo para aplicaciones web enfocadas sobre el diseño

sistemático, la personalización y la generación semiautomática de escenarios
que guíen el proceso de desarrollo de una aplicación web. UWE describe una
metodología de diseño sistemática, basada en las técnicas de UML, la notación
de UML y los mecanismos de extensión UML. (Díaz C., 2012)
 35

2.9.1. ACTIVIDADES DE MODELADO DE UWE

Figura Nro. 2. 2: Fases de la Metodología UWE

Fuente: utn.edu,ec (internet)

2.9.2. CARACTERISTICAS

La metodología UWE está basada en el modelo UML y por ello consta de las
siguientes características sustentadas a la extensión UML:
 Análisis de requisitos
Su objetivo es encontrar los requisitos funcionales de la aplicación web para
representarlos como casos de usos.
 Diseño conceptual
Construir un modelo conceptual del dominio de la aplicación considerando los
requisitos reflejados en los casos de uso, da como resultado un diagrama de
clases de dominio.
 Diseño de navegaciones
Se obtienen el modelo de espacio de navegación y modelo de estructura de
navegación, se obtiene diagrama de clases.
 Diseño de presentación
De este paso se obtienen una serie de vistas de interfaz de usuario que se
presentan mediante diagramas de iteración UML.
 36

2.9.3. FASES DE LA METODOLOGÍA UWE

Las fases de la Metodología UWE son:

a) Análisis de requerimientos

Durante esta fase se adquieren, reúnen y especifican las características

funcionales y no funcionales que deberá cumplir la aplicación web.

Captura, análisis y especificación de requisitos: En simples palabras y

básicamente, durante esta fase, se adquieren, reúnen y especifican las
características funcionales y no funcionales que deberá cumplir la aplicación
web.

Trata de diferente forma las necesidades de información, las necesidades de

navegación, las necesidades de adaptación y las de interfaz de usuario, así
como algunos requisitos adicionales. Centra el trabajo en el estudio de los
casos de uso, la generación de los glosarios y el prototipado de la interfaz de
usuario.

b) Diseño del sistema

Se basa en la especificación de requisitos producido por el análisis de

requerimientos, el diseño define como estos requisitos se cumplirán, la
estructura que debe darse la aplicación web.
b) Codificación del software
Se realizan las tareas que comúnmente se conocen como programación, que
cosiste esencialmente en llevar a código fuente en el lenguaje de programación
elegido, todo lo diseñado en la fase anterior.
c) Pruebas
Las pruebas se utilizan para asegurar el correcto funcionamiento de secciones
de código.
 37

d) La instalación o fase de implementación

Proceso por el cual los programas desarrollados son transferidos
apropiadamente al computador destino.

e) Mantenimiento
Es el proceso de control, mejora y optimización del software ya desarrollado e
instalado.

2.9.4. CICLO DE VIDA DE LA METODOLOGIA UWE

El ciclo de vida de esta metodología consta de un modelo del ciclo de vida del
objeto, denominado modelo lógico conceptual. UWE apunta a construir un
modelo conceptual de una aplicación web, procurando hacer caso a las
características del modelo unificado.

2.9.5. DIAGRAMA DE CASO DE USO

Por definición UML es un lenguaje de modelado para visualizar, especificar,
construir y documentar partes de un sistema software desde distintos puntos de
vista.
UML define varios modelos para la representación de los sistemas que pueden
verse y manipularse mediante un conjunto de diagramas diferentes y uno de
ellos es el diagrama de casos de uso.
Los casos de uso son una técnica para la especificación de requisitos
funcionales. (Jacobson, 1987)
2.9.5.1. Vista de casos de uso
La vista de casos de uso captura la funcionalidad de un sistema, de un
subsistema, o de una clase, tal como se muestra a un usuario exterior.
Reparte la funcionalidad del sistema en transacciones significativas para los
usuarios ideales de un sistema los cuales se denominan actores y las
particiones funcionales se conocen con el nombre de casos de uso, la técnica
para modelar esta vista es el diagrama de casos de uso.
 38

Sus componentes principales son:

- Sujeto
- Casos de uso
- Actores
Previos conceptos se explicaran en el siguiente capítulo, aplicados al presente
proyecto.

2.10. Arquitectura de software

Es el diseño de más alto nivel de la estructura de un sistema. Una arquitectura

de software, también denominada arquitectura lógica, consiste en un conjunto
de patrones y abstracciones coherentes que proporcionan un marco definido y
claro para interactuar con el código fuente del software.

Una arquitectura del software se selecciona y diseña con base en objetivos y

restricciones, donde define de manera abstracta los componentes que llevan a
cabo alguna tarea de computación, sus interfaces y la comunicación entre
ellos. Toda arquitectura debe ser implementable en una arquitectura física, que
consiste simplemente en determinar que computadora tendrá asignada cada
tarea.

2.10.1. PATRÓN MODELO VISTA TEMPLATE

El patrón modelo vista template de Django, funciona de la siguiente forma

antes de mostrar un resultado en pantalla Django realiza esta secuencia:
 Primero realiza una petición a los modelos (Models) el cual es la
representación de la base de datos.
 Seguido realiza un proceso en la vistas (Views). En las vistas se procesa
la información solicitada a la base de datos.
 Por ultimo muestra la información procesada anteriormente en un
template (Templates) que funcionan con código HTML.
 39

Figura Nro. 2.3: Modelo Vista Template

Fuente: codigofacilito.com

 Modelo
Se encarga de los datos, generalmente consultando la base de datos,
actualizaciones, consultas, búsquedas, etc.
 Vista
Es la capa de la lógica de negocios. Esta capa contiene la lógica que accede al
modelo y la delega a la plantilla apropiada: también se la denomina como un
puente entre el modelo y las plantillas.
 Template
Es la capa de presentación. Esta capa contiene las decisiones relacionadas a
la presentación: como algunas muestras sobre una página web u otro tipo de
documento.

2.10.2. CICLO DE VIDA DEL MVT

El ciclo de vida del MVT consta de:

 El usuario realiza una petición.
 La vista captura la petición del usuario.
 La vista llama al modelo.
 El modelo interactúa con la base de datos, y retorna la información al
vista.
 40

 La vista recibe la información y la envía al template.

 El template procesa la información recibida y la entrega de una manera
visualmente entendible al usuario. (Hector, 2018)

Figura Nro. 2.4: Esquema Interno del ciclo de Vida del MVT
Fuente: (Cumpa M., 2016)

2.10.3. VENTAJAS Y DESVENTAJAS DEL MVT

Las principales ventajas del uso del patrón MVT son:

 La separación del Modelo y Template, lo cual logra separar los datos, de

su representación visual.
 Facilita el manejo de errores.
 Permite que el sistema sea escalable si es requerido.
 Es posible agregar múltiples representaciones de los datos.
 Las aplicaciones pueden ser reutilizada en otro proyecto Django.

Las desventajas principales del uso del patrón MVT son:

 La cantidad de archivos que se deben mantener incrementa
considerablemente.
 41

 La curva de aprendizajes es más alta que utilizando otros modelos.

 Su separación en capas aumenta la complejidad del sistema.

2.11. MODELO CLIENTE SERVIDOR

El concepto de cliente servidor, refiere por lo tanto a un modelo de

comunicación que vincula a varios dispositivos informáticos a través de una
red. El cliente en este marco, realiza peticiones de servicios al servidor, que se
encarga de satisfacer dichas peticiones.
Este modelo es uno de los principales usados en muchísimos servicios y
protocolos de internet.

Figura Nro. 2.5: Modelo cliente servidor

Fuente: Gama A., 2010

2.12. METRICAS DE CALIDAD

La calidad es un concepto relativo y multidimensional, referido a las

expectativas y cualidades solicitadas por el cliente, a su vez está ligada a
restricciones y compromisos como presupuesto y tiempo de desarrollo entre
otros; sin embargo existe algo seguro, como ser:
 42

“cuando algo es de calidad suele pasar desapercibido y si no lo es, solo

desatacara en lo negativo”.
“Hay dos formas de diseñar software: la primera es hacerlo tan simple que
obviamente no hay deficiencias y la segunda es hacerlo tan complicado que no
hay deficiencias obvias. La primera forma es mucho más difícil”. (C.A.R. Hoare)
“Cualquier tonto puede escribir código que un ordenador entiende. Los buenos
programadores escriben código que los humanos pueden entender”. (Martin
Fowler)
“Medir el progreso de la programación por líneas de código es como medir el
progreso en la construcción de aviones por el peso”. (Bill Gates)

 Definición de calidad

La calidad es aquella cualidad de las cosas que son de excelente creación,

fabricación o procedencia, calidad describe lo que bueno, por definición, todo lo
que es de calidad supone un buen desempeño.
Todo lo que posee un cualitativo de calidad supone que ha pasado por una
serie de pruebas o referencias las cuales dan la garantía de que es óptimo.

 Modelo de McCall

La idea del modelo es la descomposición del concepto genérico de calidad en

tres capacidades importantes para un producto software, todo desde la mirada
del usuario. A su vez cada capacidad se descompone en un conjunto de
factores y finalmente se definen criterios para evaluar el factor través de
métricas que indican en qué medida el sistema posee una característica dada.

Se caracteriza por ser un modelo de calidad fijo y para realizar la evaluación de

la calidad de un producto utilizándolo, se selecciona un subconjunto de factores
y métricas aceptando que solo están disponibles las que propone el modelo.
 43

Figura Nro. 2.6: Modelo cliente servidor

Fuente: (Alex, 2013)

2.12.1. FACTORES DE METRICAS DE CALIDAD

Las métricas pueden ser externas
Tabla 2.3: Métricas de Calidad
Usabilidad

Elemento Métrica Propone medir

Comprensibilidad Accesibilidad a demos. ¿A qué proporción de

demos / tutoriales
pueden acceder los
usuarios?
Instructibilidad Eficiencia de la ¿Qué proporción de las
documentación del funciones pueden ser
usuario y 7 o sistemas utilizados correctamente
de ayuda al uso. después de leer la
documentación o el uso
de sistemas de ayuda?
Fuente: Revista Cubana de Ciencias Informáticas vol.7 N°2. 2013
 44

2.12.2. Factores de calidad según Mccall

Los factores desarrollados según el modelo de McCall, se centra en tres

aspectos importantes de unos productos de software:
 Sus características operativas.
 Su capacidad para soportar cambios
 Su adaptabilidad a nuevos entornos.
Lista de factores y características:
 Corrección: mide el grado en que un programa satisface sus
especificaciones y consigue los objetivos del usuario.
 Fiabilidad: mide el grado en que se puede esperar que un programa
lleve a cabo sus funciones esperada con la precisión requerida.
 Eficiencia: mide la cantidad de recursos de computadora y de código
requerido por un programa para que lleve a cabo las funciones
específicas.
 Integridad: es el grado en que puede controlarse el acceso al software
o los datos por personal no autorizado.
 Facilidad de Uso: es el esfuerzo requerido para aprender un programa
e interpretar la información de entrada y de salida.
 Facilidad de mantenimiento: es el esfuerzo requerido para localizar y
arreglar programas.
 Facilidad de Prueba: es el esfuerzo requerido para probar un
programa.
 Flexibilidad: es el esfuerzo requerido para modificar un sistema
operativo.
 Portabilidad: es el esfuerzo requerido para transferir un software de un
hardware o un entorno de sistemas a otro.
 Reusabilidad: es el grado en que un programa (o partes de un
programa) se puede reutilizar en otro.
 Facilidad de interpretación: es el esfuerzo requerido para asociar un
programa a otro.
 45

2.13. MÉTODO DE ESTIMACIÓN DE COSTOS DEL SOFTWARE

Una estimación de software es una predicción de cuánto durará o costará su

desarrollo y mantenimiento. Si se trata de estimación de tiempo, el esfuerzo
puede expresarse en horas-persona u otra unidad, si se trata de estimación de
costo, se puede expresar en la moneda de preferencia.
El reto de elaborar estimaciones de software, es realizar predicciones realistas,
basándose en información incompleta e incierta.
En ingeniería de software y gestión de proyectos de software, las estimaciones
se utilizan para:

 Desarrollar planes de proyectos.

 Elaborar planificación de iteración en desarrollo de software.
 Elaborar presupuestos.
 Realizar análisis de inversión.
 Fijación de precios de un software.
 Análisis para determinar el precio en software dirigido al consumidor.

Una estimación es la predicción más optimista con una probabilidad distinta de

cero cierta; sin embargo también es una predicción que tiene la misma
probabilidad de estar por encima o por debajo del valor actual.

Los objetivos de la estimación de proyectos son reducir los costos e

incrementar los niveles de servicio y de calidad.

La estimación de costos implica la realización de predicciones sobre la cantidad

más probable de esfuerzo, tiempo y niveles de personal que se requieren
construir un sistema de software.

2.13.1. COCOMO I
El modelo constructivo de costes también conocido como COCOMO fue
desarrollado por B. W. Bohem a finales de los 70 exponiéndolo detalladamente
en su libro “Software Engineering Economics” (Prentice-Hall, 19981),
 46

especificando que COCOMO es una jerarquía de modelos de estimación de

costos de software.

2.13.2. ANALISIS DE COSTO DE SOFTWARE CON COCOMO I

Los objetivos de la estimación de costos de COCOMO son:

 Durante la etapa de planteamiento, permite decidir cuantas personas
son necesarias para llevar al cabo el proyecto y establecer el
cronograma.
 Para controlar el progreso del proyecto, evaluar si el proyecto está
evolucionando de acuerdo al cronograma y tomar las decisiones.
 Relación entre costo, cronograma y calidad: estos tres aspectos
están íntimamente relacionados y confrontados entre sí.
 Si aumenta la calidad, aumenta el costo.
 Si aumenta la calidad, aumenta el cronograma.
 Si el cronograma se reduce, reduce la calidad.
 Si reduce el cronograma, aumenta el costo.

2.13.3. METODO DE ESTIMACIÓN

 Fórmulas de estimación

Formulas por nivel de COCOMO

Primer nivel
Nivel básico: estima el esfuerzo y el tiempo usando dos variables.
Los factores de costo son:
- Tamaño de software
- Modo de desarrollo
Las ecuaciones básicas son:
- Esfuerzo:
PM = A x (𝐊𝐒𝐋𝐎𝐂)𝑩
Dónde:
 47

PM: es el esfuerzo estimado. Representa los meses-personas necesarios para

ejecutar el proyecto.
KSLOC: es el tamaño del software a desarrollar en miles de líneas de código.
A y B: son coeficientes que varían según el Modo de Desarrollo (Orgánico,
Semiacoplado, Empotrado).

- Cronograma :

TDEV = C x (𝐏𝐌)𝑫

Dónde:

TDEV: representa los meses de trabajo que se necesitan para ejecutar el

proyecto.

C y D: son coeficientes que varían según el Modo de Desarrollo (Orgánico,

Semiacoplado, Empotrado).

Tabla 2.4: Ecuaciones del modelo COCOMO

Modo de desarrollo Esfuerzo Cronograma
Orgánico PM = 2.4 x (𝐊𝐒𝐋𝐎𝐂)𝟏.𝟎𝟓 TDEV = 2.5 x (𝐏𝐌)𝟎.𝟑𝟖
Semiacoplado PM = 3.0 x (𝐊𝐒𝐋𝐎𝐂)𝟏.𝟏𝟐 TDEV = 2.5 x (𝐏𝐌)𝟎.𝟑𝟓
Empotrado PM = 3.6 x (𝐊𝐒𝐋𝐎𝐂)𝟏.𝟐𝟎 TDEV = 2.5 x (𝐏𝐌)𝟎.𝟑𝟐
Fuente: (Elaboración Propia)

Nivel Intermedio:

- Atributos del producto de software.

o RELY, confiabilidad requerida
o DATA, tamaño de la base de datos.
o CPLX, complejidad del producto.
- Atributos del hardware
o TIME, restricción del tiempo de ejecución
 48

o STOR, restricción del almacenamiento principal

o VIRT, volatilidad de la máquina virtual
o TURN, tiempo de respuesta de la computadora expresado en horas.
- Atributos del personal involucrado en el proyecto
o ACAP, capacidad de analista
o AEXP, experiencia en aplicaciones similares
o PCAP, capacidad del programador
o VEXP, experiencia en la máquina virtual
o LEXP, experiencia en el lenguaje de programación
- Atributos propios del proyecto
o MODP, prácticas modernas de programación
o TOOL, uso de herramientas de Software
o SCED, cronograma de desarrollo requerido

Se determina el factor de ajuste del esfuerzo según la fórmula:

EAF = ∏𝟏𝟓
𝒊=𝟏 𝑬𝑴𝒊

Dónde:

EM, factor multiplicador de esfuerzo, es el valor que corresponde a cada

atributo de acuerdo al grado de influencia.

Finalmente, se ajusta el esfuerzo nominal aplicando el EAF

PM = A x EAF x (𝐊𝐒𝐋𝐎𝐂)𝑩

Tabla 2.5: Ecuaciones del modelo intermedio de COCOMO

Modelo de Esfuerzo Nominal Esfuerzo Cronograma
Desarrollo Ajustado
Orgánico 𝑷𝑴𝒏𝒐𝒎𝒊𝒏𝒂𝒍 PM = 3.2 x EAF x TDEV = 2.5 x
= 𝟑. 𝟐 𝒙 (𝑲𝑺𝑳𝑶𝑪)𝟏.𝟎𝟓 (𝑲𝑺𝑳𝑶𝑪)𝟏.𝟎𝟓 (𝑷𝑴)𝟎.𝟑𝟖
Semiacoplado 𝑷𝑴𝒏𝒐𝒎𝒊𝒏𝒂𝒍 PM = 3.0 x EAF x TDEV = 2.5 x
= 𝟑. 𝟎 𝒙 (𝑲𝑺𝑳𝑶𝑪)𝟏.𝟏𝟐 (𝑲𝑺𝑳𝑶𝑪)𝟏.𝟏𝟐 (𝑷𝑴)𝟎.𝟑𝟓
 49

Empotrado 𝑷𝑴𝒏𝒐𝒎𝒊𝒏𝒂𝒍 PM = 2.8 x EAF x TDEV = 2.5 x

= 𝟐. 𝟖 𝒙 (𝑲𝑺𝑳𝑶𝑪)𝟏.𝟐𝟎 (𝑲𝑺𝑳𝑶𝑪)𝟏.𝟐𝟎 (𝑷𝑴)𝟎.𝟑𝟐
Fuente: (Elaboración propia)

Procedimiento de Estimación del cronograma

𝑷𝑫𝑪𝑵𝒐𝒎 𝒙 𝑷𝑫𝑬𝑨𝒋𝒖𝒔
PDC = 𝑷𝑫𝑬𝑵𝒐𝒎

𝑷𝑫𝑪𝑵𝒐𝒎 : Porcentaje de distribución Nominal del cronograma

𝑷𝑫𝑪𝑵𝒐𝒎 : Porcentaje de distribución Nominal del Esfuerzo

𝑷𝑫𝑪𝑵𝒐𝒎 : Porcentaje de distribución Ajustada del Esfuerzo

 Nivel Avanzado

En este nivel se incorpora todas las características de la versión intermedia

con una evaluación del impacto de las vías de costo en cada fase (análisis,
diseño, etc) del proceso de desarrollo de software.

 Ventajas y desventajas
Ventajas
- Reducción notable de los gastos de administración.
- Se conocen separadamente los costos de los materiales y de las
operaciones, conociéndose así las alteraciones que ocurran.
- Facilita contar con estimaciones seguras cuando no cambia el diseño de
un producto o el método de fabricación.
- Se utilizan como escalón transitorio para llegar al desarrollo de un
sistema más completo de costos.
Desventajas
- Las estimaciones de costo por cada elemento no son las más correctas.
- Cuando los artículos a fabricar son pocos numerosos de estilo, tamaños
y formas similares.
- Cuando las operaciones de fabricación no son complejas.
 50

2.13.4. COCOMO II
2.13.4.1. Definición del modelo
Los objetivos principales que se tuvieron para construir el modelo COCOMO II
fueron:
 Desarrollar un modelo de estimación de costo y cronograma de
proyectos de software que se adaptara tanto a las prácticas de
desarrollo futuras.
 Construir una base de datos de proyectos de software que permitiera la
calibración continua del modelo, y asi incrementar la precisión de
estimación.
 Implementar una herramienta de software que soportara el modelo.

2.13.4.2. Estimación del Esfuerzo

El esfuerzo necesario para concretar un proyecto de desarrollo de software,
cualquiera sea el modelo empleado, se expresa en meses/persona (PM) y
representa los meses de trabajo de una persona fulltime, requeridos para
desarrollar el proyecto.

En el Modelo de Composición de Aplicación la fórmula propuesta es la

siguiente:

𝑷𝑴 = 𝑵𝑶𝑷/𝑷𝑹𝑶𝑫

Donde:
NOP (Nuevos Puntos Objeto): Tamaño del nuevo software a desarrollar
expresado en puntos objeto y se calcula de la siguiente manera:
𝟏𝟎𝟎 − %𝒓𝒆𝒖𝒔𝒐
𝑵𝑶𝑷 = 𝑶𝑷 ∗
𝟏𝟎𝟎
OP (Puntos Objeto): Tamaño del software a desarrollar expresado en puntos
objeto.
%re-uso: Porcentaje de re-uso que se espera lograr en el proyecto.
 51

PROD: Es la productividad promedio determinada a partir del análisis de datos

del proyecto en (Banker 1994), mostrada en la siguiente tabla.
Tabla N° 2.6. : Productividad para el modelo de composición de Aplicación.
Experiencias y
capacidad de Muy bajo Bajo Normal Alto Muy Alto
los
desarrolladores
Madurez y
Capacidad del Muy bajo Bajo Normal Alto Muy Alto
ICASE
PROD 4 7 13 25 50
Fuente: (Boehm, 1995)
El Modelo de Diseño Temprano se usa en las etapas tempranas de un
proyecto de software, cuando se reconoce muy poco del tamaño del producto a
ser desarrollado, de la naturaleza de la plataforma, del personal a ser
incorporado al proyecto o detalles específicos de los procesos a utilizar. Este
modelo podría emplearse tanto en productos desarrollados en sectores de
generadores de aplicación, Sistemas Integrados o Infraestructura.
El modelo de Diseño Temprano ajusta el esfuerzo nominal usando factores de
costo. La fórmula para el cálculo del esfuerzo es la siguiente:
7

𝑃𝑀𝑒𝑠𝑡𝑖𝑚𝑎𝑑𝑜 = 𝑃𝑀𝑛𝑜𝑚𝑖𝑛𝑎𝑙 ∗ ∏ 𝐸𝑀𝑖

𝑖=1

𝑃𝑀𝑛𝑜𝑚𝑖𝑛𝑎𝑙 = 𝐴 ∗ (𝐾𝑆𝐿𝑂𝐶)𝐵
5

𝐵 = 1.01 + 0.01 ∗ ∑ 𝑊𝑗
𝑗=1

Donde:
 𝑃𝑀𝑒𝑠𝑡𝑖𝑚𝑎𝑑𝑜 es el esfuerzo Nominal ajustado por 7 factores.
 KSLOC es el tamaño del software a desarrollar expresado en miles de
líneas de código fuente.
 A es una constante que captura los efectos lineales sobre
 el esfuerzo de acuerdo a la variación del tamaño. (A = 2.94)
 B es el factor exponencial de escala.
 52

 EMi corresponde a los factores de costo que tienen un efecto

multiplicativo sobre el esfuerzo.
El Modelo Post-Arquitectura es el modelo de estimación más detallado y se
aplica cuando la arquitectura del proyecto está completamente definida. Este
modelo se aplica durante el desarrollo y mantenimiento de productos de
software incluidos en las áreas de sistemas integrados, infraestructura y
generadores de aplicaciones.
El esfuerzo nominal se ajusta a 17 factores multiplicadores de esfuerzo. La
fórmula para el cálculo del esfuerzo es la siguiente:

17

𝑃𝑀𝑒𝑠𝑡𝑖𝑚𝑎𝑑𝑜 = 𝑃𝑀𝑛𝑜𝑚𝑖𝑛𝑎𝑙 ∗ ∏ 𝐸𝑀𝑖

𝑖=1

2.13.4.3. Estimación del cronograma

La versión inicial de COCOMO II provee un modelo de estimación de
cronograma similar al presentado COCOMO. La ecuación inicial para los tres
modelos de COCOMO II es:
𝑆𝐶𝐸𝐷%
𝑇𝐷𝐸𝑉 = [3.0 ∗ 𝑃𝑀 ∗ (0.33 + 0.2 ∗ (𝐵 − 1.01)) ∗
100
Donde:
TDEV es el tiempo calendario en meses que transcurre desde la determinación
de los requerimientos a la culminación de una actividad que certifique que el
producto cumple con las especificaciones.
PM* es el esfuerzo expresado en meses personas, calculado sin tener en
cuenta el multiplicador de esfuerzo SCED.
B es el factor escala.
SCED% es el porcentaje de comprensión del cronograma.

2.14. HERRAMIENTA DE DESARROLLO

En cuanto a las herramientas tecnológicas, serán empleadas las siguientes:

 HTML5
 53

HTML es un lenguaje de marcado que se utiliza para el desarrollo de

páginas de internet. Se trata de las siglas que corresponden a Hyper
Text Markup Language, es decir: Lenguaje de marcas de Hipertexto.
Ventajas de utilizar HTML5:
o Nueva estructuras de etiquetas mejoradas, esta nueva estructura
permite definir por separado el encabezado, la barra de
navegación, las secciones de la página web, los textos del sitio,
los diálogos y el pie de página de los sitios web.
o Inclusión de las etiquetas video y audio, dicha etiqueta soporta de
manera eficiente y estable cualquier opción de ejecución de video
y audio, sin generar errores o incluir código flash en nuestro sitio
web.
o Capacidad de realizar ejecuciones offline de las páginas web
creadas con código HTML5, lo que permite realizar aplicaciones
de escritorio con este código tan versátil.
 CSS 3
Se conoce como lenguaje de hojas en estilo cascada y se usa para
estilizar elementos escritos en un lenguaje de marcado como HTML.
CSS separa el contenido de la representación visual del sitio.
Ventajas de usar CSS3:
o Se obtiene un mayor control de la presentación del sitio al poder
tener todo el código CSS reunido en uno, lo que facilita su
modificación.
o Pueden mostrarse distintas hojas de estilo según el dispositivo
que estemos utilizando o dejar que el usuario elija.
o Las novedades de CSS3 nos permiten ahorrarnos tiempo y
trabajo al poder seguir varias técnicas sin necesidad de usar un
editor gráfico.
 54

2.14.1. SERVIDOR APACHE

Apache HTTP Server es un software de servidor web gratuito y de código

abierto para plataformas Unix con el cual se ejecutan el 46% de los sitios web
de todo el mundo. Es mantenido y desarrollado por la Apache Software
Foundation.
Les permite a los propietarios de sitios web servir contenido en la web, de ahí
el nombre de servidor web. Es uno de los servidores web más antiguos y
confiables, con la primera versión lanzada hace más de 20 años.
Ventajas del servidor Apache:
o Apache Web Server es un software de código abierto. Esto significa que
la programación que impulsa el software puede ser consultada y editada
por cualquiera en el mundo.
o Apache Web Server es completamente gratuito y puede ser descargado
por cualquier persona en el mundo.
Un servidor web es un programa de tipo informático que se encarga de
procesar una aplicación del lado del servidor, cada una de las cuales puede
acceder a archivos almacenados en un servidor físico y usarlos para diferentes
propósitos, mediante conexiones bidireccionales o unidireccionales con la
máquina del cliente, tras lo cual se genera una respuesta del lado del cliente.

2.14.2. Sistema Gestor Base de Datos (SGDB)

De entre los numerosos sistemas gestores de bases de datos que existen se

hará uso del siguiente:
 MongoDB: es una base de datos de documentos que ofrece una gran
escalabilidad y flexibilidad, y un modelo de consultas e indexación
avanzado.

El modelo de documentos de MongoDB resulta muy fácil de aprender y

usar, y proporciona a los desarrolladores todas las funcionalidades que
necesitan para satisfacer los requisitos más complejos a cualquier
escala.
 55

MongoDB facilita la creación de copias de la totalidad de los datos y las

pone a disposición en diferentes servidores.

Ventajas de MongoDB:

o Es un modelo de datos basado en documentos. La unidad de

almacenamiento es análoga a JSON, los diccionarios Python, los
hashes de Ruby, etc.
o Capacidad de consulta profunda. MongoDB admite consultas
dinámicas en documentos utilizando un lenguaje de consulta
basado en documentos que es tan poderoso como SQL.
o No hay migraciones de esquemas. Dado que MongoDB no tiene
esquema, su código define su esquema.

2.14.3. LENGUAJE DE PROGRAMACION

 JavaScript
Es uno de los lenguajes de programación más potentes e importantes
en la actualidad, por tres enfoques claros: es útil, práctico y está
disponible en cualquier navegador web.

El poder de JavaScript está disponible principalmente en el lado del

FrontEnd, agregando mayor interactividad a la web, también puedes
usas las librerías y frame work como: Jquery, angular, backbone, react y
otros, escritas sobre JavaScript y que te ayuda a crear una mejor
experiencia de usuarios en nuestro sitio web; así mismo se puede utilizar
en los servidores web como ser Node.js.

Ventajas de usa JavaScript:

o Es un lenguaje muy sencillo

o Es rápido, por lo tanto tiende a ejecutar las funciones
rápidamente.
o Cuenta con múltiples opciones de efectos visuales.
 56

o Es muy versátil, puesto que es muy útil para desarrollar paginas

dinámicas y aplicaciones web.
 Python

Es un lenguaje de Programación interpretado, cuya filosofía hace

hincapié en una sintaxis que favorezca un código legible. Soporta
programación orientada a objetos e imperativa y su uso es del tipo
dinámico y conteo de referencia para la administración de memoria.

Ventajas de Python:

o Simplificado rápido, este lenguaje simplifica la programación.

o Elegante y flexible, es un lenguaje que tiene varias herramientas
que no hace falta declarar el tipo de dato.
o Programación sana y productiva, porque es sencillo de aprender.
o Ordenado y limpio, es un lenguaje que respeta la indentación.

2.14.4. FRAMEWORK PARA EL DESARROLLO

Los frameworks a utilizar son los siguientes:

 Bootstrap, es un framework CSS desarrollado inicialmente por twitter

que permite dar forma a un sitio web mediante librerías CSS que
incluyen tipografías, botones, cuadros, menús y otros elementos que
puedes ser utilizados en cualquier sitio web.

 Django, es un framework web diseñado para realizar aplicaciones de

cualquier complejidad en unos tiempos muy razonables. Está escrito en
el lenguaje Python y tiene una comunidad muy amplia, que está en
continuo crecimiento.
Ventajas de Django:
o Es muy rápido
o Viene bien cargado con toda clase de funcionalidad para
adaptarlas a cualquier necesidad.
 57

o Es bastante seguro.
o 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 estable.

2.15. SEGURIDAD DEL SISTEMA

Los intentos de robar datos confidenciales y dinero, o interrupciones en un

negocio son amenazas muy reales. Aunque un negocio nunca puede estar
completamente a salvo de esos peligros, existen varias prácticas de seguridad,
para los procesos y sistemas que pueden ayudarte a eliminar las amenazas de
seguridad online.
Se menciona a continuación algunas medidas de seguridad informática, para la
protección de amenazas del tipo virtual.

2.15.1. ESTANDAR ISO 27000

ISO8 27000 es un conjunto de estándares internacionales sobre la seguridad

de la información. La familia ISO 27000 contiene un conjunto de buenas
prácticas para el establecimiento, implementación, mantenimiento y mejora de
Sistemas de Gestión de la seguridad de la Información.
Así mismo, los pilares fundamentales de la familia 27000 son las normas 27001
y 27002, la principal diferencia entre estas dos normas, es que 27001 se basa
en una gestión de la seguridad de forma continua apoyada en la identificación
de los riesgos de forma continuada en el tiempo. En cambio 27002 es una
mera guía de buenas prácticas que describe una serie de objetivos de control y
gestión que deberían ser perseguidos por las organizaciones.
Un sistema de Gestión de la Seguridad de la Información es un conjunto de
políticas y procedimientos que sirven para estandarizar la gestión de la
Seguridad de la Información.

8
ISO International Organization Standardizatiion
 58

2.15.2. CRIPTOGRAFIA MD5

9
MD5 es uno de los algoritmos de reducción criptográficos diseñados por el
profesor Ronald Rivest, es un algoritmo de reducción criptográfico de 128 Bits
ampliamente usado.
En codificación del MD5 de 128 bits es representada típicamente como un
numero de 32 dígitos hexadecimal. El siguiente código de 28 bytes ASCII será
tratado con MD5 y veremos su correspondiente hash de salida.

MD5 (“Esto si es una prueba de MD5”) = e07186fbff6107d0274af02b8b930b65

Un simple cambio en el mensaje nos da un cambio total en la codificación

hash, en este caso cambiamos dos letras, el “si” por un “no”.

MD5 (“Esto no es una prueba de MD5”) = dd21d99a468f3bb52a136ef5beef5034

PORQUE NO Json Web Token

9
MD5, Messsage – Digest Algoritn 5
 59

CAPÍTULO
III
MARCO APLICATIVO
 60

3.1. INTRODUCCION

Para el presente proyecto de desarrollo de software uno de los problemas que

se presento es no saber con exactitud los requerimientos del usuario desde un
inicio de su elaboración para la presentación y promoción de los recursos y
servicios que presenta la Ciudad de El Alto, sin embargo la forma de publicitar
dichos recursos es desarrollando un portal Web que muestre de forma
dinámica el cual permita al usuario poder navegar por el portal de manera fácil
y sencilla.

En el presente capitulo describe la implementación de la metodología UWE

para las fases de Planificación, Diseño, Codificación, Pruebas, Implementación
y Mantenimiento.

Para su mejor comprensión sobre la forma de aplicación de la metodología

UWE a continuación se muestra en la tabla N° 3.1 él desarrollo del sistema
empleando la metodología UWE.

Tabla No 3.1: Fases y procesos metodología UWE

FASES DE LA METODOLOGÍA PROCESOS UWE
- Definir el Problema
- Fijar los requisitos del sistema
- Identificar las necesidades del
Planificación usuario con respecto a la
información, navegación y
adaptación.
- Definir la estructura que tomara el
sistema
- Diseñar las plantillas haciendo uso de
diferentes herramientas, así como
Diseño del sistema también lápiz y papel.
- Definir el diagramado con respecto a
la institución parea el cual se está
realizando el sistema como en este
caso GAMEA
- Pasar la estructura del sistema a
código así como la base de datos.
- Pasar a código fuente las plantillas
diseñadas que guardaran la
Codificación del software información.
- Pasar a código fuente el
diagramado de la institución para
publicitar la ciudad de El Alto.
- Realizar las pruebas
correspondientes del sistema ya
Pruebas
sea en modo escritorio y que sea
 61

responsive.
- Realizar las pruebas de
navegación verificando los enlaces
que contiene.
- Verificar el almacenamiento de la
información sin pérdida de datos.
- El sistema desarrollado es
trasferido apropiadamente al
servidor o computador principal,
La instalación o fase de inicializado y eventualmente
implementación. configurado.
- El propósito es ser ya utilizado por
el usuario final.
- Es el proceso de control, mejora y
optimización del software ya
desarrollado e instalado, que
también incluye depuración de
Mantenimiento y seguimiento
errores y defectos que pueden
haberse filtrado de la fase de
control de pruebas.
Fuente: (Elaboración propia)

3.2. ANÁLISIS DE LA SITUACIÓN ACTUAL

Actualmente la Ciudad de El Alto no cuenta con un sitio Web, una plataforma

donde muestre lo maravilloso que es la ciudad de El Alto y que constantemente
este al conocimiento no solo de los habitantes de la misma ciudad sino a los
alrededores de la ciudad y porque no decirlo, que este al conocimiento y a la
vista del mundo. La ciudad de El Alto cuenta con particularidades que la hacen
única, como por ejemplo:

- Es la agrupación misma de varias culturas

- Muestra constantemente las danzas autóctonas de nuestro país.
- Hace prevalecer el Folklore como parte de nuestra cultura
- Tiene sitios turísticos.
- Cuenta con entidades de Apoyo.
- Cuenta con empresas de marca internacional
- Es una ciudad ambiciosa por salir adelante.
- Es una ciudad con historia
 62

- Es el núcleo principal de visitantes interprovinciales

- Es el núcleo principal de visitantes interdepartamentales.
- Es el núcleo principal de visitantes internacionales.
- Es la ciudad donde se habla dos idiomas a la par.
- Es la ciudad que mantiene viva las creencias de la nuestra tierra.
- Es una ciudad con mucha creatividad
- Es una ciudad que cuenta con arquitectura artística.
- Cuenta con la feria más grande de toda Latinoamérica.
- Es la ciudad más joven.

Podemos decir varias características que hacen de nuestra ciudad, única; sin
embargo, cabe preguntar lo siguiente:

¿Los habitantes de la ciudad de El Alto conocen sus sitios turísticos?

¿La ciudad de El Alto cuenta con un sitio web o plataforma que muestre sus
principales características?

El presente proyecto contesta satisfactoriamente estas preguntas con la

creación de un Portal web de la misma ciudad de El Alto, haciendo uso del
análisis de la situación actual de la ciudad, identificando satisfactoriamente
temas que son considerados por el GAMEA.
 63

Tabla N° 3.2. : Diagrama General de Flujo de Procesos del Portal Web

USUARIO REGISTRO VALIDACIÓN NAVEGACIÓN

INICIO

ENTRAR AL
PORTAL WEB

TIENE UNA
REGISTRARSE
CUENTA

PASSWORD
INGRESAR INGRESAR DATOS
ES VALIDO?

NAVEGAR

SALIR DEL PORTAL

WEB CERRAR
SESION?

FIN

Fuente: (Elaboración Propia)

 64

3.3. ANÁLISIS DE REQUERIMIENTOS

Es un estudio profundo de una necesidad tecnológica que tiene una empresa,

organización o negocio, en este caso nuestro Gobierno Autónomo Municipal de
El Alto (GAMEA) donde especifica las características operacionales que tendrá
el software; sin embargo dicho análisis se realiza a través de entrevistas,
observación, indagación y demás técnicas específicas que nos ayuda a
describir como se verá el presente proyecto.
Para nuestro portal web se requieren de ciertos requisitos para poder dar en
marcha con la continuidad de su lanzamiento oficial a la red, de lo cual podrá
hacer de este un mejor rendimiento en todos los niveles deseados.

3.3.1. Requerimiento de Hardware

Los requerimientos para un servidor Web a las que debemos seguir son las
siguientes:

Tabla Nro. 3.3: Requisitos de Hardware

PROCESADOR Procesador Intel Core i7 4790k 4 núcleos,
velocidad 4,40 ghz
MEMORIA RAM Memoria Ram 8 Gb (2x4gb) DDR3 667
Mhz
DISCO DURO Disco Duro 5TB sata o SDD
PLACA BASE Soporta dos procesadores con 8 de
memoria de apoyo hasta 512 Gb de
memoria, controlador dual y un puerto de
gestión.
Fuente: (Elaboración propia)

Un portal web viene alojado en un servidor local o de dominio público; sin

embargo, sus requerimientos de hardware se consideran cualquier dispositivo
que cuente o tenga acceso a internet, ya sea computadoras de escritorio,
tablets o dispositivos móviles.
 65

Para su correcto funcionamiento o para que su navegación sea cómoda, el

siguiente hardware debe cumplir con los siguientes requerimientos:
Requerimientos mínimos:
- Procesador Intel/AMD a 1.5 Ghz
- 2 GB de Memoria RAM
- 1 GB libre en el disco duro o memoria de
almacenamiento
- Resolución de pantalla de 1.024 x 768 pixeles
- Conexión a internet
- Dispositivos móviles de 1gb de RAM superior
Requerimientos recomendados:
- Procesador Intel/AMD a 2.6 Ghz
- 4 GB de Memoria RAM
- 4 GB libre en el disco duro o memoria de
almacenamiento
- Resolución de pantalla de 1.280 x 1.024 pixeles
- Conexión a internet
- Dispositivos móviles de 2gb de RAM superior

Identificación de Usuarios:
- El usuario final (toda persona que ingrese al portal)
tiene acceso a la información brindada por el Portal
Web excepto al panel de administración
- Los administradores pueden ingresar al panel de
administración.
- Personal registrado con los permisos debidamente
otorgados también puede ingresar al panel de
administración.
 66

3.3.2. Requerimiento de Software

Los requerimientos mínimos para que nuestro software entre en línea están
divididos de dos maneras, tanto por parte del servidor como del navegador
web.
Requerimientos para un servidor local:
- Virtual box
- VMware Worstation Pro
Requerimientos de un navegador web:
- Google Chrome
- Firefox
- Brave
- Microsoft Edge
Requerimientos del sistema operativo, pueden ser:
- Distribuciones Linux
- Windows xp, 7, 8, 8.1, 10
- Sistema Android
- MAC
- IOS

3.3.3. Funciones del Sistema

- Se hace la distinción entre usuarios y usuarios registrados. Solo los

usuarios registrados pueden publicar contenido. Un usuario se convierte
en un usuario registrado al iniciar sesión. Los usuarios no registrados
pueden registrarse con un nombre de usuario (login) y una contraseña
elegida libremente.
- Cada usuario puede buscar contenido de su interés por su nombre. No
se ofrece otro tipo de búsqueda. El resultado de la búsqueda se
presenta como una lista de contenidos similares que proporciona
 67

enlaces a una página de detalles por cada contenido. Las páginas de

detalles del contenido muestran el título y sus características. Si el
contenido puede ser descargado se mostrara un enlace de descarga.
- Solo se puede descargar documentos en formato PDF, ya que las
imágenes y video es de libre descarga.
- Si un usuario ha iniciado sesión, puede navegar por el portal libremente
explorando la variedad de recursos que ofrece la ciudad de El Alto.
- Siempre se mostrara los enlaces de iniciar y salir de la sesión.

3.3.4. Requerimientos del sistema

3.3.5. Requisitos Funcionales

Un requerimiento funcional define una función del sistema del software o sus
componentes; también sirve para describir los resultados producidos de
acuerdo a las entradas. En este caso la lista a continuación muestra los
requerimientos observados para el portal web.
- Debe contar un módulo que permita al usuario visualizar, la ubicación de
un sitio turístico o servicio mediante la pantalla del dispositivo móvil o de
un ordenador.
- El portal web debe permitir al usuario acceder a la información acerca de
un punto de interés para el turista o habitante.
- El portal web debe ser capaz de mostrar los lugares de mayor o menor
influencia.

3.3.6. Requerimientos No Funcionales

Los requerimientos no funcionales muestran los aspectos del sistema visibles

para el usuario.
- Es necesario que el ordenador cuente con conexión a internet.
- Es necesario que el dispositivo móvil cuente con conexión a internet.
- El portal web debe ser de fácil navegación
- La interface del usuario debe ser amigable e intuitiva.
 68

3.3.7. ROLES
Los roles con los que estamos trabajando en el presente proyecto son:

Administrador del Portal: Suele ejercer funciones similares a las de un jefe de

proyecto, debe aportar la visión global del sitio y contar con conocimientos
técnicos suficientes como para poder abordar las tareas de manera eficaz.

Es quien llena de contenido el Portal Web.

Desarrollador: Suele ser el encargado de diseñar las plantillas y gestionar las

base de datos del portal Web para que el administrador pueda cargar datos.

Es quien maneja el código del Sistema.

Usuario Final: Es quien ingresa al portal de manera segura, donde puede

disfrutar del contenido.

Es la persona a quien va dirigido el Portal Web.

3.4. ANÁLISIS DE REQUERIMIENTOS Y DISEÑO DEL SISTEMA

Para realizar el análisis de este portal web se ha optado por seguir las
recomendaciones definidas por UML (Unified Modeling Language o Lenguaje
de modelado unificado). Este modelo dispone de multitud de diagramas que
ayudan a comprender la complejidad de nuestro sistema, permitiéndonos
plasmar en un lenguaje estándar aquellas funcionalidades, requisitos y demás
características que hemos detectado en nuestro sistema.

Aunque UML define una gran cantidad de diagramas para representar los
distintos aspectos del desarrollo de la aplicación, en nuestro caso nos hemos
centrado en dos tipos de diagramas: el diagrama entidad relación, el diagrama
de clases y el diagrama de casos de uso.
El diagrama entidad relación da origen al diagrama de clases identificando los
atributos de las entidad y de las relaciones en caso de que necesitase.
 69

descripción tipo
descripción

Id_transporte ubicación tipo ubicación

Id_hospedaje red_social
ap_materno
TRANSPORTE
ap_paterno c.i. imagen
hora_ingreso
contacto
password nombre celular HOSPEDAJE
red_social
Id_menu
correo tipo
login Id_user
Id_gastronomia

1:1 1:M
verifica USUARIO ingresa MENU tiene SERVICIO contiene GASTRONOMIA

password M:M
descripción
dirección
fecha_ingreso num_visitas Id_departamento contacto
login ubicación
PORTAL WEB nombre
red_social
publica TURISMO DEPARTAMENTOS
fecha_publicación
descripción red_social
VISITANTE ADMIN ubicación M:M
tiene imagen
ubicación
contacto
M:M M:M M:M
SITIO_NATURAL contiene MANUFACTURA_CULTURAL
imagen
CONTENIDO Id_sitio
PANEL_INFORMATIVO
Id_cultura ubicación
M:M historia M:M
nombre
contacto red_social descripción nombre historia
FOLKLORE descripción
es
Id_folklore imagen
descripción
M:M M:M M:M nombre
ubicación
Id_imagen IMAGENES COMENTARIOS DOCUMENTOS
descripción historia
tamaño
archivo_imagen
Id_comentario Id_documento
tipo_doc
tipo
tamaño descripción descripción

Figura Nro. 3. 1: Análisis Diagrama Entidad-Relación

Fuente: (Elaboración propia)
 70

3.4.1. Diagrama de Clases

El diagrama de clases describe la estructura del sistema mostrando las

relaciones (asociación, agregación y composición) entre los distintos elementos
que conforma nuestro portal web, expresado estos como clases con sus
atributos.

Login
-login
-password
Creativo Tipo_transporte
-id_user * * Salud
-id_login -id_creativo -id_tipo_transp Tipo_Salud
* -descripcion -id_salud
Tipo_Contenido -nombre
* -id_tipo_salud -nombre
* -descripcion
-id_tipo_contenido -descripcion -descripcion
-descripcion -id_user * -ubicacion
*
-id_tipo_salud
Transporte
-id_transporte
* -descripcion *
-id_tipo_transp
* Hospedaje Tipo_Hospedaje
-ubicacion
Publicación Usuario -id_hospedaje -id_tipo_hosp
*
-id_publicación : int -id_user : int -id_tipo_hos -descripcion
-descripcion * *
-fecha_publicacion : Date -nombre : string *
* -ubicacion
-id_tipo_contenido * -ap_paterno : string * *
-descripcion : string -ap_materno : string -contacto
* -id_zona Zona Distrito
-tamaño -c.i. : int
-id_user -celular : int Navegación -id_zona -id_distrito
* -nombre
* -dirección : string -id_nav * * * -nombre
-login : string -id_transporte -descripcion * -descripcion
-password -id_sitio * Departamentos -ubicacion -ubicacion
* * *
-id_cultura -id_depto -id_distrito
* * -id_folklore -nombre
* *
-id_gastronomia -descripcion
* ** Tipo_Departamento *
Ingreso Folklore -id_departamento -ubicacion *
-id_hospedaje -contacto * -id_tipo_depto
-id_ingreso -id_folklore * -descripcion
Comentario -num_visitas -nombre -id_user -id_zona
* Deporte
-id_comentario -fecha -descripcion
-id_deporte
-id_user -hora -historia
Tipo_Gastronomia -nombre
-fecha -id_user -ubicacion ** * Gastronomia
* -id_tipo_deporte
-descripción -id_portal -id_tipo_gastr
-id_gastronomia -ubicacion
* -descripcion
-id_tipo_gastr * *
* -descripcion
** Comercio -ubicacion *
-id_comercio -contacto * *
Portal_Web
-nombre
-id_portal -id_tipo_comercio * * Tipo_deporte
Tipo_Educa ** Institucion_Educativa
-contador -descripcion -id_tipo_deporte
-ubicacion -id_tipo_educa -id_educa
Sitio_Natural Manufactura_Cultural -descripcion
-descripcion -nombre
* -id_tipo_educa
-id_sitio -id_cultura
-nombre -nombre -descripcion
Tipo_comercio -descripcion -descripcion -id_distrito
-historia -historia -id_zona
-id_tipo_comercio
-ubicacion -ubicacion
-descripcion

Figura Nro. 3. 2: Diagrama de Clases

Fuente: (Elaboración propia)
 71

3.5. APLICACIÓN DE LA METODOLOGIA UWE

3.5.1. Análisis de Requerimientos

Los requisitos en UWE se modelan mediante un diagrama de casos de uso,
donde forman una versión aproximada a las funciones descritas del portal web.

3.5.1.1. Diagrama de Casos de Uso

Los diagramas de casos de uso nos permiten diferenciar los actores que
interactúan con nuestro portal web, las relaciones entre ellos y las acciones que
pueden realizar cada uno dentro del sistema.

Este tipo de diagramas son fácilmente comprensibles tanto por clientes como
por usuarios, representan los requisitos funcionales del sistema y se utilizan
como base para un desarrollo iterativo e incremental. Los diagramas de clases
de uso tienen tres elementos que son:

 Actores: Son los usuarios del sistema. Un actor puede ser una persona,
un conjunto de personas, un sistema hardware o un sistema software.
Los actores representan un rol, que puede desempeñar alguien que
necesita intercambiar información con el sistema.
 Casos de uso: Un caso de uso describe una forma concreta de utilizar
parte de la funcionalidad de un sistema. La colección de todos los casos
de uso describe toda la funcionalidad del sistema.
 Comunicación entre actores y casos de uso: n Cada actor ejecuta un
numero especifico de casos de uso del sistema y por eso decidimos que
hay comunicación entre actores y casos de uso.
a) Actores
Los usuarios No regustrados son todas esas personas que acceden al portal
web a través de internet sin la necesidad de autentificarse.
EL usuario registrado como el Admin o una persona comun son los usuarios,
que acceden a nuestro portal web por internet mediante un login y password.
 72

Figura Nro. 3. 3: Actores

Fuente: (Elaboración propia)

Usuario

Administrador Usuario No Registrado

WebMaster

Figura Nro. 3. 4: Actores del Portal web

Fuente: (Elaboración propia)

b) Casos de uso del usuario

 73

Los casos de uso del usuario tienen como objetivo dirigirse al usuario final
pues este es a quien va dirigido el Portal para su navegación.
El Usuario (Usuario final), podrá ingresar datos, visualizar, publicar,
descargar y consultar toda la información que el Portal Web quiera mostrar,
ya sea como usuario registrado o como un usuario no registrado.

Como parte de los usuarios se encuentra el administrador, es quien puede

realizar el CRUD del Portal Web, pues es quien tiene permisos para
publicar, a eso lo conocemos como insertar, también podrá eliminar,
modificar y visualizar datos.
Como administrador también está encargado de la redacción de la
información que se visualizara en el Portal Web. Así como el responsable
de lo que el usuario final podrá visualizar en la red sobre el Portal Web.
 74

Ingresa Ingresa
datos datos

visualizar publicar

publicar visualizar

Usuario descargar Crear contenido

Administrador

Consultar insertar

modificar

eliminar

Ingresa
datos
Registrarse

visualizar

visualizar
consultar

publicar Descargar

Usuario Registrado Usuario No Registrado

Descargar
explorar

comentar
Ve créditos
del portal
explorar

Ve créditos
del portal

Figura Nro. 3. 5: Casos de uso del usuario

Fuente: (Elaboración propia)

c) Casos de uso del portal web

 75

Los casos de uso del usuario están relacionados con los casos del uso del
administrador, pues la comunicación que existe entre ellos es el portal web;
así también se entiende que el administrador publique lo que quiere que el
usuario vea, es así que el administrador crea el contenido y el usuario es
quien consume la información al momento de visualizar algo de su interés
en el portal.

- Si el administrador desea eliminar algún registro, el usuario no podrá

acceder a esa información, ya que el contenido no se encontrara visible
en el portal.

- Si el administrador desea modificar algún contenido, el usuario podrá

visualizar el contenido ya modificado.

- El caso de uso del portal web termina cuando se sale del mismo portal.
 76

Portal Web
Inicia
Crea Sesion
Contenido
Comenta

Visualiza

Usuario
Publica

explora

descarga

Administrador Consulta
Crea
Administrador
Cierra
Modifica Sesion
Contenido
Accede a la base
de datos
WebMaster
Elimina
Contenido
Administra el
servidor

Figura Nro. 3. 6: Casos de uso del Portal Web

Fuente: (Elaboración propia)
 77

d) Casos de Uso del Módulo de Administración de información

Los casos de uso del Módulo de Administración menciona al sistema, a la
base de datos y al Administrador como actores porque todos intervienen en
la administración de la información.
De la parte de almacenamiento se encarga la base de datos y el sistema
permite visualizar lo que el administrador carga los datos.

Almacena la
Información

Visualiza el filtro
Base de Datos
Genera historial
Sistema

Filtra los Datos

Visualiza la información

Modifica los Datos

Inserta Información

Elimina la Información

Administrador

Figura Nro. 3. 7: Casos de uso del módulo de Administración

Fuente: (Elaboración propia)
 78

e) Módulo de Ubicación
El Actor Lugar especifica un sitio en específico que es cargado por el
administrador donde el usuario tiene conocimiento de su ubicación.

Visualiza Lugar

Usuario

Datos del Lugar

Lugar

Registra Lugar

Administrador

Figura Nro. 3. 8: Casos de uso de Ubicación

Fuente: (Elaboración propia)

f) Módulo de Búsqueda
El Administrador puede filtrar los datos del sistema de acuerdo a los
campos del modelo para tener un mejor control de la información de los
datos subidos al Portal Web.
 79

Formar Caso

Sistema
Realizar Búsqueda
Mostrar casos
similares

Administrador

Comparar Casos

Recuperar Casos

Base de Datos

Figura Nro. 3. 9: Casos de uso de Búsqueda

Fuente: (Elaboración propia)

g) Módulo de Traducción
El administrador sube mediante el sistema o panel de administración la
traducción del contenido especificado y es almacenado en la base de datos
para su posterior visualización para el usuario.
 80

Registra traducción

Inserta traducción
Administrador
Base de Datos

Elimina traducción Registra Cambios

Figura Nro. 3. 10: Casos de uso del módulo de Traducción

Fuente: (Elaboración propia)

h) Módulo de Recursos y Servicios

En los casos de Uso de recursos y Servicios se visualiza los campos de
Nombre, Descripción, lugar y tipo y es el administrador quien registra estos
datos en el panel de administración para su posterior visualización.
Los recursos y servicios son brindados por diferentes entidades del
Municipio alteño y es importante su conocimiento para los visitantes de la
región
 81

Nombre

Descripción Recursos

Registra Datos
Lugar
Administrador

Tipo
Servicios

Figura Nro. 3. 11: Casos de uso de los Recursos y Servicios

Fuente: (Elaboración propia)

i) Módulo de reportes y estadísticas

El informe del portal web es dirigido por el administrador, ya que el actor es
quien realiza esas funciones y da uso de esos módulos generalmente.

Registro de
Manifestaciones
Historial de modelos

Registro de Usuarios

Reporte de Datos

Registro de Arte
Administrador

Inicia Reportes Registro de Lugares

Figura Nro. 3. 12: Casos de uso de los Reportes y estadísticas

Fuente: (Elaboración propia)

TABLA DE DESCRIPCIÓN DE LOS CASOS DE USO

 82

Tabla N° 3.4. Administración del Sistema

Caso de Uso: Administración del Sistema (Información)
Actores: Usuario, Administrador, Sistema
Tipo: Primarios, Secundario (Sistema)
Descripción: El usuario recurre a los servicios del sistema para cumplir un
caso.
El administrador quien carga los datos al sistema
Sistema al que pertenece el caso de uso como ser el panel
de administración.
Fuente: (Elaboración Propia)
Tabla N° 3.5. Usuario
Caso de Uso: Usuario
Actores: Usuario, Administrador, Desarrollador
Tipo: Primarios
Descripción: El usuario recurre a los servicios del sistema para cumplir un
caso.
El administrador quien carga los datos al sistema
Desarrollador, encargado del Backend y Frontend del Portal
web.
Fuente: (Elaboración Propia)
Tabla N° 3.6. Administración del Sistema
Caso de Uso: Administración del Sistema (Portal Web)
Actores: Usuario, Administrador, Sistema
Tipo: Primarios
Descripción: Usuarios: El usuario recurre a los servicios del sistema para
cumplir un caso.
Administrador: Es quien cargar y modificar los datos al portal
Web
Web Master: Se encarga de otorgar los permisos al
administrador o administradores.
Fuente: (Elaboración Propia)
 83

Tabla N° 3.7. Ubicación

Caso de Uso: Ubicación
Actores: Usuario, Administrador, Lugar
Tipo: Primarios y Secundarios (lugar)
Descripción: Usuario: El usuario recurre a los servicios del sistema para
cumplir un caso.
Administrador: Es quien cargar y modificar los datos al portal
Web
Lugar: Son los sitios mencionados en el portal Web como
ser. Áreas verdes
Fuente: (Elaboración Propia)
Tabla N° 3.8. Búsqueda
Caso de Uso: Búsqueda
Actores: Administrador, Sistema, Base de Datos
Tipo: Primarios, Secundario (Sistema, Base de Datos)
Descripción: Administrador: Es quien cargar y modificar los datos al portal
Web
Sistema: Pertenece el caso de uso como ser el panel de
administración.
Base de Datos: Lugar donde se almacena los datos
cargados al sistema para su posterior uso y control.
Fuente: (Elaboración Propia)
Tabla N° 3.9. Traducción
Caso de Uso: Traducción
Actores: Administrador, Base de Datos
Tipo: Primario y secundario (Base de datos)
Descripción: Administrador: Es quien cargar y modificar los datos al portal
Web
Base de Datos: Lugar donde se almacena los datos
cargados al sistema para su posterior uso y control.

Fuente: (Elaboración Propia)

 84

Tabla N° 3.10. Recursos y Servicios

Caso de Uso: Recursos y Servicios
Actores: Administrador, Recursos, Servicios
Tipo: Primarios y Secundarios (Recursos y Servicios)
Descripción: Administrador: Es quien cargar y modificar los datos al portal
Web
Recursos: pueden ser naturales, arte, tecnología y otros,
que posee la ciudad de El Alto
Servicios: pueden ser las escuelas, hospitales, transporte,
teatros y otros, que posee la ciudad de El Alto
Fuente: (Elaboración Propia)
Tabla N° 3.11. Reportes y Estadísticas
Caso de Uso: Reportes y Estadísticas
Actores: Administrador
Tipo: Primario
Descripción: Administrador: Es quien cargar y modificar los datos al portal
Web para que pueda gestionar y sacar datos estadísticos de
la información que posee el Portal Web.

Fuente: (Elaboración Propia)

3.6. DISEÑO

3.6.1. Fase de Inicio

Esta fase tiene como propósito definir y acordar el alcance del proyecto con los
patrocinadores o alumnos de un proyecto en el cual se tiene que identificar los
riesgos asociados al proyecto, proponer una visión muy general de la
arquitectura de software y producir el plan de las fases y el de iteraciones
posteriores.
 85

3.6.2. Fase de Elaboración

En esta fase se diseñó la solución preliminar, donde se seleccionó los casos de

uso que permitieron definir la arquitectura base del sistema y se desarrolló el
primer análisis del dominio del problema.

Login
-login
-password
Creativo Tipo_transporte
-id_user * * Salud
-id_login -id_creativo -id_tipo_transp Tipo_Salud
* -descripcion -id_salud
Tipo_Contenido -nombre
* -id_tipo_salud -nombre
* -descripcion
-id_tipo_contenido -descripcion -descripcion
-descripcion -id_user * -ubicacion
*
-id_tipo_salud
Transporte
-id_transporte
* -descripcion *
-id_tipo_transp
* Hospedaje Tipo_Hospedaje
-ubicacion
Publicación Usuario -id_hospedaje -id_tipo_hosp
*
-id_publicación : int -id_user : int -id_tipo_hos -descripcion
-descripcion * *
-fecha_publicacion : Date -nombre : string *
* -ubicacion
-id_tipo_contenido * -ap_paterno : string * *
-descripcion : string -ap_materno : string -contacto
* -id_zona Zona Distrito
-tamaño -c.i. : int
-id_user -celular : int Navegación -id_zona -id_distrito
* -nombre
* -dirección : string -id_nav * * * -nombre
-login : string -id_transporte -descripcion * -descripcion
-password -id_sitio * Departamentos -ubicacion -ubicacion
* * *
-id_cultura -id_depto -id_distrito
* * -id_folklore -nombre
* *
-id_gastronomia -descripcion
* ** Tipo_Departamento *
Ingreso Folklore -id_departamento -ubicacion *
-id_hospedaje -contacto * -id_tipo_depto
-id_ingreso -id_folklore * -descripcion
Comentario -num_visitas -nombre -id_user -id_zona
* Deporte
-id_comentario -fecha -descripcion
-id_deporte
-id_user -hora -historia
Tipo_Gastronomia -nombre
-fecha -id_user -ubicacion ** * Gastronomia
* -id_tipo_deporte
-descripción -id_portal -id_tipo_gastr
-id_gastronomia -ubicacion
* -descripcion
-id_tipo_gastr * *
* -descripcion
** Comercio -ubicacion *
-id_comercio -contacto * *
Portal_Web
-nombre
-id_portal -id_tipo_comercio * * Tipo_deporte
Tipo_Educa ** Institucion_Educativa
-contador -descripcion -id_tipo_deporte
-ubicacion -id_tipo_educa -id_educa
Sitio_Natural Manufactura_Cultural -descripcion
-descripcion -nombre
* -id_tipo_educa
-id_sitio -id_cultura
-nombre -nombre -descripcion
Tipo_comercio -descripcion -descripcion -id_distrito
-historia -historia -id_zona
-id_tipo_comercio
-ubicacion -ubicacion
-descripcion

Figura Nro. 3. 13: Diagrama de Clases

Fuente: (Elaboración propia)
 86

3.7. DESARROLLO DEL MODELO

3.7.1. Modelo Conceptual

En este modelo visualizamos la información relevante del dominio del portal

web que comprende principalmente el contenido de la aplicación web. En
nuestro ejemplo, la información es proporcionada por las clases Usuario,
Navegación y Sitio Natural. Un diagrama de clase UML y clases simples UML
que se utilizaron para modelar el contenido.

Usuario Navegación
-id_user : int -id_nav
-nombre : string -id_transporte
-ap_paterno : string 1 * -id_sitio
-ap_materno : string -id_cultura
-c.i. : int -id_folklore
-celular : int -id_gastronomia
-dirección : string -id_departamento
-login : string -id_hospedaje
-password -id_user

1
* Sitio_Natural
-id_sitio
-nombre
-descripcion
-historia
-ubicacion

Figura Nro. 3. 14: Modelo conceptual con diagrama de clases

Fuente: (Elaboración propia)
 87

Iglesia
Arquitectura
Artista -id_iglesia Gastronomia Deportes_Cont
ArtesPlasticas -titulo -id_arquitec Restaurantes UnidadEducativa
-id_artista -nombre WhipalaCont -id_gastronomia -id_deport_cont
-id_artes_plast -contenido -id_restaurante -id_unidad
-nombre -contendio -nombre -nombre
-nombre -imagen -id_whipala -nombre -nombre
-descripcion -imagen -descripcion -descripcion
-contenido -fecha ArquiCont -titulo -imagen -descripcion
-imagen -fecha -imagen -imagen
-imagen -contenido -descripcion -imagen
-fecha -id_arqui_cont -lugar -tipo
-fecha -imagen -lugar -fecha
-titulo -horario -lugar
-fecha -fecha
-contenido -precio -fecha
-imagen
-fecha
Historia
-id_historia Manifestaciones Servicios Deportes
-titulo -id_servicios
-id_manifestaciones -id_deporte
-nombre_principal -nombre
-titulo -titulo
-nombre_secundario Hospedaje -desripcion
-contenido Tecnologia -imagen
-imagen_principal TecnologiaContenido -imagen
-imagen_principal -id_hospedaje -contendio
-imagen_secundario -id_tecnologia -id_tecno_cont
-imagen_secundaria -descripcion -fecha -fecha
-fecha Proyecto -nombre -titulo
-audio -lugar -tipo
-contenido -contenido
-id_proyecto -traducido -tipo
-imagen -imagen
-titulo -fecha -imagen_principal
-fecha -fecha
-contenido -imagen_secundaria
-imagen
-fecha
Lugar
-id_lugar
-nombre
-descripción
-ubicación
Museo MuseoContenido Recursos
Transporte
Usuario Administrador -id_recursos
-id_museo -id_museo_cont -id_transporte
-id -id -titulo -titulo -nombre
Turismo -nombre
-nombres -nombres Cultura -contenido -contenido -tipo
-descripcion
-ap_paterno -ap_paterno -id_turismo -imagen -tipo -imagen
-id_cultura -imagen
-ap_materno -ap_materno -titulo -fecha -imagen -fecha
-titulo -lugar
-ci -telefono -contenido -lugar -fecha
-contenido -fecha
-dirección -dirección -imagen 1 AreaVerde
-imagen
-e-mail -e-mail -imagen2
-fecha -id
-telefono -ci Empresas -audio
-nombre
-traducido
-id_empresas -lugar
-creacion
-nombre Festival -imagen
-descripcion -fecha
-id_festival
UsuarioFinal -imagen Festival_Contenido
-titulo
-lugar
-id -contenido -id_fest_cont
-fecha Ballet
-nombres -imagen -titulo
-ap_paterno -id_ballet -creacion -contenido
-ap_materno -nombre -modificación -director1
-ci -imagen -director2
-dirección -fecha -imagen1
-e-mail -imagen2
-telefono -fecha

Figura Nro. 3. 15: Modelo conceptual general con diagrama de clases

Fuente: (Elaboración propia)
 88

3.7.2. Modelo de usuario

Mientras que nuestro modelo de contenido define el contenido de datos de la

aplicación, el modelo de usuario tiene dos propósitos diferentes. Por un lado
contienen clases que definen que información se almacena en el contexto de
una sesión. En este ejemplo, vemos que una sesión puede tener un usuario
actual que puede tener una lista de navegación.

Figura Nro. 3. 16: Modelo del usuario con diagrama de clases

Fuente: (Elaboración propia)
 89

3.7.3. Modelo de Navegación

Al igual que el portal web final, el modelo presentado en el siguiente diagrama

se basa en un menú de navegación. Este menú en si está dividido en algunos
submenús, que permiten al visitante abrir diferentes tipos de información
accesibles en nuestro portal web.

contenidoapp
PortalApp
-id
-id
-nombre Funciones
-nombre
+añadir() -id
AutenticaciónAutorización +añadir()
+modificar() -nombre_lista
+modificar()
-id +eliminar() -
+eliminar()
-lista +leer() +añadir()
+leer()
-sublista +modificar()
+filtrar()

Usuarios
AdministraciónPortalWeb UnidadEducativaApp
-id
-id -id
-lista
-nombre -nombre
-nombre
-header +añadir()
-direccion
-nav +modificar()
-nombre
-body +eliminar()
-apellidos
-footer TurismoApp +leer()
-tipo
+añadir() -id
+modificar() -nombre
+eliminar() +añadir()
+leer() GastronomiaApp +modificar()
transporteApp +eliminar()
-id
-nombre -id ProyectoApp +leer()
+añadir() -nombre
-id
+modificar() +añadir() -nombre
+eliminar() +modificar()
+añadir()
+leer() +eliminar()
+modificar()
+leer()
+eliminar()
+leer()

Figura Nro. 3. 17: Modelo del panel de Administración con diagrama de clases
Fuente: (Elaboración propia)
 90

Menú
MainMenu Usuario

Hospedaje Logout

UserMenu
Servicios Informaciones
MenuNavegación

Cultura Gastronomia

Museos Seguridad Educación Salud Deportes

SitioNatural

ÁreasVerdes
Transporte Áreas más visitadas

MenuContantos

Información Contactos RedSocial

Acerca de... WhatsApp FaceBook Twitter

Tramites
Ubicación Teléfono

MainMenu2 Ubicación

Menú Publicar Publicaciones

Departamentos Subalcaldia
Comentarios
Alcaldia
Folklore

tramites Ubicación

Figura Nro. 3. 18: Modelo de navegación con diagrama de clases

Fuente: (Elaboración propia)
 91

3.7.4. Modelo de procesos

Debido a que el portal web es dinámico y estático a la vez, su modelado

contiene procesos en diferentes funciones.

Registra Registra
*
-ErrorMensaje -ErrorMensaje
-UserName * -UserName
Usuario Admin
-Password -Password
-id_User -id_User
* -Nombre -Nombre
-Ap_paterno -Ap_paterno *
* -Ap_Materno *
* -Ap_Materno *
-Login -Login
-password -password
Login Login
-id_login -id_login
-UserName -UserName
-Password -Password
-ErrorMensaje -ErrorMensaje

* * Navega
Publica
-id_publicacion -Id_Nav
Usuario Usuario * -Nombre
-descripcion
-fecha -id_User -fecha
* -id_User
-Nombre -Nombre
-Ap_paterno -Ap_paterno
-Ap_Materno -Ap_Materno *
** *
-Login -Login
-password -password
Contenido PaginaWeb
-id_contenido -url
-tipo
-descripcion

Figura Nro. 3. 19: Modelo de navegación de procesos con diagrama de clases

Fuente: (Elaboración propia)
 92

3.7.5. Modelo de presentación

El modelo de presentación del ejemplo se muestra como un diagrama de

estructura compuesta UML. En este tipo de diagrama, las propiedades
contenidas en la composición se muestran como rectángulos contenidos en la
clase que lo contiene.

Portal Usuario Login

Registro :name Login

:error de mensaje Ap_Paterno
LogOut
UserName Ap_Materno

C.I. Register
password
Dirección
RegistroNum
Login

Passoword

Figura Nro. 3. 20: Modelo de presentación del usuario

Fuente: (Elaboración propia)
 93

Portal Usuario Sitio_Natural

Registro :name Descripción

:error de mensaje Ap_Paterno Ubicación

UserName Ap_Materno

C.I.
password Departamentos
Dirección
RegistroNum Nombre
Login
Direccion

Passoword
Teléfono

Login
RedesSociales
Bienvenidad
Descripción
Login
Descripción

LogOut
Usuario Visitante
Register

Navegación

Menú

Turismo

Servicios
Img

Informaciones

Arte_Alteño

PublicidadEmpresarial

Figura Nro. 3. 21: Modelo de presentación del portal con diagrama de clases
Fuente: (Elaboración propia)
 94

Navegación

Menú

Turismo

Img Servicios

Informaciones

Arte_Alteño
Descripción

PublicidadEmpresarial

Figura Nro. 3. 22: Modelo de presentación de la navegación

Fuente: (Elaboración propia)

Título de aplicación Añadir

Filtro
Autenticación

ContenidoApp

PortalApp
Activo

ProyectoApp

TurismoApp

TransporteApp

RecServiciosApp

Figura Nro. 3. 23: Modelo de presentación del panel administrativo

Fuente: (Elaboración propia)
 95

Recursos y Servicios

Audio

Figura Nro. 3. 24: Modelo de presentación de recursos y servicios

Fuente: (Elaboración propia)

3.8. FASE DE CONSTRUCCIÓN

En esta fase se pudo completar la funcionalidad del sistema, donde se
clarifican los requisitos pendientes, donde se administran los cambios de
acuerdo a las evaluaciones realizadas por los usuarios y donde se realizó sus
respectivas mejoras.

3.8.1. Base de Datos

Postgresql es la base de datos que se utilizara para almacenar y realizar todas

las consultas que el usuario requiera de nuestro Portal Web, siguiendo el
siguiente modelo lógico de la base de datos.
 96

UserInfo
Id_user int() Lugares
Nombres varchar()
Login varchar() Id_lugar int()
Password varchar() Id_user int()
Id_tipo_lugar int()
Nombre varchar()
Descripcion varchar()
Direccion varchar()
Imagen_lugar varchar()
Actividad

Id_actividad int()
Id_user int()
Id_lugar int()
Nombre varchar()
Descripcion varchar() Tipo_lugar
Fecha_inicio date()
Fecha_fin date() Id_tipo_lugar int()
Hora datetime() Descripcion varchar()

Figura Nro. 3. 25: Modelo de lógico con diagrama de clases

Fuente: (Elaboración propia)

3.8.2. Patrón Modelo Vista Controlador

El MVC o Modelo-Vista-Controlador es un patrón de arquitectura de software

que, utilizando tres componentes (Vistas, Modelos, Controladores) separa la
lógica de la aplicación de la lógica de la vista de una aplicación. Es una
arquitectura importante puesto que se utiliza tanto en componentes gráficos
básicos hasta sistemas empresariales; la mayoría de los frameworks modernos
utilizan MVC para la arquitectura, entre ella podemos mencionar Ruby,
AngularJS y muchos otros más.
 97

3.8.3. Diseño de Interfaces

Es el área de diseño que se enfoca en la parte visual de un producto digital en

este caso nuestro portal web, donde permite crear interfaces intuitivas,
usables, iterativas e impactantes.
Podemos utilizar diferentes herramientas para el diseño de nuestra interfaz; sin
embargo para desarrollar el portal web de la ciudad de El Alto se hizo uso de la
herramienta Balsamiq Mockups 3. El diseño es tanto para modo escritorio
como móvil.
 98

Figura Nro. 3. 26: Interface de la presentación en modo escritorio

Fuente: (Elaboración propia)
 99

Figura Nro. 3. 27: Interface de la presentación en modo móvil

Fuente: (Elaboración propia)
 100

3.9. LA INSTALACIÓN O FASE DE IMPLEMENTACIÓN

Es la fase de cierre, el propósito es asegurar que el software esté disponible

para los usuarios finales; así mismo ajustar los errores y defectos encontrados
en la prueba de aceptación, para capacitar a los usuarios a su manejo y así
proveer el soporte necesario.
Las siguientes vistas son puestas en un servidor local para el funcionamiento
de nuestro portal como prueba y así obtener la prueba de aceptación del
usuario y subirlo a un hosting.

Figura Nro. 3. 28: Vista principal del Portal Web en el Servidor Local
Fuente: (Elaboración propia)
 101

Barra de Navegación Script de Búsqueda

Botones de Exploración

Botón de Redes Sociales

Figura Nro. 3. 29: Vista principal del Portal Web con sus características
Fuente: (Elaboración propia)
 102

Vista de un modelo Samsung Galaxy S5

Figura Nro. 3. 30: Vista principal del Portal Web responsive

Fuente: (Elaboración propia)

Figura Nro. 3. 31: Vista Principal (Haciendo Click en el Botón “La ciudad más
joven”)
Fuente: (Elaboración propia)
 103

Figura Nro. 3. 32: Vista Principal de las categorías de Turismo

Fuente: (Elaboración propia)

Incluye conjunto de botones con funcionalidad propia

Figura Nro. 3. 33: Navegando por el Portal con sus botones y funcionalidades
Fuente: (Elaboración propia)
 104

La función del Botón Permite Traducir a Aymara la Sección elegida

Figura Nro. 3. 34: Dando Click en el botón traducir

Fuente: (Elaboración propia)

El botón de Audio, cumple la función de Escuchar el Himno

Figura Nro. 3. 35: Dando Click en el botón de Audio

Fuente: (Elaboración propia)
 105

Figura Nro. 3. 36: Navegando por el Portal sección de Manifestaciones

Fuente: (Elaboración propia)

Figura Nro. 3. 37: Navegando por el Portal sección de Manifestaciones (vista 2)

Fuente: (Elaboración propia)
 106

Al dar Click en Ver más te lleva a nuevas vistas

Figura Nro. 3. 38: Navegando por el Portal en Arte Alteño (vista 1)

Fuente: (Elaboración propia)

Figura Nro. 3. 39: Navegando por el Portal en Arte Alteño dando click en Ver
más (vista 2)
Fuente: (Elaboración propia)
 107

Figura Nro. 3. 40: Navegando por el Portal en Noticias

Fuente: (Elaboración propia)

Figura Nro. 3. 41: Navegando por el Portal en Noticias > Coronavirus en Bolivia
Fuente: (Elaboración propia)
 108

Figura Nro. 3. 42: Navegando por el Portal en Noticias > El mundo

Haciendo de funcionalidades externas implementadas en nuestro portal

Fuente: (Elaboración propia)

 109

3.10. PRUEBAS
Las pruebas al presente proyecto se realizan para comprobar su funcionalidad,
en este caso utilizaremos las pruebas de caja negra en los procesos más
relevantes del sistema.

Pruebas de Caja Negra

Las pruebas de caja negra, es una técnica de pruebas de software en la cual la

funcionalidad se verifica sin tomar en cuenta la estructura interna de código,
detalles de implementación o escenarios de ejecución internos en el software.

En las pruebas de caja negra, nos enfocamos solamente en las entradas y

salidas del sistema, sin preocuparnos en tener conocimiento de la estructura
interna del programa de software y de esta manera realizamos la prueba de
caja negra en el presente Portal Web El Alto.

 Visualización en diversos navegadores

Descripción de la situación: La pantalla del portal debe visualizarse con los

navegadores web Chrome, Firefox, Brave y Edge.

Técnicas de pruebas de Caja negra: Requerimiento funcional / Casos de uso.

Caso 1.1:

Datos de entrada: Acceder al Login del portal Web desde Chrome.

Resultado esperado (Salida): La pantalla se visualiza correctamente y diseño

es “Responsive” a los cambios en el tamaño de pantalla y resolución.

Caso 1.2:

Datos de Entrada: Acceder a pantalla del Login del Portal Web desde el
navegador Firefox.

Resultado esperado (Salida): La pantalla se visualiza correctamente y diseño

es “Responsive” a los cambios en el tamaño de pantalla y resolución.
 110

Caso 1.3:

Datos de Entrada: Acceder a pantalla del Login del Portal Web desde el
navegador Brave.

Resultado esperado (Salida): La pantalla se visualiza correctamente y diseño

es “Responsive” a los cambios en el tamaño de pantalla y resolución.

 Capacidad de procesamiento del sistema

Descripción de la situación: El sistema debe ser capaz de procesar la carga

de imágenes y las plantillas continuamente. Esto se medirá por medio del
mismo portal web.

Técnica de pruebas de caja negra: Prueba no funcional.

Caso 2.1:

Datos de entrada: Utilizar SoapUI para simular menos de 100 mil sesiones
concurrentes

Resultado esperado (Salida): Las sesiones son procesadas adecuadamente y

sin error por el sistema.

Caso 2.2:

Datos de entrada: Utilizar SoapUI para simular más de 100 mil sesiones
concurrentes

Resultado esperado (Salida): Al llegar al límite de su capacidad funcional, el

sistema no muestra errores, sin embargo por la carga continua de plantillas
baja la carga de datos.

Prueba de Caja Blanca

También suelen ser llamadas estructurales o de cobertura lógica. En ellas se

pretende investigar sobre la estructura interna del código, exceptuando detalles
 111

referidos a datos de entrada o salida, para probar la lógica del programa desde
el punto de vista algorítmico.

Durante esta etapa se realizó la tarea más importante que comúnmente se

conoce como prueba de programación, que consiste esencialmente en llevar a
código fuente todo lo diseñado anteriormente y verificar su funcionamiento.

Figura Nro. 3. 43: Código Fuente del Login en el Lenguaje PHP

Fuente: (Elaboración propia)
 112

Figura Nro. 3. 44: Código de enlaces para los estilos del proyecto usando el
editor de código Sublime Text
Fuente: (Elaboración propia)

Figura Nro. 3. 45: Código Fuente del Header del Proyecto

Fuente: (Elaboración propia)
 113

Figura Nro. 3.46: Código Fuente del section de botones del Proyecto
Fuente: (Elaboración propia)

Figura Nro. 3. 47: Código Fuente de Rutas para el uso del Portal web, haciendo
uso de uno del Framework de Python (Flask)
Fuente: (Elaboración propia)
 114

Figura Nro. 3. 48: Dando estilos a nuestro Portal web con CSS3
Fuente: (Elaboración propia)

3.11. SEGURIDAD INFORMÁTICA

La seguridad de la información es un aspecto esencial de las tecnologías de
información en organizaciones de cualquier tamaño y tipo. Se trata de un
aspecto que tiene que ver con la protección de datos contra accesos no
autorizados y para protegerlos de una posible corrupción durante el ciclo de
vida del proyecto.
Seguridad de datos incluye conceptos como encriptación de datos,
tokenización y prácticas de gestión de claves que ayudan a proteger los datos
en todas las aplicaciones y plataformas de una organización.
El presente proyecto tiene conexiones cifradas y las paginas seguras con
protocolos HTTPS que pueden ocultar y proteger los datos enviados y recibidos
en los navegadores.
 115

3.11.1. SEGURIDAD A NIVEL BASE DE DATOS

En el presente proyecto lo primero que debemos suponer es que el diseño del
sistema es público del cual debemos preocuparnos por la seguridad de la base
de datos y por ello notamos diferentes aspectos como ser:
- El defecto debe ser: sin acceso.
- Chequear permanentemente.
- Los mecanismos de protección deben ser simples, uniformes y
construidos en las capas más básicas del sistema.
Para proteger la bases de datos se siguió los siguientes requisitos:
- La base de datos debe ser protegida contra el fuego, el robo y otras
formas de destrucción.
- Los datos deben ser re-construibles, ya que puede existir cualquier
accidente.
- Los datos deben poder sometidos a procesos de auditoria.
- El sistema debe diseñarse a prueba de intromisiones, no debería poder
pasar por alto los controles.
El objetivo es proteger la base de datos contra accesos no autorizados,
tomando en cuenta las 3 principales características de la seguridad de la base
de datos las cuales son:
- La confidencialidad de la información
- La integridad de la información
- La disponibilidad de la información.
Otorgar privilegios así como la identificación y autenticación del usuario es una
forma de proteger los datos, de lo cual el presente proyecto cuenta.

3.11.1.1. ENCRIPTACIÓN DE DATOS

La encriptación o cifrado en una base de datos se puede aplicar a:
 Sus datos
 Conexiones
 Los procedimientos almacenados
 116

Para poder encriptar datos en nuestro proyecto, se usó una librería de Django
llamada Bcrypt, permitiendo desde configuraciones realizar el siguiente cambio:

Figura Nro. 3. 49: Bcrypt en Django

Fuente: (Elaboración propia)

3.11.2. SEGURIDAD A NIVEL DE APLICACIÓN

La seguridad a nivel de aplicación hace referencia a los servicios de seguridad
que se invocan en la interfaz entre una aplicación y un gestor de colas al que
está conectada.
La seguridad a nivel de aplicación se conoce también como seguridad de
extremo a extremo o seguridad a nivel de mensaje.

- CONTROL DE ACCESO, permite de forma eficaz, aprobar o negar el

paso de personas o grupo de personas a zonas restringidas en función a
ciertos parámetros de seguridad establecidos por una empresa,
comercio, institución o cualquier otra entidad.
- CONTROL CRIPTOGRÁFICO, se utilizaron de forma que no sea
necesario utilizar la información confidencial, para protegerla contra
cualquier acceso no deseado, sobre todo en la URL.
 117

- REGISTRO, ACTIVIDAD Y SUPERVISION, con el registro de

actividades registra el acceso de todos los usuarios al portal, donde el
administrador supervisa los cambios realizados.
- SEGURIDAD EN LA RED, el presente proyecto hace uso de una
herramienta como W3af, que es un framework de test de intrusión web,
para que sea utilizado en futuras auditorias del entorno Web.
 118

CAPÍTULO
IV
ANÁLISIS DE CALIDAD Y COSTOS DEL SOFTWARE
 119

4.1 INTRODUCCIÓN

El análisis y evaluación de calidad de un sitio web permite ver la eficacia del

mismo, prestando especial atención al parámetro de visibilidad web.
El tema de visibilidad es uno de los indicadores de ranking web de ciudades y
para su estudio utiliza el número de redes externas que originan vínculos de
retrocesos dentro del sitio web.

4.1.1. CIBERMETRÍA

Proporciona un conjunto de conocimientos y técnicas que permiten recopilar y

analizar el ciberespacio, con el objetivo de obtener información relativa a
contenidos, recursos y usuarios en red en diversos ámbitos de actividad, esto
permite conocer y predecir patrones de uso y consumo de la información
(Orduña-Malea & Aguillo, 2014).

Desde la creación de la web hace poco más de 30 años, su tamaño no ha

dejado de crecer, siendo extremadamente difícil ofrecer una estimación fiable
de su dimensión real (Orduña-Malea & Aguillo, 2014).

El aspecto clave de un estudio Cibermétrico es el de medir la información

disponible en internet independientemente de las herramientas y protocolos de
red que se utilicen para su distribución.

La Cibermetria centrada en el análisis de contenidos del espacio de red se

divide en tres áreas de trabajo que son:
4. Cibermetria Descriptiva: Estudia el desarrollo teórico de la disciplina, así
como la definición y modelización de indicadores Cibermétricos, el estudio
de las unidades de medida y su interpretación.
5. Cibermetria Instrumental: Estudia el funcionamiento, cobertura y
limitaciones de as fuentes de información Cibermétricas principalmente
 120

robots, motores de búsqueda y de los métodos de extracción, análisis y

visualización de información.
6. Cibermetria Aplicada: Es un estudio combinado de los indicadores
Cibermétricos en contextos específicos, tales como entidades, productos
o temas que incluyen en condiciones de contorno, académicas, sociales,
políticas, etc.

DESCRIPTIVA

INSTRUMENTAL MARCADO APLICADA

Figura Nro. 4. 1: Áreas de la Cibermetria

Fuente: (Elaboración propia)

4.1.2. WEBMETRIA

Es la disciplina que permite estudiar la web desde un punto de vista

cuantitativo, la web es considerada como una parte importante del ciberespacio
y constituye el objeto de análisis de una gran parte de estudios Cibermétricos.
Un ejemplo de webmetria puede ser la medición de entornos virtuales, portales
web, etc. (Cavaller, 2014)
Sin embargo también existen otras definiciones realizadas por diferentes
autores de Webmetria mencionados en la tabla siguiente:
 121

AUTOR DEFINICIÓN

Björneborn (2004) “El estudio de los aspectos

cuantitativos de la construcción y uso
de los recursos de información,
estructuras y tecnologías de una parte
concreta de internet, por regla general
a una web o portal, desde
perspectivas bibliométricas e
informétricas”
Thelwall (2009) “El estudio de contenido basado en
web fundamentalmente con métodos
cuantitativos propios de la
investigación en ciencias sociales
utilizando técnicas no específicas de
ningún campo de estudio”

Tabla Nro. 4. 1: Conceptos de webmetria

Fuente: (Elaboración propia)

Para la aplicación de técnicas web métricas al campo empresarial y de

instituciones como en el caso del Gobierno Autónomo Municipal de El Alto se lo
puede hacer realizando un análisis del número de enlaces que recibe un sitio
web y determinadas variables económico-financieras, abriendo nuevas
posibilidades de estudio con la información extraída de la estructura de enlaces
de la web analizado en el apartado anterior de cibermetria.
 122

4.1.2.1. Webmetría aplicada a ciudades

A finales del siglo XX la mayoría de los sitios web eran relativamente

pequeños, la información que se encontraba en cada sitio no contribuía mucho
en términos de valor añadido; sin embargo actualmente es diferente, un sitio
web de una ciudad en especifica constituye el nodo central del cual las
pequeñas, medianas y grandes empresas se favorecen obteniendo presencia
online si es bien gestionado y publicado, permitiendo que el sitio web refleje un
alto contenido no solo empresarial sino cultural y permita llegar a un público
más amplio.

Un portal web de la Ciudad de El Alto tiene diferentes actividades reflejadas,

como los servicios en línea, por ejemplo: correo electrónico, archivos de
transferencia, servicio de noticias, repositorio de actividades en la ciudad ya
sea de tema cultural, deportiva, enseñanza e investigación, servicios de
gestión, además pueden estar enlazados a uno o más sitios web dentro de la
ciudad y otros portales que se vinculan para gestionar Hospitales, estaciones
periodísticas, áreas de deporte, áreas de educación y lo más importante que
son las áreas verdes o sitios turísticos.

4.2. METODOLOGÍA DE EVALUACIÓN DE CALIDAD DE SITIOS WEB

La evaluación de recursos digitales es una disciplina de las ciencias de la

documentación que nación en algún momento de los años 90 en que la web se
constituyó por primera vez en un recurso creíble y valioso para académicos y
profesionales.
Sin embargo hoy en día la web ha crecido considerablemente con una infinidad
de recursos e información; por tanto en el origen de la evaluación de recursos
digitales encontramos la necesidad, tan característica de la Biblioteconomía-
Documentación, de establecer sistemas de información sobre la información, o
sea sistemas de meta-información, y en este caso, la necesidad de establecer
 123

directorios y base de datos sobre sitios web. Para ello existe ciertos procesos
en este caso fases para su elaboración.

4.2.1. FASES

 Primera fase: Identificación

En esta fase se explora el recurso, pero sin todavía aplicar los indicadores. No
es necesario recorrer todos los niveles en profundidad, ni en amplitud:
únicamente aquellos que en función de su diseño y ubicación en la página
presentan evidencias de ser lo más importante.
En caso de duda, se puede realizar una exploración sistemática de distintas
opciones, pero sin descender a más de uno o dos niveles de profundidad. Se
revisara con atención, en cambio, los apartados de autoría (“about”, “Quienes
somos”, “créditos”, etc.) y se intentara determinar objetivos, temas de recursos,
el sector público al que va destinado.

Figura Nro. 4. 2: Elemento footer del portal web

Fuente: (Elaboración propia)

 Segunda Fase: Exploración sistemática

En esta fase interviene la toma de notas siguiendo las indicaciones de la
metodología. Si el recurso es muy amplio, probablemente la exploración deberá
limitarse a partes o secciones bien definidas del recurso que tenga sentido
 124

analizar por separado, es decir que se debe seleccionar secciones que sean
relativamente auto-contenidas.
En nuestro portal web de la Ciudad de El Alto que muestra publicaciones y
contenidos con respecto a sitios naturales, áreas verdes, gastronomía,
educación, deportes. Actividades socio-culturales y otros, se limita al análisis
de un sumario principal como ser: las opciones de búsqueda, lo más visto,
noticias de mayor relevancia, y otros.
Como resultado muestra las siguientes fichas de análisis.

Portal Web
Dificultad de
Facilidad de Navegación
Navegación

100% 100%
5%
de Navegacioón Dinámico

Figura Nro. 4. 3: Ficha de análisis

Fuente: (Elaboración propia)

4.3. CALIDAD

La calidad se refiere a la capacidad que posee un objeto para satisfacer

necesidades implícitas según un parámetro, un cumplimientos de requisitos de
calidad, misma que el portal web de la Ciudad de El Alto debe satisfacer y
reflejar.
Para realizar la evaluación del software el presente proyecto utilizó la Norma
ISO/9126.
 125

4.3.1. NORMA ISO 9126

La norma ISO/IEC 9126 es un estándar internacional para la evaluación del

software que surge debido a la necesidad de un modelo único para expresar la
calidad de un software. Fue publicado en 1992 en el cual se establecen las
características de calidad para productos de software.

 Calidad, es el conjunto de propiedades y características de un producto

o servicio, que le confieren aptitud para satisfacer unas necesidades
explicitas o implícitas.
 El estándar establece que cualquier componente de la calidad del software
puede ser descrito en términos de una o más de seis características básicas, las
cuales son: funcionalidad, confiabilidad, usabilidad, eficiencia, mantenibilidad y
portabilidad; cada una de las cuales se detalla a través de un conjunto de sub-
características.

4.3.2. RESULTADOS DE LA EVALUACIÓN ISO 9126

Las métricas presentan las calificaciones de cada uno de los atributos de calidad. Que ban
desde el 0 al 10 donde 0 es la calificación menos satisfactoria y 10 es la calificación más
satisfactoria. El peso se multiplica por la calificación obtenida y esto nos da de la calificación
final. Contiene una columna que presenta el valor ideal para cada unno de los sub-atributos.
Para obtener la calificación final, los sub-atributos se sumaron y se compararon con el puntaje
ideal.
ATRIBUTOS Y SUB-ATRIBUTOS PESO CALIFICACIÓN TOTAL IDEAL
FUNCIONALIDAD
 Idoneidad 5 10 50 10 50
 Exactitud 5 10 50 10 50

 Interoperabilidad 5 9 45 10 50
 Seguridad 5 10 50 10 50

 Conformidad 5 10 50 10 50
 126

CONFIABILIDAD
 Madurez 5 10 50 10 50
 Recuperación 5 9 45 10 50
 Tolerancia a Fallos 5 5 25 10 50
USABILIDAD
 Comprensión 5 50 10 50
 Facilidad de aprender 5 50 10 50

 Operatividad 5 45 10 50
EFICIENCIA
 Comportamiento en el tiempo 5 10 50 10 50

 Comportamiento de Recursos 5 8 40 10 50
MANTENIBILIDAD
 Estabilidad 5 8 40 10 50
 Facilidad de análisis 5 8 40 10 50
 Facilidad de cambio 5 8 40 10 50
 Facilidad de pruebas 5 8 40 10 50
PORTABILIDAD
 Adaptabilidad 5 8 40 10 50
 Facilidad de instalación 5 10 50 10 50
 Cumplimiento 5 10 50 10 50
 Capacidad de reemplazo 5 5 25 10 50
TOTAL 925 1050
Porcentaje en relación al 100% 88%
Tabla 4.2: Resultados de la evaluación ISO 9126
Fuente: (Elaboración Propia)

En las tablas muestra el porcentaje de calidad del portal con 88% sobre 100%,
diciendo que el portal es confiable.
 127

4.3.2.1. Funcionabilidad
La funcionabilidad de un software se puede medir de acuerdo a su complejidad,
para realizar la medida del presente proyecto, se toma el método de métrica de
punto de fusión, que es un medio para cuantificar el tamaño y funcionalidad del
sistema, para su proceder se debe determinar las siguientes características:

Tabla N° 4.3 Características de Funcionalidad

CARACTERIZTICAS DESCRIPCIÓN
Son los atributos del software relacionados con la
Adecuación presencia y aptitud de un conjunto de funciones para
tareas especificas.

Atributos del software relacionados con la disposición de

Exactitud
resultados o efectos correctos o acordados.

Atributos del software que se relacionan con su

Interoperabilidad
habilidad para la interacción con sistemas especificados.

Atributos del software relacionados con su habilidad

Seguridad para prevenir acceso no autorizado ya sea accidental o
deliberado, a programas y datos.

Es el resultado que muestra los atributos de manera

Cumplimiento funcional
satisfactoria.
Fuente: Elaboración Propia

Tabla N° 4.4 Características de Fiabilidad

CARACTERIZTICAS DESCRIPCIÓN

Atributos del software que se relacionan con la

Madurez
frecuencia de falla por fallas en el software.
Atributos del software que se relacionan con la
capacidad para restablecer su nivel de desempeño y
Recuperabilidad
recuperar los datos en caso de falla y en el tiempo y
esfuerzo relacionado a ello.
Atributos del software que se relacionan con su
habilidad para mantener un nivel especificado de
Toleranciua a fallos
desempeño en casos de fallas de software o de una
infracción a su interfaz especificada.
La capacidad del producto de software para adherirse a
Cumplimiento de fiabilidad normas, convenciones o legislación relacionadas con la
fiabilidad.
Fuente: Elaboración Propia
 128

Tabla N° 4.5 Características de Usabilidad

CARACTERIZTICAS DESCRIPCIÓN
Atributos del software que se relacionan al esfuerzo de
Aprendizaje los usuarios para reconocer el concepto lógico y sus
aplicaciones.
Atributos del software que se relacionan al esfuerzo de
Comprensión los usuarios para reconocer el concepto lógico y sus
aplicaciones.

Atributos del software que se relacionan con el esfuerzo

Operatividad
de los usuarios para la operación y control del software.

Muestra atributos del software que sea atractivos para el

Atractividad
usuario del Portal Web.

Fuente: Elaboración Propia

Tabla N° 4.6 Características de Eficiencia

CARACTERIZTICAS DESCRIPCIÓN
Atributos del software que se relacionan con el tiempo
Comportamiento en el
de respuesta y procesamiento en las tasas de
tiempo
rendimiento donde desempeña su función
Usar cantidades y tipos de recursos adecuados cuando
Comportamiento de
el software lleva a cabo su función bajo condiciones
recursos
determinadas
Fuente: Elaboración Propia

Tabla N° 4.7 Características de Mantenibilidad

CARACTERIZTICAS DESCRIPCIÓN

Atributos del software relacionados con el riesgo de

Estabilidad
efectos inesperados por modificaciones.

Atributos del software relacionados con el esfuerzo

Facilidad de análisis necesario para el diagnóstico de deficiencias o causas
de fallos, o identificaciones de partes a modificar.
Atrinutos del software relacionados con el esfuerzo
Facilidad de cambio necesario para la modificación, correccion de falla o
cambio de ambiente.

Atributos del software relacionados con el esfuerzo

Facilidad de pruebas
necesario para validad el software modificado.

Fuente: Elaboración Propia

 129

Tabla N° 4.8 Características de Portabilidad

CARACTERIZTICAS DESCRIPCIÓN
Atributos del software que se relacionan al esfuerzo
Capacidad de Instalación necesario para instalar el software en un ambiente
específicado.
Atributos del software relacionados con la oportunidad y
Capacidad de esfuerzo de usar el software en lugar de otro software
Reemplazamiento especificado en el ambiente de dicho software
especificado.
Fuente: Elaboración Propia

Tabla N° 4.9 Características de Calidad de Uso

CARACTERIZTICAS DESCRIPCIÓN

Atributos relacionados con la eficiencia del software

Eficacia
cuando el usuario final realiza los procesos.

Atributos relaconados con el rendimiento en las tareas

Productividad
cotidianas realizadas por el usuario final

Seguridad Atributos para medir los niveles de riesgo

Atributos relacionados con la satisfacción de uso del

Satisfacción
software

Fuente: Elaboración Propia

Ecuación de Funcionalidad

𝑷𝑭 = 𝑪𝒖𝒆𝒏𝒕𝒂 𝑻𝒐𝒕𝒂𝒍 ∗ (𝟎, 𝟔𝟓 + 𝟎, 𝟎𝟏 ∗ ∑ 𝑭𝒊) (𝟏)

Se considera (1) como máximo valor de ajuste de complejidad: ∑ 𝑭𝒊= 46

Donde:

Cuenta Total: Es el resultado de la sumatoria del producto entre los factores de

ponderación y los valores de los parámetros.

∑ 𝑭𝒊: Es la sumatoria de los valores de ajuste de Complejidad.

 130

Tabla N° 4.10 Parámetro de medición para la Ecuación de Funcionalidad

Factor de Resultado del
Ponderación Factor de
Ponderación
Parámetro

Complejo

Complejo
De

Cuenta

Simple

Simple
Media

Media
Signo
Medición

igual
Número de entradas del usuario 3 * 3 4 6 = 9 12 18
Número de salidas del usuario 2 * 4 5 7 = 8 10 14
Número de consultas del usuario 2 * 3 4 6 = 6 8 12
Número de archivos 1 * 7 10 15 = 7 10 15
Número de interfaces externas 4 * 5 7 10 = 20 28 40
Cuenta Total 50 68 99
Fuente: (Elaboración Propia)

Realizando el Cálculo:𝑷𝑭 = 50 ∗ (0,65 + 0,01 ∗ 37) (2)

𝑷𝑭 = 50 ∗ 1,02

𝑷𝑭 = 𝟓𝟏

Considerando (2) el máximo ajuste de complejidad ∑ 𝑭𝒊 = 46, calculamos el

nivel de confianza al 100%, de la siguiente manera:

𝑷𝑭𝒎𝒂𝒙 = 𝑪𝒖𝒆𝒏𝒕𝒂 𝑻𝒐𝒕𝒂𝒍 ∗ (𝟎, 𝟔𝟓 + 𝟎, 𝟎𝟏 ∗ ∑ 𝑭𝒊)

𝑷𝑭𝒎𝒂𝒙 = 50 ∗ (0,65 + 0,01 ∗ 46)

𝑷𝑭𝒎𝒂𝒙 = 50 ∗ 1,11

𝑷𝑭𝒎𝒂𝒙 = 𝟓𝟓. 𝟓

Para obtener el porcentaje de funcionalidad, se relaciona los resultados

obtenidos de la siguiente manera:
 131

𝑷𝑭
𝑭𝒖𝒏𝒄𝒊𝒐𝒏𝒂𝒍𝒊𝒅𝒂𝒅 =
𝑷𝑭𝒎𝒂𝒙

51
𝑭𝒖𝒏𝒄𝒊𝒐𝒏𝒂𝒍𝒊𝒅𝒂𝒅 =
55.5

𝑭𝒖𝒏𝒄𝒊𝒐𝒏𝒂𝒍𝒊𝒅𝒂𝒅 = 𝟎, 𝟗𝟏𝟖𝟗 ∗ 𝟏𝟎𝟎 = 𝟗𝟏, 𝟖𝟗 %

Según el valor obtenido, la funcionalidad del presente proyecto es 91,89 %,

esto da a entender que el sistema tiene un 91,89 % de realizar sus funciones
sin riesgo de fallar con operatividad constante y un 8,11 % de que el sistema
tenga un colapso y deje de funcionar.

Ecuación de Fiabilidad

𝒏ú𝒎𝒆𝒓𝒐𝒅𝒆𝒆𝒓𝒓𝒐𝒓𝒆𝒔
𝑭𝒊𝒂𝒃𝒊𝒍𝒊𝒅𝒂𝒅 = 𝟏 − ( )
𝒏ú𝒎𝒆𝒓𝒐𝒅𝒆𝒍í𝒏𝒆𝒂𝒔
𝒅𝒆𝒄ó𝒅𝒊𝒈𝒐

Tabla N° 4.11.: Datos para la Ecuación de Fiabilidad

Tiempo de Servicio Peticiones Fallas encontradas Probabilidad de
Realizadas Fallo bajo demanda
10 hrs 70 4 0.0286
16 hrs 54 2 0.045
Fuente: (Elaboración propia)

𝟔
𝑭𝒊𝒂𝒃𝒊𝒍𝒊𝒅𝒂𝒅 = 𝟏 − ( )
𝟖𝟎𝟎𝟖

𝑭𝒊𝒂𝒃𝒊𝒍𝒊𝒅𝒂𝒅 = 𝟏 − 𝟕, 𝟒𝟗 ∗ 𝟏𝟎−𝟒

𝑭𝒊𝒂𝒃𝒊𝒍𝒊𝒅𝒂𝒅 = 𝟎, 𝟗𝟗 ∗ 𝟏𝟎𝟎

Así vemos que la fiabilidad es de un 99%

Ecuación de Usabilidad

Un conjunto de atributos relacionados con el esfuerzo necesario para su uso, y

en la valoración individual de tal uso.
 132

Se realiza una evaluación del sistema en base a encuestas de un grupo de

usuarios.

Tabla N° 4.12 Cuestionario simple de Usabilidad

Pregunta Ponderación positiva
¿El interfaz de usuario es 92%
amigable?
¿La navegación por el Portal Web 91%
es sencilla?
¿El Portal satisface todos los 90%
requerimientos?
¿Los datos de salida son 90%
confiables?
Fuente: (Elaboración propia)

𝒙𝒊
∑ = 𝒔𝒖𝒎𝒂 𝒅𝒆 𝒑𝒐𝒏𝒅𝒆𝒓𝒂𝒄𝒊𝒐𝒏𝒆𝒔 = 𝟒𝟓𝟗
𝒏

N = Cantidad de preguntas = 4

Entonces:

𝒙𝒊 𝟑𝟔𝟓
𝑼=∑ = = 𝟗𝟏. 𝟐𝟓
𝒏 𝟒

Así vemos que la usabilidad es de un 91,25%

Ecuación de Mantenibilidad

Es un conjunto de atributos relacionados con la facilidad de extender, modificar

o corregir errores en un sistema software.

Así tiene la siguiente formula:

𝑰𝑴𝑺 = [𝑴𝒕 − (𝑭𝒄 + 𝑭𝒂 + 𝑭𝒅 )]/𝑴𝒕

 133

Donde:

Mt = número de módulos en la versión actual

Fc = número de módulos en la version actual que han cambiado

Fa = número de módulos en la versión actual añadido

Fd = número de módulos en la versión anterior que se ha eliminado

Entonces:

Mt = 6

Fc = 1

Fa = 0

Fd = 0

𝐼𝑀𝑆 = 0.83

Por lo tanto el portal tiene una mantenibilidad de un 83%

Ecuación de Eficiencia

Son atributos relacionados con la relación entre el nivel de desempeño del

software y la cantidad de recursos necesitados bajo condiciones establecidas.

𝒆𝒇𝒊𝒄𝒊𝒆𝒏𝒄𝒊𝒂
𝑬𝒇𝒊𝒄𝒊𝒆𝒏𝒄𝒊𝒂 𝒅𝒆𝒍 𝒔𝒐𝒇𝒕𝒘𝒂𝒓𝒆 =
𝑳𝑪𝑪

Donde:

𝐸𝑓𝑖𝑐𝑖𝑒𝑛𝑐𝑖𝑎 = 𝑑𝑖𝑠𝑝𝑜𝑛𝑖𝑏𝑖𝑙𝑖𝑑𝑎𝑑 ∗ 𝑐𝑜𝑛𝑓𝑖𝑎𝑏𝑖𝑙𝑖𝑑𝑎𝑑 ∗ 𝑚𝑎𝑛𝑡𝑒𝑛𝑖𝑏𝑖𝑙𝑖𝑑𝑎𝑑 ∗ 𝑐𝑎𝑝𝑎𝑐𝑖𝑑𝑎𝑑

𝑳𝑪𝑪 = 𝒄𝒐𝒔𝒕𝒐 𝒅𝒆 𝒄𝒊𝒍𝒐 𝒅𝒆 𝒗𝒊𝒅𝒂

La disponibilidad, es una medida frecuente que el sistema esta bien y listo para
operar, para ello entendemos que la disponibilidad es de un 95%
 134

La capacidad de un 90%, está relacionada con la entrega productiva, mide la

capacidad del sistema para desempeñar su función.

Así:

LCC = 85%

Reemplazando en la fórmula tenemos:

𝟎. 𝟗𝟓 ∗ 𝟎. 𝟗𝟐 ∗ 𝟎. 𝟖𝟑 ∗ 𝟎. 𝟗𝟎
𝑬𝒇𝒊𝒄𝒊𝒆𝒏𝒄𝒊𝒂 = = 𝟎. 𝟕𝟕
𝟎. 𝟖𝟓

Así decimos que la eficiencia es de un 77%

Ecuación de Portabilidad

Son atributos relacionados con la capacidad de un sistema software para ser

transferido desde una plataforma a otra.

𝑛ú𝑚𝑒𝑟𝑜𝑑𝑒𝑑𝑖𝑎𝑠𝑝𝑎𝑟𝑎
𝑝𝑜𝑟𝑡𝑎𝑟𝑠𝑖𝑠𝑡𝑒𝑚𝑎
𝑃𝑜𝑟𝑡𝑎𝑏𝑖𝑙𝑖𝑑𝑎𝑑 = 1 − ( )
𝑛ú𝑚𝑒𝑟𝑜𝑑𝑒 𝑑𝑖𝑎𝑠𝑝𝑎𝑟𝑎
𝑖𝑚𝑝𝑙𝑒𝑚𝑒𝑛𝑡𝑎𝑟𝑒𝑙
𝑠𝑖𝑠𝑡𝑒𝑚𝑎

0.5
𝑃𝑜𝑟𝑡𝑎𝑏𝑖𝑙𝑖𝑑𝑎𝑑 = 1 − ( 𝑑𝑖𝑎𝑠)
2.5

Portabilidad = 0.80

Así vemos que la portabilidad es de un 80%, puede ser transferido de un

entorno a otro.

4.4. ANALISIS DE COSTOS DE SOFTWARE

El análisis de costos es simplemente, el proceso de identificación de los
recursos necesarios para llevar a cabo la labor o proyecto de software.
 135

4.4.1. METODO DE ESTIMACIÓN DE COSTOS COCOMO II

 Estimación del Esfuerzo

El esfuerzo necesario para concretar un proyecto de desarrollo de

software, cualquiera sea el modelo empleado, se expresa en
meses/persona PM y representa los meses de trabajo de una persona
Full-time, requeridos para trabajar el proyecto.

Experiencia y capacidad de los Muy bajo Bajo Normal Alto Muy Alto
desarrolladores
Madurez y Capacidad de Muy Bajo Bajo Normal Alto Muy Alto
ICASE
PROD 4 7 13 25 50
Tabla 4.13: Productividad para el modelo Composición de Aplicación
Fuente: (Elaboración Propia)

 Modelo Diseño Temprano

Este modelo se usa en la etapa temprana del proyecto de software,
cuando se conoce muy poco del producto a ser desarrollado, de la
naturaleza de la plataforma, del personal a ser incorporado al proyecto o
detalles específicos de los procesos a desarrollar.
El modelo de Diseño Temprano ajusta el esfuerzo nominal usando siete
factores de costo. La fórmula para el cálculo del esfuerzo es la siguiente:
PM = A x (𝐊𝐒𝐋𝐎𝐂)𝑩
PM: es el esfuerzo estimado. Representa los meses-personas
necesarios para ejecutar el proyecto.
KSLOC: es el tamaño del software a desarrollar en miles de líneas de
código.
 136

A y B: son coeficientes que varían según el Modo de Desarrollo

(Orgánico, Semiacoplado, Empotrado).

Modo de desarrollo Esfuerzo Cronograma

Orgánico PM = 2.4 x (𝐊𝐒𝐋𝐎𝐂)𝟏.𝟎𝟓 TDEV = 2.5 x (𝐏𝐌)𝟎.𝟑𝟖
Semiacoplado PM = 3.0 x (𝐊𝐒𝐋𝐎𝐂)𝟏.𝟏𝟐 TDEV = 2.5 x (𝐏𝐌)𝟎.𝟑𝟓
Empotrado PM = 3.6 x (𝐊𝐒𝐋𝐎𝐂)𝟏.𝟐𝟎 TDEV = 2.5 x (𝐏𝐌)𝟎.𝟑𝟐
Tabla 4.14: Ecuaciones del modelo COCOMO II
Fuente: (Elaboración Propia)

Modelo de Esfuerzo Nominal Esfuerzo Ajustado Cronograma

Desarrollo
Orgánico 𝑷𝑴𝒏𝒐𝒎𝒊𝒏𝒂𝒍 PM = 3.2 x EAF x TDEV = 2.5 x
= 𝟑. 𝟐 𝒙 (𝑲𝑺𝑳𝑶𝑪)𝟏.𝟎𝟓 (𝑲𝑺𝑳𝑶𝑪)𝟏.𝟎𝟓 (𝑷𝑴)𝟎.𝟑𝟖
Semiacoplado 𝑷𝑴𝒏𝒐𝒎𝒊𝒏𝒂𝒍 PM = 3.0 x EAF x TDEV = 2.5 x
= 𝟑. 𝟎 𝒙 (𝑲𝑺𝑳𝑶𝑪)𝟏.𝟏𝟐 (𝑲𝑺𝑳𝑶𝑪)𝟏.𝟏𝟐 (𝑷𝑴)𝟎.𝟑𝟓
Empotrado 𝑷𝑴𝒏𝒐𝒎𝒊𝒏𝒂𝒍 PM = 2.8 x EAF x TDEV = 2.5 x
= 𝟐. 𝟖 𝒙 (𝑲𝑺𝑳𝑶𝑪)𝟏.𝟐𝟎 (𝑲𝑺𝑳𝑶𝑪)𝟏.𝟐𝟎 (𝑷𝑴)𝟎.𝟑𝟐
Tabla 4.15: Ecuaciones del modelo intermedio de COCOMO
Fuente: (Elaboración propia)
 137

4.4.2. PRUEBAS Y RESULTADOS

Las siguientes pruebas son realizadas por los metodos de estimacion de costos de COCOMO II.

Número de líneas de código

COSTO VALORADO EN DOLARES

Figura Nro. 4. 4: Estimación de Costos haciendo uso del software USC -

COCOMO II.2000.4
Fuente: (Elaboración propia)

4.4.3. Fórmulas de estimación

Las siguientes Operaciones hacen alusión a las formulas vistas en los modelos
del Método de estimación de Costos COCOMO II.
4. Modo de desarrollo Esfuerzo Cronograma
Orgánico PM = 2.4 x (𝟖)𝟏.𝟎𝟓 TDEV = 2.5 x (𝟐𝟏)𝟎.𝟑𝟖
Semiacoplado PM = 3.0 x (𝟖)𝟏.𝟏𝟐 TDEV = 2.5 x (𝟑𝟎)𝟎.𝟑𝟓
Empotrado PM = 3.6 x (𝟖)𝟏.𝟐𝟎 TDEV = 2.5 x (𝟒𝟑)𝟎.𝟑𝟐

Tabla 4.16: Ecuaciones del modelo COCOMO

Fuente: (Elaboración Propia)
 138

Modo de desarrollo Esfuerzo Cronograma

Orgánico PM = 21 hombres-mes TDEV = 8 meses
N = 21/8 =2,6 hombres
Semiacoplado PM = 30 hombres-mes TDEV = 8 meses
N = 30/8 =3,7 hombres
Empotrado PM = 43 hombres-mes TDEV = 8 meses
N = 43/8 =5.4 hombres

Tabla 4.17: Resultados del modelo COCOMO

Fuente: (Elaboración Propia)

PM = A x EAF x (𝐊𝐒𝐋𝐎𝐂)𝑩

Modelo de Esfuerzo Nominal Esfuerzo Ajustado Cronograma

Desarrollo
Orgánico 𝑷𝑴𝒏𝒐𝒎𝒊𝒏𝒂𝒍 = PM = 3.2 x 1.1 x TDEV = 2.5 x
𝟑. 𝟐 𝒙 (𝟖)𝟏.𝟎𝟓 = 28 (𝟖)𝟏.𝟎𝟓 = 31 (𝟖)𝟎.𝟑𝟖 = 5,5

Semiacoplado 𝑷𝑴𝒏𝒐𝒎𝒊𝒏𝒂𝒍 = PM = 3.0 x 1.1 x TDEV = 2.5 x

𝟑. 𝟎 𝒙 (𝟖)𝟏.𝟏𝟐 = 30 (𝟖)𝟏.𝟏𝟐 = 33 (𝟖)𝟎.𝟑𝟓 = 5,17
Empotrado 𝑷𝑴𝒏𝒐𝒎𝒊𝒏𝒂𝒍 = PM = 2.8 x 1.1 x TDEV = 2.5 x
𝟐. 𝟖 𝒙 (𝟖)𝟏.𝟐𝟎 = 33 (𝟖)𝟏.𝟐𝟎 = 37 (𝟖)𝟎.𝟑𝟐 = 4.86

Tabla 4.18: Resultados del modelo COCOMO a nivel Intermedio

Fuente: (Elaboración Propia)

En conclusión para el desarrollo del proyecto se requiere un estimado de 3

programadores, trabajando aproximadamente 8 meses, con un costo total de
20.788 $, que equivalen a 143.632 Bs.
 139

CAPÍTULO
V
CONCLUSIONES Y RECOMENDACIONES
 140

5.1. CONCLUSIONES

Realizando el respectivo análisis, diseño, programación, pruebas e

implementación del “PORTAL WEB COMO UN PLAN ESTRATÉGICO PARA
EL ACCESO RÁPIDO A RECURSOS Y SERVICIOS QUE BRINDA LA
CIUDAD DEL EL ALTO”, con la implementación del Portal Web se obtuvo
como producto final un sistema que satisface las necesidades halladas, y
cumple con el objetivo general y los objetivos específicos planteados en el
presente proyecto de grado.

La obtención de información es instantánea para todos los tipos de usuario, el

sistema cuenta con una base de datos centralizada, bien estructura y segura.
Para la obtención final del proyecto se realizaron las siguientes actividades:

 Se realizó el análisis
 Se diseñó una plataforma Web de fácil uso y acceso, que
 Se implementó métodos de seguridad logrando
 Se elaboró una interfaz de usuario amigable

Con el desarrollo e implementación del sistema se lograron alcanzar todos los

objetivos que se tenían planteados en un principio, los cuales son:

- Se realizó el análisis de los procesos actuales de información cultural

otorgada por el portal Web sea organizada.
- Se logró determinar los requerimiento de la información necesaria,
especifica y detallada de los eventos culturales por medio del Portal Web
- Se logró desarrollar un portal web que contenga anuncios referentes a la
cultura.
- Proveer con información actualizada para promover los eventos
culturales.
- Mejorar el acceso a la información del patrimonio de la ciudad de El Alto.
- Diseñar una plataforma de fácil uso y acceso para brindar una gran
comodidad a los usuarios del sistema.
 141

- Integrar una Interfaz de usuario amigable y bastante intuitivo con el fin

de facilitar el manejo del sistema a los usuarios.

El presente proyecto implementa un portal web, la cual puede ser aplicada a

los distritos de la ciudad de El Alto para el mejor control del Gobierno
Autónomo Municipal de El Alto, promocionando cada sector del lugar, así como
cada negocio, empresa, y sobre todo las áreas verdes que existe en la ciudad
de El Alto, porque es momento de conocer nuestra ciudad.

Se desarrolló el Portal Web, cumpliendo con los requerimientos y necesidades

de los usuarios que se determinó en el procesos de recolección de información
y requerimientos, obteniendo como producto final un portal web de fácil
manejo, comprensión, agradable y útil en el momento de realzar una visita a las
iglesias, museo, áreas verdes e instituciones existentes.

Finalmente podemos llegar a la conclusión de que se cumplió con el objetivo

general, ya que. Con el uso del portal web de la Ciudad de El Alto se mejoró la
experiencia turística de las personas al visitar los sitios turísticos de la Ciudad
de El Alto.

Cabe destacar como uno de los resultados más relevantes, es el hecho de

poder contribuir con este tipo de tecnología promocionando la Ciudad de El
Alto, ya que es una de las tecnologías más utilizadas en promociones y que va
en constante crecimiento gracias a la facilidad de poder implementar distintas
tecnologías a la misma.
 142

5.2. RECOMENDACIONES

Se recomienda utilizar y promover el Portal Web dentro y fuera de la ciudad, y

que además resaltar que cuenta con un traductor del lenguaje español a
Aymara del contenido existente dentro del portal para él público en general,
manteniendo la cultura más sobresaliente de la Ciudad de El Alto que es su
propia gente, ya que no requiere descargar alguna aplicación por el momento y
la información que contiene es totalmente verídica gracias al GAMEA

- Implementar un módulo de firma digital, con la finalidad de darle un valor

legal al documento digital de esta forma garantizar la integridad del
documento digital.
- Se recomienda realizar una aplicación que recorra el mayor espacio de
recorrido de la ciudad de El Alto para conocer las áreas verdes que
existen.
- Se recomienda realizar un módulo de realidad virtual, con la finalidad de
publicitar la Ciudad de El Alto.

Por ultimo desarrollar un análisis y selección de próximos atractivos turísticos a

exponer. Para el levantamiento de información turística como también
multimedia, y así aprovechar el uso de esta tecnología agregando nuevas
funcionalidades que se viene exponiendo en los proyectos encontrados dentro
del portal web, para poder exponer y dar a conocer distintos sitios turísticos que
forman parte del patrimonio de nuestra Ciudad de El Alto.
 143

BIBLIOGRAFIA

Aketzali R, A. (2018). Propuestas de esttrategias de marketing digital. mexico.

GADSC, Gobierno Autónomo de Santa Cruz. (2012). Conociendo nuestra Región:

Manifestaciones Culturales del Municipio de Pailon. Santa Cruz - Bolivia.

Sanchez L., S. (2014). Análisis de información y toma de decisiones para

administración de negocios. Perú.

Uribe F., U. (2014). Uso de redes sociales digitales como herramienta de marketing.
España.

Yujra J., Y. (2017). Realidad Aumentada y geolocalización en el ámbito del turismo. La

Paz - Bolivia.

Zarco J., Z. (2017). Realidad Aumentada aplicada al turismo de las iglesias de la

ciudad de La Paz. La Paz Bolivia.

Rodrigo Goméz, 2015. Desarrollador web en microservices de la Ciudad de México

WEBGRAFIA

http://blog.desafiolatam.com/metricas-de-calidad-de-software/

http://rodrigogr.com/blog/modelo-vista-controlador/

https://es.slideshare.net/clauddiaa/factores-de-calidad-segn-mc-call

https://www.it-swarm.dev/es/django/seguir-el-numero-de-visitas-la-pagina-o-visitas-de-
un-objeto/968875424/

https://www.selenium.dev/selenium-ide/docs/en/introduction/command-line-runner

https://docs.hektorprofe.net/django/web-personal/patron-mvt-modelo-vista-template/
 144

ANEXOS
 145

ANEXO A Falta de medios Base de Datos

desactualizada

Aplicaciones fuera del Información Falsos Anuncios

ámbito cultural desorganizada
PROBLEMAS

¿Es posible generar un portal Web que permita el fácil y rápido acceso a los
ÁRBOL DE

recursos culturales que ofrece la dirección de Culturas y la unidad de Turismo,

manteniendo como plan estratégico de promover la cultura y los servicios en la
Ciudad de El Alto?

Existencia de Información Búsqueda tediosa Descontento del usuario

variada

Insuficiente información Desconocimiento de

Información
 146

ANEXO B
Brindar información Actualizar la Base de
organizada Datos

Evitar publicaciones no Añadir información sobre

Añadir contenido cultural
culturales los recursos y servicios
OBJETIVOS

Desarrollar e implementar un Portal Web, que permita el acceso fácil y rápido a los
ÁRBOL DE

recursos culturales que ofrece la dirección de Culturas y la unidad de Turismo,

apoyando como plan estratégico, promover la cultura en la Ciudad de El Alto a fin de
satisfacer las necesidades de información a los usuarios en general.

Hacer que el usuario se

Efectuar un módulo de sienta cómodo y
Desarrollar un Portal Web
contenido dinámico satisfecho con el uso del
Portal Web

Brindar información Diseñar una Portal de fácil

específica y detallada uso
 147

ANEXO C

MAPA DE LA CIUDAD DE EL ALTO POR DISTRITO

 148

MANUAL
DEL
USUARIO