Portal web con contenidos didácticos interactivos para reforzar el

Portal web con contenidos didácticos interactivos para reforzar el
UNIVERSIDAD DE OVIEDO
ESCUELA DE INGENIERÍA INFORMÁTICA
TRABAJO FIN DE MÁSTER
“PORTAL WEB CON CONTENIDOS DIDÁCTICOS INTERACTIVOS
PARA REFORZAR EL APRENDIZAJE DE LOS NIÑOS”
DIRECTOR: MARÍA LOURDES TAJES MARTÍNEZ
AUTOR: JESÚS FERNÁNDEZ HERRERO
Vº Bº del Director del
Proyecto
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños
Resumen
El objetivo del Trabajo Fin de Máster, es desarrollar un portal web con contenidos didácticos
interactivos, que permita a los niños de entre 9 y 12 años reforzar los conocimientos
adquiridos durante las clases en el colegio.
Se pretende que el portal sea una extensión de los libros de texto, donde los niños puedan
repasar los contenidos explicados durante las clases, y comprobar si los han comprendido.
Dicho portal, albergará contenido didáctico dividido por temas para las asignaturas de
Conocimiento del Medio, Lengua y Matemáticas, y constará de tres bloques:



En el primero de ellos, se realizará una explicación interactiva sobre el tema
seleccionado.
En el segundo bloque, se harán ejercicios guiados para ayudar a consolidar la materia
previamente explicada en el bloque anterior.
Por último, en el tercer bloque, se hará un test de autoevaluación que permita saber si
se han comprendido los conceptos estudiados.
Los profesores, podrán realizar un seguimiento de los niños, viendo quién ha realizado los test
de autoevaluación, y los fallos que se han tenido, y en base a eso, saber si los contenidos
explicados durante las clases presenciales han sido comprendidos, o si por el contrario, es
necesario realizar un repaso de determinadas materias.
El portal web, tendrá una interfaz orientada hacia los niños, siempre con contenidos
interactivos que faciliten el aprendizaje, y les haga más entretenido estudiar. Además, puesto
que el uso de los dispositivos móviles está en crecimiento, el portal será adaptado para poder
visualizarlo correctamente desde estos.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
3
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños
Palabras Clave
Web, e-Learning, contenido didáctico, aprendizaje, educación primaria, autoevaluación, curso
académico, asignatura y lección.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
5
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños
Índice General
CAPÍTULO 1.
1.1
1.2
MEMORIA DEL PROYECTO...........................................................................................15
RESUMEN DE LA MOTIVACIÓN, OBJETIVOS Y ALCANCE DEL PROYECTO ..................................................... 15
RESUMEN DE TODOS LOS ASPECTOS .................................................................................................. 16
CAPÍTULO 2.
INTRODUCCIÓN...........................................................................................................19
2.1
JUSTIFICACIÓN DEL PROYECTO .......................................................................................................... 19
2.2
OBJETIVOS DEL PROYECTO ............................................................................................................... 20
2.3
ESTUDIO DE LA SITUACIÓN ACTUAL ................................................................................................... 21
2.3.1 Evaluación de Alternativas ................................................................................................... 21
CAPÍTULO 3.
3.1
3.2
3.3
3.4
3.5
3.6
3.7
CRUD (CREATE, READ, UPDATE AND DELETE) .................................................................................... 22
E-LEARNING ................................................................................................................................. 22
FRAMEWORK ................................................................................................................................ 22
MODELO-VISTA-CONTROLADOR ....................................................................................................... 24
PROGRAMACIÓN POR CAPAS............................................................................................................ 25
SISTEMA DE GESTIÓN DE BASES DE DATOS.......................................................................................... 26
LENGUAJE UNIFICADO DE MODELADO (UML) .................................................................................... 26
CAPÍTULO 4.
4.1
ASPECTOS TEÓRICOS ...................................................................................................22
PLANIFICACIÓN DEL PROYECTO Y RESUMEN DE PRESUPUESTOS ................................27
PLANIFICACIÓN.............................................................................................................................. 27
CAPÍTULO 5.
ANÁLISIS .....................................................................................................................30
5.1
DEFINICIÓN DEL SISTEMA ................................................................................................................ 30
5.1.1 Determinación del Alcance del Sistema ................................................................................ 30
5.2
REQUISITOS DEL SISTEMA ................................................................................................................ 32
5.2.1 Obtención de los Requisitos del Sistema .............................................................................. 32
5.2.2 Identificación de Actores del Sistema ................................................................................... 49
5.2.3 Especificación de Casos de Uso ............................................................................................ 49
5.3
IDENTIFICACIÓN DE LOS SUBSISTEMAS EN LA FASE DE ANÁLISIS ............................................................... 59
5.3.1 Descripción de los Subsistemas ............................................................................................ 59
5.3.2 Descripción de los Interfaces de Comunicación entre Subsistemas ...................................... 61
5.4
ANÁLISIS DE CASOS DE USO Y ESCENARIOS ......................................................................................... 62
5.4.1 Casos de Uso del Módulo “Gestión de Usuarios” ................................................................. 62
5.4.2 Casos de Uso del Módulo “Aprendizaje” .............................................................................. 65
5.4.3 Casos de Uso del Módulo “Gestión de Contenidos Académicos” ......................................... 69
5.4.4 Casos de Uso Comunes ......................................................................................................... 74
5.5
ANÁLISIS DEL SISTEMA DE GESTIÓN DE BASES DE DATOS ....................................................................... 76
5.5.1 Sistemas de Gestión de Bases de Datos ............................................................................... 76
5.5.2 Estudio de Alternativas ......................................................................................................... 77
5.6
ANÁLISIS DE INTERFACES DE USUARIO ................................................................................................ 82
5.6.1 Descripción de la Interfaz ..................................................................................................... 82
5.6.2 Descripción del Comportamiento de la Interfaz ................................................................... 85
5.6.3 Diagrama de Navegabilidad ................................................................................................. 86
5.7
ESPECIFICACIÓN DEL PLAN DE PRUEBAS .............................................................................................. 89
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
7
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños
5.7.1
5.7.2
5.7.3
Pruebas Unitarias ..................................................................................................................89
Pruebas de Integración y Sistema .........................................................................................97
Pruebas de Rendimiento .......................................................................................................98
CAPÍTULO 6.
DISEÑO DEL SISTEMA.................................................................................................. 99
6.1
ARQUITECTURA DEL SISTEMA............................................................................................................99
6.1.1 Diagramas de Paquetes ........................................................................................................99
6.1.2 Diagramas de Componentes .............................................................................................. 102
6.1.3 Diagramas de Despliegue .................................................................................................. 104
6.2
DISEÑO DE CLASES ...................................................................................................................... 106
6.2.1 Diagrama de Clases ........................................................................................................... 106
6.3
DIAGRAMAS DE INTERACCIÓN Y ESTADOS......................................................................................... 120
6.3.1 Caso de Uso “Realizar Autoevaluación” ............................................................................. 120
6.3.2 Caso de Uso “Modificar Pregunta” .................................................................................... 122
6.5
DISEÑO DE LA BASE DE DATOS ....................................................................................................... 125
6.5.1 Descripción del SGBD Usado .............................................................................................. 125
6.5.2 Integración del SGBD en Nuestro Sistema ......................................................................... 125
6.5.3 Diagrama E-R ..................................................................................................................... 126
6.6
DISEÑO DE LA INTERFAZ ................................................................................................................ 129
6.6.1 Módulo “Aprendizaje”........................................................................................................ 129
6.6.2 Módulo “Gestión de Contenidos Académicos” y Módulo “Gestión de Usuarios” .............. 130
6.7
ESPECIFICACIÓN TÉCNICA DEL PLAN DE PRUEBAS ............................................................................... 131
6.7.1 Pruebas Unitarias ............................................................................................................... 131
6.7.2 Pruebas de Integración y del Sistema ................................................................................ 131
6.7.3 Pruebas de Usabilidad........................................................................................................ 132
6.7.4 Pruebas de Rendimiento .................................................................................................... 135
CAPÍTULO 7.
IMPLEMENTACIÓN DEL SISTEMA .............................................................................. 137
7.1
ESTÁNDARES Y NORMAS SEGUIDOS ................................................................................................ 137
7.1.1 AJAX (Asynchronous JavaScript And XML) ......................................................................... 137
7.1.2 CSS (Cascading Style Sheets) .............................................................................................. 137
7.1.3 HTML (HyperText Markup Language) ................................................................................ 138
7.1.4 JSON (JavaScript Object Notation) ..................................................................................... 138
7.1.5 Pautas de Accesibilidad al Contenido Web (WCAG) 2.0 .................................................... 138
7.1.6 Pautas de Usabilidad Web ................................................................................................. 139
7.1.7 SVG (Scalable Vector Graphics) .......................................................................................... 139
7.1.8 XML (eXtensible Markup Language) .................................................................................. 139
7.2
LENGUAJES DE PROGRAMACIÓN, TECNOLOGÍAS Y FRAMEWORKS .......................................................... 140
7.2.1 Apache Log4j ...................................................................................................................... 140
7.2.2 Apache Maven ................................................................................................................... 140
7.2.3 Google Charts..................................................................................................................... 142
7.2.4 Java .................................................................................................................................... 142
7.2.5 JEE ...................................................................................................................................... 143
7.2.6 JavaScript ........................................................................................................................... 143
7.2.7 jQuery................................................................................................................................. 144
7.2.8 jQuery UI ............................................................................................................................ 145
7.2.9 JSON in Java ....................................................................................................................... 145
7.2.10
Spring ............................................................................................................................. 145
7.2.11
Struts2 ........................................................................................................................... 146
7.2.12
Tablesorter..................................................................................................................... 148
8
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños
7.2.13
Tiles ................................................................................................................................ 148
7.3
HERRAMIENTAS Y PROGRAMAS USADOS PARA EL DESARROLLO............................................................. 150
7.3.1 Apache Tomcat ................................................................................................................... 150
7.3.2 Eclipse ................................................................................................................................. 150
7.3.3 Enterprise Architect ............................................................................................................ 151
7.3.4 Google Chrome ................................................................................................................... 151
7.3.5 Internet Explorer ................................................................................................................. 152
7.3.6 Microsoft Office 2010 ......................................................................................................... 153
7.3.7 Microsoft Project 2013 ....................................................................................................... 153
7.3.8 Mozilla Firefox .................................................................................................................... 153
7.3.9 native2ascii ......................................................................................................................... 154
7.3.10
PIXLR EDITOR ................................................................................................................. 155
7.3.11
pgAdmin III ..................................................................................................................... 155
7.3.12
PostgreSQL ..................................................................................................................... 156
7.4
CREACIÓN DEL SISTEMA ................................................................................................................ 157
7.4.1 Problemas Encontrados ...................................................................................................... 157
7.4.2 Descripción Detallada de las Clases.................................................................................... 162
CAPÍTULO 8.
DESARROLLO DE LAS PRUEBAS .................................................................................165
8.1
PRUEBAS UNITARIAS .................................................................................................................... 165
8.2
PRUEBAS DE INTEGRACIÓN Y DEL SISTEMA ........................................................................................ 175
8.3
PRUEBAS DE USABILIDAD .............................................................................................................. 177
8.3.1 Pruebas de Usabilidad ........................................................................................................ 177
8.4
PRUEBAS DE RENDIMIENTO ........................................................................................................... 184
CAPÍTULO 9.
MANUALES DEL SISTEMA ..........................................................................................187
9.1
MANUAL DE INSTALACIÓN ............................................................................................................. 187
9.1.1 Servidor Web ...................................................................................................................... 187
9.1.2 Motor de Bases de Datos.................................................................................................... 194
9.1.3 Despliegue de la Aplicación Web ........................................................................................ 222
9.2
MANUAL DE EJECUCIÓN ................................................................................................................ 223
9.2.1 Arranque de la Base de Datos PostgreSQL ......................................................................... 223
9.2.2 Arranque de Apache Tomcat .............................................................................................. 224
9.3
MANUAL DE USUARIO .................................................................................................................. 225
9.3.1 Procesos Comunes .............................................................................................................. 225
9.3.2 Módulo “Aprendizaje” ........................................................................................................ 225
9.3.3 Módulo “Gestión de Usuarios” ........................................................................................... 231
9.3.4 Módulo “Gestión de Contenidos Académicos” ................................................................... 238
9.4
MANUAL DEL PROGRAMADOR........................................................................................................ 241
9.4.1 Variables de Entorno .......................................................................................................... 242
9.4.2 Generar Javadoc ................................................................................................................. 243
9.4.3 Generar Fichero de Despliegue ........................................................................................... 245
9.4.4 Añadir Textos a los Ficheros Properties .............................................................................. 245
CAPÍTULO 10.
CONCLUSIONES Y AMPLIACIONES .........................................................................247
10.1
CONCLUSIONES ........................................................................................................................... 247
10.2
AMPLIACIONES ............................................................................................................................ 248
10.2.1
Bloque Ejercicios............................................................................................................. 248
10.2.2
Mecanismo de Recuperación de Contraseña ................................................................. 248
10.2.3
Estadísticas de los Usuarios ........................................................................................... 249
10.2.4
Aumentar el Seguimiento de los Usuarios ..................................................................... 249
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
9
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños
10.2.5
10.2.6
Teoría
10.2.7
CAPÍTULO 11.
Accesibilidad .................................................................................................................. 249
Crear y Configurar las Preguntas y Tareas de los Bloques Ejercicios, Autoevaluaciones y
250
Crear Plantillas para las Tareas del Bloque de Teoría ................................................... 250
PRESUPUESTO ...................................................................................................... 251
11.1
IDENTIFICACIÓN DE COSTES ........................................................................................................... 251
11.1.1
Desarrollo del Sistema ................................................................................................... 251
11.1.2
Costes Hardware ........................................................................................................... 251
11.1.3
Costes Fijos .................................................................................................................... 252
11.1.4
Costes Variables............................................................................................................. 252
11.2
PRESUPUESTOS ........................................................................................................................... 253
11.2.1
Presupuesto de Costes ................................................................................................... 253
11.2.2
Presupuesto del Cliente ................................................................................................. 253
CAPÍTULO 12.
12.1
REFERENCIAS BIBLIOGRÁFICAS ............................................................................. 255
REFERENCIAS EN INTERNET ............................................................................................................ 255
CAPÍTULO 13.
APÉNDICES ........................................................................................................... 259
13.1
CONTENIDO ENTREGADO .............................................................................................................. 259
13.1.1
Contenidos ..................................................................................................................... 259
13.2
ÍNDICE ALFABÉTICO ..................................................................................................................... 260
10
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños
Índice de Figuras
Figura 3.1: Representación gráfica que conceptualiza la implementación que hace Struts2 del patrón
MVC. ............................................................................................................................................25
Figura 4.1: Planificación inicial. ............................................................................................................27
Figura 4.2: Planificación final. ..............................................................................................................28
Figura 4.3: Diagrama de Gantt de los hitos del proyecto. .....................................................................29
Figura 5.1: Diagrama de Casos de Uso - Gestión de Usuarios. ..............................................................50
Figura 5.2: Diagrama de Casos de Uso - Gestión de Contenidos Académicos. .......................................51
Figura 5.3: Diagrama de Casos de Uso – Aprendizaje. ..........................................................................55
Figura 5.4: Casos de Uso Comunes a todos los Módulos. ......................................................................57
Figura 5.5: Diagrama de robustez - Crear usuario .................................................................................62
Figura 5.6: Diagrama de robustez - Modificar usuario. .........................................................................64
Figura 5.7: Diagrama de robustez - Realizar bloque Teoría. ..................................................................66
Figura 5.8: Diagrama de robustez - Realizar Autoevaluación. ...............................................................67
Figura 5.9: Diagrama de robustez – Realizar bloque Ejercicios. ............................................................68
Figura 5.10: Diagrama de robustez – Comentar autoevaluación...........................................................70
Figura 5.11: Diagrama de robustez – Modificar Comentario Autoevaluación. ......................................72
Figura 5.12: Diagrama de robustez - Modificar Pregunta......................................................................73
Figura 5.13: Diagrama de robustez - Iniciar sesión ...............................................................................75
Figura 5.14: Interfaz módulo "Aprendizaje" - Vista 1. ...........................................................................83
Figura 5.15: Interfaz módulo "Aprendizaje" - Vista 2. ...........................................................................84
Figura 5.16: Interfaz módulos "Gestión de Usuarios" y "Gestión de contenidos Académicos". ............85
Figura 5.17: Diagrama de navegabilidad – Parte I.................................................................................86
Figura 5.18: Diagrama de navegabilidad – Parte II................................................................................87
Figura 5.19: Diagrama de navegabilidad – Parte III...............................................................................87
Figura 5.20: Diagrama de navegabilidad - Parte IV. ..............................................................................88
Figura 6.1: Diagrama de paquetes. .......................................................................................................99
Figura 6.2: Diagrama de Componentes...............................................................................................103
Figura 6.3: Diagrama de Despliegue. ..................................................................................................104
Ilustración 1: Fragmento del diagrama de clases global. ....................................................................106
Figura 6.4: Diagrama de clases del paquete com.jfh.elearning.filter. .................................................107
Figura 6.5: Diagrama de clasees del paquete com.jfh.elearning.presentation.attemp .......................108
Figura 6.6: Diagrama de clases del paquete com.jfh.elearning.presentation.selfevaluation. .............109
Figura 6.7: Diagrama de clases del paquete com.jfh.elearning.presentation.taskselfevaluation. .......110
Figura 6.8: Diagrama de clases del paquete com.jfh.elearning.presentation.tasktheoryblock. ..........111
Figura 6.9: Diagrama de clases del paquete com.jfh.elearning.presentation.template. .....................111
Figura 6.10: Diagrama de clases del paquete com.jfh.elearning.presentation.user. ...........................112
Figura 6.11: Diagrama de clases del paquete com.jfh.elearning.presentation.user.login ...................113
Figura 6.12: Diagrama de clases del paquete com.jfh.elearning.presentation.useranswer. ...............114
Figura 6.13: Diagrama de clases del paquete com.jfh.elearning.util. ..................................................114
Figura 6.14: Diagrama de clases del paquete com.jfh.elearning.model – Parte I ................................115
Figura 6.15: Diagrama de clases del paquete com.jfh.elearning.model – Parte II ...............................115
Figura 6.16: Diagrama de clases del paquete com.jfh.elearning.model – Parte III ..............................116
Figura 6.17: Diagrama de clases del paquete com.jfh.elearning.business.* ........................................117
Figura 6.18: Diagrama de clases del paquete com.jfh.elearning.persistence.impl.* - Parte I ..............117
Figura 6.19: Diagrama de clases del paquete com.jfh.elearning.persistence.impl.* - Parte II ............118
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
11
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños
Figura 6.20: Diagrama de clases del paquete com.jfh.elearning.persistence.impl.* - Parte III ........... 118
Figura 6.21: Diagrama de secuencia – Caso de Uso Realizar Autoevaluación. .................................... 121
Figura 6.22: Diagrama de secuencia – Caso de Uso Modificar Pregunta. ............................................ 123
Figura 6.23: Diagrama E-R. ................................................................................................................. 127
Figura 6.24: Diseño final del módulo "Aprendizaje" – Vista I. ............................................................ 129
Figura 6.25: Diseño final del módulo “Aprendizaje” – Vista II. ........................................................... 130
Figura 6.26: Diseño final del módulo "Gestión de Usuarios”. ............................................................. 130
Figura 6.27: Diseño final del módulo "Gestión de Contenidos Académicos". ..................................... 131
Figura 7.1: Captuira del sitio web generado con Maven: Dependecias. ............................................. 162
Figura 7.2: Captuira del sitio web generado con Maven: Licencias. ................................................... 162
Figura 7.3: Captura del sitio web generado con Maven: Plugins. ....................................................... 163
Figura 7.4: Captura del sitio web generado con el ‘javadoc’ del proyecto. ......................................... 163
Figura 9.1: Ventana de inicio del asistente de instalación de Apache Tomcat. ................................... 188
Figura 9.2: Términos y condiciones de la licencia de Apache Tomcat. ................................................ 189
Figura 9.3: Selección de los componentes de Apache Tomcat que se quiere instalar. ........................ 190
Figura 9.4: Selección de los puertos que utilizará Apache Tomcat. .................................................... 191
Figura 9.5: Selección del directorio donde se encuentra instalada la máquina virtual de Java. .......... 192
Figura 9.6: Selección de la ruta de instalación de Apache Tomcat. .................................................... 193
Figura 9.7: Instalación de Apache Tomcat 7 terminada. ..................................................................... 194
Figura 9.8: Ventana de inicio del asistente de instalación de PostgreSQL. ......................................... 195
Figura 9.9: Selección del directorio de instalación de PostgreSQL. ..................................................... 196
Figura 9.10: Selección del directorio donde se almacenarán los datos por defecto de PostgreSQL. ... 197
Figura 9.11: Introduciendo contraseña del superusuario de PostgreSQL. .......................................... 198
Figura 9.12: Selección del puerto de escucha del servidor PostgreSQL. ............................................. 199
Figura 9.13: Selección de la configuración regional de PostgreSQL. ................................................... 200
Figura 9.14: Finalización de la instalación de PostgreSQL. ................................................................. 201
Figura 9.15: Ventana de inicio de psAdmin III. ................................................................................... 202
Figura 9.16: Conectando el servidor de la base de datos PostgreSQL. ................................................ 203
Figura 9.17: Creando un nuevo rol de login. ...................................................................................... 204
Figura 9.18: Nombre del login de rol de la base de datos PostgreSQL. ............................................... 205
Figura 9.19: Seleccionando la opción “Inherits rights from parent roles”. ......................................... 206
Figura 9.20: Rol de login jfhadmin creado. ......................................................................................... 206
Figura 9.21: Creando un nuevo tablespace. ....................................................................................... 207
Figura 9.22: Introduciendo el nombre y propietario del nuevo tablespacede PostgreSQL. ................ 208
Figura 9.23: Seleccionando un directorio para almacenar el tablespace de la base de datos PostgreSQL.
.................................................................................................................................................. 209
Figura 9.24: Tablespace tbe_elearning creado. .................................................................................. 210
Figura 9.25: Creando la base de datos. .............................................................................................. 210
Figura 9.26: Creando una nueva base de datos. ................................................................................. 211
Figura 9.27: Configurando la base de datos de PostgreSQL. ............................................................... 212
Figura 9.28: Base de datosde PostgreSQL creada. .............................................................................. 213
Figura 9.29: Iniciando la Base de Datos. ............................................................................................. 213
Figura 9.30: Creando un nuevo esquema en la base de datos de PostgreSQL. ................................... 214
Figura 9.31: Datos del nuevo esquema de la base de datos PostgreSQL. ........................................... 215
Figura 9.32: Nuevo esquema de la base de datos de PostgreSQL creado. .......................................... 216
Figura 9.33: Creando una nueva tabla en la base de datos de PostgreSQL. ........................................ 217
Figura 9.34: Creando una tabla en la base de datos PostgreSQL. ....................................................... 218
Figura 9.35: Selección del tablespace de la tabla users. ..................................................................... 219
Figura 9.36: Creando una columna en la tabla users. ......................................................................... 220
Figura 9.37: Indicando que un campo de la tabla users no puede ser NULL. ...................................... 221
12
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños
Figura 9.38: Tabla users creada. .........................................................................................................222
Figura 9.39: Directorio de instalación de Apache Tomcat. ..................................................................223
Figura 9.40: Aplicación web desplegada. ...........................................................................................223
Figura 9.41: Buscando el servicio de la base de datos PostgreSQL. .....................................................224
Figura 9.42: Base de datos PostgreSQL en ejecución. .........................................................................224
Figura 9.43: Apache Tomcat en ejecución. .........................................................................................224
Figura 9.44: Manual de usuario - Iniciar sesión. .................................................................................225
Figura 9.45: Manual de usuario - Seleccionar curso. ...........................................................................226
Figura 9.46: Manual e usuario - Seleccionar asignatura. .....................................................................226
Figura 9.47: Manual de usuario - Seleccionar unidad. ........................................................................227
Figura 9.48: MAnual de usuario - Seleccionar un bloque. ...................................................................227
Figura 9.49: MAnual de usuario - Realizar autoevaluación. ................................................................228
Figura 9.50: Manual de usuario - Realizar autoevaluación (enviar respuestas)...................................228
Figura 9.51Manual de usuario - Realizar autoevaluación (pregunta para ver las soluciones). ............229
Figura 9.52: Manual de usuario - Realizar autoevaluación (pregunta fallada). ...................................229
Figura 9.53: Manual de usuario - Realizar autoevaluación (pregunta acertada). ................................230
Figura 9.54: Manual de usuario - Lección de teoría (página 1). ...........................................................230
Figura 9.55: Página principal de la web del administrador. ................................................................231
Figura 9.56: Listado de usuarios dados de alta en el sistema. .............................................................232
Figura 9.57: Eliminar un usuario del sistema. .....................................................................................232
Figura 9.58: Mensaje de confirmación para eliminar un usuario. .......................................................233
Figura 9.59: Mensaje de notificación de usuario eliminado. ...............................................................233
Figura 9.60: Botón para editar un usuario. .........................................................................................234
Figura 9.61: Datos para editar el usuario. ...........................................................................................234
Figura 9.62: Mensaje de notificación de que el usuario se ha actualizado correctamente. .................235
Figura 9.63: Añadiendo un nuevo usuario desde un formulario. ........................................................235
Figura 9.64: Guardando los datos del nuevo usuario. .........................................................................236
Figura 9.65: Notificación de que el usuario se ha insertado correctamente. ......................................236
Figura 9.66: Añadir usuarios desde fichero.........................................................................................237
Figura 9.67: Selector de fichero. .........................................................................................................237
Figura 9.68: Añadir usuarios desde fichero.........................................................................................238
Figura 9.69: Página principal del módulo del profesor. ......................................................................238
Figura 9.70: Listar las tareas de los bloques de teoría y las preguntas de las autoevaluaciones. ........239
Figura 9.71: Listar las autoevaluaciones almacenadas en el sistema. .................................................239
Figura 9.72: Información de una autoevaluación. ..............................................................................240
Figura 9.73: Preguntas ee una autoevaluación (Se han filtrado los resultados). .................................240
Figura 9.74: Modificando una pregunta de una autoevaluación. ........................................................241
Figura 9.75: Editando el contenido de una pregunta de una autoevaluación. ....................................241
Figura 9.76: Añadiendo la variable de entorno JAVA_HOME. .............................................................242
Figura 9.77: Añadiendo al “Path” la ruta de acceso a los ejecutables de Java. ....................................242
Figura 9.78: Añadiendo al sistema la variable de entorno CLASSPATH. ..............................................243
Figura 9.79: Añadiendo al sistema la variable de entorno M2_HOME. ...............................................243
Figura 9.80: Añadiendo al “Path” la ruta de los ejecutables de Maven 3. ...........................................243
Figura 9.81: Directorio del proyecto. ..................................................................................................244
Figura 9.82: Comando ‘mvn site’ de Maven. ......................................................................................244
Figura 9.83: Finalización de la ejecución del comando ‘mvn site’ de Maven. ......................................244
Figura 9.84: Ejecución del comando 'mvn javadoc:javadoc' de Maven. ..............................................244
Figura 9.85: Finalización de la ejecución del comando 'mvn javadoc:javadoc' de Maven. ..................245
Figura 11.1: Tabla con los perfiles profesionales. ...............................................................................251
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
13
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños
14
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Memoria del Proyecto | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Capítulo 1. Memoria del Proyecto
1.1 Resumen de la Motivación, Objetivos y Alcance
del Proyecto
La enseñanza ha evolucionado con los años, y cada vez es mayor la tendencia a utilizar
plataformas online para estudiar. Este modelo de educación online se conoce como e-learning
y para mí, estas son las principales ventajas que aporta:




Flexibilidad. Puedes estudiar en cualquier momento del día, cualquier día de la
semana; lo que sería un servicio 24x7.
Compatibilidad. Puedes compaginar los estudios con cualquier otra actividad, como
por ejemplo trabajar.
Comodidad. No es necesario desplazarse hasta un centro de formación, lo que supone
un ahorro para el estudiante.
Actualización de los contenidos. Los contenidos se pueden modificar en cualquier
momento, de manera que el alumno tenga siempre información actualizada.
El desarrollo del presente proyecto se enmarca en las plataformas e-learning destinadas a los
estudios de primaria. La mayoría de las editoriales ofrecen plataformas e-learning de pago que
permiten continuar los estudios en papel de forma online, pero presentan un gran
inconveniente; los contenidos didácticos no son modificables. Este proyecto surge motivado
por el deseo de eliminar esta restricción y permitir a los profesores adaptar los contenidos
didácticos a las necesidades de sus alumnos.
El objetivo del presente proyecto es desarrollar una plataforma con contenidos didácticos
interactivos que permita a los alumnos estudiar de una forma entretenida. La aplicación web
tendrá una interfaz vistosa y amigable, con animaciones, sonidos, imágenes, etc. Por otro lado,
se pretende que los profesores puedan modificar los contenidos teóricos de las lecciones, los
ejercicios y las autoevaluaciones, y que a su vez puedan hacer un seguimiento de los alumnos.
La idea no es sustituir a los libros en papel, sino reforzar los conocimientos adquiridos por los
alumnos durante las clases presenciales.
El proyecto se limitará a desarrollar un primer prototipo de esta plataforma que permita, a los
alumnos hacer tareas de teoría, ejercicios y autoevaluaciones, y a los profesores gestionar los
contenidos didácticos que aparecen en la plataforma y hacer un seguimiento de los alumnos.
Por otro lado, también se realizará la parte de gestión de usuarios.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
15
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Memoria del Proyecto
1.2 Resumen de Todos los Aspectos
En esta sección se describen brevemente los apartados existentes en la presente
documentación.
Introducción
Este primer capítulo se centra en explicar al lector el porqué del desarrollo del proyecto, cuáles
son los objetivos a conseguir y cuál es la situación actual.
Aspectos Teóricos
En este capítulo se explican los conceptos teóricos empleados en el desarrollo del proyecto
que es conveniente que el lector conozca.
Planificación del Proyecto
En este apartado se muestra la planificación inicial y final proyecto, y se explican las
desviaciones que se han producido.
También contiene el presupuesto de costos y el presupuesto que se entregará al cliente.
Análisis
En esta sección se describe en primer lugar el alcance del proyecto y el catálogo de requisitos.
Posteriormente se hace un análisis de la aplicación que se empleará posteriormente en la fase
de diseño.
Diseño del Sistema
En este apartado se describe todo lo referente al diseño de la aplicación, como la arquitectura
del sistema, el diseño de la base de datos, el diseño de la interfaz, el plan de pruebas, etc.
Implementación del Sistema
En este capítulo se describen las tecnologías, herramientas y lenguajes de programación
utilizados en el desarrollo del proyecto, así como los estándares que se han seguido.
Desarrollo de las Pruebas
En este apartado se encuentran los resultados de las pruebas realizadas.
Manuales del Sistema
Esta sección contiene los diferentes manuales asociados al presente proyecto: instalación,
ejecución, de usuario y del programador.
Conclusiones y Ampliaciones
En este capítulo se describen las conclusiones obtenidas una vez finalizado el proyecto, y las
posibles ampliaciones que se pueden realizar para mejorar el sistema.
16
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Memoria del Proyecto | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Presupuesto
Esta sección contiene el presupuesto de costes y el presupuesto para el cliente.
Referencias Bibliográficas
Detalle de todos los documentos, libros y páginas web consultadas en la elaboración del
presente proyecto.
Apéndices
Apartado en el que se detalla el material entregado junto con la presente documentación.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
17
Introducción | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje
de los niños
Capítulo 2. Introducción
2.1 Justificación del Proyecto
Como se había adelantado en el capítulo anterior, las finalidades de este proyecto son dos; por
un lado se pretende permitir a los alumnos continuar estudiando desde casa de una forma
entretenida y divertida, y por otro, permitir a los profesores gestionar los contenidos de los
temarios.
En la actualidad hay muy pocos colegios que cuenten con una plataforma e-learning que
permita a los alumnos estudiar desde casa. El principal problema de los que sí cuentan con una
de estas plataformas es que los contenidos didácticos de las mismas son muy restrictivos; los
profesores no pueden gestionarlos, tienen que adaptarse a lo que hay o buscar otras
alternativas online para facilitar el material de ampliación a los alumnos. Son muchos los
profesores que recurren a blogs para aportar más material didáctico a sus alumnos; el
problema está en que los profesores no tienen un control sobre quién accede a esa
información, además de que los blogs no tienen una interfaz vistosa e interactiva que atraiga a
los alumnos.
Este proyecto surge como una propuesta de la directora de proyecto tras ser muchos los
profesores que se quejan de las plataformas e-learning actuales por los motivos citados en el
párrafo anterior.
Con la aplicación que se pretende desarrollar, los profesores podrán configurar el contenido de
las lecciones y hacer los cambios que crean oportunos cuando sea necesario. Podrán
configurar las preguntas de las autoevaluaciones y realizar un seguimiento de los alumnos que
les permita saber si éstos comprenden las explicaciones realizadas en las clases. Por otro lado,
los alumnos podrán seguir estudiando desde casa, algo que es una ventaja en aquellos casos
en los que nos pueden acudir a clase por estar enfermos o por cualquier otro motivo. La
interfaz del módulo destinado a los alumnos será interactiva, con animaciones, sonidos,
imágenes, etc. que llame su atención y haga que estudiar les parezca una tarea divertida.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
19
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Introducción
2.2 Objetivos del Proyecto
Los objetivos que se pretenden alcanzar con el desarrollo del presente proyecto, son los
siguientes:










20
Desarrollar una aplicación en un entorno web que suponga una alternativa a las
aplicaciones e-learning de las editoriales.
Proporcionar un mecanismo que permita dar de alta y de baja usuarios en la
plataforma.
Proporcionar un mecanismo que permita a los profesores gestionar los contenidos
didácticos; esto incluye los contenidos de las unidades teóricas y las preguntas de los
ejercicios de repaso y las autoevaluaciones.
Proporcionar un sistema de plantillas que permita a los profesores modificar de una
forma sencilla el contenido de las preguntas de los ejercicios y de las
autoevaluaciones, y el contenido de las unidades de teoría.
Proporcionar un mecanismo que permita almacenar los resultados de las
autoevaluaciones para su posterior explotación.
Proporcionar un mecanismo que permita a los profesores consultar los resultados de
las autoevaluaciones.
Proporcionar un mecanismo que reporte a los profesores estadísticas de los resultados
de las autoevaluaciones en forma de gráficos.
Proporcionar una web que permita a los alumnos estudiar las lecciones de teoría,
realizar ejercicios de repaso y evaluarse de los conocimientos adquiridos.
Proporcionar un sistema de comunicación entre los diferentes módulos que permita
transferir la información entre ellos.
Aplicar, consolidar y evolucionar los conocimientos adquiridos en el Máster de
Ingeniería Web.
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Introducción | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje
de los niños
2.3 Estudio de la Situación Actual
Como se ha comentado con anterioridad, actualmente hay numerosas plataformas e-learning
que proporcionan material didáctico online; a continuación compararemos algunas de ellas
con el proyecto que se pretende desarrollar.
2.3.1
Evaluación de Alternativas
2.3.1.1 LibrosVivos.net
Descripción
Se trata de una plataforma e-learning desarrollada por la editorial SM. Proporciona los
recursos didácticos de los libros de texto pero de forma online e interactiva. Para acceder a
ellos, hay que introducir el código ISBN del libro que se quiere consultar.
Ventajas
Proporciona los recursos de forma interactiva, y además, permite acceder a todos ellos sin
pagar una licencia.
Desventajas
Las dos principales desventajas de esta plataforma son, que no se puede realizar un
seguimiento de los alumnos, puesto que no hay un sistema de identificación, y que los
profesores no pueden modificar los contenidos didácticos.
2.3.1.2 Moodle
Descripción
Moodle es un sistema de gestión de recursos desarrollado por Martin Douglamas que permite
crear comunidades de aprendizaje en línea. Con Moodle, se pueden realizar actividades de
diversos tipos:



Comunicación. Foros y chats, mensajería interna o consultas y encuestas.
Formativas. Lecciones, tareas o enlaces a webs.
Evaluación. Cuestionarios.
Ventajas
Se trata de un software libre, por lo que no hay que pagar licencias, y además, permite realizar
un control sobre los usuarios que acceden a la plataforma.
Desventajas
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
21
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Aspectos Teóricos
La interfaz puede resultar inadecuada para la franja de edad a la que está destinado el
presente proyecto (9 a 12 años). El sistema que se pretende desarrollar tendrá una interfaz
con un estilo destinado a esta franja de edad, con elementos grandes, coloridos, con
animaciones, sonidos, imágenes, etc.
Capítulo 3. Aspectos Teóricos
3.1 CRUD (Create, Read, Update and Delete)
Se trata del acrónimo de Crear, Obtener, Actualizar y Borrar (en inglés Create, Read, Update
and Delete) cuya utilidad, es decir, empleo, radica en [referirse a las funciones básicas en bases
de datos o la capa de persistencia en un software.] [Wikipedia14A].
3.2 E-Learning
Puede entenderse e-learning como [el proceso de enseñanza que se lleva a cabo o se desarrolla
en internet y mediante la utilización de medios electrónicos.] [Moll14].
Entre los beneficios que aporta una enseñanza a través de una plataforma e-learning,
destacan:
[






Ahorro. *…+ se ahorran gastos de traslado, alojamiento, material didáctico, dietas,
matrícula, etc.
Acceso just-in-time. La formación *…+ se lleva a cabo en el momento en que se
necesita. Eres tú el que *…+ controla el tempo de tu formación en línea.
Acceso just-for-me. *…+ permite un tipo de enseñanza o aprendizaje mucho más
individualizado y personalizado en función de tus características tanto pedagógicas
como tecnológicas.
Flexibilidad horaria. *…+ eres tú el que puede gestionar tu propio ritmo de aprendizaje.
Y puedes hacerlo a cualquier hora y en cualquier lugar *…+
Barrera espacial. *…+ es posible realizar cualquier tipo de formación en línea sin que
importe la ubicación. *…+
Actualización. *…+ los contenidos son en línea, es decir, gozan de la ventaja de estar
alojados en espacios donde se pueden revisar y actualizar constantemente. *…+
] [Moll14].
3.3 Framework
La definición más usual empleada para dar significado al término framework, consiste en un
[conjunto estandarizado de conceptos, prácticas y criterios para enfocar un tipo de
22
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Aspectos Teóricos | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
problemática particular que sirve como referencia, para enfrentar y resolver nuevos problemas
de índole similar] [Wikipedia15A].
Así, en el área que nos atañe -el desarrollo software- un framework es [una estructura
conceptual y tecnológica de soporte definido, normalmente con artefactos o módulos de
software concretos, que puede servir de base para la organización y desarrollo de software.]
[Wikipedia15A].
Es decir, puede entenderse un framework como un conjunto de componentes que
proporciona una estructura común, con el fin de acelerar los tiempos de desarrollo de un
proyecto mediante la reutilización de código ya existente. De esta manera en el proyecto se
emplearán varios frameworks para facilitar el trabajo; de entre los cuales se destacaremos los
siguientes por su relevancia para el desarrollo del proyecto que nos concierne:





Struts2. Framework empleado en el desarrollo de aplicaciones web que implementa
una arquitectura basada en el patrón Modelo-Vista-Controlador (en adelante, MVC).
Este framework se empleará en la capa de presentación, aprovechando la
implementación que hace del controlador del patrón MVC, y la biblioteca de etiquetas
web que incluye para la presentación dinámica de los datos.
Spring Framework. Se trata de un framework formado por un conjunto de módulos
independientes
que
facilita
el
desarrollo
de
aplicaciones
web.
La característica principal de Spring es que el núcleo está basado en el concepto de
Inversión de Control (IoC, por sus siglas en inglés), o más concretamente, en la
Inyección de Dependencias (DI, por sus siglas en inglés). Ésta será una de las
características de la que se hará uso en el desarrollo del proyecto (módulo Spring
Core), la inyección de dependencias por medio del uso de anotaciones. Además, para
el acceso a los datos se empleará una característica muy útil del módulo Spring JDBC,
Spring JdbcTemplate, un mecanismo que permite conectarnos a una base de datos y
ejecutar consultas SQL. Internamente hace uso de la API de JDBC, con la gran ventaja
de que elimina todos los problemas relacionados con ésta, pues se encarga de realizar
las operaciones básicas del flujo de trabajo de JDBC: apertura y cierre de la conexión,
gestión de excepciones, iteración de ResultSets, etc.
Apache Tiles. Es un framework que nos proporciona un sistema de plantillas que
resulta extremadamente útil para la construcción de ficheros JPS.
Permite especificar mediante un fichero XML, las JSP’s que formarán una JSP final. De
este modo, evitamos la redundancia de código y mejoramos el mantenimiento, ya que
cada JSP solo contendrá una parte específica de una página.
Log4j. Se trata de un framework de logging que permite a los desarrolladores mostrar
mensajes de información de lo que está sucediendo en la aplicación manera
inmediata; es lo que se conoce de manera habitual como ‘log’.
Uno de los motivos por los que se ha elegido este framework para hacer el logging de
la aplicación, es su sencillez para configurar múltiples niveles de información y
formatos de salida por medio de un fichero XML, lo cual, facilitará el proceso de
seguimiento de un error.
Apache Maven. Herramienta encargada de gestionar el ciclo de vida de una aplicación.
Entre otras tareas se encarga de la administración de dependencias, de la
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
23
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Aspectos Teóricos
automatización del proceso de construcción, de la ejecución de pruebas, y del
empaquetado y despliegue de una aplicación mediante un fichero de configuración
con formato XML.
El principal motivo por el que se ha elegido este framework es por su idoneidad para
el manejo de las dependencias, ya, que, ante la necesidad de una librería externa, solo
es necesario definir en el fichero de configuración la dependencia de ésta. El
framework se encargará de descargar del repositorio, y configurar ésta y todas las
dependencias de las que dependa. Lo cual supone e implica un ahorro de tiempo
considerable ya que nos evita el tener que descargarnos, una a una, todas las librerías
y tener que configurarlas.
Para ver más detalladamente todos y cada uno de los frameworks y herramientas utilizadas en
el desarrollo del presente proyecto resulta conveniente consultar
el apartado de
Herramientas y Programas Usados para el Desarrollo.
3.4 Modelo-Vista-Controlador
El MVC queda definido como un [patrón de arquitectura de software que separa los datos y la
lógica de negocio de una aplicación de la interfaz de usuario y el módulo encargado de
gestionar los eventos y las comunicaciones.] [Wikipedia15B]. Para ello, el patrón MVC propone
dividir y segmentar el proceso de desarrollo de los diferentes componentes en las siguientes
partes:



Modelo: [Es la representación de la información con la cual el sistema opera, por lo
tanto gestiona todos los accesos a dicha información, tanto consultas como
actualizaciones, implementando también los privilegios de acceso que se hayan
descrito en las especificaciones de la aplicación (lógica de negocio). Envía a la 'vista'
aquella parte de la información que en cada momento se le solicita para que sea
mostrada (típicamente a un usuario). Las peticiones de acceso o manipulación de
información llegan al 'modelo' a través del 'controlador.] [Wikipedia15B].
Vista: [Presenta el 'modelo' (información y lógica de negocio) en un formato adecuado
para interactuar (usualmente la interfaz de usuario) por tanto requiere de dicho
'modelo' la información que debe representar como salida.] [Wikipedia14B].
Controlador: [Responde a eventos (usualmente acciones del usuario) e invoca
peticiones al 'modelo' cuando se hace alguna solicitud sobre la información (por
ejemplo, editar un documento o un registro en una base de datos). También puede
enviar comandos a su 'vista' asociada si se solicita un cambio en la forma en que se
presenta de 'modelo' (por ejemplo, desplazamiento o scroll por un documento o por los
diferentes registros de una base de datos), por tanto se podría decir que el
'controlador' hace de intermediario entre la 'vista' y el 'modelo'.] [Wikipedia14B].
En la presente aplicación, el patrón MVC está implementado por el framework Struts2 que
queda descrito en el capítulo Herramientas y Programas Usados para el Desarrollo. En la
siguiente ilustración puede observarse una representación gráfica que conceptualiza la
implementación que hace Struts2 del patrón MVC:
24
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Aspectos Teóricos | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 3.1: Representación gráfica que conceptualiza la implementación que hace Struts2 del
patrón MVC.
Históricamente, [la arquitectura MVC fue desarrollada como parte del grupo de Smalltalk en el
famoso Xerox PARC. Por lo general se le atribuye los créditos al noruego Trygve Reenskaug,
que trabajó allí como científico en 1978/1979. MVC es desde entonces una parte integral del
lenguaje de programación Smalltalk.] [Gregory15].
3.5 Programación por Capas
La programación por capas es [una arquitectura cliente-servidor en el que el objetivo primordial
es la separación de la lógica de negocios de la lógica de diseño] [Wikipedia15D].
La principal ventaja que aporta esta arquitectura, [es que el desarrollo se puede llevar a cabo
en varios niveles y, en caso de que sobrevenga algún cambio, solo se ataca al nivel requerido
sin tener que revisar entre código mezclado.
Además, permite distribuir el trabajo de creación de una aplicación por niveles; de este modo,
cada grupo de trabajo está totalmente abstraído del resto de niveles, de forma que basta con
conocer la API que existe entre niveles.] [Wikipedia15D].
Para el desarrollo del presente producto, se ha elegido un diseño en tres capas:
[
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
25
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Aspectos Teóricos
1. Capa de presentación: la que ve el usuario *…+, presenta el sistema al usuario, le
comunica la información y captura la información del usuario en un mínimo de
proceso. *…+ Esta capa se comunica únicamente con la capa de negocio.
2. Capa de negocio: *…+ se reciben las peticiones del usuario y se envían las respuestas
tras el proceso. *…+ es aquí donde se establecen todas las reglas que deben cumplirse.
Esta capa se comunica con la capa de presentación, para recibir las solicitudes y
presentar los resultados, y con la capa de datos, para solicitar al gestor de base de
datos almacenar o recuperar datos de él. *…+
3. Capa de datos: es donde residen los datos y es la encargada de acceder a los mismos.
Está formada por uno o más gestores de bases de datos que realizan todo el
almacenamiento de datos, reciben solicitudes de almacenamiento o recuperación de
información desde la capa de negocio.
] [Wikipedia15D].
3.6 Sistema de Gestión de Bases de Datos
Un Sistema de Gestión de Bases de Datos (en adelante, SGBD) es un tipo de software que
permite [el almacenamiento, modificación y extracción de la información en una base de datos,
además de proporcionar herramientas para añadir, borrar, modificar y analizar los datos. Los
usuarios pueden acceder a la información usando herramientas específicas de interrogación y
de generación de informes, o bien mediante aplicaciones al efecto.] [Wikipedia15E].
Entre otras características, estos sistemas [proporcionan métodos para mantener la integridad
de los datos, para administrar el acceso de usuarios a los datos y para recuperar la información
si el sistema se corrompe.] [Wikipedia15E].
La aplicación utilizará PostgreSQL como SGBD. En el apartado 5.6 Análisis de los SGBD se
encuentra el análisis realizado de las diferentes alternativas.
3.7 Lenguaje Unificado de Modelado (UML)
Para el desarrollo del presente proyecto emplearemos la definición de UML como la de
[Lenguaje Unificado de Modelado (UML, por sus siglas en inglés, Unified Modeling Language)
es el lenguaje de modelado de sistemas de software más conocido y utilizado en la actualidad;
está respaldado por el OMG (Object Management Group).
Es un lenguaje gráfico para visualizar, especificar, construir y documentar un sistema. UML
ofrece un estándar para describir un "plano" del sistema (modelo), incluyendo aspectos
conceptuales tales como procesos de negocio, funciones del sistema, y aspectos concretos
como expresiones de lenguajes de programación, esquemas de bases de datos y compuestos
reciclados.] [Wikipedia15D].
El UML se empleará en las fases de análisis y diseño del sistema, con el objetivo de definir
todos los aspectos de la arquitectura del sistema.
26
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Planificación del Proyecto y Resumen de Presupuestos | Portal web con contenidos didácticos
interactivos para reforzar el aprendizaje de los niños
UML fue desarrollado por James Rumbaugh, Grady Booch e Ivar Jacobson durante los años
iniciales de la década de 1990. Así, en el año 1997, el UML 1.1 fue adoptado por el Object
Management Group (en adelante, OMG), siendo finalmente en el año 2005 cuando se aprobó
como estándar la versión 1.4.2 de UML.
Actualmente, la última versión disponible del UML es la 2.5, lanzada en octubre 2012.
Capítulo 4. Planificación
Proyecto
y
Resumen
Presupuestos
del
de
4.1 Planificación
La planificación del presente proyecto está basada, en gran parte, en un modelo cascada, lo
que quiere decir que ninguna tarea comenzará antes de terminar sus predecesoras.
Para la planificación del proyecto, pese que lo ha realizado una sola persona, se han tenido en
cuenta seis perfiles diferentes, que son:






Analista
Desarrollador web
Jefe de proyecto
Programador
Técnico de sistemas
Tester
El desarrollo del presente proyecto se ha descompuesto en múltiples tareas que permitan
realizar un sencillo seguimiento. Como se puede ver en la Figura 4.1, la fase inicial del
proyecto comenzó el día 12 de enero del 2015. Éste, se estimó en una duración de 126 días,
siendo la fecha de entrega el 6 de julio del 2015, último días para la entrega de la
documentación del Trabajo Fin de Máster.
Figura 4.1: Planificación inicial.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
27
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Planificación del Proyecto y Resumen de Presupuestos
Durante el desarrollo del proyecto se produjeron números retrasos, debidos, en gran parte, a
que se compaginó el desarrollo del mismo con la vida laboral. No obstante, los cambios en los
requisitos obligaron, también, a tener que hacer una reestructuración en el proyecto que
significo un retraso de dos semanas -como se puede ver en el fichero adjunto de la
planificación final (“72093281b_planificacion_final.mpp”)-. Puesto que la fecha de finalización
del proyecto no se podía alargar porque se pretendía presentar el Trabajo Fin de Máster en la
convocatoria de julio, se tuvo que reducir el alcance del proyecto. En la Figura 4.2 puede
observarse la planificación final.
Figura 4.2: Planificación final.
En las ilustraciones anteriores solo se ha mostrado la tarea resumen de cada fase; para ver en
detalle cada una de las planificaciones, por favor, consultar los siguientes ficheros que se
adjuntan con la presente documentación:


72093281b_planificacion_inicial.mpp
72093281b_planificacion_final.mpp
En la planificación final del proyecto se han identificado 141 tareas a realizar durante los 126
días en que se ha estimado la duración del proyecto. Las tareas principales son:







28
Estudio de viabilidad. Esta fase está destinada a definir los objetivos que se pretenden
alcanzar con el desarrollo del presente proyecto en función de los recursos
disponibles, y poder así realizar la planificación y los presupuestos (costes y cliente).
Análisis. Se trata de la tarea resumen que engloba el conjunto de tareas destinadas al
estudio del sistema a desarrollar.
Diseño. Esta tarea engloba al conjunto de tareas destinadas a la realización del diseño
del sistema.
Implementación. Esta tarea engloba las tareas propias de la implementación del
proyecto y las tareas destinadas a la realización de los diferentes manuales.
Banco de pruebas. Se trata de la tarea que engloba las tareas destinadas a la
realización de las diferentes pruebas que verifiquen el correcto funcionamiento del
sistema. Además, también incluye las tareas destinadas a corregir los errores
detectados, y a documentar los resultados obtenidos.
Monitorización y control de riesgos. Tarea destinada a la monitorización y control de
los riesgos identificados.
Despliegue. Tarea que engloba las tareas destinadas a la formación del usuario final,
instalación y puesta en marcha del sistema, y definición del acuerdo del nivel de
servicio (personal dedicado al mantenimiento y solución de errores, documentación
disponible, disponibilidad del personal de soporte, etc).
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Planificación del Proyecto y Resumen de Presupuestos | Portal web con contenidos didácticos
interactivos para reforzar el aprendizaje de los niños
En la siguiente imagen (Figura 4.3) puede observarse un diagrama de Gantt con los hitos del
proyecto que representan cada una de las entregas y reuniones de seguimiento que se han
tenido con el cliente.
Figura 4.3: Diagrama de Gantt de los hitos del proyecto.
Además, en la documentación adjunta pueden verse los informes de seguimiento y las actas de
inicio y cierre del proyecto. En cada uno de los informes de seguimiento se explican los
cambios en el alcance del proyecto que se han acordado con el cliente. Los documentos
adjuntos son los siguientes:













72093281b_acta_inicio_proyecto.docx
72093281b_01_23012015.docx
72093281b_02_27022015.docx
72093281b_03_26032015.docx
72093281b_04_14042015.docx
72093281b_05_23042015.docx
72093281b_06_30042015.docx
72093281b_07_15052015.docx
72093281b_08_03062015.docx
72093281b_09_04062015.docx
72093281b_10_12062015.docx
72093281b_11_01072015.docx
72093281b_acta_cierre_proyecto.docx
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
29
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
Capítulo 5. Análisis
Este apartado contendrá toda la especificación de requisitos y toda la documentación del
análisis de la aplicación, a partir de la cual se elaborará posteriormente el diseño.
5.1 Definición del Sistema
5.1.1
Determinación del Alcance del Sistema
Se pretende construir un sistema que permita a los alumnos de educación primaria estudiar las
lecciones de teoría de las asignaturas de Lengua y Literatura, Ciencias Naturales y
Matemáticas. Los alumnos también podrán realizar ejercicios guiados para practicar la parte
teórica, y, autoevaluaciones para “examinarse“. Las respuestas de los alumnos se almacenarán
en la base de datos, de manera que posteriormente se puedan extraer los resultados para
realizar estadísticas que permitan al profesor hacer un seguimiento de los alumnos, y,
determinar si entendieron los conceptos explicados.
Los contenidos de los bloques de teoría, ejercicios y autoevaluaciones los podrán gestionar el
profesor. Se proporcionarán plantillas con tipos de ejercicios que faciliten esta tarea, de modo
que los profesores solo tengan que rellenarlas con la información que deseen que se visualice
posteriormente en las lecciones. Las plantillas existentes estarán registradas en la base de
datos y habrá plantillas definidas para el bloque de autoevaluaciones, aunque en una futura
ampliación del sistema se harán también para los bloques de teoría y ejercicios.
El acceso al sistema será vía web y los usuarios deberán estar registrados en él para poder
acceder al mismo.
En cuanto a la gestión de usuarios, se podrán dar de alta usuarios nuevos, modificar los
existentes o eliminarlos. A la hora de dar de un usuario nuevo se le asignará un perfil que
determinará a qué módulo del sistema tiene acceso:



Perfil “Profesor”: Este tipo de usuario tendrá accedo al módulo “Gestión de
Contenidos Académicos”.
Perfil “Alumno”: Este tipo de usuario tendrá acceso al módulo “Aprendizaje”.
Perfil “Administrador”: Este tipo de usuario tendrá acceso al módulo “Gestión de
Usuarios”.
Es necesario que la interfaz del módulo destinado a los alumnos con perfil “Alumno” conste de
animaciones, sonidos, imágenes, elementos grandes, etc. que la hagan llamativa. Hay que
tener en cuenta que este módulo está destinado a usuarios de entre 9 y 12 años por lo que se
seguirán ciertos principios de usabilidad dirigidos a este grupo de usuarios.
No es objetivo del proyecto dar opciones para crear nuevas autoevaluaciones, lecciones de
teoría, ejercicios o plantillas, como dijimos esto es un prototipo por lo que se proporcionarán
autoevaluaciones, lecciones de teoría, ejercicios y plantillas de prueba.
30
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
Por último, mencionar que es posible que se realicen cambios en el alcance del sistema; la
funcionalidad que se amplíe o se elimine quedará reflejada en los informes de seguimiento.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
31
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
5.2 Requisitos del Sistema
5.2.1
Obtención de los Requisitos del Sistema
5.2.1.1 Especificaciones del Cliente
El sitio web debe permitir a los niños de 4º, 5º y 6º de primaria estudiar de una forma
interactiva, con animaciones, imágenes, vídeos, sonidos, juegos, etc. Los alumnos podrán
elegir tres materias para estudiar: Lengua y Literatura, Conocimiento del Medio y
Matemáticas. A su vez, cada una de estas deberá estar dividida en tres bloques:
1. Una sección donde se explique un temario.
2. Otra sección donde se hagan ejercicios guiados.
3. Y finalmente, una última sección donde el alumno deberá hacer una autoevaluación
con material visto en las secciones anteriores.
Tras finalizar una autoevaluación, las respuestas de la misma deben ser almacenadas en una
base de datos, de manera que posteriormente se puedan explotar.
Los profesores deben poder consultar las respuestas de las autoevaluaciones realizadas por los
alumnos. Esta información les permitirá realizar un seguimiento de los alumnos y saber en
todo momento cuáles deben ser los puntos que deben reforzarse, tanto a nivel individual
como colectivo. Los alumnos no deben tener acceso a esta información.
El sitio web deberá estar protegido mediante un sistema de Login, de manera que solo los
usuarios registrados puedan tener acceso. Habrá un mecanismo que permita a los usuarios
administradores crear, eliminar, buscar y modificar usuarios.
5.2.1.2 Requisitos Funcionales
5.2.1.2.1 Requisitos del Módulo “Gestión de Usuarios”
RF - 1.XX – Requisitos del Módulo “Gestión de Usuarios”
Código
Nombre Requisito
Descripción del Requisito
RF – 1.01 Perfiles de usuario
a) Habrá los siguientes perfiles de usuario en el
(Eliminado)
sitio web:
 Administrador
 Alumno
 Profesor
32
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
RF – 1.02 Acceso al sistema
(Eliminado)
a) El acceso al sitio web estará protegido
mediante usuario y contraseña. Solo los
usuarios que inicien sesión podrán acceder.
RF – 1.03
(Movido)
Iniciar sesión
RF – 1.04
(Movido)
Cerrar sesión
RF – 1.05
(Movido)
Recuperación
de
la
a) El sistema proporcionará un mecanismo para
contraseña de usuario
recuperar la contraseña de acceso al sitio web.
b) Esta tarea la podrán realizar los usuarios
anónimos.
a) El portal deberá tener un sistema de login para
que los usuarios se identifiquen en el sitio web.
b) Esta tarea la podrán realizar los usuarios
anónimos.
c) Se leerá el identificador y la contraseña
introducidos por el usuario anónimo y se
validarán contra la base de datos:
 Si los datos son correctos, el usuario
iniciará sesión en el sistema, éste
tendrá un usuario más conectado, y
redirigirá al usuario a su página
principal.
 Si los datos no son correctos, el usuario
no iniciará sesión en el sistema, éste no
tendrá un usuario más conectado, y se
redirigirá al usuario a la pantalla de
login, donde se mostrará un mensaje
de error indicando que los datos no son
correctos.
a) El portal deberá tener un sistema de logout que
permita a los usuarios finalizar la sesión en el
sitio web.
b) Esta
tarea
la
podrán
realizar
los
administradores, los alumnos y los profesores.
c) Cuando el usuario seleccione la opción de
logout, el sistema cerrará la sesión, éste tendrá
un usuario menos conectado y se redirigirá al
usuario a la pantalla de login.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
33
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
RF – 1.06
Alta usuario
RF – 1.07
Eliminar usuario
34
a) Se podrán dar de alta nuevos usuarios en el
sistema (una vez leídos y validados los datos)
mediante un formulario donde se introducirán
los siguientes datos:
 Nombre
 Apellidos
 DNI
 Sexo
 Dirección
 Población
 Provincia
 País
 Teléfono (solo los administradores y los
profesores).
 Perfil (administrador, alumno o
profesor).
 Email
 Identificador de login (único en el
sistema)
 Contraseña
A cada uno de los usuarios se le asignará un
perfil de entre los siguientes:
 Administrador
 Alumno
 Profesor
b) Esta tarea solo la podrán realizar los
administradores.
c) El administrador debe iniciar sesión en el
sistema para poder realizar esta tarea.
d) El administrador introducirá los datos del
usuario en el formulario. A continuación, se
comprobará que el usuario no existe en la base
de datos:
 Si el usuario no existe en la base de
datos, se añadirá un nuevo usuario al
sistema.
 Si el usuario ya existe en la base de
datos, el sistema no tendrá un usuario
nuevo, y se mostrará un mensaje de
error.
a) Se podrán eliminar usuarios almacenados en el
sistema, previa confirmación de la acción.
b) Esta tarea solo la podrán realizar los
administradores.
c) El administrador debe iniciar sesión en el
sistema para poder realizar esta tarea.
d) Cuando el administrador esté visualizando en
detalle un usuario, seleccionará la opción
“Eliminar usuario”. El sistema solicitará que se
confirme la acción; en caso afirmativo, el
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
sistema eliminará el usuario de la base de datos
y ésta tendrá un usuario menos.
Posteriormente se redirigirá al administrador a
la pantalla de búsqueda de usuarios.
RF – 1.08
Modificar usuario
RF – 1.09
Listar usuarios
R – 1.10
Filtrado de registros de
a) Se podrán realizar búsquedas de usuarios por
usuarios
uno
o
por
varios
campos.
Los campos por los que al menos se tienen que
poder realizar las búsquedas son:
 DNI
 Nombre
 Primer apellido
 Segundo apellido
 Perfil de usuario
b) Esta tarea solo la podrán realizar los
administradores.
c) Los administradores deben iniciar sesión en el
sistema para poder realizar esta tarea.
d) El administrador rellenará los campos del
formulario por los que quiere realizar la
búsqueda y seleccionará la opción “Buscar”. El
sistema consultará en la base de datos las
coincidencias y mostrará los resultados.
a) Se podrán modificar todos los datos de los
usuarios almacenados en el sistema.
b) Esta tarea solo la podrán realizar los
administradores.
c) El administrador debe iniciar sesión en el
sistema para poder realizar esta tarea.
d) El administrador modificará los datos del
usuario (el identificador de usuario no se podrá
modificar). El sistema solicitará que se confirme
la acción:
a. En caso afirmativo, tras leer y validar
los datos, guardará los cambios y
actualizará la información del usuario
en la base de datos.
b. En caso de que cancele la acción, el
sistema no guardará los cambios, y la
base de datos seguirá teniendo la
misma información.
a) Se podrán listar todos los usuarios que hay
registrados en el sistema.
b) Esta tarea solo la podrán realizar los
administradores.
c) Los administradores deben iniciar sesión en el
sistema para poder realizar esta tarea.
d) El administrador seleccionará la opción
“Buscar”. El sistema mostrará todos los
usuarios dados de alta en el sitio web.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
35
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
RF – 1.11
RF – 1.12
RF – 1.13
Ordenación
de
los
registros
de
las a) Los registros de usuario mostrados en el listado
se podrán ordenar.
búsquedas de usuarios
b) Esta tarea solo la podrán realizar los
administradores.
c) Los administradores deben iniciar sesión en el
sistema para poder realizar esta tarea.
d) Una vez mostrados los registros de usuarios, el
administrador seleccionará la columna por la
que quiere realizar la ordenación y el sistema
ordenará los registros.
Mostrar usuario
a) Se podrán visualizar todos los datos de un
usuario registrado en el sistema.
b) Esta tarea solo la podrán realizar los
administradores.
c) Los administradores deben iniciar sesión en el
sistema para poder realizar esta tarea.
d) Una vez que el administrador seleccione un
usuario de una lista de usuarios, el sistema
mostrará toda la información almacenada en la
base de datos.
Alta
usuarios
desde
a) Se podrán dar de alta nuevos usuarios por
fichero
medio de un fichero con extensión CSV. Este
fichero contendrá en cada fila un usuario con
las propiedades de éste separadas por el
carácter ‘;’.
b) Esta tarea solo la podrán realizar los
administradores.
c) El administrador debe iniciar sesión en el
sistema para poder realizar esta tarea.
El fichero tiene que estar codificado en UTF-8.
d) El administrador seleccionará el fichero con
extensión CSV que contiene los usuarios. A
continuación, el sistema procesará el fichero y
añadirá los nuevos usuarios a la base de datos.
5.2.1.2.2 Requisitos del Módulo “Gestión de Contenidos Académicos”
RF - 2.XX – Requisitos del Módulo “Gestión de Contenidos Académicos”
Código
Nombre Requisito
Descripción del Requisito
RF – 2.01
Listar autoevaluaciones
a) Se podrán listar todas las autoevaluaciones
realizadas por los alumnos.
b) Esta tarea solo la podrán realizar los
profesores.
c) Los profesores deberán iniciar sesión en el
sistema para poder realizar esta tarea.
d) El profesor seleccionará la opción “Buscar”.
El
sistema
mostrará
todas
las
autoevaluaciones almacenadas en la base
de datos.
36
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
RF – 2.02
RF – 2.03
RF – 2.04
Filtrado de registros de
a) Se podrán realizar búsquedas de
autoevaluaciones
autoevaluaciones en base a uno o varios
campos. Los campos por los que al menos
se tienen que poder realizar las búsquedas
son:
 Curso
 Asignatura
 Lección
 DNI del alumno
 Nombre del alumno
 Apellido del alumno
b) Esta tarea solo la podrán realizar los
profesores.
c) Los profesores deberán iniciar sesión en el
sistema para poder realizar esta tarea.
d) El profesor rellenará los campos del
formulario por los que quiere realizar la
búsqueda y seleccionará la opción
“Buscar”. El sistema consultará en la base
de datos las coincidencias y mostrará los
resultados.
Ordenación
de
los
registros
de
autoevaluaciones
registros de las búsquedas a) Los
mostrados
en
el
listado
se
podrán ordenar.
de autoevaluaciones
b) Esta tarea solo la podrán realizar los
profesores.
c) Los profesores deben iniciar sesión en el
sistema para poder realizar esta tarea.
d) Una vez mostrados los registros de
autoevaluaciones, el profesor seleccionará
la columna por la que quiere realizar la
ordenación y el sistema ordenará los
registros.
Mostrar autoevaluación
a) Se podrán visualizar los siguientes datos de
una autoevaluación almacenada en el
sistema:
 Información.
 Estadísticas.
 Intentos.
 Preguntas
asociadas
a
la
autoevaluación.
b) Esta tarea solo la podrán realizar los
profesores.
c) Los profesores deben iniciar sesión en el
sistema para poder realizar esta tarea.
d) Una vez que el profesor seleccione una
autoevaluación
de
una
lista
de
autoevaluaciones, el sistema mostrará toda
la información almacenada en la base de
datos.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
37
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
RF – 2.05
Comentar autoevaluación
RF – 2.06
Eliminar comentario
RF – 2.07
Modificar comentario
38
a) Se podrá añadir un comentario a una
autoevaluación almacenada en el sistema.
b) Esta tarea solo la podrán realizar los
profesores.
c) El profesor debe iniciar sesión en el sistema
para poder realizar esta tarea.
d) Cuando el profesor esté visualizando en
detalle el registro de una autoevaluación,
introducirá un comentario en el campo
“Comentario”.
Cuando
el
profesor
seleccione la opción para guardar los
cambios, el sistema, tras leer y validar los
datos, guardará los cambios y actualizará la
información de la autoevaluación en la
base de datos.
a) Se podrá eliminar el comentario de una
autoevaluación, previa confirmación de la
acción.
b) Esta tarea solo la podrán realizar los
profesores.
c) El profesor debe iniciar sesión en el sistema
para poder realizar esta tarea.
d) Cuando el profesor esté visualizando en
detalle una autoevaluación, seleccionará la
opción “Eliminar comentario”. El sistema
solicitará que se confirme la acción:
 En caso afirmativo, el sistema
eliminará el comentario. Cuando se
guarden los cambios, el sistema
actualizará la información en la
base de datos.
 En caso de que cancele la acción, el
sistema no eliminará el comentario,
y la base de datos seguirá teniendo
la misma información.
a) Se podrá modificar el comentario de una
autoevaluación.
b) Esta tarea solo la podrán realizar los
profesores.
c) El profesor debe iniciar sesión en el sistema
para poder realizar esta tarea.
d) Cuando el profesor esté visualizando en
detalle una autoevaluación, modificará el
comentario existente. El profesor guardará
los cambios, el sistema notificará que se
han hecho cambios en el registro y pedirá
una confirmación:
 En caso afirmativo, el sistema, tras
leer y validar los datos, guardará
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños

RF – 2.08
Calificar autoevaluación
RF – 2.09
(Eliminado)
Eliminar calificación
RF – 2.10
(Eliminado)
Modificar calificación
los cambios y actualizará la
información de la autoevaluación
en la base de datos.
En caso de que cancele la acción, el
sistema
no
modificará
el
comentario, y la base de datos
seguirá
teniendo
la misma
información.
a) Se podrán calificar las autoevaluaciones
realizadas por los alumnos.
b) Esta tarea la realizará el sistema.
c) Cuando el alumno termine de realizar la
autoevaluación, el sistema la calificará
automáticamente en base a las soluciones
almacenadas en la base de datos.
a) Se podrá eliminar la calificación de una
autoevaluación, previa confirmación de la
acción.
b) Esta tarea solo la podrán realizar los
profesores.
c) El profesor debe iniciar sesión en el sistema
para poder realizar esta tarea.
d) Cuando el profesor esté visualizando en
detalle una autoevaluación, seleccionará la
opción “Eliminar calificación”. El sistema
solicitará que se confirme la acción:
 En caso afirmativo, el sistema
eliminará la calificación. Cuando se
guarden los cambios, el sistema
actualizará la información en la
base de datos.
 En caso de que cancele la acción, el
sistema no eliminará la calificación,
y la base de datos seguirá teniendo
la misma información.
a) Se podrá modificar la calificación de una
autoevaluación.
b) Esta tarea solo la podrán realizar los
profesores.
c) El profesor debe iniciar sesión en el sistema
para poder realizar esta tarea.
d) Cuando el profesor esté visualizando en
detalle una autoevaluación, modificará la
calificación existente. El profesor guardará
los cambios, el sistema notificará que se
han hecho cambios en el registro y pedirá
una confirmación:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
39
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis


RF – 2.11
RF – 2.12
RF – 2.13
40
En caso afirmativo, el sistema, tras
leer y validar los datos, guardará
los cambios y actualizará la
información de la autoevaluación
en la base de datos.
En caso de que cancele la acción, el
sistema
no
modificará
el
comentario, y la base de datos
seguirá
teniendo
la misma
información.
Modificar el contenido de
las tareas de los bloques a) Se podrá modificar el contenido de las
tareas
de
los
bloques
“Teoría”,
“Teoría”
entendiéndose como tarea cada página con
contenido didáctico.
b) Esta tarea solo la podrán realizar los
profesores.
c) El profesor debe iniciar sesión en el sistema
para poder realizar esta tarea.
d) El profesor seleccionará de un listado la
tarea que quiere modificar. El sistema irá
pidiendo los datos que debe introducir el
profesor en cada momento. Cuando
termine, el sistema modificará la tarea con
la información que ha introducido el
profesor.
Modificar el contenido de
las preguntas de los a) Se podrá modificar el contenido de las
preguntas de las autoevaluaciones y de los
bloques “Autoevaluación”
ejercicios. Se podrá elegir entre los
y “Ejercicios”
siguientes tipos de preguntas:
 Pregunta/Respuesta
 Verdadero/Falso
 Varias opciones
b) Esta tarea solo la podrán realizar los
profesores.
c) El profesor debe iniciar sesión en el sistema
para poder realizar esta tarea.
d) El profesor seleccionará en primer lugar la
autoevaluación o ejercicio que quiere
modificar, y posteriormente la pregunta. El
sistema irá pidiendo los datos que debe
introducir el profesor en cada momento.
Cuando termine, el sistema modificará la
pregunta con la información que ha
introducido el profesor.
Listar tareas
a) Se podrán listar todas las tareas que hay
almacenadas en la base de datos. Se
considerarán tareas cada una de las
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
preguntas del bloque de autoevaluación y
cada página con material explicativo del
bloque de teoría.
b) Esta tarea solo la podrán realizar los
profesores.
c) Los profesores deben iniciar sesión en el
sistema para poder realizar esta tarea.
d) El profesor seleccionará la opción “Buscar”.
El sistema mostrará todas las tareas
almacenadas en las base de datos.
RF – 2.14
Listar preguntas
RF – 2.15
Filtrar los registros de las
a) Se podrán realizar búsquedas de tareas por
tareas
uno
o
por
varios
campos.
Los campos por los que al menos se tienen
que poder realizar las búsquedas son:
 Asignatura
 Bloque
 Curso académico
 Lección
b) Esta tarea solo la podrán realizar los
profesores.
c) Los profesores deben iniciar sesión en el
sistema para poder realizar esta tarea.
d) El profesor rellenará los campos del
formulario por los que quiere realizar la
búsqueda y seleccionará la opción
“Buscar”. El sistema consultará en la base
de datos las coincidencias y mostrará los
resultados.
Filtrar las registros de las
a) Se podrán realizar búsquedas de preguntas
preguntas
por uno o por varios campos.
Los campos por los que al menos se tienen
que poder realizar las búsquedas son:
 Asignatura
 Bloque
 Curso académico
 Lección
b) Esta tarea solo la podrán realizar los
profesores.
c) Los profesores deben iniciar sesión en el
sistema para poder realizar esta tarea.
RF – 2.16
a) Se podrán listar todas las preguntas que
hay almacenadas en la base de datos.
b) Esta tarea solo la podrán realizar los
profesores.
c) Los profesores deben iniciar sesión en el
sistema para poder realizar esta tarea.
d) El profesor seleccionará la opción “Buscar”.
El sistema mostrará todas las preguntas
almacenadas en las base de datos.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
41
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
d) El profesor rellenará los campos del
formulario por los que quiere realizar la
búsqueda y seleccionará la opción
“Buscar”. El sistema consultará en la base
de datos las coincidencias y mostrará los
resultados.
RF – 2.17
RF – 2.18
Ordenación
de
los
registros de las búsquedas a) Los registros de tareas mostrados en el
listado se podrán ordenar.
de tareas
b) Esta tarea solo la podrán realizar los
profesores.
c) Los profesores deben iniciar sesión en el
sistema para poder realizar esta tarea.
d) Una vez mostrados los registros de las
tareas, el profesor seleccionará la columna
por la que quiere realizar la ordenación y el
sistema ordenará los registros.
Ordenación
de
los
registros de las búsquedas a) Los registros de preguntas mostrados en el
listado se podrán ordenar.
de tareas
b) Esta tarea solo la podrán realizar los
profesores.
c) Los profesores deben iniciar sesión en el
sistema para poder realizar esta tarea.
d) Una vez mostrados los registros de las
preguntas, el profesor seleccionará la
columna por la que quiere realizar la
ordenación y el sistema ordenará los
registros.
5.2.1.2.3 Requisitos del Módulo “Aprendizaje”
RF - 3.XX – Requisitos del Módulo “Aprendizaje”
Código
Nombre Requisito
Descripción del Requisito
RF – 3.01 Cursos académicos
a) Habrá los siguientes cursos académicos en el
(Eliminado)
sitio web:
 Cuanto
 Quinto
 Sexto
RF – 3.02
42
Seleccionar curso
a) Se podrá seleccionar un curso académico de
entre todos los disponibles:
 Cuarto
 Quinto
 Sexto
b) Esta tarea solo la podrán realizar los alumnos.
c) El alumno debe iniciar sesión en el sistema para
poder realizar esta tarea.
d) El alumno seleccionará un curso académico de
entre los disponibles y el sistema le redirigirá a
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
la pantalla de selección de asignatura.
RF – 3.03 Asignaturas
(Eliminado)
RF – 3.04
Seleccionar asignatura
RF – 3.05 Lecciones
(Eliminado)
RF – 3.06
Seleccionar lección
RF – 3.07 Bloques
(Eliminado)
RF – 3.08
a) Habrá las siguientes asignaturas en el sitio web:
 Lengua y Literatura
 Matemáticas
 Conocimiento del Medio
a) Se podrá seleccionar una asignatura de entre
todas las disponibles:
 Lengua y Literatura
 Matemáticas
 Ciencias de la Naturaleza y Ciencias
Sociales
b) Esta tarea solo la podrán realizar los alumnos.
c) El alumno debe iniciar sesión en el sistema para
poder realizar esta tarea.
d) El alumno seleccionará una asignatura de entre
las disponibles y el sistema le redirigirá a la
pantalla de selección de lección.
a) Cada asignatura tendrá un temario dividido por
lecciones.
a) Cada asignatura tendrá un temario dividido en
lecciones. Se podrá seleccionar una lección de
entre todas las disponibles.
b) Esta tarea solo la podrán realizar los alumnos.
c) El alumno debe iniciar sesión en el sistema para
poder realizar esta tarea.
d) El alumno seleccionará una lección de entre las
disponibles y el sistema le redirigirá a la
pantalla de selección de bloque.
a) Cada asignatura estará
siguientes tres bloques:
 Teoría
 Ejercicios
 Autoevaluación
dividida
en
los
Seleccionar bloque de la
a) Se podrá seleccionar un bloque de entre todos
lección
los disponibles:
 Teoría
 Ejercicios
 Autoevaluación
b) Esta tarea solo la podrán realizar los alumnos.
c) El alumno debe iniciar sesión en el sistema para
poder realizar esta tarea.
d) El alumno seleccionará un bloque de entre los
disponibles y el sistema le redirigirá a la
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
43
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
pantalla donde visualizará el contenido
referente al curso, asignatura, lección y bloque
seleccionado.
RF – 3.09
Realizar tarea del bloque
a) Se podrán realizar tareas relacionadas con el
de teoría
bloque de teoría, donde habrá material
didáctico de carácter explicativo.
b) Esta tarea solo la podrán realizar los alumnos.
c) Los alumnos deben iniciar sesión en el sistema
para poder realizar esta tarea.
d) El alumno deberá seleccionar el curso, la
asignatura, la lección y el bloque “Teoría” para
poder realizar ésta tarea. Una vez terminada la
tarea, el alumno seleccionará la opción
“Finalizar” y el sistema redirigirá al alumno a la
pantalla de selección de curso académico.
RF – 3.10 Realizar tarea del bloque
a) Se podrán realizar tareas relacionadas con el
de ejercicios
bloque de ejercicios, donde habrá ejercicios
guiados relacionados con la materia
seleccionada.
b) Esta tarea solo la podrán realizar los alumnos.
c) Los alumnos deben iniciar sesión en el sistema
para poder realizar esta tarea.
d) El alumno deberá seleccionar el curso, la
asignatura, la lección y el bloque “Ejercicios”
para poder realizar ésta tarea. Una vez
terminada la tarea, el alumno seleccionará la
opción “Finalizar” y el sistema redirigirá al
alumno a la pantalla de selección de curso
académico
RF – 3.11 Realizar autoevaluación
a) Se podrán realizar tareas relacionadas con el
bloque de autoevaluación, donde habrá
ejercicios relacionados con el bloque “Teoría” y
“Ejercicios”.
b) Esta tarea solo la podrán realizar los alumnos.
c) Los alumnos deben iniciar sesión en el sistema
para poder realizar esta tarea.
d) El alumno deberá seleccionar el curso, la
asignatura, la lección y el bloque de
“Autoevaluación” para poder realizar ésta
tarea. Una vez terminada la tarea, el alumno
seleccionará la opción “Finalizar”, el sistema
almacenará los resultados en la base de datos y
el sistema redirigirá al alumno a la pantalla de
selección de curso académico
RF – 3.12 Contenido de las tareas
a) Las tareas podrán estar formadas por varias
(Eliminado)
páginas.
RF – 3.13
44
Navegación entre
páginas de una tarea
las
a) Las tareas podrán estar formadas por varias
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
páginas. Se proporcionará un mecanismo que
permita movernos entre las páginas, tanto a la
anterior como a la siguiente.
b) Esta tarea solo la podrán realizar los alumnos.
c) Los alumnos deben iniciar sesión en el sistema
para poder realizar esta tarea.
d) Cuando el alumno seleccione la opción
“Siguiente”, el sistema mostrará en pantalla la
siguiente página de la tarea.
RF – 3.14 Retroceder a la página
a) Se proporcionará un mecanismo para
(Eliminado) anterior de una tarea
retroceder a la página anterior.
b) Esta tarea solo la podrán realizar los alumnos.
c) Los alumnos deben iniciar sesión en el sistema
para poder realizar esta tarea.
d) Cuando el alumno seleccione la opción “Atrás”,
el sistema mostrará en pantalla la anterior
página de la tarea.
RF – 3.15
Consultar ayuda
RF – 3.16
Mostrar el resultado de la
a) Al finalizar la autoevaluación, se podrán
autoevaluación
visualizar las preguntas que se han acertado y
las
que
se
han
fallado.
No se mostrará una nota numérica; en función
del número de preguntas acertadas, el sistema
mostrará uno de los siguientes mensajes:
 0 – 4: Necesitas mejorar.
 5 – 6: Bien, pero puedes mejorar.
 7: Sigue así.
 8 – 9: Muy bien.
 10: Excelente.
b) Esta tarea solo la podrán realizar los alumnos.
c) El alumno seleccionará la opción “Finalizar
autoevaluación”. El sistema, automáticamente,
comprobará los resultados ésta con los
soluciones almacenadas en la base de datos y
mostrará los aciertos, los fallos y las soluciones
a los fallos.
a) El bloque “Ejercicios” tendrá una opción de
ayuda donde se proporcione información o
“pistas” sobre la tarea.
b) Esta tarea solo la podrán realizar los alumnos.
c) El alumno debe iniciar sesión en el sistema para
poder realizar esta tarea.
d) El alumno seleccionará la opción “Ayuda” y el
sistema mostrará información o “pistas” sobre
la tarea actual.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
45
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
5.2.1.2.4 Requisitos Comunes a todos los Módulos
Código
RF – 4.01
RF – 4.02
RF – 4.03
RF – 4.04
RF – 4.05
46
RF-4.XX – Requisitos Comunes a Todos los Módulos
Nombre Requisito
Descripción del Requisito
Ayuda
a) El portal contará con un apartado de ayuda
donde se explique con claridad el
procedimiento para realizar cada una de las
tareas.
b) La ayuda deberá estar disponible para todos los
usuarios.
c) Los administradores, alumnos, profesores y
tutores deben iniciar sesión en el sistema para
poder consultar la ayuda.
Cambiar idioma del sitio
a) Se podrá cambiar el idioma predeterminado
web
del sitio web entre:
 Español
 Inglés
Iniciar sesión
a) El portal deberá tener un sistema de login para
que los usuarios se identifiquen en el sitio web.
b) Esta tarea la podrán realizar los usuarios
anónimos.
c) Se leerá el identificador y la contraseña
introducidos por el usuario anónimo y se
validarán contra la base de datos:
 Si los datos son correctos, el usuario
iniciará sesión en el sistema, éste
tendrá un usuario más conectado, y
redirigirá al usuario a su página
principal.
 Si los datos no son correctos, el usuario
no iniciará sesión en el sistema, éste no
tendrá un usuario más conectado, y se
redirigirá al usuario a la pantalla de
login, donde se mostrará un mensaje
de error indicando que los datos no son
correctos.
Cerrar sesión
a) El portal deberá tener un sistema de logout que
permita a los usuarios finalizar la sesión en el
sitio web.
b) Esta
tarea
la
podrán
realizar
los
administradores, los alumnos y los profesores.
c) Cuando el usuario seleccione la opción de
logout, el sistema cerrará la sesión, éste tendrá
un usuario menos conectado y se redirigirá al
usuario a la pantalla de login.
Recuperación
de
la
a) El sistema proporcionará un mecanismo para
contraseña de usuario
recuperar la contraseña de acceso al sitio web.
b) Esta tarea la podrán realizar los usuarios
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
anónimos.
5.2.1.3 Requisitos no Funcionales
5.2.1.3.1 Requisitos de Usuario
Código
RNF – 1.01
RNF-1.XX – Requisitos de Usuario
Nombre Requisito
Descripción del Requisito
Conocimientos previos
Para interactuar con el sitio web, no se requiere
que los usuarios de este tengan unos
conocimientos avanzados en informática; bastaría
con saber desenvolverse con soltura en Internet y
tener claros ciertos conceptos como:






Qué es un navegador y cómo funciona.
Qué es una dirección web.
Cómo acceder a una página web.
Cómo hacer una búsqueda en internet.
Qué es una aplicación web.
Etc.
5.2.1.3.2 Requisitos Tecnológicos
Código
RNF – 2.01
RNF – 2.02
RNF – 2.03
RNF – 2.04
RNF – 2.05
RNF – 2.06
RNF – 2.07
RNF-2.XX – Requisitos Tecnológicos
Nombre Requisito
Descripción del Requisito
Navegadores
El usuario deberá tener instalado el navegador
Google Chrome, versión 33.0.1750.154 m o
superior para obtener un comportamiento
completamente correcto de la aplicación.
Máquina virtual de Java
Se requiere tener instalado en el equipo Java 7
Update 45 o superior.
JavaScript
Es necesario habilitar la ejecución de JavaScript.
Servidor de aplicaciones
El sitio web se desplegará sobre un servidor Apache
Tomcat 7.0.53.
Sistema operativo del El sistema operativo de la máquina que alojará el
servidor de aplicaciones
servidor de aplicaciones será Windows 7 64 bits.
Sistema de Gestión de El sistema operativo de la máquina que alojará el
Bases de Datos (SGBD)
Sistema de Gestión de Bases de Datos (SGBD) será
Windows 7 64 bits.
Conexión a Internet
El equipo del usuario debe tener acceso a Internet.
5.2.1.3.3 Requisitos de Usabilidad
Puesto que el sitio web está dirigido a niños de entre 9 y 12 años, a la hora de desarrollarlo se
deben tener en cuenta ciertos principios de usabilidad dirigidos a este grupo de usuarios:

Se deberán emplear animaciones y sonidos, ya que niños recorren la página con el
puntero del ratón con el fin de activar los movimientos que se producen al desplazarse
por encima de los iconos, botones, dibujos, etc.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
47
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis








Se emplearán elementos llamativos y grandes: colores brillantes, botones grandes,
fuentes grandes, etc.
Los textos no deben ser largos; estos se deberán mostrar en bloques pequeños y bien
delimitados.
Se emplearán elementos de la naturaleza tales como árboles, pájaros, nieve, etc.
Los contenidos deberán estar centrados, evitando que sobretodo los niños tengan que
buscar la información.
Se deberá seguir una estructura de navegación ordenada, empleando metáforas
visuales que orienten en la navegación, y evitando los saltos de página.
Se deberá evitar que en las ventanas se tenga que hacer uso de la barra de scroll para
ver todo el contenido de ésta, y se incluirán instrucciones de uso siempre que sean
necesarias, evitando el uso de tecnicismos.
El acceso a los contenidos debe ser rápido, puesto que este perfil de usuarios tiene
menos paciencia que los adultos. Aquellos casos en los que el tiempo de carga pueda
ser mayor, se deberá informar mediante una barra de carga, de manera que quede
claro que se está trabando en la tarea.
Dado el auge de los dispositivos móviles, el sitio web deberá tener un diseño líquido
para proporcionar una correcta visualización desde dispositivos móviles.
5.2.1.3.4 Requisitos de Seguridad
Código
RNF – 3.01
RNF – 3.02
RNF – 3.03
RNF – 3.04
RNF – 3.05
RNF – 3.06
RNF-3.XX – Requisitos de Seguridad
Nombre Requisito
Descripción del Requisito
Acceso al sistema
El acceso al sistema estará protegido mediante
usuario y contraseña; los usuarios tendrán asignado
un identificado unipersonal y una contraseña para
poder acceder al sistema.
Niveles de acceso
Se garantizará que cada perfil de usuario solo tenga
acceso a las operaciones que tenga permitidas.
URLs específicas
Se evitará el acceso a URLs específicas sin que el
usuario se encuentre en sesión.
Cifrado de datos
Las contraseñas de los usuarios serán cifradas
mediante un algoritmo de encriptación MD5 o SHA1 antes de ser almacenadas en la base de datos.
LOPD
El sitio web deberá cumplir con las disposiciones
recogidas en la Ley Orgánica de Protección de
Datos.
LPI
El sitio web deberá cumplir con las disposiciones
recogidas en la Ley de Protección Intelectual.
5.2.1.3.5 Requisitos de Tiempo de Respuesta
Código
RNF – 4.01
48
RNF-4.XX – Requisitos de Seguridad
Nombre Requisito
Descripción del Requisito
Respuesta del servidor de El tiempo de respuesta de las operaciones
aplicaciones
realizadas sobre el servidor de aplicaciones debe lo
más pequeño posible. No obstante, esto también
dependerá de la calidad de la conexión de red y del
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
RNF – 4.02
5.2.2
volumen de carga del servidor.
Respuesta de la base de El tiempo de respuesta de las operaciones de
datos
lectura/escritura/consulta de la base de datos debe
ser lo más pequeño posible. No obstante, esto
también dependerá de la calidad de la conexión de
red y del volumen de carga del Sistema de Gestión
de la Base de Datos (SGBD).
Identificación de Actores del Sistema
A continuación, se describen los actores del sistema que se han identificado:




Administrador: es aquella persona responsable de la gestión de usuarios: crear,
eliminar,
modificar
y
consultar
los
datos
de
los
usuarios.
Al menos debe existir uno registrado en el sistema.
Alumno: Son aquellos usuarios que realizan las tareas y autoevaluaciones disponibles
en el sitio web.
Profesor: usuario encargado de la gestión del contenido académico: visualizar los
resultados de las autoevaluaciones, visualizar estadísticas, visualizar los intentos de
cada autoevaluación, modificar las tareas de las autoevaluaciones, etc.
Usuario anónimo: es aquella persona que aún no ha iniciado sesión en el sistema. Solo
tendrá acceso a la página principal del sitio web donde se podrá autentificar.
5.2.3

Especificación de Casos de Uso
A partir del catálogo de requisitos del apartado 5.2.1 Obtención de los Requisitos del
Sistema, se pueden extraer los siguientes casos de uso.
5.2.3.1 Gestión de Usuarios
Los siguientes casos de uso muestran las operaciones relacionadas con la gestión de los
usuarios de la aplicación web.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
49
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
Figura 5.1: Diagrama de Casos de Uso - Gestión de Usuarios.
Nombre del Caso de Uso
Crear Usuario
Descripción
El usuario administrador añadirá un usuario nuevo al sistema tras rellenar un formulario con
los datos de dicho usuario.
Nombre del Caso de Uso
Eliminar Usuario
Descripción
El usuario administrador eliminará un usuario registrado del sistema tras seleccionarlo de una
lista de usuarios.
Nombre del Caso de Uso
Consultar Usuario
Descripción
El usuario administrador visualizará los datos de un usuario registrado en el sistema tras
seleccionarlo de una lista de usuarios.
Nombre del Caso de Uso
Listar Usuarios
Descripción
El usuario administrador visualizará todos los usuarios registrados en el sistema.
50
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
Nombre del Caso de Uso
Modificar Usuario
Descripción
El usuario administrador modificará la información de un usuario registrado en el sistema tras
seleccionarlo de una lista de usuarios. Para modificar los datos del usuario, estos se mostrarán
en un campo de texto editable.
Nombre del Caso de Uso
Filtrar Usuarios
Descripción
El usuario administrador introducirá en un formulario un texto a buscar en los campos de los
usuarios que se visualizan en un listado; el sistema mostrará aquellos usuarios que contengan
en alguno de sus campos el texto introducido.
Nombre del Caso de Uso
Ordenar Usuarios
Descripción
El usuario administrador visualizará ordenados, en función del campo que seleccione, los
usuarios de un listado.
5.2.3.2 Gestión de Contenidos Académicos
Figura 5.2: Diagrama de Casos de Uso - Gestión de Contenidos Académicos.
Nombre del Caso de Uso
Listar Autoevaluaciones
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
51
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
Descripción
El usuario profesor visualizará una lista con todas las autoevaluaciones que hay registradas en
el sistema.
Nombre del Caso de Uso
Listar las Preguntas de las Autoevaluaciones
Descripción
El usuario profesor visualizará el conjunto de preguntas que forman una autoevaluación y que
están registradas en el sistema.
Nombre del Caso de Uso
Filtrar Autoevaluaciones
Descripción
El usuario profesor introducirá en un formulario un texto a buscar en los campos de las
autoevaluaciones que se visualizan en un listado; el sistema mostrará aquellas
autoevaluaciones que contengan en alguno de sus campos el texto introducido.
Nombre del Caso de Uso
Ordenar Autoevaluaciones
Descripción
El usuario profesor visualizará ordenadas, en función del campo que seleccione, las
autoevaluaciones de un listado.
Nombre del Caso de Uso
Mostrar Autoevaluación
Descripción
El usuario profesor visualizará los datos de una autoevaluación registrada en el sistema tras
seleccionarla de una lista de autoevaluaciones.
Nombre del Caso de Uso
Comentar Autoevaluación
Descripción
El usuario profesor añadirá un comentario a una autoevaluación.
Nombre del Caso de Uso
Eliminar Comentario Autoevaluación
Descripción
El usuario profesor eliminará un comentario que se añadió previamente a una
autoevaluación.
Nombre del Caso de Uso
Modificar Comentario Autoevaluación
Descripción
El usuario profesor modificará un comentario de una autoevaluación registrada en el sistema
52
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
tras seleccionarlo de una lista de autoevaluaciones. Para modificar el comentario, este se
mostrará en un campo de texto editable.
Nombre del Caso de Uso
Filtrar Preguntas
Descripción
El usuario profesor introducirá en un formulario un texto a buscar en los campos de las
preguntas de una autoevaluación que se visualizan en un listado; el sistema mostrará aquellas
preguntas que contengan en alguno de sus campos el texto introducido.
Nombre del Caso de Uso
Ordenar Preguntas
Descripción
El usuario profesor visualizará ordenadas, en función del campo que seleccione, las preguntas
de una autoevaluación.
Nombre del Caso de Uso
Modificar Pregunta
Descripción
El usuario profesor modificará el contenido didáctico de una pregunta registrada en el sistema
tras seleccionarla de una lista de preguntas. Para modificar los datos de la pregunta, éstos se
mostrarán en un campo de texto editable, a excepción del contenido didáctico. Para modificar
el contenido didáctico de la pregunta, se proporcionarán plantillas que se mostrarán en una
lista de la que el profesor tendrá que seleccionar una y deberá rellenar los campos asociados
a ésta.
Nombre del Caso de Uso
Listar Intentos de una Autoevaluación
Descripción
El usuario profesor visualizará el conjunto de intentos que los alumnos han intentado hacer
de una autoevaluación y que están registrados en el sistema.
Nombre del Caso de Uso
Ordenar Intentos de una Autoevaluación
Descripción
El usuario profesor visualizará ordenados, en función del campo que seleccione, los intentos
de realizar una autoevaluación que han hecho los usuarios alumnos y que se mostraban en un
listado.
Nombre del Caso de Uso
Filtrar Intentos de una Autoevaluación
Descripción
El usuario profesor introducirá en un formulario un texto a buscar en los campos de los
intentos de realizar una autoevaluación que han hecho los usuarios alumnos y que se
mostraban en un listado; el sistema mostrará aquellos intentos que contengan en alguno de
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
53
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
sus campos el texto introducido.
Nombre del Caso de Uso
Listar Tareas de Teoría
Descripción
El usuario profesor visualizará el conjunto de tareas de teoría que forman un bloque de teoría
y que están registradas en el sistema.
Nombre del Caso de Uso
Filtrar Tareas de Teoría
Descripción
El usuario profesor introducirá en un formulario un texto a buscar en los campos de las tareas
de teoría de los bloques de teoría que se visualizan en un listado; el sistema mostrará aquellas
tareas que contengan en alguno de sus campos el texto introducido.
Nombre del Caso de Uso
Ordenar Tareas de Teoría
Descripción
El usuario profesor visualizará ordenadas, en función del campo que seleccione, las tareas de
teoría de un bloque de teoría.
Nombre del Caso de Uso
Modificar Tarea de Teoría
Descripción
El usuario profesor modificará el contenido didáctico de una tarea de teoría registrada en el
sistema tras seleccionarla de una lista de tareas de teoría. Para modificar los datos de la tarea,
éstos se mostrarán en un campo de texto editable, a excepción del contenido didáctico. Para
modificar el contenido didáctico de la tarea, se proporcionarán plantillas que se mostrarán en
una lista de la que el profesor tendrá que seleccionar una y deberá rellenar los campos
asociados a ésta.
Nombre del Caso de Uso
Calificar Autoevaluación
Descripción
La autoevaluación es calificada automáticamente una vez el usuario alumno la ha finalizado.
54
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
5.2.3.3 Aprendizaje
Figura 5.3: Diagrama de Casos de Uso – Aprendizaje.
Nombre del Caso de Uso
Seleccionar Curso
Descripción
El usuario alumno habrá seleccionado un curso académico de entre los disponibles, que
serán: Cuarto, Quinto y Sexto.
Nombre del Caso de Uso
Seleccionar Asignatura
Descripción
El usuario alumno habrá seleccionado una asignatura de entre las disponibles, que serán:
Lengua y Literatura, Matemáticas y Ciencias Naturales.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
55
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
Nombre del Caso de Uso
Seleccionar Lección
Descripción
El usuario alumno habrá seleccionado una lección de entre las disponibles para cada curso y
asignatura.
Nombre del Caso de Uso
Seleccionar Bloque de la Lección
Descripción
El usuario alumno habrá seleccionado una lección de entre las disponibles, que serán: Teoría,
Ejercicios y Autoevaluación
Nombre del Caso de Uso
Realizar Bloque de Teoría
Descripción
Consiste en visualizar el contenido de una página de una lección del bloque de teoría. Cada
lección está formada por seis páginas.
Nombre del Caso de Uso
Realizar Bloque de Ejercicios
Descripción
Consiste en realizar un ejercicio de una lección. Cada bloque de ejercicios de una lección está
formado por seis preguntas.
Nombre del Caso de Uso
Realizar Bloque Autoevaluación
Descripción
El usuario alumno habrá realizado una autoevaluación.
Nombre del Caso de Uso
Navegar Entre las Páginas de un Bloque
Descripción
El usuario alumno se podrá mover hacia la página/pregunta siguiente, y hacia la
página/pregunta anterior de cualquiera de los bloques: Teoría, Ejercicios y Autoevaluaciones.
Nombre del Caso de Uso
Consultar Ayuda
Descripción
Las tareas del bloque de ejercicios son asistidas. El usuario alumno visualizará como resolver
el ejercicio.
56
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
5.2.3.4 Comunes
Figura 5.4: Casos de Uso Comunes a todos los Módulos.
Nombre del Caso de Uso
Iniciar Sesión
Descripción
Un usuario anónimo podrá acceder a la pantalla de inicio y loguearse en el sistema con su
nombre de usuario y contraseña.
Nombre del Caso de Uso
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
57
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
Cerrar Sesión
Descripción
El usuario administrador, profesor o alumno saldrán del sistema y serán redirigidos a la página
principal.
Nombre del Caso de Uso
Recuperar Contraseña
Descripción
Un usuario sin identificar que no recuerda el usuario o la contraseña de acceso al sistema,
podrá solicitar una nueva introduciendo la dirección de correo que proporcionó al registrarse.
Los pasos para crear la contraseña nueva se le enviarán a su correo.
Nombre del Caso de Uso
Cambiar Idioma del Sitio Web
Descripción
Cualquiera de los usuarios registrados puede cambiar el idioma del sitio web.
El sistema cambiará el idioma del sitio web. Los idiomas disponibles son Español e Inglés.
Nombre del Caso de Uso
Ayuda
Descripción
El usuario profesor y el usuario administrador visualizarán la ayuda del sitio web. Podrán
consultar como realizar cualquiera de las opciones disponibles en el sistema.
58
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
5.3 Identificación de los Subsistemas en la Fase de
Análisis
A continuación se describirán los subsistemas que componen la aplicación.
5.3.1
Descripción de los Subsistemas
En un primer nivel, la aplicación web estará dividida en tres módulos, los cuales son:
Gestión de Usuarios
En este subsistema se engloban todas las operaciones relacionadas con la gestión de usuarios:
crear usuario, eliminar usuario, modificar usuario, mostrar usuario, listar usuarios y buscar
usuarios.
Gestión de Contenidos Académicos
En este subsistema se engloban todas las operaciones relacionadas con la gestión de los
contenidos académicos: listar las autoevaluaciones creadas, listar las preguntas de las
autoevaluaciones, listar las tareas de las lecciones de teoría, listar los intentos de una
autoevaluación, mostrar la información de una autoevaluación, modificar la plantilla de una
pregunta, modificar el contenido de una pregunta de una autoevaluación, modificar la plantilla
de una tarea de teoría, modificar el contenido de una tarea de teoría, mostrar las estadísticas
de los resultados de una autoevaluación.
Aprendizaje
En este subsistema se engloban todas las operaciones relacionadas con el aprendizaje de los
alumnos: seleccionar un curso, seleccionar una asignatura, seleccionar una unidad, seleccionar
un bloque (teoría, ejercicios y autoevaluación), guardar respuestas del alumno y ver soluciones
de las preguntas de las autoevaluaciones.
En un segundo nivel se podrían identificar los siguientes subsistemas en los que estarían
divididos los módulos.
Subsistema de Presentación
Este subsistema establece un punto de comunicación entre el usuario final y la aplicación. Se
encarga de recibir las peticiones de los usuarios y realizar un filtrado para determinar si la
información recibida tiene errores. Este subsistema únicamente se comunicará con el
Subsistema de Lógica de Negocio.
Subsistema de Lógica de Negocio
En este subsistema se procesan las peticiones que recibe el subsistema de presentación. Este
subsistema se comunica, por un lado con el Subsistema de Persistencia en caso de que sea
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
59
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
necesario leer o escribir información de la base de datos, y por otro lado con el Subsistema de
Presentación para recibir una petición y devolver una respuesta.
Subsistema de Persistencia
Este subsistema se encarga de comunicar al subsistema de Lógica de Negocio con la base de
datos, siempre que sea necesario leer o escribir información en ésta.
Dentro de cada uno de los subsistemas anterior, tenemos un tercer nivel donde se pueden
identificar los siguientes subsistemas que implementan una parte concreta de la funcionalidad
del sistema.
Gestión de Autoevaluaciones
Este módulo engloba todas las operaciones relacionadas con las autoevaluaciones.
Gestión de Intentos
Este módulo engloba todas las operaciones relacionadas con los intentos que un alumno hace
de examinarse de una autoevaluación.
Gestión de Preguntas
Este módulo engloba todas las operaciones relacionadas con las preguntas de las
autoevaluaciones.
Gestión de Tareas de Teoría
Este módulo engloba todas las operaciones relacionadas con las tareas de teoría. Se denomina
tarea a cada una de las páginas de una lección.
Gestión Respuestas de Usuario
Este módulo engloba todas las operaciones relacionadas con las respuestas de los alumnos a
las preguntas de las autoevaluaciones.
Gestión de Cursos
Este módulo engloba todas las operaciones relacionadas con los cursos académicos.
Gestión de Asignaturas
Este módulo engloba todas las operaciones relacionadas con las asignaturas de los cursos
académicos.
Gestión de Lecciones
Este módulo engloba todas las operaciones relacionadas con las lecciones de una asignatura.
Gestión de Plantillas
60
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
Este módulo engloba todas las operaciones relacionadas con las plantillas de las preguntas de
las autoevaluaciones y de las tareas de teoría.
5.3.2
Descripción
de
los
Interfaces
Comunicación entre Subsistemas
de
Dentro del primer nivel de módulos identificados, no habrá una comunicación directa, aunque
si compartirán datos a través de la base de datos.
Dentro del segundo nivel de subsistemas identificados, en el Subsistema de Presentación se
empleará el patrón MVC, que separa los controladores y el modelo de la interfaz de usuario. El
encargado de gestionar esta comunicación será el framework Struts2, del que se habló en el
apartado 3.3 Frameworks. Como ya se dijo, Struts2 es un framework que implementa el patrón
MVC. El controlador StrutsPrepareAndExecuteFilter de Struts2 será el encargado de recibir las
peticiones que se desencadenen desde las vistas y delegar en los diferentes Action la tarea de
procesar los datos recibidos.
La comunicación entre el Subsistema de Presentación y el Subsistema de Lógica de Negocio
será local. Se empleará el patrón AbstractFactory para que sirva de punto de entrada entre
estos dos subsistemas, de manera que estén totalmente desacoplados. Lo mismo sucederá con
la comunicación entre el Subsistema de Lógica de Negocio y el Subsistema de Persistencia.
Por último, decir que la comunicación entre el Subsistema de Persistencia y la base de datos
será a través del driver JDBC.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
61
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
5.4 Análisis de Casos de Uso y Escenarios
En este apartado se detallan, por medio de sus escenarios, los casos de uso identificados en el
apartado 5.2.3 Especificación de Casos de Uso. Estos escenarios describirán las interacciones
de los usuarios con el sistema de una forma más ampliada en aquellos casos en los que se
requiera. Los casos de uso más obvios no se detallarán.
5.4.1
Casos de Uso del Módulo “Gestión de
Usuarios”
A continuación se muestran los casos de uso que requieren de una descripción ampliada para
dejar más clara su funcionalidad ya que pueden generarse escenarios alternativos.
De los casos de uso del módulo “Gestión de Usuarios”, no se considera necesario ampliar la
descripción de los marcados en rojo ya que no se aportaría información adicional (no
presentan escenarios alternativos o son muy simples). A continuación se enumeran dichos
casos de uso:







Crear Usuario
Filtrar Usuario
Ordenar Usuario
Listar Usuarios
Consultar Usuario
Eliminar Usuario
Modificar Usuario
5.4.1.1 Crear Usuario
Figura 5.5: Diagrama de robustez - Crear usuario
62
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
Crear Usuario
Precondiciones
Poscondiciones
Actores
Descripción
El usuario en sesión tiene el perfil de administrador.
Hay un usuario más almacenado en la base de datos.
Iniciado y terminado por el administrador.
El administrador:
1. El usuario administrador accede a la página de registro de un
nuevo usuario.
2. Rellenará los datos del formulario.
3. Se creará el usuario.
4. Se almacenará el usuario en la base de datos.
5. Se visualizará un mensaje que confirme que el usuario se ha
creado correctamente.

Variaciones
(escenarios
secundarios)


Excepciones

Escenario Alternativo 1: El administrador deja campos
obligatorios en blanco.
o Se marcan los campos obligatorios en rojo.
o Se muestra un mensaje indicando que los campos en
rojo son obligatorios.
o Volver al paso 2 del escenario principal.
Escenario Alternativo 2: El formulario de entrada contiene
errores de validación.
o Se marcan en rojo los campos con errores de validación.
o Se muestra un mensaje notificando que los datos de los
campos en rojo son incorrectos.
o Volver al paso 2 del escenario principal
El DNI del usuario que se quiere registrar ya está almacenado
en el sistema:
o Se informa al administrador de que el DNI del usuario
que se pretende almacenar ya está registrado en la
base de datos.
o Se redirige al administrador al punto 1 del escenario
principal.
La base de datos no está disponible: No se puede almacenar el
nuevo usuario en la base de datos.
o Se muestra al administrador un error descriptivo.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
63
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
5.4.1.2 Modificar Usuario
Figura 5.6: Diagrama de robustez - Modificar usuario.
Modificar Usuario
Precondiciones
Poscondiciones
Actores
Descripción
El usuario en sesión tiene el perfil de administrador.
Se ha seleccionado un usuario.
El usuario a modificar ya existe en la base de datos.
Los datos del usuario han sido actualizados en la base de datos.
Iniciado y terminado por el administrador.
El administrador:
1. El usuario administrador accede a la página con los detalles del
usuario a modificar.
2. Se recuperan los datos del usuario.
3. El usuario administrador cambia el contenido de los datos que
considere necesario.
4. Se almacena el usuario en la base de datos.
5. Se visualizará un mensaje que confirme que el usuario se ha
actualizado correctamente.

Variaciones
(escenarios
secundarios)
64

Escenario Alternativo 1: El administrador deja campos
obligatorios en blanco.
o Se marcan los campos obligatorios en rojo.
o Se muestra un mensaje indicando que los campos en
rojo son obligatorios.
o Volver al paso 2 del escenario principal.
Escenario Alternativo 2: El formulario de entrada contiene
errores de validación.
o Se marcan en rojo los campos con errores de validación.
o Se muestra un mensaje notificando que los datos de los
campos en rojo son incorrectos.
o Volver al paso 2 del escenario principal
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños

Excepciones
5.4.2
La base de datos no está disponible: No se puede almacenar el
usuario actualizado en la base de datos.
o Se muestra al administrador un error descriptivo.
Casos de Uso del Módulo “Aprendizaje”
A continuación se muestran los casos de uso que requieren de una descripción ampliada para
dejar más clara su funcionalidad ya que pueden generarse escenarios alternativos.
De los casos de uso del módulo “Aprendizaje”, no se considera necesario ampliar la
descripción de los marcados en rojo ya que no se aportaría información adicional (no
presentan escenarios alternativos o son muy simples). A continuación se enumeran dichos
casos de uso:









Seleccionar Curso
Seleccionar Asignatura
Seleccionar Lección
Seleccionar Bloque de la Lección
Realizar Bloque de Teoría
Realizar Autoevaluación
Navegar Entre las Páginas de un Bloque
Realizar Bloque de Ejercicios
Consultar Ayuda
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
65
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
5.4.2.1 Realizar Bloque de Teoría
Figura 5.7: Diagrama de robustez - Realizar bloque Teoría.
Realizar Bloque de Teoría
Precondiciones
Poscondiciones
Actores
Descripción
El usuario en sesión tiene el perfil de alumno.
Se ha seleccionado un curso, una asignatura y una lección.
El usuario alumno realiza un bloque de teoría.
Iniciado y terminado por el alumno.
El alumno:
1. El usuario alumno selecciona el bloque Teoría.
2. El sistema obtiene el path donde se encuentran las tareas del
bloque.
3. El usuario alumno realiza las tareas de teoría (lee las páginas de
la lección de teoría).
4. El usuario alumno selecciona la opción terminar.
5. El sistema redirige al alumno a la página de inicio.
6. Se muestra la página de inicio.
Variaciones
(escenarios
secundarios)

Escenario Alternativo 1: El alumno recarga la página antes de
terminar.
o Se redirige al alumno a la página de inicio.
Excepciones

La base de datos no está disponible: No se puede recuperar la
ruta donde se almacenar las tareas del bloque.
66
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
o
o
Se muestra al alumno un error descriptivo.
Se redirige al alumno a la página de inicio.
5.4.2.2 Realizar Autoevaluación
En este caso de uso se entiende como escenario principal aquel en el que el alumno quiere ver
las soluciones correctas.
Figura 5.8: Diagrama de robustez - Realizar Autoevaluación.
Realizar Autoevaluación
Precondiciones
Poscondiciones
Actores
Descripción
El usuario en sesión tiene el perfil de alumno.
Se ha seleccionado un curso, una asignatura y una lección.
El usuario alumno realiza una autoevaluación.
Se han almacenado las respuestas del usuario en la base de datos
Iniciado y terminado por el alumno.
El alumno:
1. El usuario alumno selecciona el bloque Autoevaluación.
2. El sistema obtiene el path donde se encuentran las preguntas
dela autoevaluación.
3. El alumno realiza las preguntas.
4. El alumno termina la autoevaluación.
5. El sistema obtiene las respuestas de las preguntas.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
67
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
6. El sistema envía las respuestas del usuario para almacenarlas en
la base de datos.
7. El sistema pregunta al alumno si quiere ver las soluciones.
8. El sistema muestra la solución de cada pregunta.
9. El alumno termina la revisión.
10. El sistema redirige el alumno a la página de inicio.

Variaciones
(escenarios
secundarios)


Excepciones
Escenario Alternativo 1: El alumno recarga la página antes de
terminar.
o Se redirige al alumno a la página de inicio.
Escenario Alternativo 2: El alumno no quiere ver las soluciones.
o Se redirige al usuario a la página de inicio.
La base de datos no está disponible: No se puede recuperar la
ruta donde se almacenan las preguntas de la autoevaluación, no
se pueden recuperar las soluciones correctas y no se pueden
guardar las respuestas del usuario.
o Se muestra al alumno un error descriptivo.
o Se redirige al alumno a la página de inicio.
5.4.2.3 Realizar Bloque de Ejercicios
Figura 5.9: Diagrama de robustez – Realizar bloque Ejercicios.
68
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
Realizar Bloque de Ejercicios
Precondiciones
Poscondiciones
Actores
Descripción
Variaciones
(escenarios
secundarios)
Excepciones
El usuario en sesión tiene el perfil de alumno.
Se ha seleccionado un curso, una asignatura y una lección.
El usuario alumno realiza un bloque de ejercicios.
Iniciado y terminado por el alumno.
El alumno:
1. El usuario alumno selecciona el bloque Ejercicios.
2. El sistema obtiene el path donde se encuentran las tareas del
bloque.
3. El usuario alumno realiza los ejercicios.
4. El usuario alumno selecciona la opción terminar.
5. El sistema redirige al alumno a la página de inicio.
6. Se muestra la página de inicio.

Escenario Alternativo 1: El alumno recarga la página antes de
terminar.
o Se redirige al alumno a la página de inicio.

La base de datos no está disponible: No se puede recuperar la
ruta donde se almacenar las tareas del bloque.
o Se muestra al alumno un error descriptivo.
o Se redirige al alumno a la página de inicio.
5.4.3
Casos de Uso del Módulo “Gestión de
Contenidos Académicos”
A continuación se muestran los casos de uso que requieren de una descripción ampliada para
dejar más clara su funcionalidad ya que pueden generarse escenarios alternativos.
De los casos de uso del módulo “Gestión de Contenidos Académicos”, no se considera
necesario ampliar la descripción de los marcados en rojo ya que no se aportaría información
adicional (no presentan escenarios alternativos o son muy simples). A continuación se
enumeran dichos casos de uso:










Listar Autoevaluaciones
Listar las Preguntas de las Autoevaluaciones
Filtrar Autoevaluaciones
Ordenar Autoevaluaciones
Mostrar Autoevaluación
Comentar Autoevaluación
Eliminar Autoevaluación
Modificar Comentario Autoevaluación
Filtrar Preguntas
Modificar Pregunta
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
69
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis









Ordenar Pregunta
Filtrar Intentos de una Autoevaluación
Ordenar Intentos de una Autoevaluación
Listar Intentos de una Autoevaluación
Ordenar Tareas Teoría
Filtrar Tareas Teoría
Listar Tareas Teoría
Modificar Tareas Teoría (Es el mismo proceso que para modificar una pregunta).
Calificar Autoevaluación
5.4.3.1 Comentar Autoevaluación
Figura 5.10: Diagrama de robustez – Comentar autoevaluación.
Comentar autoevaluación
Precondiciones
Poscondiciones
Actores
Descripción
70
El usuario en sesión tiene el perfil de profesor.
Se han listado todas las autoevaluaciones.
La autoevaluación tiene un comentario más.
Iniciado y terminado por el profesor.
El profesor:
1. El usuario profesor selecciona la autoevaluación que quiere
comentar.
2. Se obtienen los datos de la autoevaluación.
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
Variaciones
(escenarios
secundarios)
3.
4.
5.
6.
Se muestran los datos de la autoevaluación.
El usuario profesor añade un comentario.
Se crea un comentario y se almacena en la base de datos.
Se redirige al usuario profesor a la página de detalle de la
autoevaluación.

Escenario Alternativo 1: El profesor recarga la página antes de
terminar.
o Se redirige al profesor a la página de inicio.
Escenario Alternativo 2: El usuario profesor cancela la
operación.
o Se vuelve al punto 3 del escenario principal.


Excepciones
La base de datos no está disponible: No se pueden obtener los
datos de la autoevaluación ni se puede almacenar el nuevo
comentario.
o Se muestra al profesor un error descriptivo.
o Se redirige al profesor a la página de inicio.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
71
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
5.4.3.2 Modificar Comentario Autoevaluación
Figura 5.11: Diagrama de robustez – Modificar Comentario Autoevaluación.
Modificar Comentario Autoevaluación
Precondiciones
Poscondiciones
Actores
Descripción
72
El usuario en sesión tiene el perfil de profesor.
Se ha seleccionado una autoevaluación de un listado.
El comentario de la autoevaluación ha sido actualizado en la base de
datos.
Iniciado y terminado por el profesor.
El profesor:
1.
2.
3.
4.
Se muestra los detalles de una autoevaluación.
Se obtienen los datos de la autoevaluación.
Se muestran los datos de la autoevaluación.
El usuario profesor selecciona el comentario que quiere
modificar.
5. Se modifica el comentario.
6. Se guardar los cambios en la base de datos.
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
7. Se muestran los datos de la autoevaluación.

Variaciones
(escenarios
secundarios)


Excepciones
Escenario Alternativo 1: El profesor recarga la página antes de
terminar.
o Se redirige al profesor a la página de inicio.
Escenario Alternativo 2: El usuario profesor cancela la
operación.
o Se vuelve al punto 3 del escenario principal.
La base de datos no está disponible: No se pueden obtener los
datos de la autoevaluación ni se puede almacenar el nuevo
comentario.
o Se muestra al profesor un error descriptivo.
o Se redirige al profesor a la página de inicio.
5.4.3.3 Modificar Pregunta
Figura 5.12: Diagrama de robustez - Modificar Pregunta.
Modificar Pregunta
Precondiciones
El usuario en sesión tiene el perfil de profesor.
Se ha seleccionado una pregunta y se han cargado los datos de dicha
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
73
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
Poscondiciones
Actores
Descripción
pregunta.
La plantilla de la pregunta ha cambiado.
El contenido de la pregunta ha cambiado.
Iniciado y terminado por el profesor.
El profesor:
1. El usuario profesor selecciona una plantilla nueva.
2. Se carga la ruta de la nueva plantilla y se muestra al usuario.
3. El usuario profesor rellena los huecos con el contenido que
considere adecuado.
4. El usuario guarda los cambios.
5. Se guarda el nuevo contenido de la pregunta en la JSP de dicha
pregunta.
6. Se almacena la respuesta de la pregunta en la base de datos.
7. Se redirige al profesor al listado de preguntas.

Variaciones
(escenarios
secundarios)


Excepciones
5.4.4
Escenario Alternativo 1: El profesor recarga la página antes de
terminar.
o Se redirige al profesor a la página de inicio.
Escenario Alternativo 2: El usuario profesor cancela la
operación.
o Se redirige al usuario al lista de preguntas.
La base de datos no está disponible: No se puede recuperar la
ruta donde se almacena la JSP de la pregunta, no se puede
recuperar la ruta donde se almacena la plantilla y no se puede
almacenar la nueva respuesta.
o Se muestra al profesor un error descriptivo.
o Se redirige al profesor a la página de inicio.
Casos de Uso Comunes
A continuación se muestran los casos de uso que requieren de una descripción ampliada para
dejar más clara su funcionalidad. De los casos de uso comunes, no se considera necesario
ampliar la descripción de los marcados en rojo ya que no se aportaría información adicional. A
continuación se enumeran dichos casos de uso:





74
Iniciar sesión
Cerrar sesión
Recuperar contraseña
Ayuda
Cambiar Idioma del Sitio Web
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
5.4.4.1 Iniciar Sesión
Figura 5.13: Diagrama de robustez - Iniciar sesión
Iniciar Sesión
Precondiciones
Poscondiciones
Actores
Descripción
El usuario está registrado en el sistema.
El usuario/a está logueado/a en el sistema.
Usuario anónimo y Profesor, Alumno o Administrador.
El profesor:
1. El usuario anónimo accede a la página de login del sitio web.
2. Rellenará la información necesaria para loguearse en el sistema.
3. Se realiza el proceso de validación de los datos introducidos
contra la base de datos.
4. Se redirige al usuario a la página principal.
5. Se muestra un mensaje de bienvenida.

Variaciones
(escenarios
secundarios)
Excepciones


Escenario Alternativo 1: Inicio de sesión erróneo porque faltan
campos obligatorios.
o Notificar al usuario el problema.
o Volver al paso 1 del escenario principal.
Escenario Alternativo 2: El usuario o la contraseña son
incorrectos.
o Se notifica el problema al usuario sin dar detalles de
cuál es el campo erróneo para no dar detalles por
motivos de seguridad.
o Volver al paso 1 del escenario principal
La base de datos no está disponible: No se pueden obtener
usuarios ni contraseñas.
o Se muestra al administrador un error descriptivo.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
75
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
5.5 Análisis del Sistema de Gestión de Bases de
Datos
5.5.1
Sistemas de Gestión de Bases de Datos
Durante mucho tiempo, las bases de datos relacionales han dominado el mundo de los datos,
sin embargo, durante los últimos años, se está percibiendo cierta proliferación en el empleo de
desarrollos NoSQL dentro de la comunidad informática. Dicha situación nos sitúa ante la
tesitura de tener que abordar la toma de una decisión preliminar al desarrollo del proyecto. La
primera decisión que se debe tomar antes de comenzar con el desarrollo del proyecto, es
decidir cómo se almacenarán y administrarán los datos del sistema; si se empleará un modelo
relacional, o si por el contrario se optará por una base de datos no relacional.
Como explicábamos en el párrafo anterior, durante años las bases de datos relacionales han
dado soporte a gran parte de las aplicaciones. Cuando se manejan grandes volúmenes de
datos y se tienen miles de usuarios concurrentes, estos sistemas pueden presentar problemas
de rendimiento, que pueden comprometer la funcionalidad y operatividad del sistema. Dichos
problemas, pueden ser solventados mediante un escalado vertical, es decir, añadiendo más
recursos a un solo nodo del sistema, o, a través de un escalado horizontal, agregando más
nodos al sistema; el problema es que las bases de datos relacionales no se adaptan por
completo a este modelo.
Ante la dificultad plantada aparecen las bases de datos NoSQL, sistemas de almacenamiento
que permiten gestionar un gran volumen de datos, y pueden proporcionar una respuesta más
rápida, ya que tienen la posibilidad de almacenar en memoria toda la información necesaria.
Esta no se encuentra centralizada, como ocurre en la mayoría de las bases de datos
relacionales, puesto que las plataformas NoSQL operan de manera distribuida, lo que facilita el
escalado horizontal.
Las bases de datos relacionales y no relacionales, difieren en varios aspectos. Algunos de los
más relevantes que podemos citar son, por ejemplo, que el lenguaje de consulta no sigue el
estándar SQL propio de las bases de datos relacionales, o que tampoco requieren estructuras
fijas como son las tablas para almacenar los datos; pueden ser almacenados otros formatos
como clave-valor, grafos o documentos.
Sin embargo, estos sistemas a menudo no ofrecen garantías de que los datos serán
almacenados correctamente, pues las propiedades ACID (atomicidad, consistencia, aislamiento
y durabilidad) son sacrificadas en pro de una mayor accesibilidad a los datos. En
contraposición, estas bases de datos suelen implementar lo que se conoce como consistencia
eventual, la cual garantiza que la base de datos es consistente cuando no se hayan modificado
los datos durante un periodo de tiempo suficientemente extenso.
76
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
5.5.2
Estudio de Alternativas
A continuación, se presentarán algunas de las alternativas que se han barajado en el estudio,
teniendo siempre en cuenta que todas ellas debían poseer licencias de tipo Open Source para
ser empleadas en el vigente proyecto.
5.5.2.1 Bases de Datos Relacionales
5.5.2.1.1 MySQL
MySQL [es un sistema de gestión de bases de datos relacional, multihilo y multiusuario con más
de seis millones de instalaciones. MySQL AB -desde enero de 2008 una subsidiaria de Sun
Microsystems y ésta a su vez de Oracle Corporation desde abril de 2009- desarrolla MySQL
como software libre en un esquema de licenciamiento dual.
Por un lado se ofrece bajo la GNU GPL para cualquier uso compatible con esta licencia, pero
para aquellas empresas que quieran incorporarlo en productos privativos deben comprar a la
empresa una licencia específica que les permita este uso. Está desarrollado en su mayor parte
en ANSI C.] [Wikipedia14F].
A continuación, se presentan algunas de las principales características de este gestor de bases
de datos:
[












Usa GNU Automake, Autoconf, y Libtool para portabilidad.
Uso de multihilos mediante hilos del kernel.
Usa tablas en disco b-tree) muy rápidas con compresión de índice.
Tablas hash en memoria temporales
El código MySQL se prueba con Purify (un detector de memoria perdida comercial) así
como con Valgrind, una herramienta GPL.
Completo soporte para operadores y funciones en cláusulas select y where.
Completo soporte para cláusulas group by y order by, soporte de funciones de
agrupación
Seguridad: ofrece un sistema de contraseñas y privilegios seguro mediante verificación
basada en el host y el tráfico de contraseñas está cifrado al conectarse a un servidor.
Soporta gran cantidad de datos. MySQL Server tiene bases de datos de hasta 50
millones de registros.
Se permiten hasta 64 índices por tabla (32 antes de MySQL 4.1.2). Cada índice puede
consistir desde 1 hasta 16 columnas o partes de columnas. El máximo ancho de límite
son 1000 bytes (500 antes de MySQL 4.1.2).
Los clientes se conectan al servidor MySQL usando sockets TCP/IP en cualquier
plataforma. En sistemas Windows se pueden conectar usando named pipes y en
sistemas Unix usando ficheros socket Unix.
En MySQL 5.0, los clientes y servidores Windows se pueden conectar usando memoria
compartida.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
77
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis

MySQL contiene su propio paquete de pruebas de rendimiento proporcionado con el
código fuente de la distribución de MySQL.
] [Wikipedia14F].
5.5.2.1.2 PostgreSQL
PostgreSQL [es un sistema de gestión de bases de datos objeto-relacional, distribuido bajo
licencia BSD y con su código fuente disponible libremente. Es el sistema de gestión de bases de
datos de código abierto más potente del mercado y en sus últimas versiones no tiene nada que
envidiarle a otras bases de datos comerciales.
PostgreSQL utiliza un modelo cliente/servidor y usa multiprocesos en vez de multihilos para
garantizar la estabilidad del sistema. Un fallo en uno de los procesos no afectará el resto y el
sistema continuará funcionando.”+ [Martínez10].
A continuación, se presentan las características generales de este gestor de bases de datos:
[



















Es una base de datos 100% ACID
Integridad referencial
Tablespaces
Nested transactions (savepoints)
Replicación asincrónica/sincrónica / Streaming replication - Hot Standby
Two-phase commit
PITR - point in time recovery
Copias de seguridad en caliente (Online/hot backups)
Unicode
Juegos de caracteres internacionales
Regionalización por columna
Multi-Version Concurrency Control (MVCC)
Multiples métodos de autentificación
Acceso encriptado via SSL
Actualización in-situ integrada (pg_upgrade)
SE-postgres
Completa documentación
Licencia BSD
Disponible para Linux y UNIX en todas sus variantes (AIX, BSD, HP-UX, SGI IRIX, Mac OS
X, Solaris, Tru64) y Windows 32/64bit.
] [Martínez10].
78
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
5.5.2.1.3 MySQL vs PostgreSQL
A continuación, expondremos un análisis de las principales características que se han tenido en
cuenta a la hora de la elección del SGBD (Sistema de Gestión de Bases de Datos, en lo sucesivo
en el texto la expresión se abreviará como SGDB).
Rendimiento
MySQL posee una mayor velocidad de respuesta cuando se opera sobre bases de datos que no
son de una gran envergadura, y las consultas lanzadas sobre esta son simples. Sin embargo,
cuando se manejan grandes volúmenes de datos, el tiempo de respuesta se incrementa
notablemente, más en el caso de tratarse de consultas complejas. En cambio, el rendimiento
de una base de datos PostgreSQL es constante, resultando su empleo menos indicado cuando
se trabaja con volúmenes de datos pequeños, pero más adecuado cuando se manejan
cantidades de datos sobre la que se lanzan consultas que involucran el empleo de varias
tablas.
En conclusión, el empleo de un SGDB PostgreSQL resulta más adecuado que el de un sistema
MySQL cuando la carga de trabajo es alta.
Transacciones ACID e Integridad Referencial
PostgreSQL soporta transacciones ACID (Atomicidad, Consistencia, Aislamiento y Durabilidad)
y tiene integridad referencial. Sin embargo, en el caso de MySQL, no siempre es así. Por
defecto, MyISAM -el motor de almacenamiento de MySQL- no soporta ambas características.
No obstante, existen otros tipos de motores de almacenamiento que si lo hacen como es el
caso de InnoDB. El problema es que este no es, ni tan rápido como MyISAM, ni tan potente
como PostgreSQL, por lo que termina siendo más eficiente utilizar esta última.
Escalabilidad Horizontal y Vertical
Ambos presentan ciertas características para facilitar la escalabilidad horizontal. PostgreSQL
tiene algunas opciones como PL/Proxy, pgPool2 y Bucardo. Mientras que, MySQL Clúster tiene
la posibilidad de escalar horizontalmente para satisfacer cargas de trabajo intensivas. Sin
embargo, PostgreSQL tiene una mejor escalabilidad vertical; puede ajustarse al número de
CPUs y a la cantidad de memoria disponible de forma óptima.
Licenciamiento
A pesar de que ambos sistemas son Open Source, MySQL está distribuido bajo una licencia
más restrictiva. Está basado en una licencia GNU GPL, la cual obliga a los productos derivados
que lo incluyan a distribuirse bajo ese mismo marco legal. De lo contrario, deberán adquirir
para ello una licencia específica.
Por su parte, PostgreSQL se basa en licenciamiento BSD, el cual permite que los productos que
la empleen, puedan ser distribuidos con fines comerciales.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
79
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
5.5.2.2 Bases de Datos No Relacionales
Aunque existen varias tipos de modelos de bases de datos NoSQL, normalmente se suelen
clasificar en cuatro tipos:




Orientadas a documentos.
Orientadas a columnas.
De clave valor.
De Grafo.
de entre los cuales, los que mejor encajan para almacenar los datos del presente proyecto son
los orientados a documentos y los orientados a columnas.
Las bases de datos orientadas a columnas, ofrecen una velocidad de lectura alta. Sin embargo,
no son muy eficientes cuando el número de escrituras que se espera realizar es muy elevado:
[ganamos mucha velocidad en lecturas, ya que si queremos consultar un número reducido de
columnas, es muy rápido hacerlo. Al final tenemos una base muy parecida a las key-value. Por
otro lado, este paradigma no es muy eficiente para realizar escrituras. Por ello este tipo de
soluciones es usado en aplicaciones con un índice bajo de escrituras pero muchas lecturas.].
[Camacho10].
Por el contrario, las bases de datos orientadas a documentos [son las bases de datos NoSQL
más versátiles] [Camacho10]; ofrecen [un gran performance y escalabilidad sin perder del todo
los beneficios del modelo relacional.] [Camacho10].
Teniendo en cuenta lo anterior, puesto que se tiene previsto que el número de escrituras sea
elevado, en el estudio se compararán bases de datos que sigan un modelo orientado a
documentos.
5.5.2.2.1 MongoDB
MongoDB [(de la palabra en inglés “humongous” que significa enorme) es un sistema de base
de datos NoSQL orientado a documentos, desarrollado bajo el concepto de código abierto.
MongoDB forma parte de la nueva familia de sistemas de base de datos NoSQL. En vez de
guardar los datos en tablas como se hace en las base de datos relacionales, MongoDB guarda
estructuras de datos en documentos tipo JSON con un esquema dinámico (MongoDB llama ese
formato BSON), haciendo que la integración de los datos en ciertas aplicaciones sea más fácil y
rápida.] [Wikipedia15G].
A continuación, se presentan algunas de las principales características de este sistema:
[




80
Ausencia de transacciones. *…+
Escalabilidad horizontal. *…+
Almacenamiento Orientado a documentos (BSON). *…+
Soporte a Querys dinámicas. *…+
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños






Indexación de Documentos. *…+
Índices Geoespaciales. *…+
Análisis de Rendimiento de Queries. *…+
GridFS. *…+
Replicación de Datos. *…+
Implementación de Auto Sharding.
] [García13].
5.5.2.2.2 Apache CouchDB
Apache CouchDB [ es un gestor de bases de datos de código abierto, cuyo foco está puesto en
la facilidad de su uso y en ser "una base de datos que asume la web de manera completa". Se
trata de una base de datos NoSQL que emplea JSON para almacenar los datos, JavaScript como
lenguaje de consulta por medio de MapReduce y HTTP como API. Una de sus características
más peculiares es la facilidad con la que permite hacer replicaciones. CouchDB fue liberada por
primera vez en 2005, transformándose en un proyecto Apache en 2008.] [Wikipedia15H].
A continuación, se presentan algunas de las principales características de este sistema:
[







Almacenamiento de documentos (JSON). *…+
Semántica ACID. *…+
Vistas e índices Map/Reduce. *…+
Arquitectura distribuida con replicación. *…+
Interfaz REST. *…+
Consistencia Eventual. *…+
Hecha para operar offline. *…+
] [Wikipedia15H].
5.5.2.2.3 MongoDB vs Apache CouchDB
A continuación, expondremos un pequeño análisis de las principales características que se han
tenido en cuenta a la hora de la elección del Sistema de Gestión de Bases de Datos (en
adelante, SGBD).
Rendimiento
MongoDB presenta un mejor rendimiento de inserción que CouchDB [Sotolongo13].
Capacidad de Consulta
Tanto MongoDB como CouchDB soportan funciones MapReduce, el cual *“proporciona un
sistema de procesamiento de datos paralelo y distribuido.”+ [Olmedo12]. Sin embargo, a
diferencia de Apache CouchDB, MongoDB soporta consultas dinámicas, por lo que no es
necesario definir las consultas antes de ejecutarlas.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
81
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
Por otro lado, MongoDB cuenta con una aplicación de línea de comandos fácil de utilizar,
desde la que se pueden realizar varias operaciones como insertar o consultar datos. Además,
también permite la posibilidad de utilizar una interfaz web desde la que se puede comprobar
el estado de la bases de datos. En cuanto a CouchDB, también cuenta con una interfaz web
(Futon) desde donde se puede administrar la base de datos. Sin embargo, esta no puede ser
administrada desde un Shell; es necesario instalar una herramienta como curl que pueda
manejar el protocolo HTTP desde línea de comandos.
Replicación
Ambos sistemas soportan la replicación maestro-esclavo, lo que permite que el maestro pueda
realizar operaciones de lectura y escritura mientras el esclavo copia la información que se
encuentra almacenada en el maestro y solo es necesaria para operaciones de lectura o copias
de seguridad. Sin embargo, CouchDB cuenta además con un algoritmo de resolución de
conflictos bidireccional que permite evitar los problemas de consistencia de la información.
Fragmentación
En MongoDB se puede tener la información fragmentada en varios nodos, ya que permite la
fragmentación nativa de la información a través del mecanismo autosharding. Este mecanismo
delega a MongoDB la separación y recombinación de los datos, y la tarea de asegurar que
estos van al servidor correcto. Sin embargo, CouchDB no posee ningún método nativo de
fragmentación de los datos, aunque pueden emplearse aplicaciones intermedias utilizando el
mecanismo de consultas Map/Reduce.
Esta característica facilita la escalabilidad horizontal de las bases de datos.
Almacenamiento
MongoDB utiliza BSON (Binary-JSON) para almacenar la información; un formato abierto
basado en JSON que permite el manejo de datos binarios. Además, hace uso de la
especificación de almacenamiento y recuperación de archivos GridFS, mediante el cual,
cuando un archivo supera los 16 MB, en lugar de almacenarlo en un solo documento, lo divide
en una colección de documentos.
Por su parte, CouchDB almacena la información en formato JSON (JavaScript Object Notation,
en adelante se abreviará en el texto como JSON), empleando el concepto de adjunto
(attachment) cuando se quieren almacenar datos binarios.
5.6 Análisis de Interfaces de Usuario
5.6.1
Descripción de la Interfaz
En sistema existirán dos tipos de interfaces, uno para el módulo de los alumnos y otro para los
módulos de los profesores y los administradores.
82
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
El principal objetivo a la hora de diseñar la interfaz, será mantener una estructura común en
todas las interfaces, de manera que el usuario pueda familiarizarse con ésta rápidamenteA continuación se muestra el diseño que se pretende realizar en el módulo de aprendizaje:
Figura 5.14: Interfaz módulo "Aprendizaje" - Vista 1.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
83
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
Figura 5.15: Interfaz módulo "Aprendizaje" - Vista 2.
Como se puede apreciar, se trata de una interfaz muy sencilla, pues está dirigida a niños de 9 a
12 años.
En el módulo del alumno se distinguirán dos diseños similares, en los que solo cambiará el
contenido de la parte central de la página. El primer diseño será donde se le pregunta al
usuario la información del curso, la asignatura, la unidad y el bloque que quiere estudiar. El
segundo diseño será el que se emplee a la hora de realizar las tareas:



Bloque “Autoevaluaciones”. Se mostrarán las preguntas.
Bloque “Ejercicios”. Se mostrarás los ejercicios.
Bloque “Teoría”. Se mostrarás las tareas de teoría.
En ellos se pueden distinguir dos partes:


84
Un título en la parte superior, donde se mostrarán en el caso del primer diseño las
preguntas pertinentes para recabar la información de qué quiere estudiar el alumno;
en el caso del segundo diseño será donde se muestre el título de la lección que se está
estudiando.
Una parte central:
o En la primera vista servirá para mostrar las opciones que puede seleccionar en
cada momento el alumno: curso, asignatura, unidad y bloqueo En la segunda vista se empleará para mostrar las preguntas del bloque
“Autoevaluación” y del bloque “Ejercicios”; y para mostrar las tareas del
bloque “Teoría”.
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
Veremos ahora el diseño para los módulos “Gestión de Usuarios” y “Gestión de Contenidos
Académicos”:
Figura 5.16: Interfaz módulos "Gestión de Usuarios" y "Gestión de contenidos Académicos".
Como se puede apreciar en la imagen anterior, se trata de un diseño común en los sitios web:




Cabecera. Se mostrará el título del sitio web, el tipo de usuario que ha iniciado sesión y
los botones para cambiar de idioma y para cerrar sesión.
Menú. Se mostrarán las distintas opciones que pueden realizar el profesor y el
administrador.
Cuerpo. Zona donde se mostrarán los contenidos.
Pié de página. En principio no se tiene pensado poner nada, pero se reserva una zona
del diseño por si en un futuro es necesario añadir algo.
5.6.2
Descripción
Interfaz
del
Comportamiento
de
la
El sistema contará con varios formularios que se han de validar. Para ello, se realizarán
validaciones de los datos tanto en el lado del cliente como en el servidor. Para las validaciones
del lado del cliente se empleará JavaScript, mientras que para validar los datos procedentes de
los formularios en el lado del servidor se empleará el método validate de Struts2, el cual se
encarga de comprobar si los datos son correctos y devolver un mensaje de error en caso de
que no lo sean.
Los errores de validación se mostrarán con un mensaje en rojo junto al campo donde se han
producido, indicando cuál ha sido el motivo del error.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
85
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
5.6.3
Diagrama de Navegabilidad
Para facilitar la comprensión del diagrama de navegabilidad, se ha dividido en 4 partes más
sencillas:




Un primer diagrama del redireccionamiento que se hace desde la página de login a los
distintos homes de cada tipo de usuario.
Un segundo diagrama de navegabilidad del módulo “Aprendizaje”.
Un tercer diagrama de navegabilidad del módulo “Gestión de Usuarios”.
Un cuarto diagrama de navegabilidad del módulo “Gestión de Contenidos
Académicos”.
A continuación se muestra el primer diagrama; en él se ve cómo se redirecciona a cada tipo de
usuario a un home diferente en función de su perfil:
Figura 5.17: Diagrama de navegabilidad – Parte I.
Seguido se muestra el diagrama de navegabilidad del módulo “Aprendizaje”.
86
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
Figura 5.18: Diagrama de navegabilidad – Parte II.
El siguiente es el diagrama de navegabilidad del módulo “Gestión de Usuarios”:
Figura 5.19: Diagrama de navegabilidad – Parte III.
Por último, se muestra el diagrama del módulo “Gestión de Contenidos Académicos”:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
87
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
Figura 5.20: Diagrama de navegabilidad - Parte IV.
88
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
5.7 Especificación del Plan de Pruebas
Como último apartado del análisis, se detalla a continuación el conjunto de pruebas que se
realizarán para verificar que el sistema funciona correctamente. Estas pruebas estarán
divididas en cuatro tipos:





Pruebas unitarias: Pruebas realizadas a la unidad mínima de cada uno de los módulos que
forman el sistema.
Pruebas de integración: Estas pruebas verifican la integración entre los módulos una vez
estén todos ensamblados, de manera que nos permita determinar si funcionan
correctamente en conjunto.
Pruebas de integración: con estas pruebas se verifica la correcta integración de cada uno
de los componentes del sistema final.
Pruebas del sistema: Estas pruebas verifican el correcto funcionamiento del sistema
completo.
Pruebas de usabilidad y accesibilidad: En el caso del módulo de los alumnos, pretende
determinar si la interfaz diseñada cumple con las reglas básicas establecidas para el rango
de edades para el que está dirigido el presente proyecto. En el caso de los módulos de los
profesores y los administradores, se determinarán cosas como si el posicionamiento de los
menús es correcto, si los campos obligatorios de los formularios están marcados y se
informa de qué información solicitan y para qué, si la navegación entre apartados es
adecuada, si el tamaño de los elementos se visualiza correctamente, si se proporciona una
descripción para las imágenes, etc. en definitiva, se tratará de determinar el grado de
satisfacción del usuario con el sistema.
Para realizar el plan de pruebas, nos basaremos en los casos de uso que se detallaron en el
apartado 5.2.3 Especificación de Casos de Uso.
Este plan de pruebas se debe considerar como el mínimo de pruebas que debe pasar el
sistema antes de ser entregado, ya que es probable que en la fase de implementación se
realicen aún más pruebas de las que se detallan a continuación.
5.7.1
Pruebas Unitarias
5.7.1.1 Crear Usuario
Caso de Uso 1: Crear Usuario
Prueba
Crear
un
usuario
no
existente.
Prueba
Crear un usuario que ya
existe.
Prueba
Cancelar la Operación.
Resultado Esperado
El sistema posee un usuario más.
Resultado Esperado
El sistema no posee un usuario más y se muestra un dialogo
notificándolo.
Resultado Esperado
El sistema permanece sin cambios.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
89
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
5.7.1.2 Eliminar Usuario
Caso de Uso 2: Eliminar Usuario
Prueba
Resultado Esperado
Eliminar un usuario existente. El sistema posee un usuario menos.
Prueba
Resultado Esperado
Eliminar un usuario que no El sistema no realiza cambios y muestra un mensaje de error.
existe.
Prueba
Resultado Esperado
Cancelar la Operación.
El sistema permanece sin cambios.
5.7.1.3 Modificar Usuario
Caso de Uso 3: Modificar Usuario
Prueba
Resultado Esperado
Modificar
un
usuario El sistema modificará las propiedades del usuario indicado.
existente.
Prueba
Resultado Esperado
Modificar un usuario que no El sistema no realiza cambios y muestra un mensaje de error.
existe.
Prueba
Resultado Esperado
Cancelar la Operación.
El sistema permanece sin cambios.
5.7.1.4 Consultar Usuario
Caso de Uso 4: Consultar Usuario
Prueba
Resultado Esperado
Visualizar los datos de un El sistema muestra los datos del usuario seleccionado.
usuario
5.7.1.5 Listar Usuarios
Caso de Uso 5: Listar Usuarios
Prueba
Resultado Esperado
Visualizar el listado de El sistema muestra un listado con el conjunto de usuarios
usuarios existentes.
dados de alta en el sistema.
5.7.1.6 Ordenar Usuarios
Caso de Uso 6: Ordenar Usuarios
Prueba
Resultado Esperado
Ordenar, por una columna, el El sistema muestra un listado ordenado, de acuerdo a la
listado
de
usuarios columna seleccionada, de los usuarios dados de alta en la
existentes.
aplicación.
90
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
5.7.1.7 Filtrar Usuarios
Caso de Uso 7: Filtrar Usuarios
Prueba
Resultado Esperado
Introducir un parámetro de El sistema muestra un listado con los usuarios registrados que
búsqueda.
contengan en alguno de sus campos el texto introducido.
5.7.1.8 Listar Autoevaluaciones
Caso de Uso 8: Listar Autoevaluaciones
Prueba
Resultado Esperado
Visualizar el listado de El sistema muestra un listado con el conjunto de
autoevaluaciones existentes. autoevaluaciones registradas en la aplicación.
5.7.1.9 Listar Preguntas de una Autoevaluación
Caso de Uso 9: Listar Preguntas de una Autoevaluación
Prueba
Resultado Esperado
Visualizar el listado de El sistema muestra un listado con el conjunto de preguntas
preguntas asociadas a una registradas en la aplicación que están asociadas a una
autoevaluación.
autoevaluación.
5.7.1.10
Filtrar Autoevaluaciones
Caso de Uso 10: Filtrar Autoevaluaciones
Prueba
Resultado Esperado
Introducir un parámetro de El sistema muestra un listado con las autoevaluaciones
búsqueda.
registradas que contengan en alguno de sus campos el texto
introducido.
5.7.1.11
Ordenar Autoevaluaciones
Caso de Uso 11: Ordenar Autoevaluaciones
Prueba
Resultado Esperado
Ordenar, por una columna, el El sistema muestra un listado ordenado, de acuerdo a la
listado de autoevaluaciones columna seleccionada, de las autoevaluaciones dadas de alta
existentes.
en la aplicación.
5.7.1.12
Mostrar Autoevaluación
Caso de Uso 12: Mostrar Autoevaluación
Prueba
Resultado Esperado
Visualizar los datos de una El sistema muestra los datos de la autoevaluación
autoevaluación.
seleccionada.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
91
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
5.7.1.13
Comentar Autoevaluación
Caso de Uso 13: Comentar Autoevaluación
Prueba
Resultado Esperado
Añadir un comentario a una La autoevaluación seleccionada posee un comentario más.
autoevaluación seleccionada.
5.7.1.14
Eliminar Comentario de una Autoevaluación
Caso de Uso 14: Eliminar Comentario de una Autoevaluación
Prueba
Resultado Esperado
Eliminar un comentario de La autoevaluación seleccionada posee un comentario menos.
una
autoevaluación
seleccionada.
5.7.1.15
Modificar el Comentario de una Autoevaluación
Caso de Uso 15: Modificar el Comentario de una Autoevaluación
Prueba
Resultado Esperado
Modificar un comentario de El comentario de la autoevaluación seleccionada ha sido
una
autoevaluación modificado.
seleccionada.
5.7.1.16
Modificar Pregunta
Caso de Uso 16: Modificar Pregunta
Prueba
Resultado Esperado
Modificar la plantilla y el La plantilla de la pregunta y el contenido de ésta han sido
contenido de una pregunta modificados.
seleccionada.
5.7.1.17
Filtrar Pregunta
Caso de Uso 17: Filtrar Pregunta
Prueba
Resultado Esperado
Introducir un parámetro de El sistema muestra un listado con las preguntas registradas
búsqueda.
que contengan en alguno de sus campos el texto introducido.
5.7.1.18
Ordenar Pregunta
Caso de Uso 18: Ordenar Pregunta
Prueba
Resultado Esperado
Ordenar, por una columna, el El sistema muestra un listado ordenado, de acuerdo a la
listado
de
preguntas columna seleccionada, de las preguntas registradas en la
existentes.
aplicación.
92
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
5.7.1.19
Filtrar Intentos de una Autoevaluación
Caso de Uso 19: Filtrar Intentos de una Autoevaluación
Prueba
Resultado Esperado
Introducir un parámetro de El sistema muestra un listado con los intentos de realización
búsqueda.
de una autoevaluación que hay almacenados en el sistema y
que contengan en alguno de sus campos el texto introducido.
5.7.1.20
Ordenar Intentos de una Autoevaluación
Caso de Uso 20: Ordenar Intentos de una Autoevaluación
Prueba
Resultado Esperado
Ordenar, por una columna, el El sistema muestra un listado ordenado, de acuerdo a la
listado de intentos de columna seleccionada, de los intentos de realización de una
realización
de
una autoevaluación almacenados en la base de datos.
autoevaluación almacenados
en el sistema
5.7.1.21
Listar Intentos de una Autoevaluación
Caso de Uso 21: Listar Intentos de una Autoevaluación
Prueba
Resultado Esperado
Visualizar el listado de El sistema muestra un listado con el conjunto de intentos de
intentos de realización de realización de una autoevaluación.
una
autoevaluación
seleccionada.
5.7.1.22
Listar Tareas Teoría
Caso de Uso 22: Listar Tareas Teoría
Prueba
Resultado Esperado
Visualizar el listado de tareas El sistema muestra un listado con el conjunto de tareas de
de teoría asociadas a una teoría registradas en la aplicación que están asociadas a un
autoevaluación.
bloque de teoría determinado.
5.7.1.23
Ordenar Tareas Teoría
Caso de Uso 23: Ordenar Tareas Teoría
Prueba
Resultado Esperado
Ordenar, por una columna, el El sistema muestra un listado ordenado, de acuerdo a la
listado de tareas de teoría columna seleccionada, de las tareas de teoría existentes en la
existentes.
aplicación.
5.7.1.24
Filtrar Tareas Teoría
Caso de Uso 24: Filtrar Tareas Teoría
Prueba
Resultado Esperado
Introducir un parámetro de El sistema muestra un listado con las tareas de teoría
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
93
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
búsqueda.
5.7.1.25
registradas que contengan en alguno de sus campos el texto
introducido.
Modificar Tarea Teoría
Caso de Uso 25: Modificar Tarea Teoría
Prueba
Resultado Esperado
Modificar la plantilla y el La plantilla de la tarea y el contenido de ésta han sido
contenido de una tarea de modificados.
teoría seleccionada.
5.7.1.26
Calificar Autoevaluación
Caso de Uso 26: Calificar Autoevaluación
Prueba
Resultado Esperado
Finalizar una autoevaluación. Al finalizar una autoevaluación, el sistema debe contabilizar el
número de preguntas acertadas, falladas y en blanco.
Posteriormente debe insertarlas en la base de datos como un
intento de autoevaluación más. El sistema tendrá un intento
de autoevaluación más.
5.7.1.27
Seleccionar Curso
Caso de Uso 27: Seleccionar Curso
Prueba
Resultado Esperado
Seleccionar curso.
El sistema mostrará las asignaturas registradas para el curso
seleccionado.
5.7.1.28
Seleccionar Asignatura
Caso de Uso 28: Seleccionar Asignatura
Prueba
Resultado Esperado
Seleccionar asignatura.
El sistema mostrará las lecciones registradas para la
asignatura seleccionada.
5.7.1.29
Seleccionar Lección
Caso de Uso 29: Seleccionar Lección
Prueba
Resultado Esperado
Seleccionar lección.
El sistema mostrará los bloques disponibles para la lección
seleccionada.
5.7.1.30
Seleccionar Bloque
Caso de Uso 30: Seleccionar Bloque
Prueba
Resultado Esperado
Seleccionar bloque de teoría. El sistema mostrará la primera página de la lección
94
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
Prueba
Seleccionar
bloque
ejercicios.
Prueba
Seleccionar
bloque
autoevaluación.
5.7.1.31
seleccionada (lección asociada a una asignatura y a un curso).
Resultado Esperado
de El sistema mostrará el primer ejercicio de la lección
seleccionada (lección asociada a una asignatura y a un curso).
Resultado Esperado
de El sistema mostrará la primera pregunta de la lección
seleccionada (lección asociada a una asignatura y a un curso).
Realizar Tarea de Teoría
Caso de Uso 31: Realizar Tarea de Teoría
Prueba
Resultado Esperado
Ampliar imagen.
El sistema mostrará ampliada la imagen seleccionada.
5.7.1.32
Realizar Autoevaluación
Caso de Uso 32: Realizar Autoevaluación
Prueba
Resultado Esperado
Guardar respuesta de una El sistema almacenará la respuesta de la pregunta.
pregunta.
Prueba
Resultado Esperado
Dejar una pregunta en El sistema almacenará como respuesta el resultado en blanco
blanco.
para esa pregunta.
5.7.1.33
Navegar Entre las Páginas de un Bloque
Caso de Uso 33: Navegar Entre las Páginas de un Bloque
Prueba
Resultado Esperado
Avanzar de página.
El sistema pasará a la página siguiente.
Prueba
Resultado Esperado
Avanzar de pregunta.
El sistema pasará a la pregunta siguiente.
Prueba
Resultado Esperado
Retroceder de página.
El sistema pasará a la página anterior.
Prueba
Resultado Esperado
Retroceder de pregunta.
El sistema pasará a la pregunta anterior.
5.7.1.34
Consultar Ayuda
Caso de Uso 34: Consultar Ayuda
Prueba
Resultado Esperado
Consultar la ayuda de un El sistema mostrará una pista de cómo solucionar el ejercicio.
ejercicio del bloque de
ejercicios.
5.7.1.35
Mostrar el Resultado de una Autoevaluación
Caso de Uso 35: Mostrar el Resultado de una Autoevaluación
Prueba
Resultado Esperado
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
95
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
Ver resultados.
Prueba
No ver resultados.
5.7.1.36
El sistema mostrará las preguntas correctas e incorrectas y
las soluciones de aquellas que sean incorrectas.
Resultado Esperado
El sistema redirigirá al usuario a la página de inicio.
Consultar Ayuda
Caso de Uso 36: Consultar Ayuda
Prueba
Resultado Esperado
Finalizar autoevaluación.
El sistema enviará los resultados de la autoevaluación al
servidor.
5.7.1.37
Iniciar Sesión
Caso de Uso 37: Iniciar Sesión
Prueba
Iniciar sesión con un usuario
dado de alta.
Prueba
Iniciar sesión con un usuario
no dado de alta.
Prueba
Dejar el campo nombre
usuario
en
blanco
e
introducir la contraseña.
Prueba
Dejar el campo contraseña
en blanco e introducir el
nombre de usuario.
Prueba
Dejar en blanco los campos
nombre de usuario y
contraseña.
5.7.1.38
Resultado Esperado
El sistema no tendrá un usuario más conectado y mostrará un
mensaje de error indicando que el usuario o la contraseña
son incorrectos.
Resultado Esperado
El sistema no tendrá un usuario más conectado y mostrará un
mensaje de error indicando que el campo usuario no puede
estar en blanco.
Resultado Esperado
El sistema no tendrá un usuario más conectado y mostrará un
mensaje de error indicando que el campo contraseña no
puede estar en blanco.
Resultado Esperado
El sistema no tendrá un usuario más conectado y mostrará un
mensaje de error indicando los campos nombre de usuario y
contraseña no pueden estar en blanco.
Cerrar Sesión
Caso de Uso 38: Cerrar Sesión
Prueba
El usuario selecciona la
opción de cerrar la sesión.
Prueba
El usuario deja la sesión
inactiva.
5.7.1.39
Resultado Esperado
El sistema tendrá un usuario más conectado.
Resultado Esperado
El sistema cierra la sesión del usuario y tendrá un usuario
menos conectado.
Resultado Esperado
El sistema cierra la sesión del usuario y tendrá un usuario
menos conectado.
Cambiar el Idioma del Sitio Web
Caso de Uso 39: Cambiar el Idioma del Sitio Web
96
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Análisis | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
Prueba
Cambiar el idioma a inglés.
Prueba
Cambiar el idioma a español.
Prueba
Cambiar el idioma a inglés
estando ya en inglés.
Prueba
Cambiar el idioma a español
estando ya en español.
5.7.1.40
Resultado Esperado
El sistema no cambiará el idioma de la aplicación.
Ayuda
Caso de Uso 40: Ayuda
Prueba
Seleccionar la ayuda.
5.7.1.41
Resultado Esperado
El sistema cambiará el idioma de la aplicación web a inglés.
Resultado Esperado
El sistema cambiará el idioma de la aplicación web a español.
Resultado Esperado
El sistema no cambiará el idioma de la aplicación.
Resultado Esperado
El sistema mostrará la información de la ayuda.
Recuperar Contraseña
Caso de Uso 41: Recuperar Contraseña
Prueba
Resultado Esperado
Recuperar contraseña de un El sistema enviará al correo electrónico del usuario las
usuario existente.
instrucciones para recuperar la contraseña.
Prueba
Resultado Esperado
Recuperar contraseña de un El sistema mostrará un mensaje indicando que se ha enviado
usuario no existente.
la contraseña al correo del usuario para no dar pista de que el
usuario no existe.
5.7.2
Pruebas de Integración y Sistema
Prueba
Añadir
un
usuario
administrador.
Prueba
Añadir un usuario alumno.
Prueba
Añadir un usuario profesor.
Prueba
Realizar una autoevaluación.
Prueba
Realizar una autoevaluación y
dejar 5 preguntas en blanco.
Prueba
Modificar el contenido de
una pregunta de una
autoevaluación y acceder
como usuario alumno a esa
Resultado Esperado
El usuario solo tiene acceso al módulo “Gestión de Usuario”.
Resultado Esperado
Es usuario solo tiene acceso al módulo “Aprendizaje”.
Resultado Esperado
El usuario solo tiene acceso al módulo “Gestión de
Contenidos Académicos”.
Resultado Esperado
El sistema ha almacenado las respuestas en la base de datos.
Resultado Esperado
El sistema almacena las respuestas del usuario en la base de
datos de las cuales 5 están en blanco.
Resultado Esperado
El sistema ha modificado el contenido de la pregunta, ha
almacenado la respuesta de la pregunta en la base de datos y
se visualiza el nuevo contenido de la pregunta en el módulo
del alumno.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
97
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Análisis
autoevaluación.
Prueba
Modificar el contenido de un
ejercicio del bloque de
ejercicios y acceder al
sistema
como
usuario
alumno a ese bloque.
Prueba
Modificar el contenido de
una tarea de teoría y acceder
al sistema como usuario
alumno a esa tarea del
bloque de teoría.
Prueba
Acceder
como
usuario
profesor y comprobar que
hay al menos un intento de
realización
de
una
autoevaluación
(el
que
hicimos
en
pruebas
anteriores).
Prueba
Comprobar las estadísticas
de
la
autoevaluación
realizada en la prueba
número cinco.
5.7.3
Resultado Esperado
El sistema ha modificado el contenido del ejercicio, ha
almacenado la respuesta del ejercicio en la base de datos y se
visualiza el nuevo contenido del ejercicio en el módulo del
alumno.
Resultado Esperado
El sistema ha modificado el contenido de la tarea y se
visualiza el nuevo contenido del ejercicio en el módulo del
alumno.
Resultado Esperado
El sistema muestra los datos de un intento de realización de
una autoevaluación.
Resultado Esperado
El sistema muestra que se han dejado 5 preguntas en blanco
en esa autoevaluación.
Pruebas de Rendimiento
Prueba
Resultado Esperado
Conexión de 20 usuarios de El sistema no se cae y los tiempo de carga no son elevados.
forma simultánea.
98
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Capítulo 6. Diseño del Sistema
6.1 Arquitectura del Sistema
6.1.1
Diagramas de Paquetes
Como puede apreciarse en la imagen inferior, se utilizará un diseño en tres capas
(presentación, lógica de negocio y persistencia), junto con el patrón AbstractFactory. Con esto
conseguimos que cada capa esté desacoplada y se pueda realizar una implementación en
paralelo –aunque como vimos en el apartado 4.1 Planificación, se seguirá una implementación
secuencial porque el desarrollo lo realizará una sola persona-.
A continuación se muestra el diagrama de paquetes con los principales paquetes del sistema.
Figura 6.1: Diagrama de paquetes.
6.1.1.1 Paquete com.jfh.elearning.filter
Contiene la clase destinada a filtrar y codificar en UTF-8 los datos de todas las peticiones
entrantes.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
99
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Diseño del Sistema
6.1.1.2 Paquete com.jfh.elearning.presentation
Este paquete contiene todas las clases que extienden de la clase ActionSupport. Se encargan
de procesar las peticiones entrantes que delega en ellos el controlador
“StrutsPrepareAndExecuteFilter” de Struts2.
Este paquete contiene a su vez paquetes que agrupan las clases según su funcionalidad:







com.jfh.elearning.presentation.attemp. Contiene las clases con funcionalidad
relacionada con los intentos de realización de una autoevaluación.
com.jfh.elearning.presentation.selfevaluation. Contiene todas las clases con
funcionalidad relacionada con las autoevaluaciones.
com.jfh.elearning.presentation.taskselfevaluation. Contiene las clases con
funcionalidad relacionada con las tareas (preguntas) de una autoevaluación.
com.jfh.elearning.presentation.tasktheoryblock. Contiene todas las clases con
funcionalidad relacionada con las tareas (páginas) de las lecciones teóricas del bloque
de teoría.
com.jfh.elearning.presentation.template. Contiene las clases con funcionalidad
relacionada con las plantillas.
com.jfh.elearning.presentation.user. Contiene todas las clases con funcionalidad
relacionada con los usuarios.
com.jfh.elearning.presentation.useranswer. Contiene las clases con funcionalidad
relacionada con las respuestas de los usuarios a las preguntas de las autoevaluaciones.
Cabe recordar que se ha empleado la inyección de dependencias por medio de anotaciones
para inyectar los Bean en cada una de las clases de los paquetes enumerados.
6.1.1.3 Paquete com.jfh.elearning.util
Contiene las clases con utilidades que se utilizan desde la lógica de la aplicación.
6.1.1.4 Paquete com.jfh.elearning.model
Este paquete contiene el modelo de la aplicación.
6.1.1.5 Paquete com.jfh.elearning.business.*
Paquete que contiene la lógica de negocio de la aplicación.
A su vez, dentro podemos encontrar los siguientes paquetes:

100
com.jfh.elearning.bussiness.interfaz*. Contiene las operaciones a realizar por cada
uno de los elementos del modelo de la aplicación. A su vez, este paquete se divide en
paquetes para agrupar la funcionalidad. Estos paquetes serían:
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
o

com.jfh.elearning.bussiness.interfaz.attemps. Contiene las clases con
funcionalidad relacionada con los intentos de realización de una
autoevaluación.
o com.jfh.elearning.bussiness.interfaz.lesson. Contiene las clases con
funcionalidad relacionada con unidades de un curso.
o com.jfh.elearning.bussiness.interfaz.selfevaluation. Contiene todas las clases
con funcionalidad relacionada con las autoevaluaciones.
o com.jfh.elearning.bussiness.interfaz.subject. Contiene las clases con
funcionalidad relacionada con las asignaturas de un curso.
o com.jfh.elearning.bussiness.interfaz.taskselfevaluation. Contiene las clases
con funcionalidad relacionada con las tareas (preguntas) de una
autoevaluación.
o com.jfh.elearning.bussiness.interfaz.tasktheorytask. Contiene todas las clases
con funcionalidad relacionada con las tareas (páginas) de las lecciones teóricas
del bloque de teoría.
o com.jfh.elearning.bussiness.interfaz.template. Contiene las clases con
funcionalidad relacionada con las plantillas.
o com.jfh.elearning.bussiness.interfaz.user. Contiene todas las clases con
funcionalidad relacionada con los usuarios.
o com.jfh.elearning.bussiness.interfaz.username. Contiene las clases con
funcionalidad relacionada con las respuestas de los usuarios a las preguntas de
las autoevaluaciones.
o com.jfh.elearning.bussiness.interfaz.year.
Contiene
las
clases
con
funcionalidad relacionada con los cursos académicos.
com.jfh.elearning.bussiness.impl*. Contiene las implementaciones definidas en las
interfaces del paquete com.jfh.elearning.bussiness.interfaz. Al igual que con el
paquete de interfaces, este paquete contiene paquetes que agrupan funcionalidad;
estos serían (se omite la descripción de cada paquete ya que es la misma que la de la
interfaz):
o com.jfh.elearning.bussiness.impl.attemps.
o com.jfh.elearning.bussiness.impl.lesson.
o com.jfh.elearning.bussiness.impl.selfevaluation.
o com.jfh.elearning.bussiness.impl.subject.
o com.jfh.elearning.bussiness.impl.taskselfevaluation.
o com.jfh.elearning.bussiness.impl.tasktheorytask.
o com.jfh.elearning.bussiness.impl.template.
o com.jfh.elearning.bussiness.impl.user.
o com.jfh.elearning.bussiness.impl.username.
o com.jfh.elearning.bussiness.impl.year.
Cabe recordar que se ha empleado la inyección de dependencias por medio de anotaciones
para inyectar los Bean en las clases que implementan las interfaces.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
101
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Diseño del Sistema
6.1.1.6 Paquete com.jfh.elearning.persistence.*
Contiene los DAO donde se definen las operaciones de acceso a la base de datos. Al igual que
el paquete com.jfh.elearning.pesistence, se distinguen dos paquetes dentro de éste que a su
vez contendrán más paquetes que agrupan funcionalidad


com.jfh.elearning.pesistence.interfaz. Paquete donde se definen las interfaces con las
operaciones de cada Bean. A su vez, este paquete contiene los siguientes paquetes (se
omite la descripción de cada paquete ya que es la misma que la de la capa de lógica
de negocio):
o com.jfh.elearning.pesistence.interfaz.attemps.
o com.jfh.elearning.pesistence.interfaz.lesson.
o com.jfh.elearning.pesistence.interfaz.selfevaluation.
o com.jfh.elearning.pesistence.interfaz.subject.
o com.jfh.elearning.pesistence.interfaz.taskselfevaluation.
o com.jfh.elearning.pesistence.interfaz.tasktheorytask.
o com.jfh.elearning.pesistence.interfaz.template.
o com.jfh.elearning.pesistence.interfaz.user.
o com.jfh.elearning.pesistence.interfaz.username.
o com.jfh.elearning.pesistence.interfaz.year.
com.jfh.elearning.bussiness.impl. Paquete que contiene las clases que implementan
las interfaces definidas en el paquete com.jfh.elearning.bussiness.interfaz. A su vez,
este paquete contiene los siguientes paquetes (se omite la descripción de cada
paquete ya que es la misma que la de la capa de lógica de negocio):
o com.jfh.elearning.pesistence.impl.attemps.
o com.jfh.elearning.pesistence.impl.lesson.
o com.jfh.elearning.pesistence.impl.selfevaluation.
o com.jfh.elearning.pesistence.impl.subject.
o com.jfh.elearning.pesistence.impl.taskselfevaluation.
o com.jfh.elearning.pesistence.impl.tasktheorytask.
o com.jfh.elearning.pesistence.impl.template.
o com.jfh.elearning.pesistence.impl.user.
o com.jfh.elearning.pesistence.impl.username.
o com.jfh.elearning.pesistence.impl.year.
Cabe recordar que para el acceso a los datos se ha empleado la clase JdbcTemplate de Spring.
6.1.2
Diagramas de Componentes
En el diagrama que se muestra a continuación pueden observarse los componentes del
sistema:
102
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 6.2: Diagrama de Componentes.
Podemos ver como los diferentes módulos del sistema reciben las peticiones HTTP de un
navegador web (en este caso se ha puesto Google Chrome, Internet Explorer y Mozilla
Firefox). Estos módulos van a estar desplegados en un servidor web (que en este caso será
Apache Tomcat) y se comunicarán con el Sistema de Gestión de Bases de Datos (en adelante
SGBD) a través del driver JDBC (se empleará JDBCTemplate, que encapsula todos los detalles
generales y repetitivos de la API JDBC como son: establecer los datos de la conexión, abrir la
conexión, crear un ResulSet para leer los datos, iterar los resultados, cerrar el ResulSet, cerrar
la conexión, gestionar las excepciones, etc.).
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
103
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Diseño del Sistema
6.1.3
Diagramas de Despliegue
Figura 6.3: Diagrama de Despliegue.
Una vez finalizada la implementación del sistema, esta será la estructura que tenga. A
continuación se describen cada una de las partes del diagrama.
Navegador Web
Se trata del elemente que sirve de comunicación entre el usuario y la aplicación web. Se
encarga de realizar las peticiones del usuario al servidor a través del protocolo HTTP.
PC
Este elemento representa el ordenador donde se encuentra instalado el servidor Apache
Tomcat y el Sistema de gestión de Bases de Datos PostgreSQL.
Apache Tomcat
Servidor de aplicaciones donde se desplegará la aplicación web.
elearning.war
104
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Se trata del contenedor que sirve para distribuir la aplicación web. Contiene todo lo necesario
para poder ejecutar la aplicación Java.
librerías.jar
Representa el conjunto de librerías que necesita el sistema para poder funcionar. Estas
librerías serán comunes a todos los módulos del sistema. Para ver el conjunto de estas librerías
se puede consultar el sitio web que se generará con Apache Maven y que se adjuntará con la
presente documentación.
Módulo Aprendizaje
Como su propio nombre indica, se trata del módulo “Aprendizaje”, destinado a los alumnos en
el que podrán realizar diversas actividades para estudiar. Este módulo se comunicará con la
base de datos a través del protocolo TCP/IP.
Módulo Gestión de Contenidos Académicos
Como su propio nombre indica, se trata del módulo “Gestión de Contenidos Académicos”,
destinado a que los profesores puedan gestionar el contenido de estudio que utilizan los
alumnos en el módulo “Aprendizaje”. Este módulo se comunicará con la base de datos a través
del protocolo TCP/IP.
Módulo Gestión de Usuarios
Como su propio nombre indica, se trata del módulo “Gestión de Usuarios”, destinado a la
gestión de usuarios: crear usuarios, eliminar usuarios, modificar usuarios, etc. Este módulo se
comunicará con la base de datos a través del protocolo TCP/IP.
PostgreSQL
Se trata del sistema de Sistema de Gestión de Bases de Datos que se empleará en el sistema y
que alojará la base de datos.
Base de Datos
Este elemento representa la base de datos donde se alojan los datos de la aplicación web.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
105
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Diseño del Sistema
6.2 Diseño de Clases
6.2.1
Diagrama de Clases
6.2.1.1 Diagrama de Clases Global
A continuación se muestra un trozo del diagrama global de clases que correspondería al
sistema. Con él, se pretende describir la relación existente entre las clases de cada uno de los
paquetes y la forma en que se comunican cada una de las capas. Se omitirán los detalles de las
funciones y atributos, con este diagrama se pretende mostrar al lector el flujo de código, para
ver en detalle cada una de las clases consultar los diagramas de clases de cada uno de los
paquetes que se muestran en los apartados siguientes.
Ilustración 1: Fragmento del diagrama de clases global.
Como se puede apreciar en la imagen anterior, tendremos una clase *Action en la que el
controlador StrutsPrepareAndExecuteFilter del framework Struts2 delegue el procesamiento
de las peticiones entrantes. En esta clase Action (InsertUserAction en este caso) se crea el
106
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
elemento del modelo (en este caso User) y se procede a insertarlo en la base de datos a través
del DAO correspondiente (en este caso UserDAOImpl).
A continuación se describen las clases que componen cada uno de los paquetes. En este
apartado solo se mostrarán los diagramas de clases a nivel de paquete para no realizar
diagramas demasiado robustos.
6.2.1.2 Diagrama de Clases del Paquete com.jfh.elearning.filter
Figura 6.4: Diagrama de clases del paquete com.jfh.elearning.filter.
Como se puede apreciar en la imagen anterior, este paquete es muy simple, solo contiene la
clase destinada a filtrar y codificar en UTF-8 los datos de todas las peticiones entrantes.
6.2.1.3 Diagrama
de
Clases
com.jfh.elearning.presentation
del
Paquete
Como dijimos en el apartado 6.1.1.2 com.jfh.elearning.presentacion, este paquete contiene a
su vez paquetes que agrupan las clases según su funcionalidad. A continuación veremos los
diagramas de paquetes de cada uno de estos.
Podremos apreciar que entre las clases de los paquetes contenidos en
com.jfh.elearning.presentation no hay ninguna relación entre ellas, solo se relacionan con los
elementos del modelo correspondiente y con la capa de business. Este comportamiento lo
pudimos apreciar en el diagrama global (Vista – Action (Controlador) – Modelo > Business >
Persistencia).
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
107
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Diseño del Sistema
6.2.1.3.1 Diagrama
de
Clases
com.jfh.elearning.presentation.attemp
del
Paquete
Figura 6.5: Diagrama de clasees del paquete com.jfh.elearning.presentation.attemp
Contiene las clases con funcionalidad relacionada con los intentos de realización de una
autoevaluación.
108
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
6.2.1.3.2 Diagrama
de
Clases
del
com.jfh.elearning.presentation.selfevaluation
Paquete
Figura 6.6: Diagrama de clases del paquete com.jfh.elearning.presentation.selfevaluation.
Contiene todas las clases con funcionalidad relacionada con las autoevaluaciones.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
109
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Diseño del Sistema
6.2.1.3.3 Diagrama
de
Clases
del
com.jfh.elearning.presentation.taskselfevaluation
Paquete
Figura 6.7: Diagrama de clases del paquete
com.jfh.elearning.presentation.taskselfevaluation.
Contiene las clases con funcionalidad relacionada con las tareas (preguntas) de una
autoevaluación.
110
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
6.2.1.3.4 Diagrama
de
Clases
del
com.jfh.elearning.presentation.tasktheoryblock
Paquete
Figura 6.8: Diagrama de clases del paquete com.jfh.elearning.presentation.tasktheoryblock.
Contiene todas las clases con funcionalidad relacionada con las tareas (páginas) de las
lecciones teóricas del bloque de teoría.
6.2.1.3.5 Diagrama
de
Clases
com.jfh.elearning.presentation.template
del
Paquete
Figura 6.9: Diagrama de clases del paquete com.jfh.elearning.presentation.template.
Contiene las clases con funcionalidad relacionada con las plantillas.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
111
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Diseño del Sistema
6.2.1.3.6 Diagrama
de
Clases
com.jfh.elearning.presentation.user
del
Paquete
Figura 6.10: Diagrama de clases del paquete com.jfh.elearning.presentation.user.
Contiene todas las clases con funcionalidad relacionada con los usuarios.
112
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
6.2.1.3.7 Diagrama
de
Clases
elearning.presentation.user.login
del
Paquete
com.jfh.
Figura 6.11: Diagrama de clases del paquete com.jfh.elearning.presentation.user.login
Este paquete contiene toda la funcionalidad relacionada con el login. La clase LoginInterceptor
es la encargada de interceptar las peticiones entrantes para comprobar si el usuario está
metido en la sesión. La clase LoginAction es el controlador encargado de validad el usuario
contra la base de datos y finalmente, la clase LoginLocaleAction es una clase empleada para
redireccionar al usuario cuando cambia el idioma de la página de login.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
113
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Diseño del Sistema
6.2.1.3.8 Diagrama
de
Clases
com.jfh.elearning.presentation.useranswer
del
Paquete
Figura 6.12: Diagrama de clases del paquete com.jfh.elearning.presentation.useranswer.
Contiene las clases con funcionalidad relacionada con las respuestas de los usuarios a las
preguntas de las autoevaluaciones.
6.2.1.4 Diagrama de Clases del Paquete com.jfh.elearning.util
Figura 6.13: Diagrama de clases del paquete com.jfh.elearning.util.
114
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Contiene las clases con utilidades que se utilizan desde la lógica de la aplicación.
6.2.1.5 Diagrama de Clases del Paquete com.jfh.elearning.model
Este paquete contiene el modelo de la aplicación.
Dado que el diagrama de clases de este paquete es demasiado grande, se dividirá en varias
partes para poder apreciarlo mejor:
Figura 6.14: Diagrama de clases del paquete com.jfh.elearning.model – Parte I
Figura 6.15: Diagrama de clases del paquete com.jfh.elearning.model – Parte II
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
115
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Diseño del Sistema
Figura 6.16: Diagrama de clases del paquete com.jfh.elearning.model – Parte III
6.2.1.6 Diagrama de Clases del Paquete com.jfh.elearning.business.*
Como habíamos dicho en el apartado 6.1.1.5 com.jfh.elearning.business, este paquete
contiene la lógica de negocio de la aplicación.
A su vez, éste contiene más paquetes que agrupan funcionalidad, algo que habíamos dicho
también en el apartado 6.1.1.5 com.jfh.elearning.business. Para simplificar el diagrama de
clases del paquete -ya que las clases no tendrán relación entre ellas- se muestran todas las
clases en un mismo diagrama (se muestra el diagrama de clases del paquete
com.jfh.elearning.business.impl; se omite el del paquete com.jfh.elearning.business.interfaz ya
que sería igual, con la excepción de que cada clase de implementación tiene el atributo de la
interfaz que da acceso a la capa de persistencia):
116
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 6.17: Diagrama de clases del paquete com.jfh.elearning.business.*
6.2.1.7 Diagrama
de
Clases
com.jfh.elearning.persistence.*
del
Paquete
Como habíamos se dijo en el apartado 6.1.1.6 com.jfh.elearning.persistence, este paquete
contiene los DAO con las operaciones de acceso a la base de datos.
A su vez, éste contiene más paquetes que agrupan funcionalidad, algo que habíamos dicho
también en el apartado 6.1.1.6 com.jfh.elearning.persistence. Para simplificar el diagrama de
clases del presente paquete -ya que las clases no tendrán relación entre ellas- se muestran
todas las clases en un mismo diagrama (se muestra el diagrama de clases del paquete
com.jfh.elearning.persistence.impl;
se
omite
el
del
paquete
com.jfh.elearning.persistence.interfaz ya que sería igual, con la salvedad de que en la cada
clase de implementación tiene el atributo con la configuración de la base de datos –
recordemos que los datos de conexión a la base de datos se encarga de establecerlos Spring
con la inyección de dependencias-. Puesto que el diagrama de clases del paquete es
demasiado grande, se dividirá en varias partes para facilitar su comprensión):
Figura 6.18: Diagrama de clases del paquete com.jfh.elearning.persistence.impl.* - Parte I
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
117
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Diseño del Sistema
Figura 6.19: Diagrama de clases del paquete com.jfh.elearning.persistence.impl.* - Parte II
Figura 6.20: Diagrama de clases del paquete com.jfh.elearning.persistence.impl.* - Parte III
Como puede apreciarse en cada una de las imágenes, cada DAO tiene asociada una clase
*RowMapper que sirve para mapear los datos que se obtienen de las consultas realizadas con
los elementos del modelo. Esto se encarga de realizarlo automáticamente Spring cuando
lanzamos una consulta contra la base de datos. Pongamos un ejemplo para verlo más
claramente:
@Override
public Template select(long idTemplate) {
log.debug(
"<ELEARNING> TemplateDAOImpl::select(idTemplate). " +
"Entrando en la función select(idTemplate).");
StringBuffer query = new StringBuffer("SELECT * FROM
schm_elearning.templates WHERE id_template = ?");
118
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Template template = jdbcTemplate.queryForObject(query.toString(), new
Object[]{idTemplate}, new TemplateRowMapper());
log.debug(
"<ELEARNING> TemplateDAOImpl::select(idTemplate). " +
"Saliendo de la función select(idTemplate).");
return template;
}
En el ejemplo anterior, se puede ver que se realiza la consulta contra se la base de datos con
jdbctemplate en la línea:
jdbcTemplate.queryForObject(query.toString(), new Object[]{idTemplate},
TemplateRowMapper());
new
Se puede observar como al método queryForObject de la clase JdbcTemplate se le pasa un
objeto TemplateRowMapper, donde se mapeará cada ResulSet que devuelva la consulta en un
elemento Template.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
119
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Diseño del Sistema
6.3 Diagramas de Interacción y Estados
A continuación se muestran los diagramas de secuencia de aquellos casos de uso más
importantes, donde es necesaria una descripción más detallada que aporte información
adicional para poder comprender el funcionamiento del sistema.
Los diagramas deben incluir nombres de clases, métodos y parámetros “reales”, con la
intención de que puedan trasladarse directamente a la implementación del sistema (el
objetivo de un buen diseño).
En cuanto al número de diagramas a contemplar, al igual que se dijo anteriormente no es
necesario incluir en el diseño todos y cada uno de los posibles diagramas, sino que podremos
ahorrar extender aquellos en los que:


Las operaciones sean muy simples (en cuyo caso se puede optar por no decir nada al
respecto o colocar simplemente un texto explicativo).
La operación sea muy similar o idéntica a una que ya está desarrollada en esta sección. En
este caso lo mejor es poner en el diagrama original a que otros casos se aplica o
representa y no repetirlo.
6.3.1
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
Caso de Uso “Realizar Autoevaluación”
El usuario alumno selecciona el bloque Autoevaluación.
El sistema obtiene el path donde se encuentran las preguntas dela autoevaluación.
El alumno realiza las preguntas.
El alumno termina la autoevaluación.
El sistema obtiene las respuestas de las preguntas.
El sistema envía las respuestas del usuario para almacenarlas en la base de datos.
El sistema pregunta al alumno si quiere ver las soluciones.
El sistema muestra la solución de cada pregunta.
El alumno termina la revisión.
El sistema redirige el alumno a la página de inicio.
6.3.1.1 Diagrama de Secuencia
120
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños
Figura 6.21: Diagrama de secuencia – Caso de Uso Realizar Autoevaluación.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
121
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
En el diagrama se puede apreciar como el usuario alumno interacciona con la interfaz para
seleccionar el bloque “Autoevaluación”. A continuación, se redirige al usuario a la interfaz
donde comenzarán a aparecer las preguntas; es en ese momento cuando se cargan las
plantillas de cada pregunta para determinar el tipo de cada pregunta ya que es necesario
saberlo para conocer de dónde debe capturar la respuesta del usuario.
Posteriormente el usuario alumno debe contestar a las 10 preguntas de la autoevaluación y
cuando pulse el botón “Enviar”, se recuperarán las respuestas de las preguntas, para
comprobar cuáles son correctas e incorrectas, y se enviarán al servidor las respuestas del
usuario.
Finalmente el sistema pregunta al usuario si desea ver las soluciones; cuando este termina, se
le redirige a la pantalla de inicio.
En el diagrama anterior se han omitido las clases de la capa business ya que en este proceso no
son relevantes, simplemente se encargan de conectar a los Action con los DAO encargados de
recuperar e insertar datos en la base de datos.
6.3.2
1.
2.
3.
4.
5.
6.
7.
Caso de Uso “Modificar Pregunta”
El usuario profesor selecciona una plantilla nueva.
Se carga la ruta de la nueva plantilla y se muestra al usuario.
El usuario profesor rellena los huecos con el contenido que considere adecuado.
El usuario guarda los cambios.
Se guarda el nuevo contenido de la pregunta en la JSP de dicha pregunta.
Se almacena la respuesta de la pregunta en la base de datos.
Se redirige al profesor al listado de preguntas.
6.3.2.1 Diagrama de Secuencia
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
122
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños
Figura 6.22: Diagrama de secuencia – Caso de Uso Modificar Pregunta.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
123
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
En el diagrama se puede apreciar como el usuario alumno interacciona con la interfaz para
seleccionar en primer lugar la plantilla que quiere para la pregunta. Después de que se carga la
plantilla para dondeel profesor debe introducir los datos de la pregunta; éstos serán al menos
(dependiendo de la plantilla):


Enunciado de la pregunta.
Respuesta.
Una vez termina de introducir los datos el usuario profesor, guarda los cambios y es en ese
momento cuando se llama al Action encargado de extraer la información para realizar en la
capa business la actualización de la plantilla.
Una vez actualizada la JSP, lo que queda es almacenar en la base de datos la respuesta
correcta de esa pregunta.
Finalmente, cuando se complete el proceso se redireccionará al usuario profesor a la página
con todo el listado de preguntas.
Comentar que el caso de uso “Modificar Tareas Teoría” sería igual que este con la excepción
de que no sería necesario guardar la respuesta ya que no la abría.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
124
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
6.5 Diseño de la Base de Datos
Esta sección es la indicada para describir todo lo relativo al sistema de gestión de bases de
datos que vamos a usar en nuestra aplicación. Esto incluye hablar del sistema en sí, la versión
utilizada, las clases empleadas al usarlo, como se integra en el sistema y el diagrama E-R de las
tablas y relaciones creadas, todo ello en los apartados que se muestran a continuación.
6.5.1
Descripción del SGBD Usado
Tras considerar las ventajas y desventajas que poseen ambos modelos para la elaboración del
presente proyecto, finalmente se ha optado por utilizar un modelo relacional, ya que éstos
emplean para su funcionamiento primordialmente transacciones ACID.
En lo que respecta a las alternativas tecnológicas que se plantean, después de analizar los pros
y los contras de cada una de ellas, se ha optado por montar el SGBD PostgreSQL por los
siguientes motivos:



Presenta un mayor rendimiento cuando el nivel de concurrencia de usuarios es alto.
A pesar de que MySQL puede garantizar las transacciones ACID, el motor de
almacenamiento InnDB no es tan potente como el de PostgreSQL, motivo por el cual
emplearemos éste último, puesto que garantizaría la operatividad del sistema en
buenas condiciones ante un incremento en el futuro del volumen de datos del sistema.
La licencia GNU GPL obligaría a que el producto se distribuya bajo la misma licencia.
Para consultar más información sobre el SGBD PostgreSQL, ir al apartado 5.6.2.1.2 PostgreSQL.
6.5.2
Integración del SGBD en Nuestro Sistema
Para comunicar el sistema con la base de datos se empleará la clase JdbcTemplate del módulo
Spring JDBC de Spring, la cual hace uso internamente de la API Java Database Connectivity
(JDBC), con la gran ventaja de que elimina todos los problemas relacionados con ésta, pues se
encarga de realizar las operaciones básicas del flujo de trabajo de JDBC: apertura y cierre de la
conexión, gestión de excepciones, iteración de ResultSets, etc.
Para poder emplear JdbcTemplate, es necesario descargarnos las librerías del módulo Spring
JDBC, además de los drivers de la API de JDBC para PostgreSQL. Este proceso se hará
cómodamente con Apache Maven, ya que solo tenemos que indicarle las dependencias del
módulo Spring JDBC y del driver JDBD para PostgreSQL. En las siguientes líneas se pueden
observar las dependencias necesarias:
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-jdbc</artifactId> <!-- Soporte JDBC -->
<version>${spring.version}</version>
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
125
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Diseño del Sistema
</dependency>
<dependency>
<groupId>postgresql</groupId>
<artifactId>postgresql</artifactId>
<!-- Driver para BBDD PostgreSQL -->
<version>9.1-901.jdbc4</version>
</dependency>
Por último, cabe destacar que la versión de PostgreSQL que se empleará es la 9.3.
6.5.3
Diagrama E-R
A continuación se muestra el diagrama entidad-relación. Dado que el diagrama es muy grande,
para un mayor detalle se recomienda ver el fichero adjunto entidad_relacion.eap que se
encuentra en el directorio diagramas/entidad_relacion.
126
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños
Figura 6.23: Diagrama E-R.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
127
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
128
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
6.6 Diseño de la Interfaz
Como ya se había descrito en la fase de análisis, el sistema constará de dos tipos de interfaces:
uno para el módulo “Aprendizaje” y otro para los módulos “Gestión de Usuarios” y “Gestión de
Contenidos Académicos”. A continuación se muestran los diseños finales.
6.6.1
Módulo “Aprendizaje”
Como se puede apreciar en las siguientes imágenes, se ha respetado el diseño realizado en la
fase de análisis:
Figura 6.24: Diseño final del módulo "Aprendizaje" – Vista I.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
129
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Diseño del Sistema
Figura 6.25: Diseño final del módulo “Aprendizaje” – Vista II.
6.6.2
Módulo “Gestión de Contenidos Académicos”
y Módulo “Gestión de Usuarios”
Como se puede apreciar en las siguientes imágenes, se ha respetado el diseño realizado en la
fase de análisis:
Figura 6.26: Diseño final del módulo "Gestión de Usuarios”.
130
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 6.27: Diseño final del módulo "Gestión de Contenidos Académicos".
6.7 Especificación Técnica del Plan de Pruebas
6.7.1
Pruebas Unitarias
Para las pruebas unitarias se empleará el plan de pruebas establecido en la fase de análisis.
A lo largo del desarrollo del presente proyecto, el desarrollador irá haciendo las pruebas
necesarias sobre cada clase o método para comprobar el correcto funcionamiento de éstos.
No obstante, una vez finalizada la implementación, habrá un tester encargado de ejecutar la
batería de pruebas unitarias del plan de pruebas establecido en la fase de análisis, además de
otras que fuesen necesario realizar si se amplía el alcance del proyecto. Este reportará los
errores a los desarrolladores que se encargarán de analizar el problema y resolverlo para que
el tester pueda volver a ejecutar las pruebas pertinentes.
Como se vio en el plan de pruebas realizado en la fase de análisis, las pruebas estarán divididas
por casos de uso, y estos a su vez por pruebas. Una vez se termine de ejecutar las pruebas de
todos los casos de uso, se realizará una regresión de todas las pruebas que se vean afectadas
por la funcionalidad corregida tras reportarse un error.
6.7.2
Pruebas de Integración y del Sistema
Al igual que con las pruebas unitarias, nos basaremos en el plan de pruebas establecido en la
fase de análisis.
Las pruebas de integración se harán a la par que el desarrollador implementa funcionalidad
nueva. Una vez finalizado el proyecto, será el tester quien se encargue de realizar las pruebas
del sistema completo para comprobar el correcto funcionamiento de éste.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
131
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Diseño del Sistema
6.7.3
Pruebas de Usabilidad
Con las pruebas de usabilidad se pretende determinar el grado de usabilidad del sitio web
desarrollado.
El objetivo de estas pruebas es obtener los puntos débiles de la aplicación web para poder
mejorarlos de cara al usuario final.
6.7.3.1 Usuarios para las Pruebas
Puesto que el sistema está destinado a dos tipos de usuarios, se usará la siguiente
configuración de participantes:


Para las pruebas del módulo “Aprendizaje” se entrevistará a 2 niños de entre 9 y 12
años.
Para las pruebas de los módulos “Gestión de Usuarios” y “gestión de Contenidos
Académicos” se entrevistará a 2 adultos de entre 28 y 55 años.
6.7.3.2 Método de Evaluación
Las pruebas de accesibilidad estarán divididas en dos secciones:



En primer lugar se hará un conjunto de preguntas de carácter general para determinar
el perfil del usuario.
En segundo lugar se realizará un conjunto de preguntas sobre la aplicación.
Por último, se harán un conjunto de tareas guiadas.
6.7.3.2.1 Preguntas de Carácter General
Nombre y apellidos
Sexo
Edad
* Nivel de Estudios
(Marque con una X
una casilla)
* Conocimientos de
informáticos
(Marque con una X
una casilla)
* Conocimientos de
internet (Marque
con una X una casilla)
* ¿Con que
frecuencia utiliza el
ordenador?
(Seleccione una
opción)
* En caso de usar el
132
Primaria
Secundaria Diplomado Licenciado
Master
Doctor
Muy Bajo
Bajo
Medio
Alto
Muy Alto
Muy Bajo
Bajo
Medio
Alto
Muy Alto
 Todos los días
 Varias veces a la semana
 Ocasionalmente
 Nunca o casi nunca
____________ horas.
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
ordenador
diariamente, indique
el número de horas
al día.
* ¿Qué tipo de
tareas realiza con el
__________________________________________________.
ordenador?
¿Tiene correo
electrónico?
* ¿Sabe lo que
significa e-learning?
Sí
No
(Marque una
opción).
* En caso de que
sepa qué es elearning, descríbalo
brevemente.
* ¿Ha utilizado
alguna vez una
plataforma eSí __________________________
No
learning? En caso
afirmativo, ponga un
ejemplo.
* Esta pregunta no es necesario que la contesten los usuarios del módulo “Aprendizaje”.
Puesto que el módulo de aprendizaje está destinado a niños de entre 9 y 12 años, los usuarios
de este módulo realizarán el test junto con el entrevistador.
6.7.3.2.2 Actividades guiadas
A continuación se muestran divididas por módulos el conjunto de pruebas guiadas que
deberán realizar los usuarios con el fin de que comenten los problemas y dificultades que
según su opinión presenta la aplicación (si existiesen). Estas opiniones serán recogidas por el
entrevistador.
Módulo “Aprendizaje”
1.
2.
3.
4.
5.
6.
7.
8.
9.
Iniciar sesión.
Seleccionar un curso.
Seleccionar una asignatura.
Seleccionar una unidad.
Seleccionar el bloque de teoría.
Realizar las tareas del bloque de teoría.
Volver a la vista de los bloques y seleccionar una autoevaluación.
Realizar las preguntas de la autoevaluación.
Cerrar sesión.
Módulo “Gestión de Usuarios”
1. Iniciar sesión.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
133
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Diseño del Sistema
2.
3.
4.
5.
6.
Consultar el listado de usuarios dados de alta.
Dar de alta un usuario.
Modificar el usuario dado de alta en el punto 3.
Añadir varios usuarios desde un fichero CSV.
Cerrar sesión.
Módulo “Gestión de Contenidos Académicos”
1.
2.
3.
4.
5.
6.
7.
8.
9.
Iniciar sesión.
Listar el conjunto de tareas y preguntas.
Listar las autoevaluaciones disponibles.
Ver la información de una autoevaluación.
Ver las estadísticas de una autoevaluación.
Ver los intentos de realización de una autoevaluación.
Ver las preguntas asociadas a una autoevaluación.
Modificar el contenido y la plantilla de una pregunta de una autoevaluación.
Cerrar sesión.
6.7.3.2.3 Preguntas Cortas sobre la Aplicación y Observaciones
Preguntas Sobre la Identidad
Con la aplicación web abierta y sin usar el teclado y el ratón, conteste a las
Descripción
siguientes preguntas.
¿Sabría decir cómo se llama el
sitio web con lo que ve? ¿Cómo lo
sabe?
¿Hay algún elemento gráfico o
texto que te haya ayudado?
¿A qué tipo de audiencia cree que
está dirigido este sitio web?
Preguntas Sobre el Contenido
Después de comenzar a utilizar la aplicación, conteste a
Descripción
las siguientes preguntas.
¿Le ha parecido adecuado el
contenido del sitio o ha echado
en falta más información?
¿Al ver la portada supo cuál era
el contenido más importante que
se ofrecía?
Preguntas Sobre Navegación
¿Puede ver en la portada y en el
resto de las páginas la forma en
que se navega por el sitio web?
¿Existen algún elemento en las
páginas que permita saber
exactamente dónde estás dentro
del sitio web y cómo volver atrás
sin usar los botones del
navegador?
¿Sabe volver desde cualquier
134
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Diseño del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
página a la página de inicio?
¿Cómo?
Aspectos gráficos
Calidad del Interfaz
Muy
Adecuado
Adecuado
Poco
Adecuado
Nada
Adecuado
No
A veces
¿El tipo y tamaño de letra es
adecuado?
¿Los iconos e imágenes usados
son acordes con lo que se
pretende
representar
gráficamente?
¿Los colores empleados son
adecuados?
Diseño de la Interfaz
Si
¿Le resulta fácil de usar?
¿El diseño de las pantallas es claro y
atractivo?
¿Cree que el programa está bien
estructurado?
Observaciones
Cualquier comentario del usuario
Este cuestionario no es necesario que lo realicen los niños de entre 9 y 12 años; en su caso, se
tomarán anotaciones de sus impresiones en voz alta y de su comportamiento.
6.7.3.2.4 Cuestionario para el Responsable de las Pruebas
Aspecto Observado
Notas
El usuario comienza a trabajar de
forma rápida por las tareas
Tiempo en realizar cada tarea
Errores leves cometidos
Errores graves cometidos
6.7.4
Pruebas de Rendimiento
Al igual que con las pruebas anteriores, nos basaremos en el plan de pruebas establecido en la
fase de análisis.
No obstante, no se espera tener un gran número de usuarios concurrentes. El mayor problema
puede estará al recuperar grandes volúmenes de datos de la base de datos, por ejemplo
cuando se recuperan listados de elementos. El encargado de realizar las pruebas será el tester;
si considera que se están produciendo cuellos de botella, el desarrollador deberá estudiar la
manera de solucionarlos.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
135
Implementación del Sistema | Portal web con contenidos didácticos interactivos para reforzar
el aprendizaje de los niños
Capítulo 7. Implementación
Sistema
del
7.1 Estándares y Normas Seguidos
7.1.1
AJAX (Asynchronous JavaScript And XML)
Podemos definir Ajax (Asynchronous JavaScript And XML) como [una técnica de desarrollo web
para crear aplicaciones interactivas o RIA (Rich Internet Applications). Estas aplicaciones se
ejecutan en el cliente, es decir, en el navegador de los usuarios mientras se mantiene la
comunicación asíncrona con el servidor en segundo plano. De esta forma es posible realizar
cambios sobre las páginas sin necesidad de recargarlas, mejorando la interactividad, velocidad
y usabilidad en las aplicaciones]. [Wikipedia14B].
En numerosas ocasiones durante el proceso de implementación se ha empleado AJAX para
realizar peticiones al servidor de forma asíncrona -lo que mejora la experiencia del usuario al
no ser el mismo consciente de ello- así como para modificar fragmentos de la página JSP sin
necesidad de tener que cargar la página completa, con lo que se obtienen las siguientes
ventajas respecto a un proceso que implicase la carga completa de la página:




un menor número de transacciones,
un tiempo entre transacciones menor,
un menor consumo del ancho de banda y
una reducción en la carga de trabajo del servidor.
7.1.2
CSS (Cascading Style Sheets)
CSS es [un lenguaje usado para definir y crear la presentación de un documento estructurado
escrito en HTML o XML (y por extensión en XHTML). El World Wide Web Consortium (W3C) es el
encargado de formular la especificación de las hojas de estilo que servirán de estándar para los
agentes de usuario o navegadores]. [Wikipedia15I].
En el desarrollo del proyecto se han empleado las propiedades de las especificaciones CSS1,
CSS2.1 y CSS3.
Siempre que ha sido posible se ha cumplido con el estándar CSS, aunque, en casos
excepcionales, es posible que se empleasen propiedades no estandarizadas para conseguir un
correcto funcionamiento en todos los navegadores, así como un estilo similar en todos ellos.
Me gustaría destacar que todas las animaciones del módulo “Aprendizaje” están realizadas con
CSS3, en concreto, se ha empleado principalmente la propiedad transform.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
137
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Implementación del Sistema
7.1.3
HTML (HyperText Markup Language)
Cuando hablamos de HTML, nos referimos al [estándar que sirve de referencia para la
elaboración de páginas web en sus diferentes versiones, define una estructura básica y un
código (denominado código HTML) para la definición de contenido de una página web, como
texto, imágenes, videos, entre otros. Es un estándar a cargo de la W3C, organización dedicada
a la estandarización de casi todas las tecnologías ligadas a la web, sobre todo en lo referente a
su escritura e interpretación]. [Wikipedia15J].
La parte visual de la aplicación web se ha desarrollado empleando la última especificación del
estándar, HTML5.
Se ha tratado de cumplir, en la medida de lo posible, con las normas establecidas por la
especificación, aunque no en todos los casos se ha podido cumplir con las mismas, ya que se
ha empleado la biblioteca de etiquetas web que incluye Struts2 para la presentación dinámica
de los datos.
7.1.4
JSON (JavaScript Object Notation)
Cuando nos referimos a JSON, estamos hablando en la práctica, de [un formato ligero para el
intercambio de datos. JSON es un subconjunto de la notación literal de objetos de JavaScript
que no requiere el uso de XML.
La simplicidad de JSON ha dado lugar a la generalización de su uso, especialmente como
alternativa a XML en AJAX]. [Wikipedia15K].
Se ha utilizado JSON como formato para serializar la información que se intercambía entre el
cliente y el servidor: en el lado del cliente, la información que se envía en las peticiones Ajax
está serializada en este formato, mientras que, por otra parte, en el lado del servidor, cuando
procede, los action de Struts2 retornan información serializada en formato JSON en lugar de
retornar una vista. Esto permite mejorar la experiencia del usuario ya que no es necesario
recargar la página completa en cada petición que se hace al servidor para recuperar o enviar
información.
7.1.5
Pautas de Accesibilidad al Contenido Web
(WCAG) 2.0
Es complicado cumplir con las pautas de accesibilidad, ya que en muchas ocasiones no es
funcional, aunque se ha intentado cumplir con las pautas lo máximo posible.
Hay que tener en cuenta que los módulos de la aplicación están dirigidos a 2 tipos de usuarios:



138
Subsistema “Aprendizaje”. Dirigido a niños de entre 9 y 12 años.
Subsistemas “Gestión de Usuarios” y “Gestión Académica”. Dirigido a adultos.
http://www.sidar.org/traducciones/wcag20/es/
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Implementación del Sistema | Portal web con contenidos didácticos interactivos para reforzar
el aprendizaje de los niños
7.1.6
Pautas de Usabilidad Web
https://cinguanzo.wordpress.com/2012/10/12/5-pautas-de-usabilidad-web/
7.1.7
SVG (Scalable Vector Graphics)
Se trata de una [especificación para describir gráficos vectoriales bidimensionales, tanto
estáticos como animados *…+, en formato XML+. [Wikipedia15L].
Se ha empleado SVG para mostrar el nombre del sitio web (AprendeRiendo.com) en la página
principal de la aplicación (index.jsp). Los motivos por los que se ha empleado SVG para mostrar
este título se describen con profundidad en el apartado 7.5.1 Problemas Encontrados.
7.1.8
XML (eXtensible Markup Language)
XML es un [lenguaje de marcas desarrollado por el World Wide Web Consortium (W3C)
utilizado para almacenar datos en forma legible]. [Wikipedia15M]. A diferencia del HTML, [su
función principal es describir datos y no mostrarlos]. [W3C].
[XML no ha nacido sólo para su aplicación para Internet, sino que se propone como un estándar
para el intercambio de información estructurada entre diferentes plataformas].
[Wikipedia15M].
Para el desarrollo del proyecto se han empleado varios ficheros de configuración, entre los
cuales, los siguientes siguen el estándar XML:





struts.xml. Fichero de configuración de Struts2.
pom.xml. Fichero de configuración de Apache Maven.
applicationContext.xml. Fichero de configuración de Spring.
tiles.xml. Fichero de configuración de Tiles.
web.xml. Fichero descriptor de despliegue.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
139
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Implementación del Sistema
7.2 Lenguajes de Programación, Tecnologías y
Frameworks
7.2.1
Apache Log4j
Descripción
Log4j es una [bibliotecas open source desarrollada en Java por la Apache Software Foundation
que permite a los desarrolladores de software escribir mensajes de registro, cuyo propósito es
dejar constancia de una determinada transacción en tiempo de ejecución. Log4j permite filtrar
los mensajes en función de su importancia. La configuración de salida y granularidad de los
mensajes es realizada en tiempo de ejecución mediante el uso de archivos de configuración
externos]. [Wikipedia15N].
Cuando se desarrolla un sistema de cierta envergadura los sistemas de logging se hacen
imprescindibles ya que permiten conocer el estado de la aplicación en un cada momento.
En el desarrollo del presente proyecto, se ha empleado log4j para generar un archivo log
donde quede registrada toda la actividad de la aplicación web, sirviendo además como medio
para depurar la aplicación, ya que log4j permite configurar varios niveles de información y
formatos de salida, facilitando de este modo el proceso de seguimiento de un error.
La configuración del proyecto se encuentra en el fichero log4j.properties, en cual se han
configurado dos salidas; por fichero y por consola, cada una de ellas con su respectivo
formato.
Versión
La versión utilizada es la 1.2.17.
Distribución
Fichero JAR.
7.2.2
Apache Maven
Descripción
Cuando hacemos referencia a Apache Maven, estamos hablando de [una herramienta de
software para la gestión y construcción de proyectos Java creada por Jason van Zyl, de
Sonatype, en 2002. Es similar en funcionalidad a Apache Ant (y en menor medida a PEAR de
PHP y CPAN de Perl), pero tiene un modelo de configuración de construcción más simple,
basado en un formato XML. *…+.
140
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Implementación del Sistema | Portal web con contenidos didácticos interactivos para reforzar
el aprendizaje de los niños
Maven utiliza un Project Object Model (POM) para describir el proyecto de software a
construir, sus dependencias de otros módulos y componentes externos, y el orden de
construcción de los elementos. *…+
Una característica clave de Maven es que está listo para usar en red. El motor incluido en su
núcleo puede dinámicamente descargar plugins de un repositorio, el mismo repositorio que
provee acceso a muchas versiones de diferentes proyectos Open Source en Java, de Apache y
otras organizaciones y desarrolladores. Este repositorio y su sucesor reorganizado, el
repositorio Maven 2, pugnan por ser el mecanismo de facto de distribución de aplicaciones en
Java […++.[Wikipedia15O].
Como ya habíamos adelantado en el aparatado 3.3 Frameworks, una de las tareas para la que
se ha empleado Maven es definir el ciclo de vida del proyecto. En Maven cada una de las
partes que componen el cicla de vida del proyecto es denominada phase, entre las cuales cabe
destacar por su empleo en el proyecto, las siguientes:



compile. Compilación de los .java del proyecto (comando mvn compile).
package. Empaqueta la aplicación web en el formato que se especifique en la etiqueta
packaging del fichero pom.xml; en este caso el empaquetado del proyecto es del tipo
WAR (comando mvn package).
install. Instala el artefacto del proyecto generado en el repositorio local (comando
mvn install).
La ejecución de estas phases será secuencial; así cuando se ejecuta cualquiera de las phases,
Maven verificará las anteriores, desde la primera phase hasta la que se ejecuta.
Cabe mencionar que cada una de las phases está asocia a una o más tareas denominadas
goals, las cuales pueden ser ejecutadas fuera del ciclo de vida del proyecto. Las que se han
empleado en el desarrollo del mismo son las siguientes:



eclipse:eclipse. Añade los ficheros necesarios para convertir el proyecto maven en un
proyecto de eclipse (comando mvn eclipse:eclipse).
clean. Elimina el contenido del directorio target para poder realizar una compilación
desde cero (comando mvn clean).
site. Genera un sitio web con toda la información del proyecto. Este goal se ha
combinado con el plugin maven-javadoc-plugin, que permite generar el javadoc y
linckarlo al site generado con el goal site (comando mvn site).
La otra tarea para la que se ha utilizado Maven es para llevar a cabo la gestión de las
dependencias y la resolución de dependencias transitivas. Lo que significa que, en el caso de
que alguna de las dependencias que se añadan al fichero de configuración pom.xml dependa
de otras dependencias externas, Maven se encargará de añadirlas como dependencias del
proyecto.
Versión
La versión utilizada es la 3.2.1.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
141
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Implementación del Sistema
Distribución
Fichero ZIP portable.
7.2.3
Google Charts
Descripción
Cuando hablamos de Google Charts, nos referimos a la [aplicación de Google para realizar
estadísticas web, de fácil uso para desarrolladores de sofware web, usado en muchos campos
como Google Analytics, se puede usar con diferentes formatos, Json, Javascript y plugins que se
pueden integrar con varios lenguajes de programación]. [Wikipedia15P].
Se ha utilizado la herramienta Google Charts en el módulo “Gestión Académica” para mostrar
los datos estadísticos de los resultados de las autoevaluaciones en forma de gráficos de barras.
Actualmente hay numerosos frameworks que permiten generar gráficos estadísticos; pero se
ha optado por usar Google Charts porque se tenía experiencia previa con este framework.
Versión
La gráfica empleada se encuentra dentro del paquete Core Chartsa la cual se publicó el 23 de
febrero de 2015.
Distribución
Los términos de Google Chart no permiten descargar la librería, por lo que se debe enlazar
mediante la etiqueta <script> (<script src="http://www.google.com/jsapi"></script>) o, en su
caso, con el cargador de Google (google.load()).
7.2.4
Java
Descripción
Java es un [lenguaje de programación de propósito general, concurrente, orientado a objetos
que fue diseñado específicamente para tener tan pocas dependencias de implementación como
fuera posible. Su intención es permitir que los desarrolladores de aplicaciones escriban el
programa una vez y lo ejecuten en cualquier dispositivo *…+, lo que quiere decir que el código
que es ejecutado en una plataforma no tiene que ser recompilado para correr en otra. *…+.
El lenguaje de programación Java fue originalmente desarrollado por James Gosling de Sun
Microsystems *…+ y publicado en 1995 como un componente fundamental de la plataforma
Java de Sun Microsystems. *…+. Las aplicaciones de Java son generalmente compiladas a
bytecode (clase Java) que puede ejecutarse en cualquier máquina virtual Java (JVM) sin
importar la arquitectura de la computadora subyacente]. [Wikipedia15AB].
142
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Implementación del Sistema | Portal web con contenidos didácticos interactivos para reforzar
el aprendizaje de los niños
Java ha sido el lenguaje de programación empleado en el lado del servidor para implementar
la lógica de la aplicación. El principal motivo por el que se ha elegido Java, es que el
programador está altamente familiarizado con este lenguaje de programación.
Versión
La versión utilizada es la 1.7.0_60.
Distribución
JDK.
7.2.5
JEE
Descripción
Cuando hablamos de JEE (Java Enterprise Edition) nos estamos refiriendo a la [plataforma de
programación—parte de la Plataforma Java—para desarrollar y ejecutar software de
aplicaciones en el lenguaje de programación Java. Permite utilizar arquitecturas de N capas
distribuidas y se apoya ampliamente en componentes de software modulares ejecutándose
sobre un servidor de aplicaciones. *…+
Java EE tiene varias especificaciones de API, tales como JDBC, RMI, e-mail, JMS, Servicios Web,
XML, etc y define cómo coordinarlos. Java EE también configura algunas especificaciones
únicas para Java EE para componentes]. [Wikipedia15AC].
Versión
La versión utilizada es la 7 Update 1.
Distribución
SDK.
7.2.6
JavaScript
Descripción
JavaScript [es un lenguaje de programación interpretado, dialecto del estándar ECMAScript. Se
define como orientado a objetos, basado en prototipos, imperativo, débilmente tipado y
dinámico.
Se utiliza principalmente en su forma del lado del cliente (client-side), implementado como
parte de un navegador web permitiendo mejoras en la interfaz de usuario y páginas web
dinámicas aunque existe una forma de JavaScript del lado del servidor (Server-side JavaScript o
SSJS). Su uso en aplicaciones externas a la web, por ejemplo en documentos PDF, aplicaciones
de escritorio (mayoritariamente widgets) es también significativo.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
143
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Implementación del Sistema
JavaScript se diseñó con una sintaxis similar al C, aunque adopta nombres y convenciones del
lenguaje de programación Java. Sin embargo Java y JavaScript no están relacionados y tienen
semánticas y propósitos diferentes]. [Wikipedia15Q].
Se ha utilizado JavaScript en el lado del cliente en conjunto con las librerías jQuery y jQuery UI
–que se describen en los apartados 7.2.5 JQuery y 7.2.6 JQueryUI respectivamente- para
proporcionar un mayor dinamismo a la interfaz de usuario así como facilitar ciertas tareas.
Cabe mencionar que se ha empleado la metodología de programación orientada a objetos de
JavaScript, lo que permite realizar código reutilizable y sostenible. Todos los objetos definidos
se pueden encontrar en el fichero models.js de cada uno de los módulos de la aplicación web.
Versión
La versión utilizada es la 1.10.2.
Distribución
Fichero JS.
7.2.7
jQuery
Descripción
Cuando hablamos de jQuery, nos referimos a la [biblioteca de JavaScript, creada inicialmente
por John Resig, que permite simplificar la manera de interactuar con los documentos HTML,
manipular el árbol DOM, manejar eventos, desarrollar animaciones y agregar interacción con
la técnica AJAX a páginas web]. [Wikipedia15R].
En el desarrollo del proyecto jQuery ha tenido una relevancia significativa, empleándose para
tareas como la manipulación del DOM (Document Object Model) de las páginas de una manera
sencilla y eficaz. Algunas de las tareas para las que se ha utilizado la librería jQuery han sido:




Gestión del contenido de formularios y tablas: captura e inserción de datos, validación
de campos, ordenación de elementos, etc.
Dotar de sonido a las animaciones de los elementos del módulo “Aprendizaje”.
Manejo de eventos.
Utilidades y funciones relacionadas con la técnica AJAX, como peticiones o carga de
fragmentos del fichero JSP.
Versión
La versión utilizada es la 1.10.2.
Distribución
Fichero JS.
144
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Implementación del Sistema | Portal web con contenidos didácticos interactivos para reforzar
el aprendizaje de los niños
7.2.8
jQuery UI
Descripción
JQuery UI es [una biblioteca de componentes para el framework jQuery que le añaden un
conjunto de plug-ins, widgets y efectos visuales para la creación de aplicaciones web].
[Wikipedia15S].
Se ha utilizado jQuery UI para la realización de los siguientes componentes del proyecto:


En el módulo “Aprendizaje” se ha empleado para el desarrollo de los cuadros de
diálogo que aparecen al seleccionar las imágenes de las tareas del bloque de teoría así
como al seleccionar los iconos de la lupa.
En los módulos “Gestión Académica” y “Gestión de Usuarios” para crear los cuadros de
diálogo que notifican el resultado de una operación realizada por el administrador o
por el profesor –dependiendo del módulo en el que se realice (el profesor en el
módulo “Gestión Académica” y el administrador en el módulo “Gestión de Usuarios”
por ejemplo: insertar un usuario, eliminar un usuario, modificar una tarea, etc.)-.
Versión
La versión utilizada es la 1.10.3.
Distribución
Fichero JS.
7.2.9
JSON in Java
Descripción
JSON in Java es una librería para el lenguaje de programación Java desarrollada por Douglas
Crockford que permite la codificación y decodificación entre objetos Java y JSON.
En el presente proyecto se ha utilizado esta librería en la parte del servidor para convertir
objetos JSON a Java, y poder así procesar los datos enviados desde el cliente.
Versión
La versión utilizada es la 20140107.
Distribución
Fichero JAR.
7.2.10
Spring
Descripción
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
145
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Implementación del Sistema
Como ya se ha expresado en el apartado 3.3 Frameworks, Spring es un [framework para el
desarrollo de aplicaciones y contenedor de inversión de control, de código abierto para la
plataforma Java]. [Wikipedia15T].
Éste, fue [creado por Rod Johnson y es de código abierto. Sus características son:




Simplicidad y acoplamiento débil: *…+. busca ser simple y se basa en la inyección de
dependencias para obtener un acoplamiento débil. *…+.
Es un contenedor: no es solo un framewrok más. Es un contenedor que gestiona el ciclo
de vida de los objetos y como se relacionan entre ellos. *…+.
Ligero: es muy rápido en tiempo de procesamiento y no es intrusivo a la hora de
desarrollar. *…+.
Orientado a aspectos: soporta la programación orientada a aspectos, lo que permite
facilitar una capa de servicios que son ideales para este tipo de programación como
auditoría, o gestión de transacciones.
*…+
Spring posee diversos módulos que se pueden agregar a las aplicaciones Java. Cada
desarrollador agrega los módulos que necesite]. [Wikipedia15T].
Para el desarrollo del proyecto uno de los módulos que se ha utilizado es el Spring JDBC. En él,
se encuentra la clase JDBCTemplate de Spring, la cual proporciona un mecanismo que permite
conectase a una base de datos y ejecutar consultas SQL de una manera simple. Esta clase hace
uso de la API de JDBC; con la ventaja de que se encarga de realizar las operaciones básicas del
flujo de trabajo de JDBC. Algunas de estas operaciones son: apertura y cierre de la conexión,
gestión de excepciones, iteración de ResultSets, etc.
Los otros módulos que se han usado son el Spring Core, para poder utilizar la inyección de
dependencias de Spring, y los módulos Spring Beans y Spring Context, necesarios estos para
hacer uso de la inyección de dependencias por medio de anotaciones.
Finalmente, mencionar que la configuración del framework se encuentra en el fichero
applicationContext.xml.
Versión
La versión utilizada es la 4.1.6.RELEASE.
Distribución
Fichero JAR.
7.2.11
Struts2
Descripción
En el apartado 3.3 Frameworks ya adelantábamos que Struts2 es [una herramienta de soporte
para el desarrollo de aplicaciones Web bajo el patrón MVC bajo la plataforma Java EE (Java
146
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Implementación del Sistema | Portal web con contenidos didácticos interactivos para reforzar
el aprendizaje de los niños
Enterprise Edition). Struts se desarrollaba como parte del proyecto Jakarta de la Apache
Software Foundation, pero actualmente es un proyecto conocido como Apache Struts.
Struts permite reducir el tiempo de desarrollo. *…+
El 5 de marzo de 2013, Struts 1 llegó al final de su vida y dejó de estar oficialmente soportado.
Struts 2 es un nuevo framework (anteriormente conocido como WebWork 2) que introdujo
algunas mejoras sobre Struts 1, de cara a simplificar las tareas más comunes en el desarrollo
de aplicaciones web, así como mejorar su integración con AJAX, etc.]. [Wikipedia14C].
En el presente proyecto, Struts2 implementa el controlador del patrón MVC; se encarga de
filtrar todas las peticiones entrantes y determinar qué Action debe procesar cada una de ellas.
Este proceso de filtrado la realiza la clase StrutsPrepareAndExecuteFilter, la cual se configura
en el fichero web.xml:
<filter>
<filter-name>struts2</filter-name>
<filterclass>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filterclass>
</filter>
Una característica muy importante de Struts2 y que fue muy valorada a la hora de determinar
el framework MVC que se emplearía en el proyecto, es que se puede integrar fácilmente con
otros frameworks; en el presente proyecto, se ha utilizado Struts2 junto con Spring y Apache
Tiles.
Otra característica muy importante, es que Struts2 permite devolver en los Action elementos
serializados en JSON, lo cual es muy útil ya que facilita el empleo peticiones Ajax para obtener
los datos del servidor; de esta manera, se pueden modificar fragmentos de la página JSP sin
necesidad de tener que cargar la página completa, con las ventajas que esto conlleva (las
ventajas de usar peticiones Ajax se describieron en el apartado 7.1.1 AJAX (Asynchronous
JavaScript And XML)).
Struts2 también se encarga de realizar la internacionalización automática de los textos de la
aplicación web a los idiomas inglés y español. Esta característica se establece en el fichero
struts.xml:
<constant name="struts.i18n.encoding" value="UTF-8" />
<constant name="struts.custom.i18n.resources" value="com/jfh/i18n/global" />
En la configuración, se debe establecer el tipo de codificación –que en este caso será UTF-8- y
la ruta donde se encuentran los ficheros de texto plano que contienen los datos de la
aplicación web en varios idiomas –en este caso, inglés y español-; el formato de estos textos
debe ser del tipo clave-valor. Los ficheros en texto plano con los mensajes internacionalizados
son:


global.properties. Contiene los textos en español.
global_en.properties. Contiene los textos en inglés.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
147
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Implementación del Sistema
Finalmente, también se ha empleado Struts2 para realizar la validación de los formularios en el
lado del servidor; para ello, redefinido el método validate() que implementa la clase
ActionSupport de la que extiende cada uno de los Action que procesa las peticiones que recibe
la aplicación web y que previamente han sido filtradas por el controlador
StrutsPrepareAndExecuteFilter.
A continuación se detallan las librerías que han sido necesarias para utilizar Struts2:




struts2-core. Se trata del núcleo del framework; contiene toda la funcionalidad
principal de Struts2.
struts2-spring-plugin. Esta librería sirve para integrar Struts2 con Spring Framework.
struts2-tiles-plugin. Librería que contiene todo lo necesario para integrar Struts2 con
Apache Tiles.
struts2-json-plugin. Esta librería permite que Struts2 pueda retornar elementos
serializados en JSON.
Versión
Tanto para struts2-core, struts2-spring-plugin, struts2-tiles-plugin como struts2-json-plugin,
la versión utilizada es la 2.3.24.
Distribución
Ficheros JAR.
7.2.12
Tablesorter
Descripción
Tablesorter es un plugin jQuery desarrollado por Christian Bach que permite ordenar las
columnas de una tabla sin necesidad de tener que recargar toda la página. Es muy útil ya que
soporta la ordenación de elementos de distintos tipos (textos, números, fechas, etc) y además
tiene varias opciones de personalización.
Versión
La versión utilizada es la 2.0.5b.
Distribución
Fichero JS.
7.2.13
Tiles
Descripción
Como ya se dijo en el apartado 3.3 Frameworks Tiles es un framework de Apache que
proporciona un sistema de construcción de JSPs mediante plantillas. Mediante un fichero XML
148
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Implementación del Sistema | Portal web con contenidos didácticos interactivos para reforzar
el aprendizaje de los niños
(tiles.xml) se especifican los fragmentos que forman una JSP, lo que permite evitar la
redundancia de código y mejorar el mantenimiento, puesto que cada uno de estos fragmentos
solo contendrá una parte específica de una JSP. De esta manera, si en un futuro es necesario
modificar por ejemplo el título de la cabecera, solo hay que hacer cambios en un solo fichero
JSP.
Para terminar, decir que la configuración del framework se encuentra en el fichero tiles.xml.
Versión
La versión utilizada es la 2.0.7.
Distribución
Fichero JAR.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
149
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Implementación del Sistema
7.3 Herramientas y Programas Usados para el
Desarrollo
7.3.1
Apache Tomcat
Descripción
Se trata de un [contenedor web con soporte de servlets y JSPs] [Wikipedia15U] desarrollado en
Java bajo el proyecto Jakarta en la Apache Funcdation.
[Tomcat es desarrollado y actualizado por miembros de la Apache Software Foundation y
voluntarios independientes. Los usuarios disponen de libre acceso a su código fuente y a su
forma binaria en los términos establecidos en la Apache Software License]. [Wikipedia15U].
Puesto que Apache Tomcat es un servidor de aplicaciones que se integra muy fácilmente con
Eclipse –Eclipse es el IDE que se ha empleado para realizar el desarrollo del presente proyecto
y del que se habla en el apartado 7.3.2 Eclipse-, ha sido el elegido para utilizar en el proceso de
desarrollo de la aplicación web.
Además, Apache Tomcat también se ha utilizado para albergar el sistema final.
Versión
La versión utilizada es la 7.0.53 para el sistema operativo Windows 7 64 bits.
Distribución
Instalador de Windows.
7.3.2
Eclipse
Descripción
Eclipse es un [programa informático compuesto por un conjunto de herramientas de
programación de código abierto multiplataforma para desarrollar lo que el proyecto llama
"Aplicaciones de Cliente Enriquecido", opuesto a las aplicaciones "Cliente-liviano" basadas en
navegadores. Esta plataforma, típicamente ha sido usada para desarrollar entornos de
desarrollo integrados (del inglés IDE), como el IDE de Java llamado Java Development Toolkit
(JDT) y el compilador (ECJ) que se entrega como parte de Eclipse (y que son usados también
para desarrollar el mismo Eclipse)]. [Wikipedia15V].
Una característica importante de este IDE es que posee editores de texto –con resaltado de
sintaxis- para múltiples lenguajes de programación, algo muy útil si tenemos en cuenta que en
el presente proyecto se ha hecho uso de varios de lenguajes como HTML, CSS, Javascript, Java,
etc. A su vez, los editores de texto poseen un analizador sintáctico que avisa de los errores y
warnings en tiempo real.
150
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Implementación del Sistema | Portal web con contenidos didácticos interactivos para reforzar
el aprendizaje de los niños
Cuenta, además, con ciertas opciones muy útiles que facilitan la labor del programador;
algunas de ellas son:





Autocompletado de métodos y variables.
Refactorización de código.
Generación automática de getters y setters.
Formateo de código.
Etc.
Aunque sin lugar a duda, los principales motivos por los que se ha empleado Eclipse como IDE
en el presente proyecto, es por su facilidad para integrase con Apache Tomcat y Apache
Maven -ambos descritos en los apartados 7.3.1 Apache Tomcat y 7.2.2 Apache Maven
respectivamente-, y por el hecho de que el programador esté familiarizado con esta
herramienta.
Versión
La versión utilizada es la Juno Service Release 2.
Distribución
Fichero ZIP portable.
7.3.3
Enterprise Architect
Descripción
Enterprise Architect es una herramienta de diseño y modelado UML desarrollada por Sparx
Systems que soporta la mayoría de las actividades involucradas es las fases de análisis, diseño,
pruebas y mantenimiento de un desarrollo software.
En el presente proyecto se ha empleado Enterprise Architect para realizar los diagramas UML
de las fases de análisis y diseño de la aplicación web.
Versión
La versión utilizada es la 9.0.908.
Distribución
Instalador de Windows.
7.3.4
Google Chrome
Descripción
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
151
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Implementación del Sistema
Se trata de un [navegador web desarrollado por Google y compilado con base en varios
componentes e infraestructuras de desarrollo de aplicaciones (frameworks) de código abierto,
como el motor de renderizado Blink]. [Wikipedia15W].
[Actualmente el navegador está disponible para los sistemas operativos de escritorio Microsoft
Windows, Mac OS X, Ubuntu, Debian, Fedora, openSUSE, Chrome OS y en los sistemas
operativos móviles Android y iOS]. [Wikipedia15W].
Google Chrome se ha utilizado para realizar las distintas pruebas y validaciones de la aplicación
web. Además se han usado las herramientas que Google Chrome trae integradas para la
depuración del JavaScript, HTML y CSS.
Google Chrome es el navegador para el que se ha optimizado la aplicación web.
Versión
La versión utilizada es la 43.0.2357.124 m.
Distribución
Instalador de Windows.
7.3.5
Internet Explorer
Descripción
Internet Explorer es [un navegador web desarrollado por Microsoft para el sistema operativo
Microsoft Windows desde 1995]. [Wikipedia15X].
En la actualidad, Internet Explorer está disponible para los sistemas operativos [Internet
Explorer Mobile (Windows CE y Windows Mobile), Internet Explorer para Mac (Mac OS 7.01 a
10) e Internet Explorer para UNIX (Solaris, HP-UX) y Xbox 360]. [Wikipedia15X].
Internet Explorer se ha utilizado para realizar las distintas pruebas y validaciones de la
aplicación web.
Aunque el navegador para el que está optimizada la aplicación web es el Google Chrome, se ha
procurado que es estilo con que se visualiza el sitio web en el navegador Internet Explorer sea
lo más parecido posible. Hay que tener en cuenta que en ocasiones se han empleado
propiedades no estándar de HTML y CSS para conseguir determinados resultados que con las
propiedades estándar hubiera sido más complicado obtener.
Versión
La versión utilizada es la 11.0.9600.17420.
Distribución
Instalador de Windows.
152
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Implementación del Sistema | Portal web con contenidos didácticos interactivos para reforzar
el aprendizaje de los niños
7.3.6
Microsoft Office 2010
Descripción
Se define como una [suite ofimática que abarca el mercado completo en Internet e
interrelaciona aplicaciones de escritorio, servidores y servicios para los sistemas operativos
Microsoft Windows y Mac OS X. Microsoft Office fue lanzado por Microsoft en 1989 para Apple
Macintosh, más tarde seguido por una versión para Windows, en 1990]. [Wikipedia15Y].
Del conjunto de programas que incluye el paquete Microsoft Office se han empleado:


Microsoft Office Word 2010. Procesador de texto utilizando para realizar la
documentación del proyecto.
Microsoft Power Point 2010. Programa para realizar presentaciones visuales que se ha
empleado para hacer las diapositivas de la presentación del proyecto.
Versión
La versión utilizada es la 14.0.4760.1000.
Distribución
Instalador de Windows.
7.3.7
Microsoft Project 2013
Descripción
Se trata de un [software de administración de proyectos diseñado, desarrollado y
comercializado por Microsoft para asistir a administradores de proyectos en el desarrollo de
planes, asignación de recursos a tareas, dar seguimiento al progreso, administrar presupuesto
y analizar cargas de trabajo]. [Wikipedia15Z].
Con Microsoft Project se ha realizado la planificación y seguimiento del proyecto así como la
gestión de los recursos disponibles.
Versión
La versión utilizada es la 15.0.4420.1017.
Distribución
Instalador de Windows.
7.3.8
Mozilla Firefox
Descripción
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
153
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Implementación del Sistema
Hace referencia a un [navegador web libre y de código abierto desarrollado para Microsoft
Windows, Android, OS X y GNU/Linux coordinado por la Corporación Mozilla y la Fundación
Mozilla. Usa el motor Gecko para renderizar páginas webs, el cual implementa actuales y
futuros estándares web]. [Wikipedia15AA].
Mozilla Firefox se ha utilizado para realizar las distintas pruebas y validaciones de la aplicación
web.
Aunque el navegador para el que está optimizada la aplicación web es el Google Chrome, se ha
procurado que es estilo con que se visualiza el sitio web en el navegador Mozilla Firefox sea lo
más parecido posible. Hay que tener en cuenta que en ocasiones se han empleado
propiedades no estándar de HTML y CSS para conseguir determinados resultados que con las
propiedades estándar hubiera sido más complicado obtener.
Versión
La versión utilizada es la 36.0.4.
Distribución
Instalador de Windows.
7.3.9
native2ascii
Descripción
native2ascii es una herramienta que se suministra como parte del JDK y que se encarga de
transformar a Unicode los caracteres especiales de un fichero de propiedades codificado en
UTF-8. Puesto que en el presente proyecto se manejan ficheros de propiedades con caracteres
especiales, se ha empleado native2ascii para realizar dicha transformación y evitar así los ya
conocidos problemas con los acentos y demás caracteres “extraños”.
Los ficheros de propiedades que se han transformado con native2ascii son los que emplea
Struts2 para realizar la internacionalización de la aplicación web:


global.properties
global_en.properties
Versión
La versión utilizada es la que viene con la distribución del JDK de Java. La versión del JDK es la
1.7.0_60-b19.
Distribución
Fichero JAR.
154
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Implementación del Sistema | Portal web con contenidos didácticos interactivos para reforzar
el aprendizaje de los niños
7.3.10
PIXLR EDITOR
Descripción
Se trata de un editor de fotos online que se ha empleado para modificar y “limpiar”, cuando ha
sido necesario, las imágenes que se visualizarán en la aplicación web.
Versión
No hay información disponible en la web del PIXLR EDITOR.
Distribución
Aplicación web.
7.3.11
pgAdmin III
Descripción
Consiste en una [herramienta de código abierto para la administración de bases de datos
PostgreSQL y derivados *…+. Incluye:





Interfaz administrativa gráfica.
Herramienta de consulta SQL (con un EXPLAIN gráfico).
Editor de código procedural.
Agente de planificación SQL/shell/batch.
Administración de Slony-I
]. [ARPUG].
PgAdmin III se ha empleado para la realización de tareas relacionadas con la gestión de la base
de datos PostgreSQL:






Creación y configuración de la base de datos.
Creación y configuración del esquema.
Creación y configuración de las tablas.
Inserción, eliminación y modificación de datos de prueba.
Implementación de las consultas SQL que se emplearán en la capa de persistencia para
obtener los datos de la base de datos.
Creación de las copias de seguridad.
Versión
La versión utilizada es la 1.18.1.
Distribución
Instalador de Windows.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
155
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Implementación del Sistema
7.3.12
PostgreSQL
Descripción
Se trata del SGBD empleado para el desarrollo. Para más información consultar el aparado 5.6
Análisis de los sistemas de Gestión de Bases de Datos.
Versión
La versión utilizada es la 9.3.
Distribución
Instalador de Windows.
156
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Implementación del Sistema | Portal web con contenidos didácticos interactivos para reforzar
el aprendizaje de los niños
7.4 Creación del Sistema
7.4.1
Problemas Encontrados
A continuación se enumeran y explican brevemente algunos de los problemas que surgieron
durante el desarrollo del proyecto, y cuál fue la solución que se dio a cada uno de ellos.
7.4.1.1 Codificación UTF-8
Este ha sido el principal problema y el más difícil de solucionar; el tema de la codificación, en
concreto, la representación de los caracteres especiales como la ‘ñ’ o los acentos. He tenido
numerosos problemas para conseguir que finalmente se muestren correctamente los datos.
Para ello, enumeraré las numerosas configuraciones que ha sido necesario realizar:

Codificación de todos los ficheros JSP. Para establecer la codificación UFT-8 en los
ficheros JSP, se ha de insertar la siguiente sentencia en cada uno de ellos:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

Codificar los ficheros de configuración. Para establecer la codificación UTF-8 en los
ficheros de configuración struts.xml, applicationContext.xml, tiles.xml y web.xml, se
debe añadir la siguiente línea al principio de cada uno de los ficheros:
<?xml version="1.0" encoding="UTF-8" ?>

Establecer la codificación de la base de datos. Es necesario cambiar el encoding de la
base de datos a UTF-8; para ello, se debe ejecutar desde la consola de la base de datos
y con el usuario root el siguiente comando:
update pg_database set encoding=8 where datname='db_elearning';


Codificar los ficheros .properties. Es necesario codificar los caracteres especiales de
los ficheros de propiedades. Para ello se ha empleado la herramienta native2ascii,
encargada de transformar los caracteres especiales en su representación en Unicode.
Codificar en UTF-8 los datos enviados en las peticiones POST. Para codificar los datos
procedentes de las peticiones POST, es necesario crear un filtro que se encargue de
realizar dicha tarea. En el presente proyecto, esta codificación se realiza en la clase
CharsetFilter, la cual implementa la interfaz Filter. Por último, es necesario declarar el
filtro en el descriptor de despliegue (fichero web.xml) y establecer que todas las
peticiones entrantes pasen a través de él para que se codifiquen los datos:
<filter>
<filter-name>CharsetFilter</filter-name>
<filter-class>com.jfh.elearning.filter.CharsetFilter</filter-class>
<init-param>
<param-name>requestEncoding</param-name>
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
157
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Implementación del Sistema
<param-value>UTF-8</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>CharsetFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>

Codificar en UTF-8 el javadoc. Para codificar los caracteres especiales y que se
visualicen correctamente en el javadoc, se debe establecer la siguiente propiedad en el
fichero de configuración pom.xml:
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
7.4.1.2 Derecho de Uso de las Imágenes
Uno de los principales problemas que se encuentra un desarrollador a la hora de realizar una
aplicación es encontrar imágenes libres de derechos de autor que se adapten a las necesidades
de la aplicación. Pese a que hay multitud de bancos de imágenes, éstas no siempre se adaptan
100% a lo que necesitamos. Este ha sido uno de los principales problemas durante el
desarrollo del proyecto. En numerosas ocasiones no se han encontrado imágenes que
plasmasen gráficamente lo que deseaba, por lo que se ha recurrido a la herramienta PIXLR
EDITOR para modificar e incluso crear nuevas imágenes que se adaptasen a las necesidades del
proyecto. Este proceso ha sido costoso y ha supuesto retrasos en muchas tareas, lo que se ha
visto reflejado en el alcance del proyecto, como se puede ver en los informes de seguimiento.
7.4.1.3 Envío de Ficheros con AJAX
Uno de los requisitos del sistema era añadir a la base de datos varios usuarios desde un fichero
CSV. La idea era cargar el fichero mediante un campo input de tipo file, y enviarlo con una
petición AJAX desde la parte cliente al Action de Struts2 que se encargaría de procesarlo,
evitando de esta manera el tener que recargar la página completa. El problema era que en el
lado del servidor no se conseguía recibir el fichero. Esta tarea es más simple si en lugar de
hacerlo con una petición AJAX se hace con el envío de un formulario completo y se devuelve
una vista desde el controlador de Struts2. El inconveniente es que entonces se debe recargar
toda la página tras enviar el formulario, y como he dicho, esto es lo que se pretendía evitar.
Para solucionar el problema y poder realizar el envío del fichero con AJAX, se ha hecho lo
siguiente:

Tras enviar el formulario, con JavaScript se detiene el comportamiento por defecto:
<%-- Detengo el comportamiento por defecto. --%>
event.preventDefault();
158
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Implementación del Sistema | Portal web con contenidos didácticos interactivos para reforzar
el aprendizaje de los niños

A continuación, se crea un objeto FormData de JavaScript, y se le pasa el formulario
que contiene el fichero. Con esto lo que hacemos es generar una estructura del tipo
clave/valor, similar a la que genera automáticamente el navegador cuando se envía
un formulario:
<%-Objetos con pares clave/valor para enviar los datos igual que con
un formulario.
--%>
var formData = new FormData(document.getElementById("formInsertUserFromFile"));

Se realiza la llamada AJAX:
$.ajax({
url: actionName,
dataType: 'json',
type: 'POST',
data: formData,
beforeSend: mostrarLoader, /* En generalFunctions.js. */
success: function(data){
[…]
},
error: function(xhr, status, error) {
[…]
}
});

Por último, en la parte del servidor, se debe indicar en el Action de Struts2 que se
encargará de procesar la petición, el interceptor para la carga de ficheros; éste se
llama FileUpload:
<action name="insertUsersFromFile"
class="com.jfh.elearning.presentation.user.InsertUserAction"
method="insertUsersFromFile">
<interceptor-ref name="fileUpload">
<param name="allowedTypes">text/csv</param>
</interceptor-ref>
<interceptor-ref name="defaultStack"/>
<result name="success" type="json" />
</action>
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
159
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Implementación del Sistema
Con estos pasos se consigue recibir correctamente en los Action de Struts2 los ficheros
enviados con peticiones AJAX.
7.4.1.4 Fichero CSV
Después de exportar los datos desde el Excel a un fichero con extensión CSV, cuando se leían
desde la lógica de la aplicación, la codificación de los caracteres especiales no era correcta,
pese a que se le estaba indicando a la clase BufferedReader que la codificación debía ser UTF8.
BufferedReader br = null;
FileInputStream fis = null;
String charset = "utf-8";
[…]
fis = new FileInputStream(file);
br = new BufferedReader(new InputStreamReader(fis, charset));
El problema se debía a que cuando se exportaban los datos desde el Excel, éste no mantenía la
codificación en UTF-8, por lo que fue necesario abrir el fichero CVS exportado con una
aplicación que permitiese cambiarla. En mi caso utilicé el programa Notepad++.
7.4.1.5 Maquetado
Es complicado conseguir un mismo aspecto visual de la aplicación web en todos los
navegadores debido a que algunos no soportan todas las propiedades de los estándares HTML
y CSS.
Algunos ejemplos de los problemas de maquetado que se han tenido, son los siguientes:

Efecto gradient en las fuentes. En los navegadores basados en el motor de navegación
webkit, esta tarea se puede hacer fácilmente con las siguientes propiedades:
background: -webkit-gradient(linear, left top, left bottom, from(#390), to(#fff));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
Sin embargo, este proceso se hace más complicado de conseguir en otros
navegadores. En concreto, el problema del gradiente se ha tenido en la página de login
de la aplicación web; el título “AprendeRiendo.com” tiene un degradado que va desde
un tono verdoso a blanco. Este efecto se podía haber conseguido fácilmente para
Google Chrome u Opera utilizando las propiedades anteriores, sin embargo, si las
hubiéramos utilizado el efecto no se podría visualizar en los navegadores Mozilla
Firefox o Internet Explorer. Es por ello que se ha empleado un SVG, al que si se le
puede aplicar un gradiente con la propiedad estándar linearGradient.
160
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Implementación del Sistema | Portal web con contenidos didácticos interactivos para reforzar
el aprendizaje de los niños

Efecto transform con un SVG. En el navegador Internet Explorer, el efecto transform
de CSS3 solo funciona a partir de la versión 10, sin embargo, sigue sin funcionar con los
SVG, por lo que se ha tenido que recurrir a los filtros basados en DirectX. Para
conseguir el efecto del título de la página principal, se ha tenido que hacer lo siguiente
en la animación de Internet Explorer:
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.35, M12=0, M21=0, M22=0.35,
SizingMethod='auto expand')";
Aparte de los problemas enumerados, conseguir un mismo estilo en todos los navegadores en
un proceso complicado y que requiere mucho tiempo, por lo que la presente aplicación web
solo está optimizada para Google Chrome.
7.4.1.6 Rutas Absolutas
Sin entrar en detalle de cómo realiza el proceso de modificación de las preguntas de las
autoevaluaciones, cuando se hace un cambio en una pregunta es necesario escribir los nuevos
datos en el fichero JSP donde posteriormente se van a visualizar. En la base de datos se
encuentra almacenada la ruta relativa de ese fichero JSP, pero para escribir en él es necesario
conocer la ruta absoluta, y por consiguiente, es necesario conocer la ruta absoluta donde se
encuentra desplegada la aplicación web.
Para conocer la ruta absoluta donde se encuentra desplegada la aplicación, se ha empleado el
método getServletContext de la clase ServletContext, el cual retorna el contexto de la
aplicación. Una vez obtenido el contexto, podemos obtener la ruta absoluta de un fichero con
el método getRealPath, al cual se le debe pasar la ruta relativa del fichero JSP dentro del
proyecto.
Este problema también se podía haber resulto añadiendo en el descriptor de despliegue
(fichero web.xml) la raíz donde se despliega el proyecto, pero esto implicaría tener que
modificar el fichero de configuración web.xml cada vez que se cambie la ubicación donde se
despliega la aplicación.
Otra posible solución habría sido añadir una variable de entorno que almacene la ruta absoluta
donde se encuentra despliega da la aplicación web, pero al igual que la anterior opción, sería
necesario modificar el valor de la variable cada vez que se modifique la ubicación de
despliegue de la aplicación.
Es por ello que, pese a que las anteriores opciones son totalmente válidas, y que es cierto que
no es habitual modificar frecuentemente la ruta donde se encuentra desplegada la aplicación,
considero que el método elegido facilita el despliegue de la misma, puesto que no requiere
realizar ningún cambio en los ficheros de configuración.
7.4.1.7 Tiempo de Dedicación al TFM
Compatibilizar el desarrollo del TFM con el trabajo ha supuesto un desgaste importante, pero
finalmente se ha conseguido superar utilizando las vacaciones para realizar el proyecto.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
161
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Implementación del Sistema
7.4.2
Descripción Detallada de las Clases
Se ha generado con Maven el javadoc que contiene la descripción de cada una de las clases y
métodos que componen el presente proyecto. Para consultarlo, abrir con el navegador el
archivo index.html que se encuentra en el directorio site, entregado junto con la
documentación del proyecto.
Este sitio web contiene, además del javadoc, otra información sobre el proyecto, como:




Dependencias empleadas.
Información de las licencias de las librerías utilizadas.
Información de las dependencias.
Información sobre los plugins utilizados en el proyecto.
A continuación se muestran algunas capturas de dicho sitio web:
Figura 7.1: Captuira del sitio web generado con Maven: Dependecias.
Figura 7.2: Captuira del sitio web generado con Maven: Licencias.
162
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Implementación del Sistema | Portal web con contenidos didácticos interactivos para reforzar
el aprendizaje de los niños
Figura 7.3: Captura del sitio web generado con Maven: Plugins.
Figura 7.4: Captura del sitio web generado con el ‘javadoc’ del proyecto.
Un punto muy importante a tener en cuenta es que los textos están perfectamente codificados
en UTF-8, para ello, previamente se ha definido la codificación en el fichero pom.xml:
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
163
Desarrollo de las Pruebas | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Capítulo 8. Desarrollo de las Pruebas
8.1 Pruebas Unitarias
8.1.1.1 Crear Usuario
Caso de Uso 1: Crear Usuario
Prueba
Resultado Esperado
Crear
un
usuario
no El sistema posee un usuario más.
existente.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Crear un usuario que ya El sistema no posee un usuario más y se muestra un dialogo
existe.
notificándolo.
Resultado Obtenido
El usuario se ha insertado.
Corrección
Hacer clave única la columna del DNI.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Cancelar la Operación.
El sistema permanece sin cambios.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.2 Eliminar Usuario
Caso de Uso 2: Eliminar Usuario
Prueba
Resultado Esperado
Eliminar un usuario existente. El sistema posee un usuario menos.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Eliminar un usuario que no El sistema no realiza cambios y muestra un mensaje de error.
existe.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Cancelar la Operación.
El sistema permanece sin cambios.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.3 Modificar Usuario
Caso de Uso 3: Modificar Usuario
Prueba
Resultado Esperado
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
165
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Desarrollo de las Pruebas
Modificar
existente.
un
usuario El sistema modificará las propiedades del usuario indicado.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Modificar un usuario que no El sistema no realiza cambios y muestra un mensaje de error.
existe.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Cancelar la Operación.
El sistema permanece sin cambios.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.4 Consultar Usuario
Caso de Uso 4: Consultar Usuario
Prueba
Resultado Esperado
Visualizar los datos de un El sistema muestra los datos del usuario seleccionado.
usuario
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.5 Listar Usuarios
Caso de Uso 5: Listar Usuarios
Prueba
Resultado Esperado
Visualizar el listado de El sistema muestra un listado con el conjunto de usuarios
usuarios existentes.
dados de alta en el sistema.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.6 Ordenar Usuarios
Caso de Uso 6: Ordenar Usuarios
Prueba
Resultado Esperado
Ordenar, por una columna, el El sistema muestra un listado ordenado, de acuerdo a la
listado
de
usuarios columna seleccionada, de los usuarios dados de alta en la
existentes.
aplicación.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.7 Filtrar Usuarios
Caso de Uso 7: Filtrar Usuarios
Prueba
Resultado Esperado
Introducir un parámetro de El sistema muestra un listado con los usuarios registrados que
búsqueda.
contengan en alguno de sus campos el texto introducido.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
166
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Desarrollo de las Pruebas | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
8.1.1.8 Listar Autoevaluaciones
Caso de Uso 8: Listar Autoevaluaciones
Prueba
Resultado Esperado
Visualizar el listado de El sistema muestra un listado con el conjunto de
autoevaluaciones existentes. autoevaluaciones registradas en la aplicación.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.9 Listar Preguntas de una Autoevaluación
Caso de Uso 9: Listar Preguntas de una Autoevaluación
Prueba
Resultado Esperado
Visualizar el listado de El sistema muestra un listado con el conjunto de preguntas
preguntas asociadas a una registradas en la aplicación que están asociadas a una
autoevaluación.
autoevaluación.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.10
Filtrar Autoevaluaciones
Caso de Uso 10: Filtrar Autoevaluaciones
Prueba
Resultado Esperado
Introducir un parámetro de El sistema muestra un listado con las autoevaluaciones
búsqueda.
registradas que contengan en alguno de sus campos el texto
introducido.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.11
Ordenar Autoevaluaciones
Caso de Uso 11: Ordenar Autoevaluaciones
Prueba
Resultado Esperado
Ordenar, por una columna, el El sistema muestra un listado ordenado, de acuerdo a la
listado de autoevaluaciones columna seleccionada, de las autoevaluaciones dadas de alta
existentes.
en la aplicación.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.12
Mostrar Autoevaluación
Caso de Uso 12: Mostrar Autoevaluación
Prueba
Resultado Esperado
Visualizar los datos de una El sistema muestra los datos de la autoevaluación
autoevaluación.
seleccionada.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
167
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Desarrollo de las Pruebas
8.1.1.13
Comentar Autoevaluación
Caso de Uso 13: Comentar Autoevaluación
Prueba
Resultado Esperado
Añadir un comentario a una La autoevaluación seleccionada posee un comentario más.
autoevaluación seleccionada. Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.14
Eliminar Comentario de una Autoevaluación
Caso de Uso 14: Eliminar Comentario de una Autoevaluación
Prueba
Resultado Esperado
Eliminar un comentario de La autoevaluación seleccionada posee un comentario menos.
una
autoevaluación Resultado Obtenido
seleccionada.
Se ha obtenido el resultado que se esperaba.
8.1.1.15
Modificar el Comentario de una Autoevaluación
Caso de Uso 15: Modificar el Comentario de una Autoevaluación
Prueba
Resultado Esperado
Modificar un comentario de El comentario de la autoevaluación seleccionada ha sido
una
autoevaluación modificado.
seleccionada.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.16
Modificar Pregunta
Caso de Uso 16: Modificar Pregunta
Prueba
Resultado Esperado
Modificar la plantilla y el La plantilla de la pregunta y el contenido de ésta han sido
contenido de una pregunta modificados.
seleccionada.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.17
Filtrar Pregunta
Caso de Uso 17: Filtrar Pregunta
Prueba
Resultado Esperado
Introducir un parámetro de El sistema muestra un listado con las preguntas registradas
búsqueda.
que contengan en alguno de sus campos el texto introducido.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.18
Ordenar Pregunta
Caso de Uso 18: Ordenar Pregunta
Prueba
Resultado Esperado
168
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Desarrollo de las Pruebas | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Ordenar, por una columna, el El sistema muestra un listado ordenado, de acuerdo a la
listado
de
preguntas columna seleccionada, de las preguntas registradas en la
existentes.
aplicación.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.19
Filtrar Intentos de una Autoevaluación
Caso de Uso 19: Filtrar Intentos de una Autoevaluación
Prueba
Resultado Esperado
Introducir un parámetro de El sistema muestra un listado con los intentos de realización
búsqueda.
de una autoevaluación que hay almacenados en el sistema y
que contengan en alguno de sus campos el texto introducido.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.20
Ordenar Intentos de una Autoevaluación
Caso de Uso 20: Ordenar Intentos de una Autoevaluación
Prueba
Resultado Esperado
Ordenar, por una columna, el El sistema muestra un listado ordenado, de acuerdo a la
listado de intentos de columna seleccionada, de los intentos de realización de una
realización
de
una autoevaluación almacenados en la base de datos.
autoevaluación almacenados Resultado Obtenido
en el sistema
Se ha obtenido el resultado que se esperaba.
8.1.1.21
Listar Intentos de una Autoevaluación
Caso de Uso 21: Listar Intentos de una Autoevaluación
Prueba
Resultado Esperado
Visualizar el listado de El sistema muestra un listado con el conjunto de intentos de
intentos de realización de realización de una autoevaluación.
una
autoevaluación Resultado Obtenido
seleccionada.
Se ha obtenido el resultado que se esperaba.
8.1.1.22
Listar Tareas Teoría
Caso de Uso 22: Listar Tareas Teoría
Prueba
Resultado Esperado
Visualizar el listado de tareas El sistema muestra un listado con el conjunto de tareas de
de teoría asociadas a una teoría registradas en la aplicación que están asociadas a un
autoevaluación.
bloque de teoría determinado.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.23
Ordenar Tareas Teoría
Caso de Uso 23: Ordenar Tareas Teoría
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
169
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Desarrollo de las Pruebas
Prueba
Ordenar, por una columna, el
listado de tareas de teoría
existentes.
8.1.1.24
Resultado Esperado
El sistema muestra un listado ordenado, de acuerdo a la
columna seleccionada, de las tareas de teoría existentes en la
aplicación.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Filtrar Tareas Teoría
Caso de Uso 24: Filtrar Tareas Teoría
Prueba
Resultado Esperado
Introducir un parámetro de El sistema muestra un listado con las tareas de teoría
búsqueda.
registradas que contengan en alguno de sus campos el texto
introducido.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.25
Modificar Tarea Teoría
Caso de Uso 25: Modificar Tarea Teoría
Prueba
Resultado Esperado
Modificar la plantilla y el La plantilla de la tarea y el contenido de ésta han sido
contenido de una tarea de modificados.
teoría seleccionada.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.26
Calificar Autoevaluación
Caso de Uso 26: Calificar Autoevaluación
Prueba
Resultado Esperado
Finalizar una autoevaluación. Al finalizar una autoevaluación, el sistema debe contabilizar el
número de preguntas acertadas, falladas y en blanco.
Posteriormente debe insertarlas en la base de datos como un
intento de autoevaluación más. El sistema tendrá un intento
de autoevaluación más.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.27
Seleccionar Curso
Caso de Uso 27: Seleccionar Curso
Prueba
Resultado Esperado
Seleccionar curso.
El sistema mostrará las asignaturas registradas para el curso
seleccionado.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
170
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Desarrollo de las Pruebas | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
8.1.1.28
Seleccionar Asignatura
Caso de Uso 28: Seleccionar Asignatura
Prueba
Resultado Esperado
Seleccionar asignatura.
El sistema mostrará las lecciones registradas para la
asignatura seleccionada.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.29
Seleccionar Lección
Caso de Uso 29: Seleccionar Lección
Prueba
Resultado Esperado
Seleccionar lección.
El sistema mostrará los bloques disponibles para la lección
seleccionada.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.30
Seleccionar Bloque
Caso de Uso 30: Seleccionar Bloque
Prueba
Resultado Esperado
Seleccionar bloque de teoría. El sistema mostrará la primera página de la lección
seleccionada (lección asociada a una asignatura y a un curso).
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Seleccionar
bloque
de El sistema mostrará el primer ejercicio de la lección
ejercicios.
seleccionada (lección asociada a una asignatura y a un curso).
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Seleccionar
bloque
de El sistema mostrará la primera pregunta de la lección
autoevaluación.
seleccionada (lección asociada a una asignatura y a un curso).
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.31
Realizar Tarea de Teoría
Caso de Uso 31: Realizar Tarea de Teoría
Prueba
Resultado Esperado
Ampliar imagen.
El sistema mostrará ampliada la imagen seleccionada.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.32
Realizar Autoevaluación
Caso de Uso 32: Realizar Autoevaluación
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
171
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Desarrollo de las Pruebas
Prueba
Resultado Esperado
Guardar respuesta de una El sistema almacenará la respuesta de la pregunta.
pregunta.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Dejar una pregunta en El sistema almacenará como respuesta el resultado en blanco
blanco.
para esa pregunta.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.33
Navegar Entre las Páginas de un Bloque
Caso de Uso 33: Navegar Entre las Páginas de un Bloque
Prueba
Resultado Esperado
Avanzar de página.
El sistema pasará a la página siguiente.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Avanzar de pregunta.
El sistema pasará a la pregunta siguiente.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Retroceder de página.
El sistema pasará a la página anterior.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Retroceder de pregunta.
El sistema pasará a la pregunta anterior.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.34
Consultar Ayuda
Caso de Uso 34: Consultar Ayuda
Prueba
Resultado Esperado
Consultar la ayuda de un El sistema mostrará una pista de cómo solucionar el ejercicio.
ejercicio del bloque de Resultado Obtenido
ejercicios.
Se ha obtenido el resultado que se esperaba.
8.1.1.35
Mostrar el Resultado de una Autoevaluación
Caso de Uso 35: Mostrar el Resultado de una Autoevaluación
Prueba
Resultado Esperado
Ver resultados.
El sistema mostrará las preguntas correctas e incorrectas y
las soluciones de aquellas que sean incorrectas.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
No ver resultados.
El sistema redirigirá al usuario a la página de inicio.
Resultado Obtenido
172
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Desarrollo de las Pruebas | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Se ha obtenido el resultado que se esperaba.
8.1.1.36
Consultar Ayuda
Caso de Uso 36: Consultar Ayuda
Prueba
Resultado Esperado
Finalizar autoevaluación.
El sistema enviará los resultados de la autoevaluación al
servidor.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.37
Iniciar Sesión
Caso de Uso 37: Iniciar Sesión
Prueba
Resultado Esperado
Iniciar sesión con un usuario El sistema tendrá un usuario más conectado.
dado de alta.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Iniciar sesión con un usuario El sistema no tendrá un usuario más conectado y mostrará un
no dado de alta.
mensaje de error indicando que el usuario o la contraseña
son incorrectos.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Dejar el campo nombre El sistema no tendrá un usuario más conectado y mostrará un
usuario
en
blanco
e mensaje de error indicando que el campo usuario no puede
introducir la contraseña.
estar en blanco.
Prueba
Dejar el campo contraseña
en blanco e introducir el
nombre de usuario.
Resultado Esperado
El sistema no tendrá un usuario más conectado y mostrará un
mensaje de error indicando que el campo contraseña no
puede estar en blanco.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Dejar en blanco los campos El sistema no tendrá un usuario más conectado y mostrará un
nombre de usuario y mensaje de error indicando los campos nombre de usuario y
contraseña.
contraseña no pueden estar en blanco.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.38
Cerrar Sesión
Caso de Uso 38: Cerrar Sesión
Prueba
Resultado Esperado
El usuario selecciona la El sistema cierra la sesión del usuario y tendrá un usuario
opción de cerrar la sesión.
menos conectado.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
173
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Desarrollo de las Pruebas
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
El usuario deja la sesión El sistema cierra la sesión del usuario y tendrá un usuario
inactiva.
menos conectado.
8.1.1.39
Cambiar el Idioma del Sitio Web
Caso de Uso 39: Cambiar el Idioma del Sitio Web
Prueba
Resultado Esperado
Cambiar el idioma a inglés.
El sistema cambiará el idioma de la aplicación web a inglés.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Cambiar el idioma a español. El sistema cambiará el idioma de la aplicación web a español.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Cambiar el idioma a inglés El sistema no cambiará el idioma de la aplicación.
estando ya en inglés.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Cambiar el idioma a español El sistema no cambiará el idioma de la aplicación.
estando ya en español.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
8.1.1.40
Ayuda
Caso de Uso 40: Ayuda
Prueba
Seleccionar la ayuda.
8.1.1.41
Resultado Esperado
El sistema mostrará la información de la ayuda.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Recuperar Contraseña
Caso de Uso 41: Recuperar Contraseña
Prueba
Resultado Esperado
Recuperar contraseña de un El sistema enviará al correo electrónico del usuario las
usuario existente.
instrucciones para recuperar la contraseña.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Prueba
Resultado Esperado
Recuperar contraseña de un El sistema mostrará un mensaje indicando que se ha enviado
usuario no existente.
la contraseña al correo del usuario para no dar pista de que el
usuario no existe.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
174
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Desarrollo de las Pruebas | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
8.2 Pruebas de Integración y del Sistema
Prueba
Añadir
un
administrador.
usuario
Prueba
Añadir un usuario alumno.
Prueba
Añadir un usuario profesor.
Prueba
Realizar una autoevaluación.
Prueba
Realizar una autoevaluación y
dejar 5 preguntas en blanco.
Prueba
Modificar el contenido de
una pregunta de una
autoevaluación y acceder
como usuario alumno a esa
autoevaluación.
Prueba
Modificar el contenido de un
ejercicio del bloque de
ejercicios y acceder al
sistema
como
usuario
alumno a ese bloque.
Prueba
Modificar el contenido de
una tarea de teoría y acceder
al sistema como usuario
alumno a esa tarea del
bloque de teoría.
Prueba
Acceder
como
usuario
profesor y comprobar que
hay al menos un intento de
realización
de
una
autoevaluación
(el
que
Resultado Esperado
El usuario solo tiene acceso al módulo “Gestión de Usuario”.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Resultado Esperado
Es usuario solo tiene acceso al módulo “Aprendizaje”.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Resultado Esperado
El usuario solo tiene acceso al módulo “Gestión de
Contenidos Académicos”.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Resultado Esperado
El sistema ha almacenado las respuestas en la base de datos.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Resultado Esperado
El sistema almacena las respuestas del usuario en la base de
datos de las cuales 5 están en blanco.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Resultado Esperado
El sistema ha modificado el contenido de la pregunta, ha
almacenado la respuesta de la pregunta en la base de datos y
se visualiza el nuevo contenido de la pregunta en el módulo
del alumno.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Resultado Esperado
El sistema ha modificado el contenido del ejercicio, ha
almacenado la respuesta del ejercicio en la base de datos y se
visualiza el nuevo contenido del ejercicio en el módulo del
alumno.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Resultado Esperado
El sistema ha modificado el contenido de la tarea y se
visualiza el nuevo contenido del ejercicio en el módulo del
alumno.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Resultado Esperado
El sistema muestra los datos de un intento de realización de
una autoevaluación.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
175
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Desarrollo de las Pruebas
hicimos
en
pruebas
anteriores).
Prueba
Comprobar las estadísticas
de
la
autoevaluación
realizada en la prueba
número cinco.
176
Resultado Esperado
El sistema muestra que se han dejado 5 preguntas en blanco
en esa autoevaluación.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Desarrollo de las Pruebas | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
8.3 Pruebas de Usabilidad
8.3.1
Pruebas de Usabilidad
8.3.1.1 Cuestionarios
8.3.1.1.1 Usuario 1
8.3.1.1.1.1 Preguntas de Carácter General
Nombre y apellidos
Sara Revuelta Carro
Sexo
Mujer
Edad
12
* Nivel de Estudios
Primaria Secundaria Diplomado Licenciado Master
Doctor
(Marque con una X
una casilla)
* Conocimientos de
Muy Bajo
Bajo
Medio
Alto
Muy Alto
informáticos
(Marque con una X
una casilla)
* Conocimientos de
Muy Bajo
Bajo
Medio
Alto
Muy Alto
internet (Marque
con una X una casilla)
* ¿Con que
 Todos los días
frecuencia utiliza el
 Varias veces a la semana
ordenador?
 Ocasionalmente
(Seleccione una
 Nunca o casi nunca
opción)
* En caso de usar el
ordenador
diariamente, indique 3 horas.
el número de horas
al día.
* ¿Qué tipo de
tareas realiza con el
Ocio, juegos y estudiar.
ordenador?
¿Tiene correo
Sí.
electrónico?
* ¿Sabe lo que
significa e-learning?
Sí
No
(Marque una
opción).
* En caso de que
sepa qué es elearning, descríbalo
brevemente.
* ¿Ha utilizado
alguna vez una
Sí __________________________
No
plataforma eMáster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
177
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Desarrollo de las Pruebas
learning? En caso
afirmativo, ponga un
ejemplo.
8.3.1.1.1.2
1.
2.
3.
4.
5.
6.
7.
8.
9.
Actividades guiadas
Iniciar sesión. Sin problemas.
Seleccionar un curso. Sin problemas.
Seleccionar una asignatura. Sin problemas.
Seleccionar una unidad. Sin problemas.
Seleccionar el bloque de teoría. Sin problemas.
Realizar las tareas del bloque de teoría. Sin problemas.
Volver a la vista de los bloques y seleccionar una autoevaluación. Sin problemas.
Realizar las preguntas de la autoevaluación. Sin problemas.
Cerrar sesión. Sin problemas.
8.3.1.1.2 Usuario 2
8.3.1.1.2.1 Preguntas de Carácter General
Nombre y apellidos
Sara Revuelta Carro
Sexo
Mujer
Edad
10
* Nivel de Estudios
Primaria Secundaria Diplomado Licenciado Master
Doctor
(Marque con una X
una casilla)
* Conocimientos de
Muy Bajo
Bajo
Medio
Alto
Muy Alto
informáticos
(Marque con una X
una casilla)
* Conocimientos de
Muy Bajo
Bajo
Medio
Alto
Muy Alto
internet (Marque
con una X una casilla)
* ¿Con que
 Todos los días
frecuencia utiliza el
 Varias veces a la semana
ordenador?
 Ocasionalmente
(Seleccione una
 Nunca o casi nunca
opción)
* En caso de usar el
ordenador
diariamente, indique 2 horas.
el número de horas
al día.
* ¿Qué tipo de
tareas realiza con el
Jugar y estudiar.
ordenador?
¿Tiene correo
No
electrónico?
* ¿Sabe lo que
significa e-learning?
Sí
No
(Marque una
178
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Desarrollo de las Pruebas | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
opción).
* En caso de que
sepa qué es elearning, descríbalo
brevemente.
* ¿Ha utilizado
alguna vez una
plataforma elearning? En caso
afirmativo, ponga un
ejemplo.
8.3.1.1.2.2
1.
2.
3.
4.
5.
6.
7.
8.
9.
Sí __________________________
No
Actividades guiadas
Iniciar sesión. Sin problemas.
Seleccionar un curso. Sin problemas.
Seleccionar una asignatura. Sin problemas.
Seleccionar una unidad. Sin problemas.
Seleccionar el bloque de teoría. Sin problemas.
Realizar las tareas del bloque de teoría. Sin problemas.
Volver a la vista de los bloques y seleccionar una autoevaluación. Sin problemas.
Realizar las preguntas de la autoevaluación. Sin problemas.
Cerrar sesión. Sin problemas.
8.3.1.1.3 Usuario 3
8.3.1.1.3.1 Preguntas de Carácter General
Nombre y apellidos
Martina Fernández Herrero
Sexo
Mujer
Edad
40
* Nivel de Estudios
Primaria Secundaria Diplomado Licenciado Master
Doctor
(Marque con una X
una casilla)
* Conocimientos de
Muy Bajo
Bajo
Medio
Alto
Muy Alto
informáticos
(Marque con una X
una casilla)
* Conocimientos de
Muy Bajo
Bajo
Medio
Alto
Muy Alto
internet (Marque
con una X una casilla)
* ¿Con que
 Todos los días
frecuencia utiliza el
 Varias veces a la semana
ordenador?
 Ocasionalmente
(Seleccione una
 Nunca o casi nunca
opción)
* En caso de usar el
ordenador
diariamente, indique N/A.
el número de horas
al día.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
179
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Desarrollo de las Pruebas
* ¿Qué tipo de
tareas realiza con el
ordenador?
¿Tiene correo
electrónico?
* ¿Sabe lo que
significa e-learning?
(Marque una
opción).
* En caso de que
sepa qué es elearning, descríbalo
brevemente.
* ¿Ha utilizado
alguna vez una
plataforma elearning? En caso
afirmativo, ponga un
ejemplo.
8.3.1.1.3.2
Ocio.
No
Sí
No
Sí __________________________
No
Actividades guiadas
Módulo “Aprendizaje”
N/A
Módulo “Gestión de Usuarios”
1.
2.
3.
4.
Iniciar sesión. Ha sido necesario explicarle el proceso de inicio de sesión.
Consultar el listado de usuarios dados de alta. Sin problemas.
Dar de alta un usuario. Ha sido necesario explicarle el proceso.
Modificar el usuario dado de alta en el punto 3. No sabía volver a listar los usuarios,
ha necesitado Ayuda.
5. Añadir varios usuarios desde un fichero CSV. No sabía lo que era un fichero CSV, ha
necesitado ayuda.
6. Cerrar sesión. Sin problemas.
Módulo “Gestión de Contenidos Académicos”
1.
2.
3.
4.
5.
6.
7.
8.
Iniciar sesión. Sin problemas.
Listar el conjunto de tareas y preguntas. Sin problemas.
Listar las autoevaluaciones disponibles. Sin problemas.
Ver la información de una autoevaluación. Sin problemas.
Ver las estadísticas de una autoevaluación. Sin problemas.
Ver los intentos de realización de una autoevaluación. Sin problemas.
Ver las preguntas asociadas a una autoevaluación. Sin problemas.
Modificar el contenido y la plantilla de una pregunta de una autoevaluación. Ha
necesitado ayuda.
9. Cerrar sesión. Sin problemas.
180
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Desarrollo de las Pruebas | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
8.3.1.1.3.3
Preguntas Cortas sobre la Aplicación y Observaciones
Preguntas Sobre la Identidad
Con la aplicación web abierta y sin usar el teclado y el ratón, conteste a las
Descripción
siguientes preguntas.
¿Sabría decir cómo se llama el
sitio web con lo que ve? ¿Cómo lo Sí, ApredeRiendo.com.
sabe?
¿Hay algún elemento gráfico o
Sí, el título.
texto que te haya ayudado?
¿A qué tipo de audiencia cree que
A niños de primaria.
está dirigido este sitio web?
Preguntas Sobre el Contenido
Después de comenzar a utilizar la aplicación, conteste a
Descripción
las siguientes preguntas.
¿Le ha parecido adecuado el
contenido del sitio o ha echado El contenido es adecuado.
en falta más información?
¿Al ver la portada supo cuál era
el contenido más importante que No.
se ofrecía?
Preguntas Sobre Navegación
¿Puede ver en la portada y en el
resto de las páginas la forma en Sí, con el menú.
que se navega por el sitio web?
¿Existen algún elemento en las
páginas que permita saber
exactamente dónde estás dentro
Sí, el menú.
del sitio web y cómo volver atrás
sin usar los botones del
navegador?
¿Sabe volver desde cualquier
página a la página de inicio? Sí, con el botón inicio.
¿Cómo?
Calidad del Interfaz
Muy
Poco
Nada
Aspectos gráficos
Adecuado
Adecuado
Adecuado
Adecuado
¿El tipo y tamaño de letra es
adecuado?
¿Los iconos e imágenes usados
son acordes con lo que se
pretende
representar
gráficamente?
¿Los colores empleados son
adecuados?
Diseño de la Interfaz
Si
No
A veces
¿Le resulta fácil de usar?
¿El diseño de las pantallas es claro y
atractivo?
¿Cree que el programa está bien
estructurado?
Observaciones
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
181
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Desarrollo de las Pruebas
8.3.1.1.4 Usuario 4
8.3.1.1.4.1 Preguntas de Carácter General
Nombre y apellidos
María Luz Fernández Herrero
Sexo
Mujer
Edad
41
* Nivel de Estudios
Primaria Secundaria Diplomado Licenciado Master
Doctor
(Marque con una X
una casilla)
* Conocimientos de
Muy Bajo
Bajo
Medio
Alto
Muy Alto
informáticos
(Marque con una X
una casilla)
* Conocimientos de
Muy Bajo
Bajo
Medio
Alto
Muy Alto
internet (Marque
con una X una casilla)
* ¿Con que
 Todos los días
frecuencia utiliza el
 Varias veces a la semana
ordenador?
 Ocasionalmente
(Seleccione una
 Nunca o casi nunca
opción)
* En caso de usar el
ordenador
diariamente, indique ______1______ hora.
el número de horas
al día.
* ¿Qué tipo de
tareas realiza con el
Ocio.
ordenador?
¿Tiene correo
No
electrónico?
* ¿Sabe lo que
significa e-learning?
Sí
No
(Marque una
opción).
* En caso de que
sepa qué es elearning, descríbalo
brevemente.
* ¿Ha utilizado
alguna vez una
plataforma eSí __________________________
No
learning? En caso
afirmativo, ponga un
ejemplo.
8.3.1.1.4.2
Actividades guiadas
Módulo “Aprendizaje”
182
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Desarrollo de las Pruebas | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
N/A
Módulo “Gestión de Usuarios”
7. Iniciar sesión. Sin problemas.
8. Consultar el listado de usuarios dados de alta. Sin problemas.
9. Dar de alta un usuario. La ha costado saber lo que se la pedía pero ha conseguido
añadir al usuario.
10. Modificar el usuario dado de alta en el punto 3. No sabía volver a listar los usuarios,
ha necesitado consultar el manual de usuario.
11. Añadir varios usuarios desde un fichero CSV. No sabía lo que era un fichero CSV, ha
necesitado ayuda.
12. Cerrar sesión. Sin problemas.
Módulo “Gestión de Contenidos Académicos”
10.
11.
12.
13.
14.
15.
16.
17.
Iniciar sesión. Sin problemas.
Listar el conjunto de tareas y preguntas. Sin problemas.
Listar las autoevaluaciones disponibles. Sin problemas.
Ver la información de una autoevaluación. Sin problemas.
Ver las estadísticas de una autoevaluación. Sin problemas.
Ver los intentos de realización de una autoevaluación. Sin problemas.
Ver las preguntas asociadas a una autoevaluación. Sin problemas.
Modificar el contenido y la plantilla de una pregunta de una autoevaluación. Ha
necesitado consulta la documentación para saber cómo debía introducir los datos.
18. Cerrar sesión. Sin problemas.
8.3.1.1.4.3
Preguntas Cortas sobre la Aplicación y Observaciones
Preguntas Sobre la Identidad
Con la aplicación web abierta y sin usar el teclado y el ratón, conteste a las
Descripción
siguientes preguntas.
¿Sabría decir cómo se llama el
sitio web con lo que ve? ¿Cómo lo Sí, ApredeRiendo.com.
sabe?
¿Hay algún elemento gráfico o
Sí, un título en grande.
texto que te haya ayudado?
¿A qué tipo de audiencia cree que
A niños de primaria.
está dirigido este sitio web?
Preguntas Sobre el Contenido
Después de comenzar a utilizar la aplicación, conteste a
Descripción
las siguientes preguntas.
¿Le ha parecido adecuado el
contenido del sitio o ha echado El contenido es adecuado.
en falta más información?
¿Al ver la portada supo cuál era
el contenido más importante que No.
se ofrecía?
Preguntas Sobre Navegación
¿Puede ver en la portada y en el Sí, a través del menú.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
183
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Desarrollo de las Pruebas
resto de las páginas la forma en
que se navega por el sitio web?
¿Existen algún elemento en las
páginas que permita saber
exactamente dónde estás dentro
Sí, el menú. Pero no hay un botón para volver atrás.
del sitio web y cómo volver atrás
sin usar los botones del
navegador?
¿Sabe volver desde cualquier
página a la página de inicio? Sí, con el botón inicio.
¿Cómo?
Calidad del Interfaz
Muy
Poco
Nada
Aspectos gráficos
Adecuado
Adecuado
Adecuado
Adecuado
¿El tipo y tamaño de letra es
adecuado?
¿Los iconos e imágenes usados
son acordes con lo que se
pretende
representar
gráficamente?
¿Los colores empleados son
adecuados?
Diseño de la Interfaz
Si
No
A veces
¿Le resulta fácil de usar?
¿El diseño de las pantallas es claro y
atractivo?
¿Cree que el programa está bien
estructurado?
Observaciones
8.3.1.2 Conclusiones a Partir de los Resultados
Lo que se puede deducir de los resultados obtenidos, es que el módulo de aprendizaje es muy
intuitivo y fácil de utilizar, no hay más que ver los resultados obtenidos. No sucede lo mismo
con los usuarios de los módulos de gestión de contenidos académicos y gestión de contenidos.
Han tenido algunos problemas para realizar las tareas, aunque se debe tener en cuenta que
sus conocimientos sobre las tecnologías no es muy alto, lo cual también puede explicar los
malos resultados. No obstante, los usuarios han conseguido terminar las tareas por lo que un
curso de formación podría ser suficiente para resolver las dudas. Además, siempre pueden
apoyarse en el manual de usuario.
8.4 Pruebas de Rendimiento
Prueba
Resultado Esperado
Conexión de 20 usuarios de El sistema no se cae y los tiempos de carga no son elevados.
forma simultánea.
Resultado Obtenido
Se ha obtenido el resultado que se esperaba.
184
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Desarrollo de las Pruebas | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
185
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Capítulo 9. Manuales del Sistema
9.1 Manual de Instalación
9.1.1
Servidor Web
9.1.1.1 Apache Tomcat
A continuación, se describirá el proceso de instalación de Apache Tomcat 7.0.53 en el sistema
operativo Windows 7 64 bits.
9.1.1.1.1 Datos para la Instalación y Configuración




Server Shutdown Port: 8005
HTTP/1.1 Connector Port: 8080
AJP/1.3 Connector Port: 8009
Tomcat Administrator Login
o User Name: jfhadmint
o Password: test1928.-.
o Roles: manager-gui
9.1.1.1.2 Instalación
El primer paso es descargarse el instalador de Apache Tomcat 7.0.53 para Windows 7 desde la
web oficial de Apache Tomcat.
Una vez descargado, ejecutamos el instalador en modo administrador para comenzar con la
instalación. Tras ejecutarlo, se iniciará el asistente de instalación de Apache Tomcat 7.0.53.
Pulsamos “Next”:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
187
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.1: Ventana de inicio del asistente de instalación de Apache Tomcat.
A continuación, podemos leer los términos y condiciones de la licencia de Apache Tomcat que
deberemos aceptar para continuar con la instalación:
188
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.2: Términos y condiciones de la licencia de Apache Tomcat.
Pulsamos “I Agree”. En la siguiente ventana podemos seleccionar los componentes de Apache
Tomcat que queremos instalar. En nuestro caso, dejamos las opciones por defecto, y pulsamos
“Next”:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
189
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.3: Selección de los componentes de Apache Tomcat que se quiere instalar.
En la siguiente ventana debemos introducir los puertos que utilizará Apache Tomcat, el
nombre que tendrá el servicio de Windows, y los datos del administrador, los cuales los podrá
encontrarlos en el apartado 9.1.1.1.1 Datos para la Instalación y Configuración:
190
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.4: Selección de los puertos que utilizará Apache Tomcat.
En la siguiente ventana debemos seleccionar el directorio donde se encuentra instalada la
máquina virtual de Java:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
191
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.5: Selección del directorio donde se encuentra instalada la máquina virtual de Java.
Después de seleccionar el directorio donde está instalada la máquina virtual de Java, en la
ventana siguiente debemos seleccionar el directorio donde se instalará Apache Tomcat. Una
vez seleccionemos el directorio de instalación, el asistente estará preparado para comenzar
con la instalación, por lo que pulsamos el botón “Install”.
192
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.6: Selección de la ruta de instalación de Apache Tomcat.
Una vez termine la instalación de Apache Tomcat, deseleccionamos las dos opciones marcadas
y pulsamos “Finish”:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
193
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.7: Instalación de Apache Tomcat 7 terminada.
9.1.2
Motor de Bases de Datos
9.1.2.1 PostgreSQL
A continuación, se describirá el proceso de instalación de PostgreSQL 9.3.4 en el sistema
operativo Windows 7 64 bits.
9.1.2.1.1 Datos para la Instalación y Configuración






194
Contraseña del superusuario: test123... (test123puntopuntopunto).
Puerto de escucha del servidor: 5432
Configuración regional: Configuración regional por defecto.
Rol de Login
o Rol name: jfhadmin
o Password: test321... (test321puntopuntopunto).
o Privilegios de red: Hereda permisos de roles padres.
Tablespace
o Name: tbe_elearning
o Owner: jfhadmin
Database
o Name: db_elearning
o Owner: jfhadmin
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños

o Encoding: UTF-8
o Tablespace: tbe_elearning
o Colation: Spanish_Spain.1252
Schema
o Name: schm_elearning
o Owner: jfhadmin
9.1.2.1.2 Instalación
El primer paso es descargarse el instalador de PostgreSQL 9.3.4 para Windows x86-64 desde la
web oficial de PostgreSQL.
Una vez descargado, ejecutamos el instalador en modo administrador para comenzar con la
instalación. Tras ejecutarlo, se iniciará el asistente de instalación de PostgreSQL 9.3.4.
Pulsamos “Siguiente”:
Figura 9.8: Ventana de inicio del asistente de instalación de PostgreSQL.
A continuación, se deberá especificar el directorio de instalación de PostgreSQL, en el cual se
guardarán los ejecutables, librerías y ficheros de configuración:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
195
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.9: Selección del directorio de instalación de PostgreSQL.
Tras seleccionar el directorio para almacenar el directorio de instalación, pulsamos
“Siguiente”.
En la siguiente ventana, habrá que especificar el directorio donde se almacenarán los datos
por defecto de PostgreSQL. Una vez introducida la ruta, pulsamos “Siguiente”:
196
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.10: Selección del directorio donde se almacenarán los datos por defecto de
PostgreSQL.
Introducimos una contraseña para la cuenta de superusuario (postgres) de la base de datos.
Esta cuenta será la que utilizaremos para iniciar el servidor de PostgreSQL:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
197
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.11: Introduciendo contraseña del superusuario de PostgreSQL.
Introducimos el puerto en el que deberá escuchar el servidor:
198
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.12: Selección del puerto de escucha del servidor PostgreSQL.
Seleccionamos lo configuración regional. Es este caso se ha dejado la que viene por defecto:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
199
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.13: Selección de la configuración regional de PostgreSQL.
Con esto, el asistente estará listo para comenzar con la instalación. Cuando termine,
seleccionamos “Terminar”:
200
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.14: Finalización de la instalación de PostgreSQL.
9.1.2.1.3 Configuración
En los siguientes apartados, se describirán las distintas fases de configuración de la base de
datos de PostgreSQL.
9.1.2.1.3.1 Arranque del Servidor PostgreSQL
Accedemos al administrador (pgAdmin III) de la base de datos de PostgreSQL desde “Inicio” ->
“Todos los programas” -> “PostgreSQL 9.3” -> “pgAdmin III”:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
201
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.15: Ventana de inicio de psAdmin III.
Una vez dentro de psAdmin III, desplegamos la opción “Servidores” del panel de la izquierda
de la ventana, y dentro de este, pulsamos con el botón derecho del ratón sobre “PostgreSQL
9.3 (localhost:5432). En el menú desplegable seleccionamos la opción “Conectar”, e
introducimos la contraseña del superusuario en la ventana emergente que aparecerá.
Con esto, ya tendremos el servidor de la base de datos PostgreSQL arrancado:
202
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.16: Conectando el servidor de la base de datos PostgreSQL.
9.1.2.1.3.2 Creación de un Nuevo Login Role
El siguiente paso será crear un nuevo rol de login. El rol de login es como llama PostgreSQL a
los usuarios que tendrán acceso a la base de datos. Para ello, pulsamos con el botón derecho
del ratón encima de “Login Roles” y seleccionamos la opción “New Login Role…”:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
203
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.17: Creando un nuevo rol de login.
En la ventana que se abrirá, os vamos a la pestaña “Properties” e introducimos el nombre del
rol en el campo “Name”:
204
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.18: Nombre del login de rol de la base de datos PostgreSQL.
En la pestaña “Definition”, introducimos la contraseña del usuario en el campo “Password”, y
en la ventana “Role privileges”, seleccionamos la opción “Inherits rights from parent” roles:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
205
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.19: Seleccionando la opción “Inherits rights from parent roles”.
Para finalizar, pulsamos el botón “OK”. Con esto, ya tendremos creado un nuevo rol de login:
Figura 9.20: Rol de login jfhadmin creado.
206
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
9.1.2.1.3.3 Creación de un Nuevo Tablespace
El siguiente punto es crear un nuevo tablespace donde se guardarán los datos de la base de
datos. Para ello, pulsamos con el botón derecho del ratón sobre “Tablespaces” y
seleccionamos la opción “New Tablespace…”:
Figura 9.21: Creando un nuevo tablespace.
En la ventana que se abrirá, en la pestaña “Properties” introducimos un nombre para el
tablespace, y seleccionamos el propietario en el campo “Owner”, que en este caso será el
creado en el apartado 9.1.1.1.3.2 Creación de un Nuevo Login Role:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
207
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.22: Introduciendo el nombre y propietario del nuevo tablespacede PostgreSQL.
Por último, en la pestaña “Definition” seleccionamos el directorio donde se almacenarán los
datos del tablespace. Es importante que el directorio de destino que seleccionemos exista, de
lo contrario nos dará un error avisando de que el directorio introducido no existe:
208
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.23: Seleccionando un directorio para almacenar el tablespace de la base de datos
PostgreSQL.
Una vez introduzcamos la ruta, pulsamos “OK” para finalizar. Con esto ya tendremos creado un
nuevo tablespace:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
209
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.24: Tablespace tbe_elearning creado.
9.1.2.1.3.4 Creación de la Base de Datos
Para crear la base de datos, desde el psAdmin III, pulsamos con el botón derecho del ratón
sobre “Databases” (en el panel de la izquierda) y seleccionamos la opción “New Database…”
del menú desplegable:
Figura 9.25: Creando la base de datos.
En la ventana que aparecerá, en la pestaña “Properties” debemos introducir el nombre de la
base de datos y el propietario, en los campos “Name” y “Owner” respectivamente. El
propietario será el creado en el apartado 9.1.1.1.3.2 Creación de un nuevo Login Role:
210
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.26: Creando una nueva base de datos.
En la pestaña “Definition”, debemos rellenar los siguientes campos:




Encoding
Tablespace
Collation
Character type
En la siguiente captura (o en el apartado 9.1.1.1.1 Datos para la Instalación y Configuración) se
puede ver la configuración que se debe seleccionar:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
211
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.27: Configurando la base de datos de PostgreSQL.
Para finalizar, pulsamos “OK”. Con esto tendremos la base de datos creada:
212
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.28: Base de datosde PostgreSQL creada.
9.1.2.1.3.5 Arranque de la Base de Datos
Para arrancar la base de datos, una vez hemos iniciado el servidor PostgreSQL (ver apartado
9.1.1.1.3.1 Arranque del Servidor PostgreSQL), basta con seleccionar la base de datos creada
en el apartado 9.1.1.1.3.4 Creación de la Base de Datos para que inicie automáticamente:
Figura 9.29: Iniciando la Base de Datos.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
213
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
9.1.2.1.3.6 Creación de un Esquema
Para crear un esquema que permita agrupar las tablas de la base de datos, una vez iniciada
esta, debemos pulsar con el botón derecho en “Schemas” -> “New Schema”:
Figura 9.30: Creando un nuevo esquema en la base de datos de PostgreSQL.
En la ventana que aparecerá, en la pestaña “Properties” debemos introducir un nombre para
el esquema y un propietario en los campos “Name” y “Owner” (el propietario deberá ser el
creado en el apartado 9.1.1.1.3.2 Creación de un nuevo Login Role) respectivamente:
214
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.31: Datos del nuevo esquema de la base de datos PostgreSQL.
Tras introducir los datos, pulsamos “OK”. Si desplegamos en el menú de la izquierda la opción
Schemas, veremos que tenemos el nuevo esquema creado:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
215
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.32: Nuevo esquema de la base de datos de PostgreSQL creado.
9.1.2.1.3.7 Creación de una Tabla
En este apartado no se detallará el proceso de creación de todas las tablas de la base de datos,
solo los pasos que hay que seguir para poder crear una. Se trata de un proceso repetitivo, por
lo que una vez creada una, será muy sencillo crear las demás. Para ver el conjunto de tablas y
tipos de datos de las columnas, ver el apartado Relación de Tablas de la Base de Datos
PostgreSQL.
Para crear una nueva tabla, desplegamos la opción “Schema” del menú de la izquierda,
pulsamos con el botón derecho del ratón sobre “Tables”, y seleccionamos la opción “New
Table…”:
216
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.33: Creando una nueva tabla en la base de datos de PostgreSQL.
En la ventana que aparecerá, en la pestaña “Properties” debemos cumplimentar los campos
“Name” y “Owner” con el nombre de la tabla y el propietario respectivamente (el propietario
debe ser el creado en el apartado 9.1.1.1.3.2 Creación de un nuevo Login Role):
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
217
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.34: Creando una tabla en la base de datos PostgreSQL.
En la pestaña “Definition” seleccionaremos el tablespace creado en el apartado 9.1.1.1.3.3
Creación de un Nuevo Tablespace:
218
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.35: Selección del tablespace de la tabla users.
El siguiente paso es introducir las columnas de la tabla. Para ello, nos vamos a la pestaña
“Columns” y pulsamos el botón “Add”. En la ventana “New Column…”, introducimos los datos
de los campos “Name”, “Type” y “Length” para indicar el nombre de la columna, el tipo de
dato que almacenará y la longitud que tendrá (en el caso de que se quiera especificar):
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
219
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.36: Creando una columna en la tabla users.
Adicionalmente, podemos indicar si el campo puede ser NULL o no. Esto se hará desde la
pestaña “Definition”:
220
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.37: Indicando que un campo de la tabla users no puede ser NULL.
Finalmente, pulsamos el botón “OK” para terminar de crear la columna. Para añadir más, basta
con volver a pulsar el botón “Add”.
Tras crear una columna, en la pestaña “Constraints” podemos añadir una restricción de las
siguientes:




Foreign Key
Exclude Constraint
Unique
Check
Una vez tengamos todas las columnas de la tabla añadidas y configuradas, pulsamos el botón
“OK”. Si pinchamos sobre la opción “Tables” del menú de la izquierda, podemos ver que la
tabla ha sido creada:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
221
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.38: Tabla users creada.
9.1.2.1.3.8 Configurar el Formato del Tipo Date
Por defecto en PostgreSQL, los datos de tipo “Date” se deben introducir con el formato
“aaaa/mm/dd”. Para establecer el formato europeo (dd/mm/aaaa), debemos introducir en el
Shell de PostgreSQL el siguiente comando:
SET DATESTYLE TO 'European';
9.1.2.1.3.9 Configurar el Formato de Codificación de los Datos
Para cambiar el formato de codificación de los datos, debemos introducir (como superusuario)
en el Shell de PostgreSQL el siguiente comando:
UPDATE pg_database SET encoding=6 WHERE datname='db_elearning';
9.1.3
Despliegue de la Aplicación Web
Para desplegar la aplicación en Apache Tomcat, debemos dirigirnos al directorio donde lo
instalamos, en este caso ha sido en el directorio C:\Program Files\Apache Software
Foundation (podemos verlo en el apartado 9.1.1.1.1 Instalación). En él, si entramos en el
directorio Tomcat 7.0, podemos ver todos los directorios que se han creado tras la instalación:
222
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.39: Directorio de instalación de Apache Tomcat.
El directorio que nos interesa es el webapps, en él deberemos copiar el fichero llamado
“elearning.war”. Este proceso se puede realizar con el servidor parado o en “caliente”. Como
resultado del despliegue, se nos generará un directorio llamado “elearning” con los datos de la
aplicación:
Figura 9.40: Aplicación web desplegada.
9.2 Manual de Ejecución
9.2.1
Arranque de la Base de Datos PostgreSQL
Si hicimos la instalación estándar, la base de datos se debería arrancar automáticamente al
iniciar el equipo. Si por cualquier motivo no se arrancó, se deben seguir los siguientes pasos
para arrancarla manualmente:
1. Abrir los servicios del equipo y buscar uno llamado “postgresql-x64-9-3”. Pichar con el
botón derecho sobre el servicio y seleccionar la opción “Iniciar servicio”:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
223
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.41: Buscando el servicio de la base de datos PostgreSQL.
Tras iniciarlo, en la columna estado debe aparecer como “En ejecución”:
Figura 9.42: Base de datos PostgreSQL en ejecución.
9.2.2
Arranque de Apache Tomcat
Al igual que con la base de datos PostgreSQL, el servicio Apache Tomcat se inicia
automáticamente, pero si necesitamos iniciarlo manualmente, debemos realiza el mismo
proceso que con la base de datos, pero en este caso debemos buscar el servicio llamado
“Tomcat7” e iniciarlo:
Figura 9.43: Apache Tomcat en ejecución.
224
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
9.3 Manual de Usuario
9.3.1
Procesos Comunes
9.3.1.1 Iniciar Sesión
Para poder acceder a cualquiera de los módulos del sistema, es necesario iniciar sesión. Para,
en la página principal se deben introducir el usuario y la contraseña proporcionados y pulsar
“Entrar”:
Figura 9.44: Manual de usuario - Iniciar sesión.
9.3.2
Módulo “Aprendizaje”
Cuando se accede al módulo de aprendizaje, lo primero que se muestra son los cursos
académicos; el usuario alumno deberá seleccionar uno para continuar (en el ejemplo se
seleccionará sexto):
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
225
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.45: Manual de usuario - Seleccionar curso.
El siguiente paso, es seleccionar la asignatura que se quiere estudiar; en el ejemplo se
seleccionará “Matemáticas”:
Figura 9.46: Manual e usuario - Seleccionar asignatura.
A continuación el alumno tendrá que elegir la unidad de teoría que quiere estudiar;
seleccionaremos la 1. Números naturales para realizar el ejemplo:
226
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.47: Manual de usuario - Seleccionar unidad.
Llegados a este punto, lo siguiente sería seleccionar un bloque:
Figura 9.48: MAnual de usuario - Seleccionar un bloque.
9.3.2.1 Realizar Autoevaluación
Vamos a ver como sería el proceso para realizar una autoevaluación. En primer lugar, se debe
seleccionar el bloque “Autoevaluación” en la pantalla donde se muestran los bloques en los
que está dividida cada lección. Una vez seleccionado, se empezarán a mostrar las preguntas:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
227
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.49: MAnual de usuario - Realizar autoevaluación.
Cada vez que el usuario conteste a una pregunta, deberá seleccionar la opción guardar, sino el
sistema considerará que la pregunta se ha dejado en blanco.
El alumno podrá moverse hacia delante (salvo en la última pregunta) y hacia atrás (excepto en
la primera pregunta). Una vez realizadas todas las preguntas, en la pregunta número 10 se
podrá terminar la autoevaluación y enviar los resultados:
Figura 9.50: Manual de usuario - Realizar autoevaluación (enviar respuestas).
Tras enviar las respuestas, el sistema preguntará al usuario si desea ver las preguntas
acertadas y falladas –en caso de que sean falladas se mostrarán las soluciones-:
228
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.51Manual de usuario - Realizar autoevaluación (pregunta para ver las soluciones).
Si se selecciona “Sí”, se mostrarán las preguntas acertadas y falladas; en caso de las falladas se
mostrarán las soluciones. Si se selecciona “No” se redirecciona al usuario a la página de inicio:
Figura 9.52: Manual de usuario - Realizar autoevaluación (pregunta fallada).
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
229
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.53: Manual de usuario - Realizar autoevaluación (pregunta acertada).
Cuando el usuario considere que ha terminado la revisión, debe seleccionar la opción
“Terminar” para salir de la autoevaluación; será redireccionado a la página de inicio.
9.3.2.2 Estudiar una Lección de Teoría
Vamos a ver como sería el proceso para estudiar un bloque teórico. En primer lugar, se debe
seleccionar el bloque “Teoría” en la pantalla donde se muestran los bloques en los que está
dividida cada lección. Una vez seleccionado, se empezarán a mostrar las pantallas con las
explicaciones didácticas:
Figura 9.54: Manual de usuario - Lección de teoría (página 1).
230
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Se puede ir a la página siguiente y volver a la anterior, en total hay 6 páginas. Cuando se
termine de estudiar y se quiera salir, en la última página hay que seleccionar el botón
“Terminar”:
9.3.3
Módulo “Gestión de Usuarios”
9.3.3.1 Primer Acceso
Cuando se accede al módulo de gestión de usuarios, lo primero que se muestra es la pantalla
principal del módulo, donde se puede leer un mensaje explicativo indicando las tareas que se
pueden llevar a cabo desde el módulo:
Figura 9.55: Página principal de la web del administrador.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
231
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
9.3.3.2 Listar los Usuarios Dados de Alta
Para ver el listado de usuarios dados de alta en el sistema, debemos seleccionar la opción
“Usuarios” del menú; seguido nos aparecerán el conjunto de usuarios registrados en la
aplicación web:
Figura 9.56: Listado de usuarios dados de alta en el sistema.
9.3.3.3 Eliminar un Usuario
Para eliminar un usuario dado de alta en el sistema, desde la ventada donde se visualiza el
listado de usuarios del sistema se debe seleccionar la opción “Eliminar”:
Figura 9.57: Eliminar un usuario del sistema.
232
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
A continuación, el sistema nos pedirá que confirmemos la operación:
Figura 9.58: Mensaje de confirmación para eliminar un usuario.
Finalmente, si aceptamos, el usuario será eliminado del sistema:
Figura 9.59: Mensaje de notificación de usuario eliminado.
9.3.3.4 Editar un Usuario
Para editar los datos de un usuario, desde el listado de usuarios registrados en el sistema
debemos seleccionar la opción “Editar” de un usuario:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
233
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.60: Botón para editar un usuario.
Tras seleccionar el botón “Editar”, se mostrarán los datos del usuario:
Figura 9.61: Datos para editar el usuario.
En este ejemplo, se ha modificado el segundo apellido del usuario por ‘Fernández’; tras
pinchar en la opción ‘Guardar’, el sistema actualizará los datos y mostrará un mensaje
notificando que los datos se han actualizado correctamente:
234
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.62: Mensaje de notificación de que el usuario se ha actualizado correctamente.
9.3.3.5 Añadir un Usuario Desde Formulario
Para añadir un usuario desde un formulario, en la vista donde se muestra la relación de
usuarios dados de alta, seleccionamos la pestaña “Añadir Nuevos Usuarios”, y posteriormente
seleccionamos la opción “Desde Formulario”:
Figura 9.63: Añadiendo un nuevo usuario desde un formulario.
Tras rellenar los compas, seleccionamos la opción ‘Guardar’:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
235
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.64: Guardando los datos del nuevo usuario.
Tras guardas los cambios, el sistema mostrará una notificación indicando que el usuario se
almacenó correctamente:
Figura 9.65: Notificación de que el usuario se ha insertado correctamente.
Posteriormente el formulario se vaciará para añadir un nuevo usuario.
9.3.3.6 Añadir Usuarios Desde un Fichero
Para añadir un usuario desde un fichero; en la misma vista desde donde se ha añadido el
usuario desde un formulario, se debe seleccionar la opción “Desde Fichero”:
236
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.66: Añadir usuarios desde fichero.
A continuación se debe seleccionar la opción “Seleccionar Fichero”; automáticamente se abrirá
un selector de ficheros desde donde se deberá escoger el fichero con extensión CSV que
contiene los usuarios separados; lo usuarios deben estar separados en filas y en cada fila las
propiedades deben estar separadas por el carácter “;”:
Figura 9.67: Selector de fichero.
Posteriormente, una vez se cargue el fichero, se debe seleccionar la opción “Subir Fichero” y se
mostrará un mensaje indicando el número de usuarios que se insertó:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
237
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
Figura 9.68: Añadir usuarios desde fichero.
9.3.4
Módulo “Gestión de Contenidos Académicos”
9.3.4.1 Primer Acceso
Cuando se accede al módulo de gestión de contenidos académicos, lo primero que se muestra
es la pantalla principal del módulo, donde se puede leer un mensaje explicativo indicando las
tareas que se pueden llevar a cabo desde el módulo:
Figura 9.69: Página principal del módulo del profesor.
238
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
9.3.4.2 Listar Tareas/Preguntas
Para mostrar el listado de las tareas de los bloques de teoría y de las preguntas de las
autoevaluaciones, se debe seleccionar la opción “Tareas” del menú:
Figura 9.70: Listar las tareas de los bloques de teoría y las preguntas de las
autoevaluaciones.
9.3.4.3 Listar Autoevaluaciones
Para ver el listado de autoevaluaciones almacenadas en el sistema, se debe seleccionar la
opción “Autoevaluaciones” del menú:
Figura 9.71: Listar las autoevaluaciones almacenadas en el sistema.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
239
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
9.3.4.4 Ver los Detalles de Una Autoevaluación
Desde el listado de autoevaluaciones registradas en el sistema, se debe seleccionar la opción
“Ver” de una autoevaluación; posteriormente, se podrá ver la información de la
autoevaluación, los intentos de los alumnos y las preguntas asociadas a esa autoevaluación:
Figura 9.72: Información de una autoevaluación.
9.3.4.5 Modificar el Contenido de una Pregunta
Para modificar una pregunta de una autoevaluación, en primer lugar debemos listar las
preguntas; esto lo podemos hacer o desde la opción “Tareas” del menú, o desde la
información de una autoevaluación, en la pestaña “Preguntas”:
Figura 9.73: Preguntas ee una autoevaluación (Se han filtrado los resultados).
240
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
En la imagen anterior, se muestran filtrados por el valor “1” las preguntas de la
autoevaluación; seleccionamos la pregunta 1:
Figura 9.74: Modificando una pregunta de una autoevaluación.
A continuación, debemos seleccionar una plantilla y rellenar los campos que se nos indica:
Figura 9.75: Editando el contenido de una pregunta de una autoevaluación.
9.4 Manual del Programador
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
241
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
9.4.1
Variables de Entorno
Antes de comenzar a desarrollar ampliaciones del sistema, es necesario haber definido
previamente las variables de entorno que se describirán en los siguientes apartados.
9.4.1.1 JAVA_HOME
Se debe añadir al sistema una nueva variable de entorno que llamaremos JAVA_HOME, y que
indicará el directorio raíz donde se encuentra instalado el JDK:
Figura 9.76: Añadiendo la variable de entorno JAVA_HOME.
Una vez terminado, debemos editar la variable de entorno “Path” y añadir al final la siguiente
línea:
;%JAVA_HOME%\bin;
Quedando como se muestra a continuación:
Figura 9.77: Añadiendo al “Path” la ruta de acceso a los ejecutables de Java.
9.4.1.2 CLASSPATH
CLASSPATH es la variable de entorno que almacena la ruta a las librerías empleadas en los
entornos Java.
Añadimos una nueva variable de entorno que se llamará “CLASSPATH”, e indicaremos el
directorio donde se encuentran las librerías que nombramos en el párrafo anterior:
242
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.78: Añadiendo al sistema la variable de entorno CLASSPATH.
9.4.1.3 M2_HOME
Esta variable de entorno indicará al sistema el directorio raíz en el que se encuentra instalado
Maven:
Figura 9.79: Añadiendo al sistema la variable de entorno M2_HOME.
Una vez, hay que añadir a la variable de entorno “Path” la ruta de acceso a los ejecutables de
Maven 3. Para ello, añadimos al final del “Path”, la siguiente línea:
;%M2_HOME%\bin;
Quedando como se muestra a continuación:
Figura 9.80: Añadiendo al “Path” la ruta de los ejecutables de Maven 3.
9.4.2
Generar Javadoc
Para generar el site con la información del proyecto. Se deben seguir los siguientes pasos:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
243
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Manuales del Sistema
1. Abrir una consola y situarse dentro del directorio del proyecto en el workspace:
Figura 9.81: Directorio del proyecto.
2. Ejecutar el comando mvn site (se trata de un goal de Maven, más información en el
apartado 7.2.2 Maven) y esperar a que finalice la operación. Al terminar debe aparecer
el mensaje BUILD SUCCESS:
Figura 9.82: Comando ‘mvn site’ de Maven.
Figura 9.83: Finalización de la ejecución del comando ‘mvn site’ de Maven.
3. Cuando terminen las operaciones del punto anterior, ejecutar el comando mvn
javadoc:javadoc (se trata del plugin maven-javadoc-plugin Maven, más información en
el apartado 7.2.2 Maven) y esperar a que finalice la operación. Al terminar debe
aparecer el mensaje BUILD SUCCESS:
Figura 9.84: Ejecución del comando 'mvn javadoc:javadoc' de Maven.
244
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Manuales del Sistema | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Figura 9.85: Finalización de la ejecución del comando 'mvn javadoc:javadoc' de Maven.
9.4.3
Generar Fichero de Despliegue
Para generar el fichero de despliegue, desde una consola debemos posicionarnos dentro del
directorio del proyecto y ejecutar el comando ‘mvn install’.
9.4.4
Añadir Textos a los Ficheros Properties
Los textos de los properties no se deben modificar directamente; para añadir un nuevo texto a
un properties se debe añadir a los ficheros textos.properties y textos_en.properties, y
posteriormente ejecutar los scripts codificar.bat y codificar_en.bat que se encargan de
codificar los textos en UTF-8 y escribirlo en los ficheros de properties.
Es posible que sea necesario modificar las rutas donde se encuentran los ficheros de textos y
properties en los scripts.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
245
Conclusiones y Ampliaciones | Portal web con contenidos didácticos interactivos para
reforzar el aprendizaje de los niños
Capítulo 10. Conclusiones
Ampliaciones
10.1
y
Conclusiones
Finalmente se ha conseguido implementar un prototipo funcional del sistema al que por falta
de tiempo se ha tenido que reducir el alcance. No obstante, los resultados obtenidos han sido
muy buenos, por lo que espero que este prototipo del sistema no se quede aquí y se amplíe en
un futuro.
El prototipo que se ha construido finalmente, incluye las siguientes funcionalidades:



Módulo “Aprendizaje”. Permite realizar una autoevaluación y estudiar un bloque de
teoría, mostrar las soluciones de las preguntas de las autoevaluaciones y guardar las
respuestas a estas preguntas en la base de datos. Finalmente por falta de tiempo no se
ha podido implementar el bloque de ejercicios. El bloque sacrificado ha sido este por
su similitud con el bloque de autoevaluaciones. Por otro lado, no se han realizado
todas las autoevaluaciones y todos los bloques de teoría para todos los cursosasignaturas-lecciones ya que sería una tarea repetitiva y el principal objetivo era
determinar si el sistema a implementar sería útil.
Módulo “Gestión de Usuarios”. Permite listar los usuarios almacenados en la base de
datos, eliminarlos, ver sus detalles y dar de alta otros nuevos. Se añadió una opción
fuera del alcance inicial del proyecto a petición de la tutora que consiste en añadir
usuarios desde un fichero con extensión CSV.
Módulo “Gestión de Contenidos Académicos”. Permite listar el conjunto de preguntas
de las autoevaluaciones y las tareas de teoría. Se pueden listar las autoevaluaciones
que hay almacenadas en la base de datos, ver su información, los intentos de los
alumnos de realizar la autoevaluación ver las estadísticas de los resultados de las
autoevaluaciones y ver las preguntas asociadas. Estas preguntas se pueden modificar y
cambiarles las plantillas entre varios tipos: Pregunta/Respuesta, Verdadero/False y
Preguntas con varias Opciones. Este último punto de las plantillas se añadió a petición
de la tutora, por lo que es también una tarea que está fuera del alcance inicial.
Durante el desarrollo del proyecto han surgido numerosos problemas, principalmente con
Struts2. A pesar de que han salido nuevas versiones, hay determinadas tareas que resulta
engorroso de hacer, y que es más fácil de implementar con otras tecnologías como Spring. No
obstante, esta lucha me ha permitido fortalecer ciertos conceptos y conocer mejor otras
tecnologías.
En lo personal, el desarrollo del presente proyecto ha sido muy favorable. He empleado
frameworks como Maven que no sabía utilizar y que en el mundo laboral es muy importante
conocer, dado su gran auge en los últimos tiempos. También me ha permitido reforzar y
ahondar más en otras tecnologías como Spring, JavaScript o CSS que quizás en el Máster no se
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
247
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Conclusiones y Ampliaciones
pudieron ver más detenidamente por falta de tiempo. En definitiva, estoy muy satisfecho con
el trabajo realizado.
10.2
Ampliaciones
Puesto que se trata de un prototipo y ha faltado mucho tiempo para implementar el sistema
completo, el abanico de ampliaciones es bastante amplio. A continuación se describirán las
más importantes.
10.2.1
Bloque Ejercicios
Una de las primeras ampliaciones que se debería realizar en el sistema sería implementar el
bloque de ejercicios del módulo “Aprendizaje”.



¿Cómo se implementaría?
o El proceso de implementación sería casi idéntico al del bloque autoevaluación.
En este bloque, además, debería haber un botón que permita al alumno
mostrar algún tipo de ayuda o pista sobre cómo continuar con el ejercicio.
¿Por qué no se ha incluido?
o Como se acordó en una de las reuniones mantenidas con la tutora, por falta de
tiempo no se ha podido realizar este bloque del módulo “Aprendizaje”.
¿Qué aportaría?
o Permitiría a los alumnos practicar los ejercicios antes de realizar las
autoevaluaciones.
10.2.2
Mecanismo de Recuperación de Contraseña
Es también muy importante proporcionar un mecanismo que permita a los usuarios recuperar
la contraseña por ellos mismos. Tal como está implementado el sistema, solo el administrador
puede modificar las contraseñas de los usuarios.



248
¿Cómo se implementaría?
o El sistema debería enviar un correo al usuario con una URL que genere el
sistema. Tras acceder a ella, se le debería pedir al usuario que introdujese una
contraseña nueva.
¿Por qué no se ha incluido?
o Nuevamente, la falta de tiempo ha sido uno de los principales hándicaps.
¿Qué aportaría?
o Permitiría al usuario recuperar la contraseña él mismo sin tener que acudir al
centro de estudios para que el administrador del sistema se la restableciera.
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Conclusiones y Ampliaciones | Portal web con contenidos didácticos interactivos para
reforzar el aprendizaje de los niños
10.2.3
Estadísticas de los Usuarios
Una opción muy interesante sería mostrar datos estadísticos por cada uno de los alumnos que
ha realizado una autoevaluación: número de veces que ha realizado una autoevaluación,
número de preguntas acertadas/falladas/en blanco de una autoevaluación que ha realizado,
etc.



¿Cómo se implementa?
o Sería muy parecido a como se muestran ahora las estadísticas. El principal
cambio serían las consultas SQL que se deberían hacer a la base de datos.
¿Por qué no se ha implementado?
o No formaba parte de la funcionalidad que había pedido la tutora, y aunque se
podría haber añadido posteriormente, no se disponía de tiempo.
¿Qué añadiría?
o Permitiría hacer un seguimiento más exhaustivo de los alumnos.
10.2.4
Aumentar el Seguimiento de los Usuarios
Sería interesante que el profesor, además de poder ver quién ha realizado las
autoevaluaciones, pudiese ver quién ha estudiado los apartados de teoría y ejercicios.



¿Cómo se implementaría?
o Una opción sería crear en la base de datos dos tablas; una para los bloques de
teoría y otra para los bloques de ejercicios, y almacenar los identificadores de
los usuarios que han realizado cada uno de los bloques que hay creados.
¿Por qué no se ha implementado?
o No formaba parte de la funcionalidad que había pedido la tutora, y aunque se
podría haber añadido posteriormente, no se disponía de tiempo.
¿Qué añadiría?
o Permitiría hacer un seguimiento más exhaustivo de los alumnos. Una
aplicación útil, sería mandar deberes a casa, como leer un tema o hacer unos
ejercicios. El profesor solo tendría que modificar los contenidos de la lección o
de los ejercicios.
10.2.5
Accesibilidad
Es necesario mejorar la accesibilidad del sitio web para todo tipo de personas con
discapacidades.


¿Por qué no se ha implementado?
o Como se puede ver en los informes de seguimiento, se ha tenido que reducir
el alcance por falta de tiempo.
¿Qué añadiría?
o Permitiría que personas con discapacidades se pudiesen manejar mejor en el
sitio web.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
249
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Conclusiones y Ampliaciones
10.2.6 Crear y Configurar las Preguntas y Tareas de
los Bloques Ejercicios, Autoevaluaciones y Teoría
Actualmente el sistema permite modificar las preguntas de las autoevaluaciones pero no
crearlas. Sería interesante que el profesor pudiese crear preguntas y definir cuáles se
mostrarán en una autoevaluación.

¿Cómo se implementaría?
o Al igual que se modifican las autoevaluaciones, salvo que en lugar de machacar
el contenidos de una JSP, se crearía una nueva. Posteriormente, en la sección
donde se muestra en detalle una autoevaluación, en el apartado donde se
pueden ver la relación de preguntas que forma la autoevaluación, habría un
conjunto de preguntas de reserva. La idea sería poner una checkbox por
ejemplo, indicando las preguntas que forman la autoevaluación.
o ¿Por qué no se ha implementado?
 No formaba parte de la funcionalidad que había pedido la tutora, y
aunque se podría haber añadido posteriormente, no se disponía de
tiempo.
o ¿Qué aportaría?
 Una aplicación útil sería por ejemplo si el profesor tiene varios grupos
y quiere que cada grupo realice un determinado tipo de preguntas
diferente.
10.2.7 Crear Plantillas para las Tareas del Bloque de
Teoría
Sería necesario crear plantillas para las tareas del bloque de teoría, de manera que el profesor
pueda elegir cuál poner, al igual que con las autoevaluaciones. Actualmente los estilos ya están
definidos y no se puede modificar los contenidos que se visualizan.



250
¿Cómo se implementaría?
o El proceso sería muy similar a como se hace con las preguntas de las
autoevaluaciones.
¿Por qué no se ha implementado?
o Formaba parte del alcance inicial del proyecto, pero por falta de tiempo se
tuvo que eliminar.
¿Qué aportaría?
o Libertad a los profesores para modificar el contenido de las tareas de teoría, lo
cual es el objetivo principal del proyecto.
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Presupuesto | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje
de los niños
Capítulo 11. Presupuesto
En esta sección se detallan el presupuesto de costes y el presupuesto elaborado para el
cliente.
El desarrollo del presente sistema no tiene fines comerciales, por lo que se intentará enfocar
como si se pretendiese vender a un cliente.
11.1
Identificación de Costes
En los posteriores apartados se detallaran todos los constes directos e indirectos que ha
supuesto la implementación del sistema.
11.1.1
Desarrollo del Sistema
Como se comentó en el Capítulo 4: Planificación, para el desarrollo del sistema, aunque ha
sido implementado por una sola persona, se han empleado seis perfiles. En la tabla que se
muestra a continuación se detallan las tasas estándar de cada uno de ellos:
Rol
Tasa estándar
Analista
12,00 €/hr
Desarrollador Web
9,00 €/hr
Jefe de Proyecto
15,00 €/hr
Programador
9,00 €/hr
Técnico de Sistemas
9,00 €/hr
Tester
10,00 €/hr
Figura 11.1: Tabla con los perfiles profesionales.
En la tabla que se muestra a continuación se detallan las horas que han trabajado cada uno de
los roles y los costes que han supuesto:
Concepto
Analista
Desarrollador Web
Jefe de Proyecto
Programador
Técnico de Sistemas
Tester
Cantidad
Horas
1,00
1,00
1,00
1,00
1,00
1,00
322,00
624,00
160,70
120,00
10,00
76,00
Precio
Unidad
12,00 €
9,00 €
15,00 €
9,00 €
9,00 €
10,00 €
Total
11.1.2
TOTAL
3.864,00 €
5.616,00 €
2.410,50 €
1.080,00 €
90,00 €
760,00 €
13.820,50 €
Costes Hardware
Para el desarrollo del proyecto (y futuros) se ha comprado un ordenador portátil modelo Asus
F550CA-CJ561H por un valor unitario de 699 €:
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
251
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Presupuesto

Precio unitario del equipo: 699 €
11.1.2.1
Amortización
Se ha utilizado un factor de amortización para determinar lo que se le debe cobrar al cliente
por el equipo informático. Este factor se determina en función de la vida útil del equipo y de la
duración del proyecto:


Vida útil de equipo informático: 5 años.
Duración del proyecto: 126 días.
Con estos datos, pasaremos a calcular la parte que se le debe cobrar al cliente por el
ordenador portátil.
Cálculo del Coste Mensual del Equipo Informático


Coste anual = 699 € / 5 años = 139,80 €/año
Coste mensual =139,80 € /12 meses = 11,65 €
11.1.3
Costes Fijos
A continuación se detallan los costes fijos mensuales que supone el desarrollo del proyecto:
Precio
Unidad
500,00 €
50,00 €
30,96 €
37,00 €
11,65 €
40,00 €
669,61 €
Concepto
Alquiler local oficina
Luz, agua y gas
Seguro de responsabilidad civil
Seguro del local
Amortización de los equipos informáticos
Material de oficina
Total
Calculo de los Costes Fijos del Proyecto


Los costes fijos mensuales son de 669,61 €.
Costes fijos diarios: 669,61 € / 30 días = 22,32 €/día
La duración del proyecto es de 126 días, por lo que los costes fijos del proyecto serán: 126 días
x 22,32 €/día = 2812,32 €
11.1.4
Costes Variables
En la siguiente tabla se muestran los costes variables que se han tenido a lo largo del proyecto:
Concepto
Desplazamientos
252
Cantidad
13
Precio
Unidad
100,00 €
Total
Total
1.300,00 €
1.300,00 €
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Presupuesto | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje
de los niños
11.2
Presupuestos
11.2.1
Presupuesto de Costes
A continuación se muestra el presupuesto de costes. Se trata de un presupuesto interno que
no se le entregará al cliente.
Item SubItem
01
001
002
003
004
005
006
02
03
Concepto
Cantidad
Horas
Precio
Unidad
1,00
1,00
1,00
1,00
1,00
1,00
322,00
624,00
160,70
120,00
10,00
76,00
12,00 €
9,00 €
15,00 €
9,00 €
9,00 €
10,00 €
Desarrollo de la Aplicación
Analista
Desarrollador Web
Jefe de Proyecto
Programador
Técnico de Sistemas
Tester
Costes fijos
Costes variables
Total
11.2.1.1
TOTAL
13.820,50 €
3.864,00 €
5.616,00 €
2.410,50 €
1.080,00 €
90,00 €
760,00 €
2.812,32 €
1.300,00 €
17.932,82 €
Cálculo del Benefició y Facturación
El margen de beneficio aplicado será del 20%.

Beneficio. 17.932,82 € x 20% = 3586,56 €
El importe de facturación de la aplicación será el coste del desarrollo del sistema más el
beneficio:

Facturación. 17.932,82 € + 3586,57 € = 21.519,39 €
11.2.2
Presupuesto del Cliente
A continuación se muestra el presupuesto que se ha entregado al cliente.
Se deberá pagar el 20% del importe al inicio del proyecto, y el resto una vez realizada la
entrega del mismo.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
253
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Presupuesto
Item SubItem
01
02
001
03
001
04
001
254
Concepto
Aplicación Web
Mantenimiento
Corrección de bugs (1 año)
Formación
Administradores
Instalación y configuración
Base de Datos
Servidor Web Tomcat
Cantidad
Horas
Precio
Unidad
1,00
-
300,00 €
5,00
3,00
50,00 €
1,00
1,00
2,00
0,50
75,00 €
75,00 €
Subtotal
IVA (21%)
Total
TOTAL
21.519,39 €
300,00 €
300,00 €
750,00 €
750,00 €
187,50 €
150,00 €
37,50 €
22.756,89 €
4.778,95 €
27.535,84 €
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Referencias Bibliográficas | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
Capítulo 12. Referencias
Bibliográficas
12.1
Referencias en Internet
[ARPUG] Entrada de “ArPUG: Grupo de usuarios PostgreSQL de Argentina”. “pgAdmin 3”.
http://www.postgresql.org.ar/trac/wiki/PgAdmin.
[Camacho10] Camacho, Erick. Texto reproducido de SG. “NoSQL la evolución de las bases de
datos”. Disponible en http://sg.com.mx/revista/42/nosql-la-evolucion-las-bases-datos. 2010.
[García13] García Luis, Luis Miguel. Texto reproducido de Un poco de Java. “Un poco de
MongoDB:
¿Qué
es?
¿Qué
ofrece?”.
Disponible
en
http://unpocodejava.wordpress.com/2013/01/30/un-poco-de-mongodb-que-es-que-ofrece.
2013.
[Gregory15] Gregory, H. Texto reproducido de ““Valores Web”. “Modelo Vista Controlador |
MVC”. http://www.valoresweb.com/modelo-vista-controlador-mvc/. 2015.
[Martínez10] Martínez, Rafael. Texto reproducido de PostgreSQL. “Sobre PostgreSQL”.
Disponible en http://www.postgresql.org.es/sobre_postgresql. 2010.
[Moll14] Moll, Santiago. Texto reproducido de “Justifica tu respuesta”. “¿Qué es el e-learning?
20 Ventajas del aprendizaje electrónico”. http://justificaturespuesta.com/que-es-el-e-learning20-ventajas-del-aprendizaje-electronico/. 2014.
[Olmedo12] OLMEDO, Yolanda. Texto reproducido de SolidQ. “¿Qué es MapReduce?
Disponible en http://blogs.solidq.com/es/big-data/que-es-mapreduce/ 2012.
[Sotolongo13]
Anthony
Rafael
Sotolongo
León.
http://www.slideshare.net/asotolongo/mongo-db-vs-couchdb-en-app-de-comercio-ele. 2013.
[Wikipedia14A]
Entrada
de
“Wikipedia”.
http://es.wikipedia.org/wiki/CRUD. 2014.
“CRUD”.
Disponible
en
[Wikipedia14B] Entrada de “Wikipedia”. “AJAX”. http://es.wikipedia.org/wiki/AJAX. 2014.
[Wikipedia14C]
Entrada
de
“Wikipedia”.
“Apache
https://es.wikipedia.org/wiki/Apache_Struts. 2014.
[Wikipedia15A]
Entrada
de
“Wikipedia”.
http://es.wikipedia.org/wiki/Framework. 2015.
Struts”.
“Framework”.
[Wikipedia15AA]
Entrada
de
“Wikipedia”.
http://es.wikipedia.org/wiki/Mozilla_Firefox. 2015.
Disponible
Disponible
“Mozilla
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
en
en
Firefox”.
255
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Referencias Bibliográficas
[Wikipedia15AB] Entrada de “Wikipedia”. “Java (lenguaje de programación)”. Disponible en
https://es.wikipedia.org/wiki/Java_(lenguaje_de_programaci%C3%B3n). 2015.
[Wikipedia15AC]
Entrada
de
“Wikipedia”.
https://es.wikipedia.org/wiki/Java_EE. 2015.
“Java
EE”.
Disponible
en
[Wikipedia15B] Entrada de “Wikipedia”. “Modelo-vista-controlador”. Disponible en
http://es.wikipedia.org/wiki/Modelo%E2%80%93vista%E2%80%93controlador. 2015.
[Wikipedia15C] Entrada de Wikipedia “Lenguaje unificado de modelado”. Disponible en
http://es.wikipedia.org/wiki/Lenguaje_unificado_de_modelado. 2015.
[Wikipedia15D] Entrada de “Wikipedia”. “Programación por capas”. Disponible en
http://es.wikipedia.org/wiki/Programaci%C3%B3n_por_capas. 2015.
[Wikipedia15E] Entrada de “Wikipedia”. “Sistema de gestión de base de datos”. Disponible en
http://es.wikipedia.org/wiki/Sistema_de_gesti%C3%B3n_de_bases_de_datos. 2015.
[Wikipedia15F]
Entrada
de
Wikipedia.
http://es.wikipedia.org/wiki/MySQL. 2015.
“MySQL”.
Disponible
en
[Wikipedia15G] Entrada de Wikipedia. “MongoDB”. http://es.wikipedia.org/wiki/MongoDB.
2015.
[Wikipedia15H]
Entrada
de
Wikipedia.
http://es.wikipedia.org/wiki/CouchDB. 2015.
“CouchDB”.
[Wikipedia15I]
Entrada
de
“Wikipedia”.
“Hoja
de
http://es.wikipedia.org/wiki/Hoja_de_estilos_en_cascada. 2015.
Disponible
estilos
en
en
cascada”.
[Wikipedia15J] Entrada de “Wikipedia”. “HTML”. http://es.wikipedia.org/wiki/HTML. 2015.
[Wikipedia15K] Entrada de “Wikipedia”. “JSON”. http://es.wikipedia.org/wiki/JSON. 2015.
[Wikipedia15L]
Entrada
de
“Wikipedia”.
“Scalable
http://es.wikipedia.org/wiki/Scalable_Vector_Graphics. 2015.
Vector
Graphics”.
[Wikipedia15M]
Entrada
de
“Wikipedia”.
“Extensible
https://es.wikipedia.org/wiki/Extensible_Markup_Language. 2015.
Markup
Language”.
[Wikipedia15N] Entrada de “Wikipedia”. “Log4j”. https://es.wikipedia.org/wiki/Log4j. 2015.
[Wikipedia15O] Entrada de “Wikipedia”. “Maven”. http://es.wikipedia.org/wiki/Maven. 2015.
[Wikipedia15P]
Entrada
de
“Wikipedia”.
https://es.wikipedia.org/wiki/Google_Chart. 2015.
“Google
Chart”.
[Wikipedia15Q] Entrada de “Wikipedia”. “JavaScript”. http://es.wikipedia.org/wiki/JavaScript.
2015.
[Wikipedia15R] Entrada de “Wikipedia”. “jQuery”. http://es.wikipedia.org/wiki/JQuery. 2015.
256
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Referencias Bibliográficas | Portal web con contenidos didácticos interactivos para reforzar el
aprendizaje de los niños
[Wikipedia15S] Entrada de “Wikipedia”. “jQuery UI”. http://es.wikipedia.org/wiki/JQuery_UI.
2015.
[Wikipedia15T]
Entrada
de
“Wikipedia”.
http://es.wikipedia.org/wiki/Spring_Framework. 2015.
“Spring
Framework”.
[Wikipedia15U] Entrada de “Wikipedia”. “Tomcat”. http://es.wikipedia.org/wiki/Tomcat.
2015.
[Wikipedia15V]
Entrada
de
“Wikipedia”.
http://es.wikipedia.org/wiki/Eclipse_(software). 2015.
[Wikipedia15W]
Entrada
de
“Wikipedia”.
http://es.wikipedia.org/wiki/Google_Chrome. 2015.
“Eclipse
(Software)”.
“Google
Chrome”.
[Wikipedia15X]
Entrada
de
“Wikipedia”.
http://es.wikipedia.org/wiki/Internet_Explorer. 2015.
“Internet
Explorer”.
[Wikipedia15Y]
Entrada
de
“Wikipedia”.
http://es.wikipedia.org/wiki/Microsoft_Office. 2015.
“Microsoft
[Wikipedia15Z]
Entrada
de
“Wikipedia”.
http://es.wikipedia.org/wiki/Microsoft_Project. 2015.
“Microsoft
Office”.
Project”.
[W3C] Texto reproducido de “W3C España”. “Guía Breve de Tecnologías XML”.
http://www.w3c.es/Divulgacion/GuiasBreves/TecnologiasXML.
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
257
Apéndices | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
Capítulo 13. Apéndices
13.1
Contenido Entregado
13.1.1
Contenidos
13.1.1.1.1
Estructura General Directorios Entregados
Directorio
./
./elearning
./ddbb
./distribucion
./documentación
./documentacion/actas_apertura_cierre
./documentacion/informes_seguimiento
./ documentacion /planificación
./ documentación/presupuesto
./ documentacion /diagramas
./site
13.1.1.1.2
Recomendación de la Estructura de Directorios de “desarrollo”
Directorio
./
./files
./src
Contenido
Contiene un fichero leeme.txt explicando
toda esta estructura.
Contiene toda la estructura de directorios del
proyecto para desarrollo.
Backup de la base de datos del proyecto con
todas las tablas generadas.
Ficheros utilizados para la instalación del
proyecto. Finalmente este directorio no se
entrega porque no hay suficiente espacio
para realizar la entrega del TFM.
Contiene toda la documentación asociada al
proyecto.
Contiene las actas de apertura y cierre del
proyecto.
Contiene todos los informes de seguimiento
del proyecto.
Contiene los ficheros del Microsoft Project
con la planificación inicial y la planificación
final.
Contiene el documento con el presupuesto
del proyecto.
Contiene todos los ficheros del Enterprise
Architect con los diagramas incluidos en la
documentación
Sitio web generado con Maven que contiene
toda la información referente al proyecto:
javadoc, librerías utilizadas, licencias de las
librerías utilizadas, etc.
Contenido
Contiene los ficheros de proyecto del IDE
utilizado.
Fichero CVS con usuarios de prueba.
Ficheros fuente
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
259
Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de los niños |
Apéndices
./src/main/java
./src/resources
./webapp
./webapp/web_administrators
./webapp/web_students
./webapp/web_teachers
13.2
Todos los ficheros Java, lógicamente
agrupados en los paquetes correspondientes.
Ficheros de recursos de la aplicación.
Este directorio contiene los ficheros (.JSP,
.ASPX, .HTML, …) de la Web (si el proyecto
incluyese una).
Módulo “Gestión de Usuarios”.
Módulo “Aprendizaje”.
Módulo
“Gestión
de
Contenidos
Académicos”.
Índice Alfabético
A
administrador, 34, 35, 36, 50, 51, 58, 63, 64, 65, 75,
85, 97, 145, 175, 185, 188, 193, 199, 246
Administrador, 30, 32, 34, 49, 75
alumnos, 15, 19, 20, 21, 30, 32, 33, 36, 39, 42, 43, 44,
45, 46, 53, 59, 60, 82, 89, 105, 245, 246, 247
Apache Maven, 23, 105, 125, 139, 140, 151
Apache Tiles, 23, 147, 148
aplicación, 15, 16, 19, 20, 23, 24, 25, 26, 30, 47, 49,
59, 82, 90, 91, 92, 93, 97, 100, 104, 105, 115, 116,
125, 134, 135, 138, 139, 140, 141, 142, 143, 144,
147, 148, 150, 151, 152, 154, 155, 158, 160, 161,
166, 167, 169, 170, 174, 181, 183, 220, 221, 247,
248, 251
autoevaluaciones, 15, 19, 20, 30, 32, 36, 37, 39, 40,
49, 52, 59, 60, 61, 70, 91, 100, 101, 109, 114, 142,
161, 167, 245, 246, 247, 248
C
Capas, 25
Ciencias Naturales, 30, 55
contenidos didácticos, 3, 15, 19, 20, 21
Controlador, 23, 24, 107, 253
CRUD, 22, 253
D
diseño, 16, 25, 26, 28, 30, 48, 83, 84, 85, 99, 120,
135, 151, 181, 184
E
estudiar, 3, 15, 19, 20, 30, 32, 84, 105, 135, 224, 228,
229, 245
F
framework, 22, 23, 24, 61, 106, 142, 145, 146, 147,
148, 149
Framework, 22, 23, 148, 253, 255
G
gestión de usuarios, 15, 30, 49, 59, 105
I
interfaz, 3, 15, 16, 19, 22, 24, 30, 61, 82, 83, 84, 89,
100, 101, 102, 116, 117, 122, 124, 143, 144, 157
IoC, 23
L
Lengua y Literatura, 30, 32, 43, 55
Log4j, 23, 140, 254
logging, 23, 140
M
Matemáticas, 3, 30, 32, 43, 55, 224
material didáctico, 19, 21, 22, 44
Modelo, 23, 24, 107, 253, 254
módulo, 19, 23, 24, 30, 60, 61, 62, 65, 69, 82, 83, 84,
86, 87, 89, 97, 98, 105, 125, 137, 142, 144, 145,
175, 223, 229, 236, 246
MVC, 23, 24, 25, 61, 146, 147, 253
educación primaria, 5, 30
e-learning, 15, 19, 20, 21, 22, 253
E-Learning, 22
260
Jesús Fernández Herrero | Máster en Ingeniería Web - Escuela de Ingeniería
Informática - Universidad de Oviedo
Apéndices | Portal web con contenidos didácticos interactivos para reforzar el aprendizaje de
los niños
P
Palabra1, 5
planificación, 16, 27, 28, 153, 155
plantillas, 20, 23, 30, 53, 54, 61, 100, 101, 111, 122,
148, 245, 248
profesores, 3, 15, 19, 20, 21, 30, 32, 33, 34, 36, 37,
38, 39, 40, 41, 42, 46, 82, 89, 105, 248
prototipo, 15, 30, 245, 246
Spring, 23, 102, 117, 118, 125, 139, 145, 146, 147,
148, 245, 255
Spring JDBC, 23, 125
Spring JdbcTemplate, 23
Struts2, 23, 24, 25, 61, 85, 100, 106, 138, 139, 146,
147, 148, 154, 158, 159, 160, 245
T
tres capas, 25, 99
R
U
ResultSets, 23, 125, 146
UML, 26, 27, 151
S
SGBD, 26, 47, 49, 79, 81, 103, 125, 156
Sistema de Gestión de Bases de Datos, 26, 47, 76, 79,
81, 103, 105
V
Vista, 23, 24, 83, 84, 107, 253
Máster en Ingeniería Web - Escuela de Ingeniería Informática - Universidad de
Oviedo | Jesús Fernández Herrero
261
Was this manual useful for you? yes no
Thank you for your participation!

* Your assessment is very important for improving the work of artificial intelligence, which forms the content of this project

Download PDF

advertising