Biblioteca de actividades: comunidad de recursos para monitores en el tiempo libre
Abstract
Desarrollo de una comunidad web con Joomla! para compartir recursos (juegos, manualidades, cuentos, dinámicas de grupo, etc.) para monitores en el tiempo libre.
Full text
Análisis de requisitos Biblioteca de actividades Biblioteca de actividades Comunidad de recursos para monitores en el tiempo libre Alumno: Daniel Gómez López Director: Carles Farré Tost Titulación: Ingeniería informática
Índice de contenidos Biblioteca de actividades 2 Índice de contenidos 1. Introducción ........................................................................................................................ 9 1.1. Motivación del proyecto / Antecedentes ....................................................................... 9 1.1.1. Motivación del proyecto ........................................................................................ 9 1.1.2. Antecedentes ........................................................................................................ 9 1.2. Objetivos generales del proyecto ................................................................................11 1.3. Planificación inicial ......................................................................................................12 2. Análisis de requisitos .........................................................................................................14 2.1. Estudio de requisitos ...................................................................................................14 2.2. Requisitos funcionales ................................................................................................17 2.2.1. Sitio web ..............................................................................................................17 2.2.2. Recursos .............................................................................................................18 2.2.3. Administración .....................................................................................................18 2.3. Requisitos no funcionales ...........................................................................................18 2.3.1. Usabilidad ............................................................................................................18 2.3.2. Fiabilidad .............................................................................................................18 2.3.3. Compatibilidad .....................................................................................................18 2.3.4. Disponibilidad ......................................................................................................18 2.4. Interfaces ....................................................................................................................19 2.4.1. Diseño y aspecto .................................................................................................19 2.4.2. Navegación ..........................................................................................................19 2.4.3. Personalización ...................................................................................................19 2.5. Restricciones ..............................................................................................................19 2.6. Avisos legales .............................................................................................................20 3. Especificación ....................................................................................................................21 3.1. Actores .......................................................................................................................21 3.1.1. Usuario no registrado ...........................................................................................21 3.1.2. Usuario registrado ...............................................................................................21 3.1.3. Autor ....................................................................................................................22 3.1.4. Administrador.......................................................................................................22 3.2. Diagramas de Casos de uso .......................................................................................23 3.2.1. Usuario no registrado ...........................................................................................23 3.2.2. Usuario registrado ...............................................................................................24 3.2.3. Autor ....................................................................................................................25 3.2.4. Administrador.......................................................................................................25 3.3. Descripciones de Casos de uso ..................................................................................26 3.3.1. Usuario no registrado ...........................................................................................26 3.3.2. Usuario registrado ...............................................................................................31 3.3.3. Autor ....................................................................................................................46 3.3.4. Administrador.......................................................................................................49 3.4. Modelo Conceptual .....................................................................................................61 3.4.1. Diagrama de clases .............................................................................................61 3.4.2. Restricciones de integridad ..................................................................................61
Índice de contenidos Biblioteca de actividades 3 4. Diseño ...............................................................................................................................62 4.1. Arquitectura física del sistema ....................................................................................62 4.2. Estudio de Tecnología ................................................................................................63 4.2.1. Opciones .............................................................................................................63 4.2.2. Opción escogida ..................................................................................................64 4.2.3. Comparativa de gestores de contenidos ..............................................................64 4.3. Arquitectura lógica del sistema: Diseño en capes .......................................................67 4.3.1. Descripción de la Tecnología que se utilizará en cada capa. ...............................67 4.3.2. Diseño de la Capa de Presentación Web .............................................................69 4.3.3. Diseño y menús ...................................................................................................72 4.3.4. Diseño de la Capa de Dominio y acceso a datos .................................................72 4.3.5. Diseño de la Base de Datos .................................................................................76 5. Implementación..................................................................................................................85 5.1. Descripción del entorno de desarrollo .........................................................................85 5.2. Ejemplos ilustrativos para explicar el uso de las tecnologías utilizadas .......................87 5.2.1. Estructura de Joomla! ..........................................................................................88 5.2.2. Extensiones implementadas .............................................................................. 100 5.2.3. Extensiones de terceros utilizadas ..................................................................... 100 5.2.4. Mecanismos de permisos .................................................................................. 101 5.2.5. Gestión de idiomas ............................................................................................ 102 5.2.6. Categorías ......................................................................................................... 103 5.2.7. Formularios ........................................................................................................ 104 5.2.8. Autocompletado de materiales ........................................................................... 105 5.2.9. Fichero de manifiesto ......................................................................................... 108 6. Pruebas del Sistema ........................................................................................................ 111 6.1. Diseño de juegos de pruebas y resultados obtenidos ............................................... 111 6.1.1. Pruebas funcionales .......................................................................................... 111 6.1.2. Pruebas de usabilidad ....................................................................................... 113 6.1.3. Pruebas de rendimiento ..................................................................................... 113 7. Planificación real y valoración económica ........................................................................ 116 7.1. Planificación real ....................................................................................................... 116 7.2. Valoración económica ............................................................................................... 117 8. Conclusiones y trabajo futuro ........................................................................................... 119 8.1. Conclusiones y valoración personal .......................................................................... 119 8.2. Trabajo futuro ........................................................................................................... 120 9. Bibliografía y referencias .................................................................................................. 121 9.1. Bibliografía ................................................................................................................ 121 9.2. Referencias............................................................................................................... 121 9.2.1. Archivos y documentos web .............................................................................. 121 9.2.2. Sitios web .......................................................................................................... 122 Anexos .................................................................................................................................... 124 A) Instalación, ejecución y mantenimiento ..................................................................... 125 B) Manual de usuario .................................................................................................... 131 C) Pruebas de rendimiento ............................................................................................ 137
Índice de contenidos Biblioteca de actividades 4 Ilustraciones Ilustración 1-1 Captura de manualidadesparaniños.org ............................................................................. 10 Ilustración 1-2 Captura de tiempolibre.org .................................................................................................. 10 Ilustración 1-3 Captura de chicosygrandes.com ......................................................................................... 11 Ilustración 2-1 Preferencias de contenido ................................................................................................... 14 Ilustración 2-3 Necesidad de buscador y foro............................................................................................. 15 Ilustración 2-4 Tipos de filtro ....................................................................................................................... 15 Ilustración 2-2 Preferencias multimedia y contenido complementario ....................................................... 15 Ilustración 2-5 Utilidad de las redes sociales .............................................................................................. 16 Ilustración 2-6 Guardar en favoritos y votar el contenido ........................................................................... 16 Ilustración 3-1 Jerarquía de usuarios .......................................................................................................... 21 Ilustración 3-2 Diagrama de casos de uso de usuario no registrado.......................................................... 23 Ilustración 3-3 Diagrama de casos de uso de usuario registrado............................................................... 24 Ilustración 3-4 Diagrama de casos de uso de autor ................................................................................... 25 Ilustración 3-5 Diagrama de casos de uso de administrador ...................................................................... 25 Ilustración 3-6 Diagrama de clases UML .................................................................................................... 61 Ilustración 4-1 Esquema de arquitectura física ........................................................................................... 62 Ilustración 4-2 Mapa de navegación del portal de recursos (frontend) ...................................................... 69 Ilustración 4-3 Mapa de navegación del panel de administración (backend) ............................................. 69 Ilustración 4-4 Diagrama de navegación de Crear actividad ...................................................................... 70 Ilustración 4-5 Diagrama de navegación de Comentar noticia ................................................................... 70 Ilustración 4-6 Diagrama de navegación de Crear material ....................................................................... 71 Ilustración 4-7 Diagrama de navegación de Eliminar categorías de actividad ........................................... 71 Ilustración 4-8 Estructura del portal web ..................................................................................................... 72 Ilustración 4-9 Esquema del patrón Modelo-Vista-Controlador .................................................................. 73 Ilustración 4-11 Diagrama de secuencia de Enviar formulario de creación de actividad (parte 1) ............ 74 Ilustración 4-12 Diagrama de secuencia de Enviar formulario de creación de actividad (parte 2) ............ 74 Ilustración 4-10 Diagrama de secuencia de Mostrar formulario de creación de actividad ......................... 74 Ilustración 4-13 Diagrama de secuencia de Guardar media (parte 1) ........................................................ 75 Ilustración 4-14 Diagrama de secuencia de Guardar media (parte 2) ........................................................ 75 Ilustración 4-15 Diagrama de secuencia de Finalizar edición .................................................................... 75 Ilustración 4-16 Diagrama de base de datos. Integración de tablas nuevas .............................................. 83 Ilustración 4-17 Diagrama de base de datos. Uso de tablas existentes ..................................................... 84 Ilustración 5-1 Entorno de desarrollo NetBeans ......................................................................................... 85 Ilustración 5-2 API de PHP ......................................................................................................................... 86 Ilustración 5-3 API de Joomla! .................................................................................................................... 86 Ilustración 5-4 phpMyAdmin........................................................................................................................ 87 Ilustración 5-5 Jerarquía de controladores ................................................................................................. 91 Ilustración 5-6 Jerarquía de modelos .......................................................................................................... 93 Ilustración 7 Captura de la pantalla de inicio .............................................................................................. 99 Ilustración 5-8 Permisos de usuario registrado para las actividades ....................................................... 102 Ilustración 5-9 Permisos de usuario registrado para las noticias ............................................................. 102 Ilustración 5-10 Gestión de categorías de actividades ............................................................................. 103 Ilustración 5-11 Ejemplo de uso del nuevo campo de autocompletado ................................................... 108 Ilustración 6-1 Gráfico de las pruebas de rendimiento ............................................................................. 115
Índice de contenidos Biblioteca de actividades 5 Ilustración A-1 Página de inicio de Apache Server ................................................................................... 125 Ilustración A-2 Configuración de MySQL .................................................................................................. 126 Ilustración A-3 Cliente MySQL .................................................................................................................. 126 Ilustración A-4 Configuración phpMyAdmin .............................................................................................. 127 Ilustración A-5 Comprobaciones previas para Joomla! ............................................................................ 128 Ilustración A-6 Configuración principal de Joomla! ................................................................................... 128 Ilustración A-7 Icono del gestor de actividades y formulario de instalación de extensiones. ................... 129 Ilustración B-1 Área de identificación de usuario ...................................................................................... 131 Ilustración B-2 Ventana de acceso a Facebook ....................................................................................... 131 Ilustración B-3 Menú actividades .............................................................................................................. 132 Ilustración B-4 Formulario de actividad ..................................................................................................... 132 Ilustración B-5 Envío y gestión de contenido multimedia ......................................................................... 133 Ilustración B-6 Vista de las actividades del usuario .................................................................................. 133 Ilustración B-7 Votación de contenidos ..................................................................................................... 134 Ilustración B-8 Vista de las categorías del foro......................................................................................... 134 Ilustración B-9 Menú de administración .................................................................................................... 135 Ilustración B-10 Pestañas del Gestor de artículos .................................................................................... 135 Ilustración B-11 Gestor de materiales ....................................................................................................... 135 Ilustración B-12 Panel de control de Kunena............................................................................................ 135 Ilustración B-13 Gestor de usuarios .......................................................................................................... 136
Índice de contenidos Biblioteca de actividades 6 Tablas Tabla 1-1 Ventajas e inconvenientes de manualidadesparaniños.org ....................................................... 10 Tabla 1-2 Ventajas e inconvenientes de tiempolibre.org ............................................................................ 10 Tabla 1-3 Ventajas e inconvenientes de chicosygrandes.com ................................................................... 11 Tabla 1-4 Diagrama de Gantt de la planificación inicial .............................................................................. 13 Tabla 3-1 Funcionalidades por usuario ....................................................................................................... 23 Tabla 3-2 Descripción del caso de uso Consultar actividad ....................................................................... 26 Tabla 3-3 Descripción del caso de uso Consultar noticia ........................................................................... 27 Tabla 3-4 Descripción del caso de uso Consultar post .............................................................................. 28 Tabla 3-5 Descripción del caso de uso Registrarse ................................................................................... 29 Tabla 3-6 Descripción del caso de uso Recuperar contraseña .................................................................. 30 Tabla 3-7 Descripción del caso de uso Identificarse .................................................................................. 31 Tabla 3-8 Descripción del caso de uso Cerrar sesión ................................................................................ 32 Tabla 3-9 Descripción del caso de uso Darse de baja ............................................................................... 33 Tabla 3-10 Descripción del caso de uso Ver perfil ..................................................................................... 34 Tabla 3-11 Descripción del caso de uso Crear nueva actividad................................................................. 35 Tabla 3-12 Descripción del caso de uso Modificar actividad ...................................................................... 36 Tabla 3-13 Descripción del caso de uso Listar actividades de usuario ...................................................... 37 Tabla 3-14 Descripción del caso de uso Comentar actividad ..................................................................... 38 Tabla 3-15 Descripción del caso de uso Votar actividad ............................................................................ 39 Tabla 3-16 Descripción del caso de uso Añadir actividad a favoritos ........................................................ 40 Tabla 3-17 Descripción del caso de uso Eliminar actividad de favoritos .................................................... 41 Tabla 3-18 Descripción del caso de uso Comentar noticia ........................................................................ 42 Tabla 3-19 Descripción del caso de uso Votar noticia ................................................................................ 43 Tabla 3-20 Descripción del caso de uso Crear post ................................................................................... 44 Tabla 3-21 Descripción del caso de uso Responder post .......................................................................... 45 Tabla 3-22 Descripción del caso de uso Publicar noticia ........................................................................... 46 Tabla 3-23 Descripción del caso de uso Modificar noticia .......................................................................... 47 Tabla 3-24 Descripción del caso de uso Listar noticias de usuario ............................................................ 48 Tabla 3-25 Descripción del caso de uso Eliminar actividad ....................................................................... 49 Tabla 3-26 Descripción del caso de uso Crear categoría de actividad ...................................................... 50 Tabla 3-27 Descripción del caso de uso Modificar categoría de actividad ................................................. 51 Tabla 3-28 Descripción del caso de uso Eliminar categoría de actividad .................................................. 52 Tabla 3-29 Descripción del caso de uso Eliminar noticia ........................................................................... 53 Tabla 3-30 Descripción del caso de uso Crear categoría de noticia .......................................................... 54 Tabla 3-31 Descripción del caso de uso Modificar categoría de noticia .................................................... 55 Tabla 3-32 Descripción del caso de uso Eliminar categoría de noticia ...................................................... 56 Tabla 3-33 Descripción del caso de uso Crear sección de foro ................................................................. 57 Tabla 3-34 Descripción del caso de uso Modificar sección de foro............................................................ 58 Tabla 3-35 Descripción del caso de uso Eliminar sección de foro ............................................................. 59 Tabla 3-36 Descripción del caso de uso Eliminar post ............................................................................... 60 Tabla 4-1 Comparativa de gestores de contenido ...................................................................................... 67 Tabla 4-2 Esquema de la tabla actividades ................................................................................................ 76 Tabla 4-3 Esquema de la tabla actividades_bookmarks ............................................................................ 77 Tabla 4-4 Esquema de la tabla actividades_materiales ............................................................................. 77
Índice de contenidos Biblioteca de actividades 7 Tabla 4-5 Esquema de la tabla actividades_materiales_uso ..................................................................... 77 Tabla 4-6 Esquema de la tabla actividades_media .................................................................................... 77 Tabla 4-7 Esquema de la tabla actividades_rating ..................................................................................... 78 Tabla 4-8 Esquema de la tabla assets ........................................................................................................ 78 Tabla 4-9 Esquema de la tabla categories ................................................................................................. 79 Tabla 4-10 Esquema de la tabla content .................................................................................................... 80 Tabla 4-11 Esquema de la tabla content_rating ......................................................................................... 80 Tabla 4-12 Esquema de la tabla extensions ............................................................................................... 80 Tabla 4-13 Esquema de la tabla menu ....................................................................................................... 81 Tabla 4-14 Esquema de la tabla menu_types ............................................................................................ 81 Tabla 4-15 Esquema de la tabla modules .................................................................................................. 82 Tabla 4-16 Esquema de la tabla modules_menu ....................................................................................... 82 Tabla 4-17 Esquema de la tabla usergroups .............................................................................................. 82 Tabla 4-18 Esquema de la tabla users ....................................................................................................... 82 Tabla 4-19 Esquema de la tabla user_usergroup_map .............................................................................. 83 Tabla 6-1 Resultados de las pruebas de rendimiento .............................................................................. 114 Tabla 7-1 Planificación de la definición del proyecto (inicial y real) ......................................................... 116 Tabla 7-2 Planificación de la implementación y el testeo (inicial y real) ................................................... 117 Tabla 7-3 Planificación de la redacción de la memoria y la presentación (inicial y real) ......................... 117 Tabla 7-4 Coste de personal ..................................................................................................................... 118 Tabla C-1 Pruebas de rendimiento con carga nula .................................................................................. 137 Tabla C-2 Pruebas de rendimiento con carga media ............................................................................... 137 Tabla C-3 Pruebas de rendimiento con carga alta ................................................................................... 137
Índice de contenidos Biblioteca de actividades 8 Código Código 5-1 Estructura de ficheros del componente Actividades en el frontend ......................................... 89 Código 5-2 Estructura de ficheros del componente actividades en el backend ......................................... 90 Código 5-3 Clase ActividadesControllerActividad del frontend .................................................................. 92 Código 5-4 Clase ActividadesModelActividades del frontend .................................................................... 94 Código 5-5 Clase ActividadesViewActividad del frontend .......................................................................... 95 Código 5-6 Módulo de comentarios sociales .............................................................................................. 96 Código 5-7 Plugin de votación de actividades ............................................................................................ 98 Código 5-8 Ejemplo de tratamiento de permisos ...................................................................................... 102 Código 5-9 Ejemplos de asignación clave-valor ....................................................................................... 103 Código 5-10 Contenido de Material.xml .................................................................................................... 104 Código 5-11 Ejemplo de carga de formulario desde el modelo ................................................................ 105 Código 5-12 Asignación del formulario a la vista ...................................................................................... 105 Código 5-13 Visualización de los campos desde la plantilla (recorriendo la lista) ................................... 105 Código 5-14 Visualización de los campos desde la plantilla (mostrando un campo concreto) ................ 105 Código 5-15 Creación de campo de formulario personalizado ................................................................. 106 Código 5-16 Método getInput del nuevo campo del formulario ................................................................ 106 Código 5-17 Obtención de la lista para el nuevo campo del formulario ................................................... 107 Código 5-18 Contenido JavaScript para el nuevo campo del formulario ................................................. 108 Código 5-19 Datos generales del manifiesto actividades.xml .................................................................. 109 Código 5-20 Descripción de los ficheros del backend y de idiomas ........................................................ 109 Código 5-21 Descripción de los ficheros de instalación y desinstalación ................................................ 110 Código 5-22 Descripción de los ficheros del frontend y de idiomas ......................................................... 110
Introducción Biblioteca de actividades 9 1. Introducción 1.1. Motivación del proyecto / Antecedentes 1.1.1. Motivación del proyecto Hace unos años obtuve el título de monitor de tiempo libre. Desde entonces una de las cosas que más me gusta hacer es trabajar con niños. He trabajado varios años en campamentos de verano y a la hora de planificar las actividades siempre me he encontrado con el mismo problema; la falta de ideas. Hablando con profesionales de la educación y compañeros de trabajo (monitores y monitoras) me he dado cuenta de que todos coinciden en la dificultad de encontrar material didáctico y lúdico a través de Internet. Tras conocer el problema, he pensado en las vías más comunes que existen para encontrar material didáctico: Una de ellas consiste en que dos o más personas compartan sus ideas y recursos a través de diferentes medios: reuniones, por teléfono, por email, etc. El principal inconveniente es que el acceso a esos recursos está limitado a un conjunto de personas muy reducidas. Otra opción son los sitios web que comparten recursos para todos los internautas. Creo que es importante, antes de pensar en construir un proyecto, estudiar las soluciones existentes. De este modo, podemos analizar las carencias y virtudes de otros sitios web para ofrecer una solución más útil. Por este motivo, se ha creído oportuno realizar un estudio de los antecedentes. 1.1.2. Antecedentes Aunque se han encontrado múltiples propuestas, de menor y mayor calidad, se muestran sólo las que me han parecido más relevantes. Manualidades para niños Manualidades para niños [MANUALIDADESPARANINOS] es un blog que publica con cierta frecuencia manualidades en general. En algunas ocasiones las manualidades están fuera del alcance de los niños debido a su dificultad. El contenido no es muy abundante pero en mi opinión es un buen blog. Está un poco limitado en funciones de cara al usuario, que sólo se limita a leer y comentar dudas. Un usuario puede ofrecerse a colaborar si se pone en contacto con el autor del blog. Actualmente son varios los usuarios que publican manualidades, que además complementan incluyendo algunas imágenes.
Análisis de requisitos Biblioteca de actividades 16 Según las encuestas, 7 de cada 10 usuarios utilizaría las redes sociales para acceder al sistema, comentar o compartir contenido. Ilustración 2-5 Utilidad de las redes sociales Poder guardar actividades preferidas o votar la calidad de las demás no parece resultar muy atractivo para el usuario. A estas funcionalidades, por lo tanto, se les dará menor prioridad. Ilustración 2-6 Guardar en favoritos y votar el contenido Después de analizar los resultados e incluir algunas características básicas (que no se han incluido en las encuestas por considerarse necesarias), se han clasificado los requisitos en varios grupos: funcionales, no funcionales, de interfaz, restricciones y avisos legales.
Análisis de requisitos Biblioteca de actividades 17 2.2. Requisitos funcionales Los requisitos funcionales describen el funcionamiento del sistema, cómo se comporta y qué características posee. Se han agrupado en tres categorías: Sitio web, Recursos y Administración. 2.2.1. Sitio web El sistema deberá permitir a los usuarios consultar noticias publicadas por otros usuarios. El sistema deberá permitir a los usuarios consultar actividades propuestas por otros usuarios. El sistema deberá permitir a los usuarios buscar actividades según diferentes criterios. El sistema deberá permitir a los usuarios comentar las diferentes actividades para dar a conocer sus opiniones o experiencias en la realización de dicha actividad. El sistema deberá permitir a los usuarios registrados crear actividades y así aumentar el contenido del portal. El sistema deberá permitir a los usuarios registrados votar las diferentes actividades con el fin de establecer un orden de calidad. El sistema deberá permitir a los usuarios registrados añadir a una lista de favoritos las diferentes actividades y así localizarlas posteriormente de forma más rápida. El sistema deberá proporcionar un foro para que los usuarios registrados puedan comentar sus experiencias que no tengan relación con ningún contenido específico publicado. El sistema deberá permitir a los usuarios registrados consultar sus actividades creadas, editarlas y eliminarlas. El sistema deberá permitir a los autores crear noticias sobre distintas categorías. El sistema deberá permitir a los usuarios registrarse e identificarse en el sistema de dos maneras distintas: rellenando un formulario con sus datos o a través de su cuenta de Facebook.
Análisis de requisitos Biblioteca de actividades 18 2.2.2. Recursos El sistema deberá diferenciar de forma clara los tipos de actividades. El sistema deberá almacenar junto a la actividad información acerca de la edad recomendada para realizar la actividad, el tipo de actividad o el tamaño de grupo necesario (pequeño, mediano o grande). El sistema deberá ser capaz de mostrar contenido multimedia junto a la actividad, como imágenes, vídeos o audio. El sistema deberá mostrar información sobre los materiales necesarios para realizar una actividad concreta. 2.2.3. Administración El sistema deberá ser capaz de permitir al administrador gestionar todas las actividades publicadas, así como materiales y noticias. El sistema deberá ser capaz de permitir al administrador moderar el foro. El sistema deberá permitir al administrador eliminar usuarios que usen de forma malintencionada el portal web. El sistema deberá permitir al administrador crear nuevas categorías, tanto para las actividades como para las noticias. 2.3. Requisitos no funcionales 2.3.1. Usabilidad El sistema será fácil de usar. El usuario no necesitará ningún conocimiento adicional para su uso que el de la navegación por Internet. 2.3.2. Fiabilidad El sistema deberá ser fiable. Tendrá que dar una imagen de seguridad y no deberá tener fallos. 2.3.3. Compatibilidad El sistema deberá ser compatible con los principales navegadores web de escritorio. 2.3.4. Disponibilidad El sistema deberá estar disponible el 99% del tiempo, dejando ese 1% para tareas de mantenimiento y suponiendo que no haya caídas en el servidor.
Análisis de requisitos Biblioteca de actividades 19 2.4. Interfaces 2.4.1. Diseño y aspecto El aspecto del sistema deberá ser fresco y atractivo sin ser demasiado infantil. Los usuarios deben disfrutar con la búsqueda de actividades y la creación de estos. El perfil de los usuarios es el de personas que trabajan con niños, por lo que están acostumbrados a entornos divertidos y simpáticos. Este aspecto será el mismo para todo el sistema, exceptuando la parte de administración. 2.4.2. Navegación No se puede presuponer que los usuarios sean expertos en el sistema, por lo que la navegación debe ser sencilla y clara. Las técnicas usadas para garantizar una buena navegación son las siguientes: - Usar botones grandes y visibles para facilitar la navegación. - Evitar acciones entrelazadas (acciones a realizar en más de un paso) en la medida de lo posible. Si hay acciones entrelazadas se indicará claramente en qué paso se encuentra y cuántos restan para finalizar. - Proporcionar enlaces duplicados en lugares diferentes. Por ejemplo, no todos los usuarios buscan el botón volver en el mismo lugar. 2.4.3. Personalización Los usuarios pueden personalizar su lista de favoritos, pero en cuanto a la interfaz, no se permiten personalizaciones más allá del idioma de la página. El motivo es simple; se quiere transmitir una imagen homogénea a todos los usuarios para transmitir los valores de identidad corporativa que se desean. 2.5. Restricciones La principal restricción viene dada por la naturaleza de un sistema en el que los usuarios son los que proporcionan el contenido. Este sistema, además de la tarea de revisión de contenido, hace difícil la construcción de un sistema con múltiples idiomas (se controla el idioma de la navegación, pero no del contenido) aunque se podría llevar a cabo. Hay dos soluciones posibles que quedan pendientes para futuras ampliaciones: una es dividir el contenido según el idioma; la otra es proporcionar una traducción para cada actividad. Esta última es más difícil de conseguir pero garantiza disponer del mismo contenido en cualquier idioma. Otra restricción que aparece es la de la necesidad de disponer de un ordenador para la creación de actividades y noticias. En la era de los teléfonos inteligentes y las tabletas se
Análisis de requisitos Biblioteca de actividades 20 puede acceder a cualquier sistema web desde cualquier dispositivo, pero no todos son adecuados para la redacción de textos. Además, las resoluciones de estos dispositivos hacen difícil una navegación cómoda por el sistema. Como futura solución se podría crear aplicaciones específicas para los diferentes entornos móviles. 2.6. Avisos legales El sistema deberá cumplir con la Ley Orgánica de Protección de Datos [LOPD], garantizando la seguridad y el correcto tratamiento de los datos personales almacenados.
Especificación Biblioteca de actividades 21 3. Especificación La fase de especificación es imprescindible para que un proyecto resulte exitoso. Por ello, se proporcionan diferentes modelos y diagramas para realizarla con el máximo detalle posible. En algunos casos, dos o más tipos de diagramas muestran los mismos conceptos de manera diferente, pudiendo llegar a ser, en ocasiones, redundantes. Para evitar dicha redundancia, en este proyecto no se detallan los diagramas de secuencia para la especificación (si se detallarán durante el diseño) debido a que el curso típico de acontecimientos de cada caso de uso se encuentra detallado en la descripción del propio caso de uso. 3.1. Actores Los actores son los usuarios que interactúan de forma directa con el sistema. En el sistema se encuentran los siguientes actores: Usuario no registrado, Usuario registrado, Autor y Administrador. Ilustración 3-1 Jerarquía de usuarios 3.1.1. Usuario no registrado Se entiende por Usuario no registrado a cualquier persona que visita la web sin producirse, en ningún momento, un proceso de identificación. Este tipo de actor únicamente podrá realizar consultas y búsquedas personalizadas a los diferentes contenidos (noticias, actividades y mensajes del foro). 3.1.2. Usuario registrado Un Usuario registrado es aquel que ha procedido a identificarse. Desde ese momento, el usuario gozará de más funcionalidades como son la posibilidad de publicar actividades, editarlas (únicamente las suyas), comentarlas, votarlas o marcarlas como favoritas. También podrá publicar mensajes en el foro y comentar y votar las noticias del sistema. Este es el rol que se otorga por defecto en el momento del registro.
Especificación Biblioteca de actividades 22 3.1.3. Autor Un Autor es aquel usuario registrado que, además de poder realizar las acciones propias de un usuario registrado, puede publicar noticias en el sistema. También podrá editar y eliminar sus propias noticias. El rol de Autor lo otorga el propio Administrador bajo su responsabilidad. El motivo de distinción entre Usuario registrado y Autor es muy simple. El contenido principal son las actividades y se desea que haya una gran cantidad de ellas. Por eso, se permite a cualquier usuario registrado publicar actividades. En cambio, las noticias solo pretenden informar al usuario de los acontecimientos relacionados con la educación o el propio sistema. Es por eso que las noticias deberán estar limitadas a aquellas personas implicadas en el sistema para mantener el rigor y orden en este tipo de contenido. 3.1.4. Administrador El Administrador es el que gestiona todo el sistema. Puede editar y eliminar cualquier tipo de contenido, tanto noticias como actividades y mensajes del foro. También es el responsable de escoger a los autores, pudiendo modificar sus privilegios en cualquier momento. Además, puede crear nuevas categorías de noticias y actividades así como establecer la estructura del foro. Todas estas tareas se realizan a través de un menú especial diseñado exclusivamente para controlar estos contenidos, comúnmente llamado backend o panel de administración. En la siguiente tabla se muestran las principales funcionalidades de los actores que posteriormente darán lugar a los casos de uso: Acciones Usuario no registrado Usuario registrado Actor Administrador USUARIO Registrarse X Identificarse X Cerrar sesión X Darse de baja X Recuperar contraseña X ACTIVIDADES Consultar actividades X Publicar actividades X Editar actividades propias X Editar y eliminar cualquier actividad X Comentar actividades X Añadir actividades a favoritos X NOTICIAS Consultar noticias X Publicar noticias X Editar noticias propias X Editar y eliminar cualquier noticia X Comentar noticia X FORO
Especificación Biblioteca de actividades 23 Consultar foro X Publicar en foro X Responder en foro X Editar mensajes propios del foro X Editar cualquier mensaje del foro X Eliminar mensajes del foro X BACKEND Acceder a backend X Cambiar rol de usuario X Eliminar cuenta de usuario propia X Eliminar cualquier usuario X Crear/modificar categorías de actividades X Crear/modificar categorías de noticias X Crear/modificar estructura del foro X Tabla 3-1 Funcionalidades por usuario 3.2. Diagramas de Casos de uso 3.2.1. Usuario no registrado Ilustración 3-2 Diagrama de casos de uso de usuario no registrado
Especificación Biblioteca de actividades 24 3.2.2. Usuario registrado Ilustración 3-3 Diagrama de casos de uso de usuario registrado Para simplificar el diagrama se han agrupado en un solo caso de uso (gestión de actividades) las siguientes acciones relacionadas con las actividades: consultar la lista de actividades creadas por un usuario registrado, modificar cada una de ellas y publicar nuevas. También se han agrupado en un solo caso de uso (gestión de foro) aquellos relacionados con el foro: crear post y responder post. En ambos casos se detallará la descripción de los casos de uso por separado para mayor claridad.
Especificación Biblioteca de actividades 25 3.2.3. Autor Ilustración 3-4 Diagrama de casos de uso de autor Para simplificar el diagrama se han agrupado en el caso de uso gestión de noticias los siguientes casos de uso: la consulta de la lista de noticias creadas por el Autor, la modificación de cada una de ellas y la publicación de nuevas noticias. Posteriormente se detallará en la descripción de los casos de uso cada caso por separado, para facilitar su comprensión. 3.2.4. Administrador Ilustración 3-5 Diagrama de casos de uso de administrador Para simplificar el diagrama, se han agrupado varios casos de uso en casos de uso más generales. A continuación se detalla qué incluye cada uno:
Especificación Biblioteca de actividades 32 Cerrar sesión Descripción El usuario desea cerrar su sesión. Actor principal Usuario registrado Precondición El usuario está identificado. Post condición El usuario ha dejado de estar identificado. Curso típico de acontecimientos Actor Sistema 1. El usuario selecciona la opción de cerrar sesión. 2. El sistema cierra la sesión del usuario. Cursos alternativos No hay. Tabla 3-8 Descripción del caso de uso Cerrar sesión
Especificación Biblioteca de actividades 33 Darse de baja Descripción Elimina a un usuario del sistema. Actor principal Usuario registrado Precondición El usuario está identificado. Post condición El usuario ha sido eliminado y se ha cerrado su sesión. Curso típico de acontecimientos Actor Sistema 1. El usuario selecciona la opción de darse de baja. 3. El usuario confirma que desea darse de baja. 2. El sistema pide confirmación al usuario. 4. El sistema elimina al usuario, conservando el contenido que haya creado pero asignándolo al usuario Desconocido. Cursos alternativos 3a. El usuario cancela la baja. 3a1. El caso de uso acaba. Tabla 3-9 Descripción del caso de uso Darse de baja
Especificación Biblioteca de actividades 34 Ver perfil Descripción El usuario desea consultar sus datos y actividades. Actor principal Usuario registrado Precondición El usuario está identificado en el sistema. Post condición Se muestra información sobre el usuario. Curso típico de acontecimientos Actor Sistema 1. El usuario escoge la opción de ver su perfil. 2. El sistema muestra información sobre el usuario. Cursos alternativos No hay. Tabla 3-10 Descripción del caso de uso Ver perfil
Especificación Biblioteca de actividades 35 Crear nueva actividad Descripción El usuario quiere crear una nueva actividad. Actor principal Usuario registrado Precondición El usuario está identificado en el sistema. Post condición La actividad ha sido creada. Curso típico de acontecimientos Actor Sistema 1. El usuario selecciona la opción de publicar actividad. 3. El usuario rellena el formulario y envía los datos. 6. El usuario rellena el formulario y envía los datos. 2. El sistema muestra un formulario donde pide al usuario los siguientes datos: - Título - Categoría - Descripción - … 4. El sistema crea la actividad. 5. El sistema muestra un formulario para que el usuario pueda enviar contenido multimedia. 7. El sistema guarda el contenido multimedia para la actividad. Cursos alternativos 4a. El formulario enviado por el usuario contiene errores. 4a1. El sistema informa de los errores. 4a2. El caso de uso continúa en el punto 3. 6a. El usuario no desea enviar contenido multimedia. 6a1. El caso de uso termina. 7a. El formulario enviado por el usuario contiene errores. 7a1. El sistema informa de los errores. 7a2. El caso de uso continúa en el punto 6. Tabla 3-11 Descripción del caso de uso Crear nueva actividad
Especificación Biblioteca de actividades 36 Modificar actividad Descripción El usuario desea modificar una actividad. Actor principal Usuario registrado Precondición El usuario está identificado en el sistema y es el autor de la actividad. Post condición La actividad ha sido modificada. Curso típico de acontecimientos Actor Sistema 1. El usuario selecciona la actividad a modificar. 3. El usuario modifica los datos y envía el formulario. 6. El usuario envía el formulario con el contenido multimedia. 2. El sistema muestra el formulario de actividad con los datos actuales. 4. El sistema modifica la actividad con los datos enviados por el usuario. 5. El sistema muestra un formulario para enviar contenido multimedia. 7. El sistema guarda el contenido multimedia asociándolo con la actividad. Cursos alternativos 4a. El formulario enviado por el usuario contiene errores. 4a1. El sistema informa de los errores. 4a2. El caso de uso continúa en el punto 3. 6a. El usuario no desea enviar contenido multimedia. 6a1. El caso de uso termina. 7a. El formulario enviado por el usuario contiene errores. 7a1. El sistema informa de los errores. 7a2. El caso de uso continúa en el punto 6. Tabla 3-12 Descripción del caso de uso Modificar actividad
Especificación Biblioteca de actividades 37 Listar actividades de usuario Descripción El usuario desea consultar todas las actividades creadas por él. Actor principal Usuario registrado Precondición El usuario está identificado en el sistema. Post condición Se muestra la lista de actividades creadas por el usuario. Curso típico de acontecimientos Actor Sistema 1. El usuario selecciona la opción de ver sus actividades. 2. El sistema muestra la lista de las actividades, mostrando los siguientes datos de cada una: - Título - Edad - Duración … Cursos alternativos 2a. El usuario no tiene ninguna actividad creada. 2a1. El sistema muestra un mensaje notificando al usuario que no ha creado todavía ninguna actividad. 2a2. El caso de uso acaba. Tabla 3-13 Descripción del caso de uso Listar actividades de usuario
Especificación Biblioteca de actividades 38 Comentar actividad Descripción El usuario desea comentar una actividad concreta. Actor principal Usuario registrado Precondición El usuario está identificado en el sistema. Post condición El comentado ha sido registrado. Curso típico de acontecimientos Actor Sistema 1. El usuario selecciona una actividad. 3. El usuario rellena el comentario y lo envía. 2. El sistema muestra los detalles de la actividad junto a un formulario para comentar. 4. El sistema registra el comentario asociado a la actividad. Cursos alternativos 4a. El comentario contiene errores. 4a1. El sistema comunica al usuario los errores. 4a2. El caso de uso continúa en el punto 3. Tabla 3-14 Descripción del caso de uso Comentar actividad
Especificación Biblioteca de actividades 39 Votar actividad Descripción El usuario desea votar una actividad concreta. Actor principal Usuario registrado Precondición El usuario está identificado en el sistema y no ha votado la actividad en las últimas 24 horas. Post condición El usuario ha votado la actividad. Curso típico de acontecimientos Actor Sistema 1. El usuario selecciona una actividad. 3. El usuario escoge su votación. 2. El sistema muestra los detalles de la actividad junto a un formulario de votación. 4. El sistema registra el voto asociado a la actividad. Cursos alternativos No hay Tabla 3-15 Descripción del caso de uso Votar actividad
Especificación Biblioteca de actividades 40 Añadir actividad a favoritos Descripción El usuario desea añadir una actividad concreta a su lista de actividades preferidas. Actor principal Usuario registrado Precondición El usuario está identificado en el sistema y la actividad no pertenece a su lista de favoritos. Post condición Se ha guardado la actividad en la lista de favoritos del usuario. Curso típico de acontecimientos Actor Sistema 1. El usuario selecciona una actividad. 3. El usuario selecciona la opción de añadir la actividad a favoritos. 2. El sistema muestra los detalles de la actividad. 4. El sistema añade la actividad a los favoritos del usuario. Cursos alternativos No hay. Tabla 3-16 Descripción del caso de uso Añadir actividad a favoritos
Especificación Biblioteca de actividades 41 Eliminar actividad de favoritos Descripción El usuario desea eliminar una actividad de su lista de favoritos. Actor principal Usuario registrado Precondición El usuario está identificado en el sistema y la actividad pertenece a su lista de favoritos. Post condición La actividad ya no pertenece a su lista de favoritos. Curso típico de acontecimientos Actor Sistema 1. El usuario consulta su lista de favoritos. 3. El usuario selecciona la actividad a eliminar. 2. El sistema muestra la lista de favoritos. 4. El sistema elimina la actividad de la lista de favoritos del usuario. Cursos alternativos 3a. El usuario consulta la actividad. 3a1. El sistema muestra los detalles de la actividad. 3a2. El usuario selecciona la opción de eliminar la actividad de su lista de favoritos. 3a3. El caso de uso continúa en el punto 4. Tabla 3-17 Descripción del caso de uso Eliminar actividad de favoritos
Especificación Biblioteca de actividades 48 Listar noticias de usuario Descripción El Autor desea consultar todas las noticias creadas por él. Actor principal Autor Precondición El usuario está identificado en el sistema y es Autor. Post condición Se muestra la lista de actividades creadas por el usuario. Curso típico de acontecimientos Actor Sistema 1. El usuario selecciona la opción de ver sus noticias. 2. El sistema muestra la lista de las noticias, mostrando los siguientes datos de cada una: - Título - Edad - Duración … Cursos alternativos 2a. El usuario no tiene ninguna noticia creada. 2a1. El sistema muestra un mensaje notificando al usuario que no ha creado todavía ninguna noticia. 2a2. El caso de uso finaliza. Tabla 3-24 Descripción del caso de uso Listar noticias de usuario
Especificación Biblioteca de actividades 49 3.3.4. Administrador Eliminar actividad Descripción El administrador elimina una actividad. Actor principal Administrador Precondición El usuario está identificado y es administrador. Post condición La actividad ha sido eliminada junto a la información asociada. Curso típico de acontecimientos Actor Sistema 1. El usuario selecciona la actividad a eliminar. 3. El usuario confirma la acción. 2. El sistema pide confirmación al usuario. 4. El sistema elimina la actividad y su información asociada. Cursos alternativos 3a. El usuario cancela la acción. 3a1. El caso de uso acaba. Tabla 3-25 Descripción del caso de uso Eliminar actividad
Especificación Biblioteca de actividades 50 Crear categoría de actividad Descripción El administrador desea crear una nueva categoría para las actividades. Actor principal Administrador Precondición El usuario está identificado y es administrador. Post condición La categoría ha sido creada. Curso típico de acontecimientos Actor Sistema 1. El usuario selecciona la opción de crear una nueva categoría para las actividades. 3. El usuario rellena el formulario y lo envía. 2. El sistema muestra un formulario de creación de categoría. 4. El sistema crea la nueva categoría de actividad. Cursos alternativos 4a. El formulario contiene errores. 4a1. El sistema comunica que el formulario contiene errores. 4a2. El caso de uso continúa en el punto 3. Tabla 3-26 Descripción del caso de uso Crear categoría de actividad
Especificación Biblioteca de actividades 51 Modificar categoría de actividad Descripción El administrador quiere modificar una de las categorías de las actividades Actor principal Administrador Precondición El usuario está identificado y es administrador. Post condición La categoría ha sido modificada. Curso típico de acontecimientos Actor Sistema 1. El usuario consulta las categorías de actividades. 3. El usuario selecciona la categoría a editar. 5. El usuario edita el formulario y lo envía. 2. El sistema muestra la lista de categorías de actividades. 4. El sistema muestra un formulario con los datos actuales de la categoría. 6. El sistema modifica la categoría. Cursos alternativos 2a. No existe ninguna categoría 2a1. El sistema muestra un mensaje notificando que no existe ninguna categoría para las actividades. 2a2. El caso de uso termina. 6a. El formulario contiene errores. 6a1. El sistema comunica que el formulario contiene errores. 6a2. El caso de uso continúa en el punto 5. Tabla 3-27 Descripción del caso de uso Modificar categoría de actividad
Especificación Biblioteca de actividades 52 Eliminar categoría de actividad Descripción El administrador desea eliminar una categoría para las actividades. Actor principal Administrador Precondición El usuario está identificado y es administrador. Post condición La categoría ha sido eliminada. Todas las actividades que antes pertenecían esa categoría no tienen ninguna categoría asociada. Curso típico de acontecimientos Actor Sistema 1. El usuario consulta las categorías de actividades. 3. El usuario selecciona la categoría a eliminar. 5. El usuario confirma la acción. 2. El sistema muestra la lista de categorías de actividades. 4. El sistema pide confirmación al usuario. 6. El sistema elimina la categoría. Las actividades de esa categoría ahora no pertenecen a ninguna categoría. Cursos alternativos 2a. No existe ninguna categoría 2a1. El sistema muestra un mensaje notificando que no existe ninguna categoría para las actividades. 2a2. El caso de uso termina. 5a. El usuario cancela la acción. 5a1. El caso de uso acaba. Tabla 3-28 Descripción del caso de uso Eliminar categoría de actividad
Especificación Biblioteca de actividades 53 Eliminar noticia Descripción El administrador elimina una noticia. Actor principal Administrador Precondición El usuario está identificado y es administrador. Post condición La noticia ha sido eliminada. Curso típico de acontecimientos Actor Sistema 1. El usuario selecciona la noticia a eliminar. 3. El usuario confirma la acción. 2. El sistema pide confirmación al usuario. 4. El sistema elimina la noticia. Cursos alternativos 3a. El usuario cancela la acción. 3a1. El caso de uso acaba. Tabla 3-29 Descripción del caso de uso Eliminar noticia
Especificación Biblioteca de actividades 54 Crear categoría de noticia Descripción El administrador desea crear una nueva categoría para las noticias. Actor principal Administrador Precondición El usuario está identificado y es administrador. Post condición La categoría ha sido creada. Curso típico de acontecimientos Actor Sistema 1. El usuario selecciona la opción de crear una nueva categoría para las noticias. 3. El usuario rellena el formulario y lo envía. 2. El sistema muestra un formulario de creación de categoría. 4. El sistema crea la nueva categoría de noticias. Cursos alternativos 4a. El formulario contiene errores. 4a1. El sistema comunica que el formulario contiene errores. 4a2. El caso de uso continúa en el punto 3. Tabla 3-30 Descripción del caso de uso Crear categoría de noticia
Especificación Biblioteca de actividades 55 Modificar categoría de noticia Descripción El administrador quiere modificar una de las categorías de las noticias Actor principal Administrador Precondición El usuario está identificado y es administrador. Post condición La categoría ha sido modificada. Curso típico de acontecimientos Actor Sistema 1. El usuario consulta las categorías de noticias. 3. El usuario selecciona la categoría a editar. 5. El usuario edita el formulario y lo envía. 2. El sistema muestra la lista de categorías de noticias. 4. El sistema muestra un formulario con los datos actuales de la categoría. 6. El sistema modifica la categoría. Cursos alternativos 2a. No existe ninguna categoría 2a1. El sistema muestra un mensaje notificando que no existe ninguna categoría para las noticias. 2a2. El caso de uso termina. 6a. El formulario contiene errores. 6a1. El sistema comunica que el formulario contiene errores. 6a2. El caso de uso continúa en el punto 5. Tabla 3-31 Descripción del caso de uso Modificar categoría de noticia
Especificación Biblioteca de actividades 56 Eliminar categoría de noticia Descripción El administrador desea eliminar una categoría para las noticias. Actor principal Administrador Precondición El usuario está identificado y es administrador. Post condición La categoría ha sido eliminada. Todas las noticias que antes pertenecían esa categoría no tienen ninguna categoría asociada. Curso típico de acontecimientos Actor Sistema 1. El usuario consulta las categorías de noticias. 3. El usuario selecciona la categoría a eliminar. 5. El usuario confirma la acción. 2. El sistema muestra la lista de categorías de noticias. 4. El sistema pide confirmación al usuario. 6. El sistema elimina la categoría. Las noticias de esa categoría ahora no pertenecen a ninguna categoría. Cursos alternativos 2a. No existe ninguna categoría 2a1. El sistema muestra un mensaje notificando que no existe ninguna categoría para las noticias. 2a2. El caso de uso termina. 5a. El usuario cancela la acción. 5a1. El caso de uso acaba. Tabla 3-32 Descripción del caso de uso Eliminar categoría de noticia
Especificación Biblioteca de actividades 57 Crear sección de foro Descripción El administrador desea crear una nueva sección del foro. Actor principal Administrador Precondición El usuario está identificado y es administrador. Post condición La sección de foro ha sido creada. Curso típico de acontecimientos Actor Sistema 1. El usuario selecciona la opción de crear una nueva sección para el foro. 3. El usuario rellena el formulario y lo envía. 2. El sistema muestra un formulario de creación de sección. 4. El sistema crea la nueva sección del foro. Cursos alternativos 4a. El formulario contiene errores. 4a1. El sistema comunica que el formulario contiene errores. 4a2. El caso de uso continúa en el punto 3. Tabla 3-33 Descripción del caso de uso Crear sección de foro
Diseño Biblioteca de actividades 64 aprendizaje de creación de extensiones es normalmente más complejo que el del uso de frameworks. 4.2.2. Opción escogida Se ha optado por utilizar un gestor de contenidos. Puesto que la mayoría de las funcionalidades que necesita el proyecto son proporcionadas por el gestor de contenidos, el uso de éste reducirá el tiempo de desarrollo notablemente. A pesar de que hay nuevas funcionalidades que se deberán implementar, el diseño modular y extensible de los gestores de contenidos facilita esta tarea. Además, los gestores de contenidos son muy utilizados hoy en día. Conocerlos y trabajar con ellos puede ser interesante de cara al futuro profesional. También resulta importante realizar un proyecto sin partir desde cero. Durante la carrera no se acostumbra a reutilizar código de otras fuentes y adaptarse a estructuras y formas de trabajar es un reto, a la vez que una realidad que se produce actualmente en las empresas. Una vez escogida la opción de gestor de contenidos, hay que analizar las distintas alternativas que se presentan para escoger la que mejor se adapte a las necesidades del proyecto. 4.2.3. Comparativa de gestores de contenidos Actualmente hay muchos gestores de contenidos en el mercado, algunos gratuitos, otros de pago. Con el fin de reducir la lista de gestores a comparar, se han seleccionado aquellos que están escritos en PHP, funcionan bajo plataformas UNIX (Linux), utilizan MySQL como Sistema Gestor de Base de Datos y sean gratuitos. Así, la lista se ha reducido principalmente a 3 gestores de contenidos: Drupal, Joomla! y Wordpress. De cada uno se han analizado las siguientes características: - Campos de contenido: los datos por cada unidad de contenido y flexibilidad a la hora de añadir nuevos campos. - Categorías: personalización y niveles de categorías. - Control de usuarios: tipos, permisos y seguimiento de los usuarios. - Menú de administración: existencia de un menú con la agrupación de herramientas de administración y control del contenido. - Facilidad de instalación - Soporte para múltiples idiomas - Cambio de diseño - Comunidad: calidad y cantidad. - Extensiones: calidad y cantidad. - Documentación: calidad y cantidad. - Precio
Diseño Biblioteca de actividades 65 Joomla! La última versión estable al inicio del proyecto era la 1.6, que es la que se ha analizado. Durante el desarrollo del proyecto se lanzó la versión 1.7 y, por lo tanto, queda fuera de este estudio. Joomla! (http://www.joomla.org) se caracteriza por dividir cualquier sitio web en 2 partes claramente diferenciadas. Por un lado, el frontend es la parte que los usuarios utilizarán. Por el otro, el backend es la parte donde los administradores pueden gestionar todo el contenido, categorías y usuarios del sitio web. Además de contenido, también se caracteriza por el uso de módulos y plugins para el sitio web (sistema de encuestas, usuarios más activos, etc.) y la posibilidad de cambiar el aspecto de la página mediante plantillas. Las funcionalidades que no proporciona este gestor son cubiertas por las extensiones de su comunidad. Su comunidad es una de las más amplias y organizadas que existen en el software libre. Además, dado que su uso es muy extendido, es posible encontrar mucha información de utilidad. Es considerado por muchos usuarios como el gestor de contenidos más fácil de usar sin disponer de conocimientos informáticos. Además, en su versión 1.6 se permiten categorías anidadas sin límite de profundidad (a diferencia de la versión 1.5). También ofrece un control de permisos mediante listas de acceso personalizadas. Como punto negativo, el contenido es bastante rígido; es decir, no permite añadir o eliminar campos sin editar el código fuente. Aunque hay extensiones para paliar este detalle, son extensiones de pago o bien poco intuitivas. También se echa de menos un sistema de comentarios integrado. Al no tenerlo, es necesario recurrir a extensiones externas, que aunque cumplen su cometido, pueden comprometer la seguridad del sistema si están mal diseñadas. Aspectos positivos Frontend y backend Facilidad de uso Excelente comunidad Gran número de extensiones Aspectos negativos x Contenido poco flexible x Ausencia de algunas funcionalidades integradas (sistema de comentarios) x Fallos de diseño grave en las versiones anteriores (2 niveles de profundidad en categorías)
Diseño Biblioteca de actividades 66 Drupal Drupal (http://www.drupal.org) es un gestor de contenidos flexible y poderoso. Amplía el número de funcionalidades de Joomla! y proporciona mayor personalización. Al ser más potente, también implica mayor complejidad. El principal hándicap de Drupal es esta complejidad, siendo accesible a gente con amplios conocimientos o con el tiempo suficiente para familiarizarse con todas sus opciones. Drupal también es extensible mediante módulos adicionales y posee una gran comunidad. Su documentación es de más calidad, quizás debido a su mayor complejidad. Su flexibilidad lo hace el gestor de contenidos que sirve para todo, desde la creación de un blog hasta webs de comercio electrónico o incluso comunidades de usuarios. Aspectos positivos Flexibilidad Versatilidad Soporte de extensiones Aspectos negativos x Complejidad x Curva de aprendizaje lenta x Comunidad menor que Joomla! Wordpress Wordpress (http://www.wordpress.org) es una de las maneras más sencillas de crear un sitio web. Está dirigido hacia el usuario más inexperto, mayoritariamente muy orientado a la creación de blogs. Su facilidad de uso contrarresta con su poca flexibilidad del contenido. Ofrece un sistema de permisos de usuario, pero no es muy personalizable. Ofrece plantillas para cambiar el diseño y plugins para añadir funcionalidades, aunque no llega al nivel de Joomla! y Drupal. Tanto la comunidad como las extensiones son inferiores en cantidad a las de sus dos competidores. Aunque también permite crear páginas web, en lugar de entradas de un blog, su uso y posibilidades se asemejan más al servicio Blogger (http://www.blogger.com) de Google. El punto fuerte de Wordpress es que permite el alojamiento de estos sitios web en sus servidores. Aspectos positivos Facilidad y rapidez Alojamiento propio Aspectos negativos x Nula flexibilidad x Demasiado simple x Comunidad y extensiones inferiores
Diseño Biblioteca de actividades 67 Joomla! 1.6 Drupal 6 Wordpress 3 Flexibilidad de contenido Regular Excelente Malo Categorización Bueno Excelente Bueno Control de permisos Bueno Bueno Regular Menú de administración Bueno Bueno Bueno Facilidad de instalación Regular Regular Bueno Soporte multi-idioma Excelente Regular Regular Facilidad de uso Bueno Regular Excelente Cambio de diseño Bueno Bueno Excelente Comunidad Excelente Excelente Bueno Extensiones Excelente Bueno Regular Documentación Bueno Bueno Bueno Precio Excelente Excelente Excelente Tabla 4-1 Comparativa de gestores de contenido Finalmente se ha decidido escoger Joomla! por su facilidad de uso frente a Drupal y por su potencia frente a Wordpress. Además, es el que cuenta con una mayor comunidad y un gran número de extensiones. 4.3. Arquitectura lógica del sistema: Diseño en capas En este apartado se detallan las tecnologías usadas en cada capa, realizando una brece descripción de cada una. También se muestra y describe el diseño de cada una de las capas. 4.3.1. Descripción de la Tecnología que se utilizará en cada capa. Capa de datos MySQL MySQL (http://www.mysql.com) es un sistema de gestión de base de datos relacional, multihilo y multiusuario. Está disponible para plataformas UNIX, Microsoft Windows y Macintosh, entre otras. Su licencia es GNU GPL para los usos compatibles. En caso de uso privativo, es necesaria la compra de una licencia específica.
Diseño Biblioteca de actividades 68 Capa de lógica de negocio PHP (PHP Hypertext Processor) PHP (http://www.php.net) es un lenguaje de programación interpretado. Su diseño está dirigido a la creación de páginas web dinámicas, aunque también se puede utilizar para crear aplicaciones de escritorio. Necesita un servidor que lo interprete para su uso en páginas web. Aunque existe la versión beta 6, se ha optado por utilizar la versión 5. Joomla! 1.6 Es un sistema de gestión de contenidos (CMS) que permite construir sitios web. Permite editar su contenido y personalizarlo mediante extensiones. Es de código abierto y está escrito en PHP bajo una licencia GPL. La última versión en el momento de la redacción de la memoria es la 1.7 aunque en el proyecto se utiliza la versión 1.6. Capa de presentación Javascript Es un lenguaje de programación interpretado. Se utiliza en el lado del cliente, implementado como parte de los navegadores web. Permite mejoras en la interfaz de usuario y dotar a las páginas de más dinamismo. HTML (lenguaje de marcado de hipertexto) Es un lenguaje de marcado utilizado para la creación de páginas web. Es usado para describir su estructura y contenido en formato texto, así como para complementar el texto con imágenes, vídeos, vínculos, etc. Su última versión HTML5 añade contenido semántico pero se encuentra en una fase experimental. CSS (Hojas de estilo en cascada) Es un lenguaje que permite definir la presentación de un documento estructurado escrito en HTML o XML. Al igual que HTML, su especificación es responsabilidad del Consorcio del World Wide Web [BERRIART]. Otras tecnologías utilizadas Debian Debian (http://www.debian.org) es un sistema operativo que utiliza el núcleo Linux. Todas sus herramientas proceden del Proyecto GNU. Es considerado software libre y destaca por su estabilidad, anteponiéndola al uso de las últimas versiones de los programas. El proyecto se ha realizado con la versión 5.0.
Diseño Biblioteca de actividades 69 Apache Server Apache Server (http://httpd.apache.org) es un servidor HTTP (o servidor web) de código abierto. Está disponible para plataformas UNIX, Microsoft Windows y Macintosh, entre otras. Su uso está muy extendido por toda Internet. La versión actual es la 2. 4.3.2. Diseño de la Capa de Presentación Web La capa de presentación es el conjunto de pantallas que permiten al usuario interactuar con el sistema. El sistema se encarga de mostrar la información al usuario y registrar sus acciones. La capa de presentación debe ser usable y cómoda para el usuario. Es una parte muy importante, ya que si el usuario no se siente cómodo con el sistema no lo usará. Mapa de navegación web Un mapa de navegación muestra la relación entre las diferentes vistas del sistema. A continuación se muestra el mapa de navegación de la parte pública (frontend). PORTAL DE RECURSOS ACTIVIDADES TALLERES EXCURSIONES BÚSQUEDA SALUD ETAPAS QUIÉNES SOMOS CONTACTA ACTIVIDADES NOTICIAS NUEVA NOTICIA LOGIN JUEGOS DINÁMICAS CANCIONES NOTICIAS ALIMENTACIÓN PSICOLOGÍA ACERCA DE QUÉ SOMOS MI CUENTA NUEVA ACTIVIDAD FORO REGISTRO INICIAR SESIÓN Ilustración 4-2 Mapa de navegación del portal de recursos (frontend) Mapa de navegación administración El siguiente mapa de navegación muestra la relación de las vistas de la parte privada y de administración del sistema (backend). PANEL ADMINISTRACION ACTIVIDADES CATEGORÍAS NOTICIA USUARIOSUSUARIO LOGIN ACTIVIDAD MATERIALES NOTICIAS CATEGORÍAS FORO CATEGORÍAS USUARIOS GRUPOS INICIAR SESIÓN CATEGORÍA Ilustración 4-3 Mapa de navegación del panel de administración (backend)
Diseño Biblioteca de actividades 70 Diagrama de navegación Los diagramas de navegación muestran el recorrido producido por las vistas con la ejecución de cada caso de uso. Como el comportamiento de las vistas es muy similar al curso de acontecimientos de cada caso de uso, solo se detallarán los casos de uso más interesantes a modo de ejemplo. Crear actividad A continuación se muestra una navegación posible desde que el usuario entra en el sitio web, hasta que publica su actividad. En este caso, suponemos que el usuario ya está registrado y no comete errores durante el proceso. Para mayor usabilidad, existen otros caminos menos directos hasta llegar al mismo resultado. Por ejemplo, se puede acceder al formulario de creación de actividad desde cualquier categoría de actividades. INICIO FINLOGIN MI CUENTA DESCRIPCIÓN ACTIVIDAD CONTENIDO MULTIMEDIA El usuario navega a la página de ‘Mi cuenta’ El usuario rellena el formulario de acceso El usuario navega a la página de ‘Crear Actividad’ El usuario rellena el título y descripción de la nueva actividad, entre otros campos El usuario finaliza la edición de la actividad El usuario añade un nuevo contenido multimedia Ilustración 4-4 Diagrama de navegación de Crear actividad Comentar noticia El comentario de una noticia se podrá realizar desde la propia vista de dicha noticia siempre y cuando se haya iniciado una sesión válida. Una vez enviado el comentario se podrá ver en la parte inferior de la noticia. INICIO FINLOGIN NOTICIAS CATEGORÍA NOTICIA ARTÍCULO El usuario navega a la página de ‘Noticias’ El usuario rellena el formulario de acceso El usuario selecciona una categoría El usuario selecciona un artículo concreto El usuario añade un comentario al final del artículo Ilustración 4-5 Diagrama de navegación de Comentar noticia
Diseño Biblioteca de actividades 71 Crear material La creación del material se realiza desde el menú de administración. Aunque en el momento de creación de una actividad se pueden crear materiales, no debería ser una opción muy común, puesto que el administrador debería haber dado de alta todos los materiales previamente. INICIO FINLOGIN ACTIVIDADES MATERIALES FORMULARIO MATERIAL El usuario navega a la página de ‘Actividades’ El usuario rellena el formulario de acceso del panel de administración El usuario selecciona la pestaña ‘Materiales’ El usuario selecciona ‘Crear material’ El usuario rellena y envía el formulario Ilustración 4-6 Diagrama de navegación de Crear material Eliminar categorías de actividad La eliminación de categorías de actividad se realiza desde la vista de categorías. El usuario selecciona todas aquellas categorías que desea eliminar y posteriormente indica que desea eliminarlas. INICIO FINLOGIN ACTIVIDADES CATEGORÍAS CONFIRMACIÓN El usuario navega a la página de ‘Actividades’ El usuario rellena el formulario de acceso del panel de administración El usuario selecciona la pestaña ‘Categorías’ El usuario selecciona las categorías a eliminar El usuario confirma Ilustración 4-7 Diagrama de navegación de Eliminar categorías de actividad
Diseño Biblioteca de actividades 72 4.3.3. Diseño y menús Para la creación del diseño gráfico y de los menús se han estudiado las soluciones más utilizadas en diferentes páginas creadas con Joomla! y se han buscado plantillas gratuitas. La estructura contiene una cabecera, una zona de acceso (login), un menú horizontal, una zona central que mostrará el contenido principal y una zona en el lateral izquierdo para la utilización del módulo de búsqueda, últimas actividades, encuestas, etc. También contendrá un pie de página donde aparecerán los créditos. A continuación se muestra el esquema planteado. Ilustración 4-8 Estructura del portal web Se ha optado por utilizar una plantilla creada que se asimile a la estructura escogida para, posteriormente, modificar los estilos para adecuarla al diseño deseado. 4.3.4. Diseño de la Capa de Dominio y acceso a datos Para explicar el diseño de la Capa de Dominio y de acceso a datos hay que conocer cómo funciona Joomla!. Joomla! clasifica sus artefactos en 3 tipos principales: módulos, plugins y componentes. Los módulos son extensiones que trabajan sobre el contenido ya existente en el sitio web. Añaden funcionalidades extra relacionadas con el contenido, entre otras utilidades. Existen módulos de artículos recientes y usuarios activos. También existen módulos de acceso (login), búsqueda y encuestas, entre otros.
Diseño Biblioteca de actividades 73 Los plugins son funciones que se llaman cuando se producen ciertos eventos y alteran el comportamiento de componentes, módulos o del sistema completo. Por ejemplo, si se desea comentar artículos, deberá existir un plugin que detecte cuando se muestra un artículo para mostrar también los comentarios. Los componentes funcionan como aplicaciones independientes. Utilizan los artefactos proporcionados por Joomla! para crear nuevos contenidos y funcionalidades. Requieren de sus propias tablas en la base de datos y su propia visualización. Por ejemplo, si se desea crear un foro, se deberá crear un componente para proporcionar dicha funcionalidad. Será necesario crear una estructura consistente independiente de la aplicación. Joomla! solo permite un único componente por página. El diseño de los componentes sigue el patrón Modelo-VistaControlador. Los componentes de Joomla! están diseñados siguiendo las reglas del patrón arquitectónico Modelo-Vista-Controlador (MVC). Este patrón se basa en la idea de separar la lógica de negocio, la interfaz de usuario y los datos de la aplicación. Cada componente cumple una serie de funciones: - Modelo: representa un ente de la capa de negocio, pero a la vez incorpora métodos de acceso a los datos. Se encarga de ofrecer métodos de acceso a los datos, que normalmente serán requeridos por la vista. - Vista: se encarga de acceder a los datos del modelo y mostrarlos al usuario. Suele estar formada por dos partes, una con la lógica necesaria y otra con la presentación de los datos (plantilla). - Controlador: se encarga de recoger las acciones del usuario y gobernar el sistema para que responda de forma adecuada. Ilustración 4-9 Esquema del patrón Modelo-Vista-Controlador Aunque hay muchas variantes, el ciclo de interacción entre los tres componentes suele ser el siguiente: - El usuario provoca un evento. - El controlador recoge el evento, identifica el modelo a utilizar y ejecuta una acción sobre él. - El modelo realiza la acción y devuelve el control al controlador. - El controlador indica a la vista el modelo a utilizar y delega en ella la presentación. - La vista es responsable de obtener los datos del modelo que corresponda y mostrar los datos al usuario. - El usuario retoma el control.
Diseño Biblioteca de actividades 80 publish_down tiempo Fecha de despublicación. - images texto Imágenes. Contenido.contenido Multimedia urls texto Direcciones URL. - attribs cadena de texto Parámetros en formato JSON. - versión entero Número de modificaciones. - ordering entero Orden del artículo. - metakey texto Palabras claves del artículo. - metadesc texto Meta descripción del artículo. - access entero Mínimo nivel de acceso. - hits entero Visitas del artículo. - metadata texto Metadatos en formato JSON. - featured entero Artículo promocionado. - language cadena de texto Idiomas. - Tabla 4-10 Esquema de la tabla content content_rating Almacena las votaciones de cada artículo. Nombre Tipo Descripción Modelo conceptual content_id entero Clave foránea a la tabla content. Noticia.self rating_sum entero Suma de votos de un artículo. Noticia.totalValoracion rating_count entero Número de votos de un artículo. Noticia.totalVotos lastip cadena de texto Última dirección IP en votar. - Tabla 4-11 Esquema de la tabla content_rating extensions Joomla! registra todas las extensiones propias y de terceros en esta tabla, así como parámetros de configuración de cada una. Nombre Tipo Descripción Modelo conceptual extensión_id entero Identificador de la extensión. - name cadena de texto Nombre de la extensión. - type cadena de texto Tipo (componente, módulo o plugin). - element cadena de texto Identificación textual. - enabled entero Activado. - access entero Permiso de acceso. - protected entero Protegido. - params texto Parámetros de configuración en formato JSON. - checked_out entero Clave foránea a la tabla users. - checked_out_time tiempo Fecha de instalación. - ordering entero Orden. - state entero Estado de la extensión. - Tabla 4-12 Esquema de la tabla extensions
Diseño Biblioteca de actividades 81 menu La tabla menú almacena la configuración de los menús del sitio web, guardando información de cada uno de los elementos que aparecen dentro de cada menú. Nombre Tipo Descripción Modelo conceptual id entero Identificador del menú. - menutype cadena de texto Clave foránea de la tabla menu_types. - title cadena de texto Título del menú. - alias cadena de texto Alias (para URL amigable). - path cadena de texto Ruta del menú. - link cadena de texto Ruta del enlace web. - type cadena de texto Tipo (Componente, URL, Alias, Separador). - published entero Estado de publicación. - parent_id entero Menú padre del menú. Clave foránea a la tabla menu. - level entero Nivel del árbol de menús. - component_id entero Clave foránea a la tabla extensions. - ordering entero Orden relativo dentro del menú. - checked_out entero Clave foránea a la tabla users. - checked_out_time tiempo Fecha de activación. - access entero Nivel de acceso requerido. - img cadena de texto Imagen del menú. - params texto Parámetros en formato JSON. - lft entero Facilita el recorrido de la jerarquía. - rgt entero Facilita el recorrido de la jerarquía. - home entero Página de inicio. - language cadena de texto Idiomas. - Tabla 4-13 Esquema de la tabla menu menu_types Guarda los datos generales de los menús del sitio web. Nombre Tipo Descripción Modelo conceptual id entero Identificador del tipo de menú. - menutype cadena de texto Nombre clave del menú. - title cadena de texto Título del menú. - description cadena de texto Descripción del menú. - Tabla 4-14 Esquema de la tabla menu_types modules Almacena los módulos activos del sistema, su posición en la página y parámetros adicionales. Nombre Tipo Descripción Modelo conceptual id entero Identificador del módulo. - title cadena de texto Título del módulo. - ordering entero Orden del módulo en la página. -
Diseño Biblioteca de actividades 82 position cadena de texto Posición dentro de la página. - checked_out entero Clave foránea a la tabla users. - checked_out_time tiempo Fecha de asignación. - publish_up tiempo Fecha de publicación. - publish_down tiempo Fecha de despublicación. - published entero Estado del módulo. - module cadena de texto Nombre del módulo. - access entero Acceso al módulo. - showtitle entero Mostrar título. - params texto Parámetros de configuración en formato JSON. - language cadena de texto Lenguajes del módulo. - Tabla 4-15 Esquema de la tabla modules modules_menu Representa la asociación entre módulos y menús. Nombre Tipo Descripción Modelo conceptual moduleid entero Clave foránea de la tabla modules. - menuid entero Clave foránea de la tabla menu. - Tabla 4-16 Esquema de la tabla modules_menu usergroups Define los diferentes grupos de usuario de forma jerárquica. Nombre Tipo Descripción Modelo conceptual id entero Identificador del grupo. - parent_id entero Identificador padre del grupo. - lft entero Facilita el recorrido de la jerarquía. - rgt entero Facilita el recorrido de la jerarquía. - title cadena de texto Nombre del grupo. - Tabla 4-17 Esquema de la tabla usergroups users Almacena la información relativa al usuario. Nombre Tipo Descripción Modelo conceptual id entero Identificador del usuario. - name cadena de texto Nombre completo del usuario. Usuario.nombre username cadena de texto Nombre de usuario. Usuario.username email cadena de texto Dirección de correo electrónico. Usuario.email password cadena de texto Contraseña del usuario. Usuario.password block entero Usuario bloqueado - sendEmail entero Correo electrónico enviado. - registerDate tiempo Fecha de registro. Usuario.fechaRegistro lastvisitDate tiempo Fecha de la última visita. - params texto Preferencias del usuario en formato JSON. - Tabla 4-18 Esquema de la tabla users
Diseño Biblioteca de actividades 83 user_usergroup_map Almacena los grupos a los que pertenece cada usuario. Nombre Tipo Descripción Modelo conceptual user_id entero Clave foránea a la tabla users. - group_id entero Clave foránea a la tabla usergroups. - Tabla 4-19 Esquema de la tabla user_usergroup_map El siguiente esquema muestra la relación de las tablas. Para mayor claridad se han separado las tablas nuevas y sus relaciones de las tablas nativas de Joomla! en dos diagramas distintos. Ilustración 4-16 Diagrama de base de datos. Integración de tablas nuevas
Diseño Biblioteca de actividades 84 Ilustración 4-17 Diagrama de base de datos. Uso de tablas existentes
Implementación Biblioteca de actividades 85 5. Implementación La fase de implementación es la fase en la que se desarrolla todo lo detallado durante la especificación y diseño. Es tan importante como cualquier fase anterior o incluso más, puesto que sin implementación no existiría sistema alguno. 5.1. Descripción del entorno de desarrollo En este apartado se pretende describir el entorno de desarrollo que se ha seguido para implementar el proyecto. Para realizar la implementación de un proyecto web sólo es necesario un editor de texto plano y un servidor HTTP. Sin embargo, en proyectos de mediana o gran envergadura se hace recomendable el uso de herramientas más eficaces y potentes. En el caso de este proyecto, se ha utilizado un entorno de desarrollo integrado (IDE) que permite crear aplicaciones en el leguaje PHP. Partiendo del uso de un sistema operativo UNIX, se ha optado por el IDE NetBeans 7.0 (http://www.netbeans.org) con soporte para PHP por su rapidez de instalación y sus características avanzadas de autocompletado de código o de estructuración de las clases. Ilustración 5-1 Entorno de desarrollo NetBeans
Implementación Biblioteca de actividades 86 Además, se ha hecho uso de la documentación en línea de PHP [PHPNET] para consultar información sobre algunas funciones del lenguaje. Ilustración 5-2 API de PHP El uso de la API de Joomla! [JOOMLAAPII] también ha sido de gran ayuda a la hora de resolver dudas acerca del comportamiento de ciertas clases y funciones. Ilustración 5-3 API de Joomla!
Implementación Biblioteca de actividades 87 A medida que se iba desarrollando el sistema se ha ido comprobando su resultado en diferentes navegadores (Google Chrome, Mozilla Firefox e Internet Explorer). Además, en algunos casos se ha utilizado el depurador de código xdebug (http://www.xdebug.org) que ha permitido comprobar el correcto funcionamiento del código. Al ser un proyecto unipersonal no ha sido necesario el uso de ningún sistema de control de versiones, pero se han ido realizando copias de seguridad periódicamente. También se ha utilizado la herramienta phpMyAdmin (http://www.phpmyadmin.net) para verificar los valores almacenados en la base de datos. Ilustración 5-4 phpMyAdmin 5.2. Ejemplos ilustrativos para explicar el uso de las tecnologías utilizadas El uso de un gestor de contenidos como Joomla! ha provocado que la implementación se adapte a la estructura de este. Se ha intentado utilizar los mecanismos que ofrece Joomla! como framework siempre que ha sido posible y se ha estudiado el código de las funcionalidades existentes para seguir el mismo estilo de programación. A continuación se mostrarán los aspectos más interesantes, según mi criterio, de la implementación del sistema.
Implementación Biblioteca de actividades 88 5.2.1. Estructura de Joomla! La estructura de Joomla! está formada por carpetas anidadas que agrupan diferentes funcionalidades. - /administrator: agrupa todo lo relativo al panel de administración. Contiene una estructura similar a la del frontend. - /cache: sistema de cache para acceso rápido a elementos. - /components: almacena todos los componentes del frontend. - /images: imágenes relativas a las plantillas. - /includes: ficheros que definen constantes y elementos necesarios para el funcionamiento del sistema. - /language: carpeta con los idiomas del sistema. Una subcarpetas por idioma (en-EN, es-ES) - /libraries: librerías necesarias. - /logs: registro de errores. - /media: ficheros multimedia de los artículos y actividades. - /modules: módulos del sistema. - /plugins: plugins del sistema. - /templates: plantillas del sistema. - /tmp: directorio temporal. Los componentes, módulos y plugins también deben seguir una estructura y nomenclatura. Componentes Todos los componentes deberán incluirse en la carpeta com_<nombre_componente>, dentro de la carpeta components, tanto si se trata de un componente del panel de administración como si es un componente del frontend. Cada componente estará formado por al menos tres carpetas: controllers, models y views. Dentro se guardarán los controladores, modelos y vistas respectivamente. Además, cada componente debe tener un controlador fuera de la carpeta controllers que sirva de controlador de entrada. Adicionalmente, se pueden crear carpetas que faciliten la comprensión del código como librerías adicionales o clases de ayuda (helpers). A continuación se muestra la estructura del componente desarrollado llamado Actividades en el frontend.
Implementación Biblioteca de actividades 89 Código 5-1 Estructura de ficheros del componente Actividades en el frontend - com_actividades - controllers - actividad.php (clase ActividadesControllerActividad) - helpers - category.php (clase ActividadesCategories) - icon.php (clase JHtmlIcon) - media.php (clase ActividadesHelperMedia) - route.php (clase ActividadesHelperRoute) - models - forms - actividad.xml - actividad.php (clase ActividadesModelActividad) - actividades.php (clase ActividadesModelActividades) - form.php (clase ActividadesModelForm) - media.php (clase ActividadesModelMedia) - views - actividad - tmpl - default.php - default.xml - view.html.php (clase ActividadesViewActividad) - actividades - tmpl - bookmarks.php - bookmarks.xml - bookmarks_body.php - default.php - default.xml - default_body.php - myactivities.php - myactivities.xml - myactivities_body.php - view.html.php (clase ActividadesViewActividades) - form - tmpl - edit.php - edit.xml - view.html.php (clase ActividadesViewForm) - main - tmpl - default.php - default.xml - view.html.php (clase ActividadesViewMain) - media - tmpl - default.php - default.xml - view.html.php (clase ActividadesViewMedia) - actividades.php - controller.php (clase ActividadesController) - router.php
Implementación Biblioteca de actividades 96 Módulos Los módulos son extensiones ligeras que son utilizadas durante la construcción de la página que se mostrará al usuario. Su uso es independiente del componente que se esté mostrando. Un módulo de Joomla! suele tener varios ficheros básicos dentro de una carpeta llamada mod_<nombre_modulo> como por ejemplo mod_prueba. - mod_prueba.php: es el fichero de entrada para el módulo. Se encarga de inicializar el módulo y realizar las llamadas necesarias para recoger la información y finalmente incluir la plantilla que se mostrará. - mod_prueba.xml: es el fichero de configuración necesario para su instalación. - helper.php: clase de ayuda que se usa para obtener la información normalmente de la base de datos. - tmpl/default.php: es la plantilla del módulo. Generará el código HTML que se mostrará al usuario. - es-ES.mod_prueba.ini: fichero de idioma, en este caso español. Habrá un fichero por cada idioma. Código 5-6 Módulo de comentarios sociales defined('_JEXEC') or die; if(JPluginHelper::isEnabled('system','jsocial_comments') == false) return; require_once dirname(__FILE__).'/helper.php'; $html = modJSocialCommentsHelper::getContent($params); $moduleclass_sfx = htmlspecialchars($params->get('moduleclass_sfx')); require JModuleHelper::getLayoutPath('mod_jsocial_comments', $params- >get('layout', 'default'));
Implementación Biblioteca de actividades 97 Plugins Los plugins son clases que se ejecutan cuando se produce un evento concreto. Su implementación consiste en un fichero PHP que describa una clase que herede de JPlugin y un fichero XML de configuración para su instalación. Ambos deberán tener el mismo nombre que la carpeta que lo contiene. Además, cada plugin debe pertenecer a un grupo determinado. Los grupos de Joomla! son autenticación, contenido, editores, búsqueda, sistema y usuario. Para este proyecto ha sido necesario crear un nuevo grupo llamado Actividades. Los métodos de un plugin que permiten capturar eventos son: - onBeforeContentSave: se llama antes de que el contenido sea guardado en la base de datos. - onAfterContentSave: se llama después de haber guardado el contenido en la base de datos. - onPrepareContent: se llama cuando se va a iniciar a preparar el contenido para su salida por pantalla. - onAfterDisplayTitle: se llama justo después de mostrar el título del contenido. - onBeforeDisplayContent: se llama justo antes del contenido generado. - onAfterDisplayContent: se llama justo después del contenido generado. Los ficheros de idiomas de un plugin se almacenan en la carpeta /languages.
Implementación Biblioteca de actividades 98 Código 5-7 Plugin de votación de actividades <?php defined('_JEXEC') or die; jimport('joomla.plugin.plugin'); class plgActividadesVote extends JPlugin { public function __construct(& $subject, $config) { parent::__construct($subject, $config); $this->loadLanguage(); } public function onContentBeforeDisplay($context, &$row, &$params, $page=0) { $html = ''; $rating = intval(@$row->rating); $rating_count = intval(@$row->rating_count); $view = JRequest::getString('view', ''); $img = ''; … $html .= '<span class="content_rating">'; $html .= JText::sprintf('PLG_VOTE_USER_RATING', $img, $rating_count); $html .= "</span>\n<br />\n"; if ($view == 'actividad' && $row->state == 1) { $uri = JFactory::getURI(); $uri->setQuery($uri->getQuery() . '&hitcount=0'); $html .= '<form method="post" action="' . $uri->toString() . '">'; $html .= '<div class="content_vote">'; $html .= JText::_('PLG_VOTE_POOR'); $html .= '<input type="radio" title="' . JText::sprintf('PLG_VOTE_VOTE', '1') . '" name="user_rating" value="1" />'; … $html .= JHtml::_('form.token'); $html .= '</div>'; $html .= '</form>'; } return $html; } }
Implementación Biblioteca de actividades 99 Plantillas Las plantillas son ficheros que permiten controlar el diseño y la disposición de los elementos en un sitio web. Joomla! incorpora tres plantillas por defecto para el frontend, pero ninguna ha satisfecho las necesidades del proyecto así que se ha optado por el uso de una plantilla de terceros y su posterior adaptación. En el caso del backend, la plantilla por defecto es óptima para cubrir las funcionalidades. Para la creación de una plantilla son necesarios los siguientes ficheros: - index.php: fichero principal de la plantilla. Contiene la estructura básica y las llamadas a los ficheros de estilos y JavaScript. - templateDetails.xml: fichero XML que sirve para instalar la plantilla. - template_preview.png: imagen con la captura completa de la plantilla. - template_thumbnail.png: imagen que sirve como vista previa. - css: carpeta donde se almacenan los ficheros de estilos. Para que una plantilla sea funcional debe cubrir la mayoría de las posiciones que utilizan las plantillas por defecto (cabecera, pie de página, menú, zona de acceso, columna para módulos, espacio para el componente principal, etc.). Ilustración 7 Captura de la pantalla de inicio
Implementación Biblioteca de actividades 100 5.2.2. Extensiones implementadas Para la realización del proyecto ha sido necesaria la implementación de un componente y varios módulos. El componente está dividido en dos partes: el backend y el frontend. La parte del backend es visible desde el panel de administración. Esta parte permite a los administradores crear, modificar y eliminar actividades y materiales, independientemente de si son los autores o no. El frontend es la parte pública que el usuario podrá ver y utilizar. Permite la creación de actividades. También permite enviar contenido multimedia asociado a las actividades. Los usuarios pueden editar y eliminar sus actividades y seleccionar los materiales necesarios para la realización de las actividades. En caso de no encontrar un material, pueden darlo de alta de forma sencilla. También ha sido necesario crear un plugin para la votación de las actividades, puesto que el proporcionado por Joomla! solamente era funcional para el contenido por defecto. De esta manera, en el sistema hay dos plugins que realizan la misma funcionalidad, uno para los contenidos propios de Joomla! y otro para el contenido creado a través del componente Actividades. Con el plugin de terceros para comentar actividades ha sucedido el mismo problema, por lo que ha sido necesario adaptar su funcionamiento para que funcionara también con el componente desarrollado. 5.2.3. Extensiones de terceros utilizadas Se han utilizado diferentes extensiones de terceros para proporcionar las funcionalidades de autenticación social (a través de Facebook), sistema de comentarios y creación de un foro. ITPConnect ITPConnect (http://itprism.com/free-joomla-extensions/social-connection-authentication) es una extensión para Joomla! 1.6 y 1.5 que permite al usuario del sitio donde se instale que inicie sesión con su cuenta de Facebook. De esta manera, el sistema podrá contar con todos los usuarios de Facebook sin molestar al usuario con formularios de registro. Para conectarse usa de la API de Facebook [FACEBOOKAPII]. Lo único que hay que hacer es crear una aplicación en Facebook para obtener los valores de configuración necesarios. En el apartado de instalación y mantenimiento se detallará este procedimiento con más detalle.
Implementación Biblioteca de actividades 101 JSocial Comments JSocialComments (http://www.plopixel.com/descargas/plugins-para-joomla/jsocial-comments) permite utilizar las diferentes redes sociales para compartir o comentar cualquier artículo en el sitio web. Se ha tenido que ampliar sus funcionalidades para permitir también su uso con las actividades. Permite escribir comentarios a través de Facebook, Twitter, Google+ y Linkedin. Desde el panel de administración permite configurar que redes sociales se desean ofrecer al usuario para que comente y comparta. Kunena Kunena (http://www.kunena.org) es una extensión que proporciona un foro a cualquier sitio web Joomla! Es gratuita y libre y cuenta con su propia comunidad. Es una extensión muy completa que permite al administrador definir toda la estructura del foro, así como los diferentes grupos de usuarios y configuraciones avanzadas del comportamiento del foro. Además está disponible en varios idiomas, entre ellos el español. 5.2.4. Mecanismos de permisos La versión 1.6 de Joomla! implementa un mecanismo de permisos basado en niveles de control de acceso (Access Control List ACL). Estos niveles permiten establecer permisos de lectura, creación, eliminación y acceso, entre otros. Los niveles de control de acceso actúan tanto en el frontend como en el panel de administración o backend. Este mecanismo de permisos está formado por cuatro aspectos: los usuarios, los grupos, los permisos y los niveles de acceso. Los usuarios son las personas que visitan la web, independientemente de si poseen su propia cuenta o no. Los grupos son conjuntos de usuarios que comparten los mismos permisos. Los grupos se crean jerárquicamente y permiten la herencia de permisos. Los permisos solo pueden ser asignados a grupos. Incluyen el login en frontend y backend, permisos de administrador, cambiar ajustes, crear contenido, eliminar contenido, editar contenido y editar el estado del contenido. Los permisos se asignan a nivel de contenido o categoría. Los niveles de acceso indican qué contenido puede ver cada grupo. Existen tres niveles de acceso por defecto (público, registrado y especial) aunque se pueden crear otros. Para conseguir que diferentes tipos de contenido requieran diferentes permisos de los usuarios, se han establecido permisos a las categorías de los diferentes tipos de contenido. Así, para crear artículos se ha determinado que un usuario pertenezca al grupo Autor, mientras que para crear actividades basta con pertenecer al grupo registrado.
Implementación Biblioteca de actividades 102 Ilustración 5-8 Permisos de usuario registrado para las actividades Ilustración 5-9 Permisos de usuario registrado para las noticias Código 5-8 Ejemplo de tratamiento de permisos 5.2.5. Gestión de idiomas Joomla! proporciona un sencillo mecanismo para dotar al sitio web de soporte para múltiples idiomas. Cada componente, plugin o módulo deberá tener asociado un fichero de texto plano para cada idioma. El fichero tendrá un formato de Clave=Valor, de manera que en el código fuente de la extensión se utilicen únicamente claves para mostrar texto. Joomla! detectará el idioma preferido del usuario y buscará la existencia del fichero para esa extensión (componente, módulo o plugin) y tras buscar la clave dentro del fichero mostrará el valor concreto. Con este mecanismo, resulta muy fácil añadir nuevos idiomas a la extensión, puesto que habría que crear una copia del fichero y cambiar únicamente los valores. if ($categoryId) { // If the category has been passed in the data or URL check it. $allow = $user->authorise('core.create', 'com_actividades.category.' . $categoryId); } if ($allow === null) { return parent::allowAdd(); } else { return $allow; }
Implementación Biblioteca de actividades 103 Para relacionar el idioma con el fichero se impone la restricción de que el fichero empiece con el código de idioma y país (es-ES, en-EN, etc.). A continuación se muestran algunos ejemplos de Clave-Valor: Código 5-9 Ejemplos de asignación clave-valor Se puede notar que la clave incluye el nombre del componente, módulo o plugin. Esto se ha hecho así para ver rápidamente a qué extensión pertenece y evitar posibles colisiones. El único conveniente que presentan los Sistemas Gestores de Contenido es que se puede traducir todo el sistema fácilmente, pero lamentablemente el contenido proporcionado por los usuarios es más difícil de traducir. Existen herramientas de traducción automática, pero de cara a futura ampliaciones se prefiere contar con contenido nativo en cada idioma que tener el mismo número de actividades en cada idioma. 5.2.6. Categorías En la versión 1.5 de Joomla! solo se permitía tener dos niveles de profundidad de categorías. El nivel superior eran las secciones, mientras que el inferior eran las categorías. En la nueva versión se ha eliminado esta restricción de profundidad, dotando de mayor flexibilidad a la estructuración del contenido. Además, en la versión 1.6 se ha añadido soporte para crear categorías para cualquier componente mediante un simple parámetro en la URL. De esta manera, no ha sido necesario implementar las categorías para el componente de actividades desarrollado. Simplemente ha bastado con crear el enlace correspondiente a las categorías con el parámetro adecuado. Ilustración 5-10 Gestión de categorías de actividades http://localhost/joomla/administrator/index.php?option=com_categories&exten sion=com_actividades COM_ACTIVIDADES_TYPE="Tipo" COM_ACTIVIDADES_EDAD="Edad" COM_ACTIVIDADES_MINUTOS_ABREV="mins."
Implementación Biblioteca de actividades 104 5.2.7. Formularios Uno de los momentos más importantes de un sitio web es cuando el usuario envía datos al servidor a través de un formulario. Familiarizarse con la manera de trabajar de Joomla! no ha sido trivial; es por eso que a continuación se detalla el funcionamiento de todo el proceso de envío de datos, desde que el usuario solicita la acción, hasta que se valida y se almacena en la base de datos. Joomla! 1.6 ofrece una clase llamada JModelForm que se encarga de gestionar el formulario mediante un archivo XML asociado, cargarlo (vacío o con datos, si se trata de una creación o una edición) y validarlo. Para crear un nuevo formulario lo único que tenemos que hacer es crear un modelo que herede de la clase JModelForm y crear un fichero XML con la descripción de los campos del formulario. Para cada campo hay que indicar el tipo, el nombre y se pueden añadir parámetros de validación. Joomla! también permite crear campos personalizados e indicarlos en el fichero. La vista que necesite el formulario solamente se limitará a solicitarlo al modelo e imprimirlo por pantalla. Después de enviar el formulario se procede a validarlo según los parámetros indicados en el fichero XML anterior. También se puede sobrescribir el método de validación de la clase JModelForm para hacer nuestra propia validación. Si no hay errores se invoca al método save, que se encarga de guardar los datos en la base de datos de forma adecuada. Código 5-10 Contenido de Material.xml <?xml version="1.0" encoding="utf-8"?> <form> <fieldset> <field name="id" type="hidden" /> <field name="name" type="text" label="COM_ACTIVIDADES_NAME" description="COM_ACTIVIDADES_NAME" size="40" class="inputbox" default="" required="true" /> <field name="description" type="textarea" label="COM_ACTIVIDADES_DESCRIPTION" description="COM_ACTIVIDADES_DESCRIPTION" class="inputbox" rows="3" cols="30" /> </fieldset> </form>
Implementación Biblioteca de actividades 105 Código 5-11 Ejemplo de carga de formulario desde el modelo Código 5-12 Asignación del formulario a la vista Código 5-13 Visualización de los campos desde la plantilla (recorriendo la lista) Código 5-14 Visualización de los campos desde la plantilla (mostrando un campo concreto) 5.2.8. Autocompletado de materiales Una de las cosas que no facilitaba el framework de Joomla! era soporte para gestionar contenido que necesitará interacción de más de dos elementos complejos (típica asociación N a N). En el caso del proyecto, una actividad podía necesitar unos ciertos materiales, que a su vez también podían ser requeridos por otras actividades. La gestión de esta relación múltiple ha sido uno de los muchos retos que ha supuesto el proyecto. Cuando el usuario crear una nueva actividad, es necesario poder indicar qué materiales necesita. Se han planteado varias soluciones de implementación. La primera de ellas consistía en mostrar un desplegable con todos los materiales disponibles. En este caso sería necesario incluir un enlace para crear nuevos materiales. Esta opción se ha descartado porque el usuario debe buscar entre una larga lista de materiales y puede llegar a resultar incómodo. <li><?php echo $this->form->getLabel('id'); ?> <?php echo $this->form->getInput('id'); ?></li> <?php foreach ($this->form->getFieldset() as $field): ?> <li><?php echo $field->label; echo $field->input; ?></li> <?php endforeach; ?> public function display($tpl = null) { // get the Data $form = $this->get('Form'); … // Assign the Data $this->form = $form; … // Display the template parent::display($tpl); } public function getForm($data = array(), $loadData = true) { // Get the form. $form = $this->loadForm('com_actividades.material', 'material', array('control' => 'jform', 'load_data' => $loadData)); if (empty($form)) { return false; } return $form; }
Pruebas del sistema Biblioteca de actividades 112 Descripción y resultados La mayoría de pruebas funcionales se han llevado a cabo durante la implementación. A medida que se desarrollan nuevas funcionalidades se prueban de forma exhaustiva, comprobando el correcto funcionamiento de cada una de las opciones posibles que puede realizar el usuario. A continuación se detallan algunas de las pruebas realizadas en el panel de administración y en el frontend. Creación de una nueva actividad desde el panel de administración Desde el panel de administración se ha creado una nueva actividad con sus respectivos materiales (tanto existentes como nuevos). El sistema ha guardado la actividad en la tabla #_actividades, ha creado los materiales nuevos en la tabla #_actividades_materiales y los ha asociado, junto con los ya existentes, a la actividad en la tabla #_actividades_materiales_uso. También se ha creado la asociación con la tabla #_users. Eliminación de un material desde el panel de administración Se ha eliminado un material que estaba asociado a varias actividades. El sistema ha eliminado el registro de la tabla #_actividades_materiales y sus relaciones en la tabla #_actividades_materiales_uso. Registro e inicio de sesión en el frontend Se ha creado un nuevo usuario a través del formulario de registro y se ha procedido a iniciar sesión. En la tabla #_users se ha guardado el nuevo usuario. Se ha procedido a iniciar sesión con cuenta de Facebook. El sistema ha redirigido a la página de Facebook y tras la aceptación de permisos correspondiente se ha redirigido a la página principal, quedando el usuario identificado. El usuario ha sido guardado en la tabla #_users. Modificación de una nueva actividad desde el frontend Se ha modificado una actividad, añadiendo y eliminando contenido multimedia tanto con ficheros locales como enlaces externos. El sistema ha eliminado los contenidos seleccionados del sistema de ficheros y de la tabla #_actividades_media. También ha guardado en la carpeta correspondiente los ficheros enviados por el usuario y ha registrado todos los contenidos en la tabla #_actividades_media. Marcado y desmarcado de una actividad como favorita Se ha marcado una actividad como favorita y se ha comprobado que se ha creado el registro correspondiente en la tabla #_actividades_bookmarks. También se ha probado la eliminación de un marcador provocando que el sistema borre el registro correspondiente. Filtrado y ordenación de actividades por tipo y edad Se ha solicitado un conjunto de actividades que cumplen ciertas características (se desea visualizar juegos del usuario Dani). El sistema sólo ha mostrado las actividades que cumplen las características solicitadas.
Pruebas del sistema Biblioteca de actividades 113 6.1.2. Pruebas de usabilidad Las pruebas de usabilidad pretenden demostrar si un sistema puede ser usado de forma correcta por un usuario. A menudo, el propio creador del sistema realiza las pruebas de usabilidad, pero no se puede considerar una prueba fiable porque ya conoce el uso del sistema antes de probarlo. Es por eso que las pruebas de usabilidad deben realizarse sobre grupos de usuarios que no conozcan la aplicación. Descripción El propósito de las pruebas realizadas para este proyecto es saber si la navegación y distribución de los elementos de la página es sencillo de usar. Por ello, se han seleccionado a dos usuarios familiarizados con la navegación por Internet y se les ha pedido que realicen una serie de tareas: - Identificarse en el sistema - Buscar actividades de tipo taller para niños de 9 años - Comentar una actividad - Crear una actividad de prueba - Postear un mensaje en el foro - Buscar una noticia a partir de un título Para analizar los resultados se puede comprobar si han usado el camino más corto contando el número de clics o el tiempo total dedicado a conseguir cada una de las tareas. Resultados Los usuarios han sido capaces de encontrar todas las tareas de manera más o menos rápida. Lo que se ha detectado es que el sistema no avisa de forma clara si una operación se ha realizado con éxito o no, lo que puede llevar a confusiones. Estas pruebas han permitido detectar el problema y resolverlo de forma adecuada. 6.1.3. Pruebas de rendimiento Las pruebas de rendimiento son aquellas que pretenden demostrar que el sistema es estable y fiable con una carga alta de trabajo.
Pruebas del sistema Biblioteca de actividades 114 Descripción Para realizar las pruebas se han realizado una serie de tareas sobre la web usando el navegador en diferentes escenarios. - Un escenario con carga de trabajo nula (un único usuario realizando peticiones). - Un escenario con carga de trabajo media con 5 usuarios virtuales realizando peticiones de forma exhaustiva. - Un escenario con carga de trabajo alta con 20 usuarios virtuales realizando peticiones de forma exhaustiva. Con estos escenarios se ha medido el tiempo de las diferentes tareas, realizando cada una de ellas 5 veces para una medición más fiable. Para realizar las peticiones se ha utilizado la aplicación jMeter (http://jmeter.apache.org/), un programa que permite personalizar distintos tipos de pruebas de estrés y capturar los resultados. Resultados Tras realizar varias veces las pruebas en los diferentes escenarios y calcular la media aritmética se han obtenido los siguientes resultados: Carga mínima Carga media Carga máxima Filtrar actividades 0,99 3,558 13,748 Comentar actividad 2,21 3,612 2,298 Enviar actividad 1,714 5,258 21,712 Enviar post 2,346 9,618 29,878 Buscar noticia 1,442 4,888 14,44 Tabla 6-1 Resultados de las pruebas de rendimiento En el anexo C se pueden consultar todos los resultados obtenidos.
Pruebas del sistema Biblioteca de actividades 115 Ilustración 6-1 Gráfico de las pruebas de rendimiento Se puede observar que todas las tareas se ven afectadas por el incremento de la carga de trabajo excepto la tarea de comentar actividad. Esta tarea es independiente de la carga de trabajo debido a que el comentario del usuario se envía directamente a la red social escogida en el momento de enviar el comentario. Otro aspecto interesante es ver que las operaciones de consulta (filtrar actividades y buscar noticia) se realizan más rápidamente que las operaciones de modificación (enviar actividad y enviar post). A pesar de esta diferencia, el incremento del número de usuarios concurrentes también incrementa de forma exponencial el tiempo de respuesta del sistema. Aunque según el gráfico pueda parecer que el sistema empeora mucho con el incremento de usuarios hay que tener en cuenta que los usuarios virtuales realizan las peticiones al mismo tiempo, mientras que los usuarios humanos no tienen porqué realizar la petición a la vez. Es por eso que en un sistema con 20 personas se obtendrían mejores resultados que en el escenario con 20 usuarios virtuales. No hay una manera exacta de convertir usuarios virtuales en usuarios reales, pero se podría estimar en un 5% el porcentaje de usuarios que hay en el sistema y realizan una petición al mismo tiempo. Con esa estimación, podríamos concluir que para obtener resultados equivalentes con usuarios reales al escenario con 20 usuarios virtuales serían necesarios 20/5% = 400 usuarios. 0 5 10 15 20 25 30 35 1 5 20 Tiempo en segundos Usuarios concurrentes Filtrar actividades Comentar actividad Enviar actividad Enviar post Buscar noticia
Planificación real y valoración económica Biblioteca de actividades 116 7. Planificación real y valoración económica 7.1. Planificación real Durante el desarrollo es probable que la planificación haya sufrido cambios debido a imprevistos. A continuación se detalla la planificación real, exponiendo las diferencias con respecto a la planificación inicial. Durante la fase de definición del proyecto se observan las primeras diferencias con la planificación inicial. El estudio de gestores de contenidos ha sido desplazado justo después de la especificación. Se ha considerado el estudio de CMS como parte de la fase de diseño, pero se ha querido especificar a parte porque su peso en el proyecto es considerable. Como consecuencia de este cambio, la fase de análisis de requisitos y la especificación han acabado antes aunque hayan tenido una duración similar a la planificada inicialmente. En el siguiente gráfico se muestran las diferencias. Las zonas sombreadas representan la planificación real, mientras que las zonas marcadas con una „I’ representan la planificación inicial. JUNIO JULIO AGOSTO SEMANA S1 S2 S3 S4 S1 S2 S3 S4 S1 S2 S3 S4 Definición del proyecto Origen de la necesidad Búsqueda de información Análisis de requisitos I I I Especificación I I I Estudio de CMS I I I Diseño I I I Tabla 7-1 Planificación de la definición del proyecto (inicial y real) Durante las fases de implementación y testeo es donde se observan las mayores diferencias. En la planificación real las tareas planificadas en estas fases han requerido más tiempo. No se han previsto algunos problemas encontrados. Otro motivo de la desviación ha sido por situaciones ajenas al proyecto; de la tercera semana de septiembre a la tercera de octubre la dedicación de horas se vio reducida de 40 horas semanales a 30 horas semanales. También se ha alargado el estudio de Joomla!, que ha estado presente durante casi toda la implementación.
Planificación real y valoración económica Biblioteca de actividades 117 AGOSTO SEPTIEMBRE OCTUBRE NOVIEMBRE SEMANA S1 S2 S3 S4 S1 S2 S3 S4 S1 S2 S3 S4 S1 S2 S3 S4 Implementación y testeo Búsqueda de información Estudio de Joomla! I I Implementación I I I I Testeo I I I I Tabla 7-2 Planificación de la implementación y el testeo (inicial y real) Como consecuencia de las desviaciones anteriores la redacción de la memoria ha sufrido un desfase. Además, estaba planificada inicialmente para comenzar durante la primera semana de julio pero, por querer dedicarle más tiempo a otras tareas, su inicio ha sido retrasado a principios de setiembre. A pesar de todo, hay que destacar que durante las fases relacionadas con la definición del proyecto se ha generado documentación que ha facilitado la redacción de la memoria. Obviamente, al no finalizar la redacción hasta finales de diciembre, la presentación se deberá realizar durante el mes de enero. SEPTIEMBRE OCTUBRE NOVIEMBRE DICIEMBRE ENERO SEMANA S1 S2 S3 S4 S1 S2 S3 S4 S1 S2 S3 S4 S1 S2 S3 S4 S1 S2 Redacción I I I I I Presentación I Tabla 7-3 Planificación de la redacción de la memoria y la presentación (inicial y real) 7.2. Valoración económica En cuanto al coste económico estimado, se ha dividido el coste en dos componentes diferentes: Coste servicio Incluye un servicio de alojamiento web que soporte páginas web dinámicas en PHP. Se ha escogido un alojamiento con un coste de 4,99€/mes. Este precio ya incluye un dominio que permitirá al portal ser accesible a través de una URL propia. Año de alojamiento: 4,99 €/mes * 12 meses = 59,88 € Coste de personal Es el componente más importante del proyecto. Incluye el salario de todos los recursos humanos que han desarrollado el proyecto. A pesar de que este proyecto ha sido desarrollado por una única persona, se han dividido las tareas según el tipo de recurso humano que lo realizaría en un proyecto real. La siguiente tabla muestra el reparto de horas por tarea y su coste en función del rol encargado de realizarla.
Planificación real y valoración económica Biblioteca de actividades 118 Tarea Recurso Dedicación Coste unitario Coste Planificación Jefe de proyecto 5 horas 50 €/h 250 € Origen de la necesidad Jefe de proyecto 30 horas 50 €/h 1.500 € Análisis de requisitos Analista 85 horas 35 €/h 2.975 € Especificación Analista 100 horas 35 €/h 3.500 € Comparativa de CMS Analista 40 horas 35 €/h 1.400 € Diseño de pantallas Diseñador 40 horas 30 €/h 1.200 € Estudio de Joomla! Programador 90 horas 25 €/h 2.250 € Implementación Programador 120 horas 25 €/h 3.000 € Testeo Programador 65 horas 25 €/h 1.625 € TOTAL 17.700 € Tabla 7-4 Coste de personal Coste total El coste total del proyecto será la suma del coste de mantenimiento y el coste de personal. Este coste incluye un año de alojamiento web y dominio propio. Coste total = Coste servicio + Coste de personal = 59,88 + 17.700 = 17.759,88 € Para años posteriores será necesaria una inversión de 59,88 € en concepto de alojamiento y dominio suponiendo que los costes no varían más los costes de mantenimiento.
Conclusiones y trabajo futuro Biblioteca de actividades 119 8. Conclusiones y trabajo futuro Este apartado concluye la memoria de este proyecto. Se realiza una valoración personal, comentando los conocimientos adquiridos, problemas encontrados y otros detalles. También se comenta el futuro del proyecto, valorando las opciones que han quedado fuera del proyecto y las posibilidades de ampliación. 8.1. Conclusiones y valoración personal Tras siete meses de desarrollo de este proyecto he podido ver gran parte del ciclo de vida de un proyecto, desde su gestación hasta su finalización (faltaría la parte de mantenimiento). Me siento orgulloso del trabajo realizado ya que he podido poner en práctica muchos de los conocimientos adquiridos en la facultad. Además, quería realizar un proyecto personal como proyecto final de carrera para poder comprobar mi nivel de autonomía y constancia. En este aspecto me siento bastante satisfecho. Hablando del desarrollo del proyecto, he aprendido a planificar un proyecto conociendo sólo el objetivo principal. También he sentido la decepción de comprobar que esa planificación no se ajustaba al trabajo real del proyecto. En la fase inicial, me he ayudado de la opinión de los futuros usuarios para conseguir definir todos los requisitos del proyecto. Esta situación ha sido similar a la de un proyecto real, en la que se debe consultar con el cliente las funcionalidades del sistema. Aunque se ha realizado una encuesta para llegar a más usuarios, también se han mantenido charlas con unos pocos para refinar más el análisis de requisitos. Realizar la especificación y el diseño ha sido la parte más sencilla, ya que las tareas de estas etapas las he realizado numerosas veces en distintas asignaturas de la carrera. He intentado seguir las mismas directrices y métodos aprendidos para facilitar las etapas posteriores. Además, en la etapa de diseño ha sido necesario realizar una comparativa de Gestores de contenidos. Con esta comparativa he conocido cuáles son los más utilizados y cuáles son los puntos fuertes y débiles de cada uno. Durante la etapa de implementación he tenido que buscar mucha documentación y estudiar el código fuente de varias extensiones de Joomla!. Integrar una extensión propia con el gestor de contenidos ha sido todo un reto. Durante mi estancia en la facultad se han realizado bastantes proyectos desde cero o utilizando algún framework, pero nunca había tenido que adaptarme a la forma de trabajo de un gestor de contenidos. El lenguaje PHP no ha supuesto ninguna dificultad ya que estoy acostumbrado a trabajar con él desde hace varios años, tanto en proyectos personales como en trabajos profesionales.
Conclusiones y trabajo futuro Biblioteca de actividades 120 La etapa de testeo me ha permitido conocer la metodología de las pruebas unitarias y su realización con PHP y NetBeans. La realización de pruebas de rendimiento me ha enseñado a interpretar resultados y a profundizar en el uso de herramientas de estrés como jMeter. 8.2. Trabajo futuro Desde el inicio del proyecto han ido surgiendo ideas que se podían realizar. Lamentablemente, el tiempo y la decisión de los usuarios han hecho que algunas de esas ideas no se hayan podido llevar a cabo, aunque se pueden realizar en trabajos futuros. Se pueden añadir más funcionalidades que faciliten la búsqueda y clasificación de actividades. Se puede ampliar la funcionalidad de favoritos, permitiendo al usuario crear listas personalizadas, de manera similar a como se realiza en los navegadores web. También se pensó en la idea de guardar las preferencias del usuario de manera que se mostraran sugerencias relacionadas. Se puede mostrar actividades similares dentro de la vista de una actividad. Otra funcionalidad muy interesante puede ser la creación de un planificador de actividades, que estaría dirigida a monitores; este planificador permitiría asignar una actividad a una fecha y hora en un calendario personalizado para cada usuario que posteriormente se podría descargar en formato PDF para su impresión. En cuanto a movilidad, se pueden crear clientes móviles para las diferentes plataformas actuales (iOS, Android y Windows Phone) o bien proporcionar un diseño adecuado para dispositivos móviles. Si se quisiera sacar rentabilidad al portal web, se podría recurrir a publicidad de entidades relacionadas con la educación o a vendedores de materiales para realizar las actividades. También se podría implementar una bolsa de trabajo donde entidades de ocio publicarían ofertas de trabajo y los usuarios podrían inscribirse. Con esta última idea, se podría incentivar la participación de los usuarios ya que las empresas podrían ver qué usuario comparte más ideas.
Bibliografía y referencias Biblioteca de actividades 121 9. Bibliografía y referencias 9.1. Bibliografía Ballard, P. (2006). AJAX in 10 minutes. Sams. Batlle, R., Corral, I., Matas, I., Montserrat, R., Canelo, J., Pérez-Portabella, M., y otros. (2005). Curs de monitors i monitores d'activitat de lleure infantil i juvenil. Fundació Catalana de l'Esplai. Costal, D., Franch, X., Ribera Sancho, M., & Teniente, E. (2005). Enginyeria del software. Especificació. Edicions UPC. de Caso Parra, A. (2010). JavaScript. Anaya Multimedia. Rahmel, D. (2007). Professional Joomla! Wrox. Schmitt, C., Dominey, T., Li, C., Marcotte, E., Orchard, D., & Trammell, M. (2008). Profesional CSS para diseño web. Anaya Multimedia. Sklar, D. (2005). Introducción a PHP 5. Anaya Multimedia. 9.2. Referencias 9.2.1. Archivos y documentos web LOPD. Ley Orgánica de Protección de Datos que se encarga de regular el tratamiento de datos de los usuarios en los sitios web. http://www.boe.es/boe/dias/1999/12/14/pdfs/A43088-43099.pdf JOOMLAPLANTILLAS. Desarrollo de plantillas para Joomla! https://github.com/comunidadjoomla/cj_biblioteca/raw/master/desarrollo_plantillas_joomla/libro/ pdf/desarrollo_plantillas_joomla.pdf JOOMLAPROGRAMMING. Tutorial de los cambios de Joomla! 1.6 de cara a la programación de extensiones. http://cursus.jira.nl/cursus/downloads/doc_view/31-joomla-16-programming
A. Instalación, ejecución y mantenimiento Biblioteca de actividades 128 Ilustración A-5 Comprobaciones previas para Joomla! Tras leer y aceptar la licencia deberemos proporcionar los datos de acceso a la base de datos. A continuación se muestra una configuración posible. - Tipo de base de datos: MySQL - Hospedaje: localhost - Usuario: root (u otro usuario con permisos) - Contraseña: <contraseña de root> - Base de datos: joomla - Prefijo de las tablas: jos_ - Proceso para una base de datos antigua: Respaldar En el siguiente paso omitiremos la configuración del FTP pulsando el botón siguiente. En la pantalla de configuración principal indicaremos los datos necesarios para proseguir con la instalación. No es necesario instalar datos de ejemplos, así que no lo haremos. Ilustración A-6 Configuración principal de Joomla! Para finalizar la instalación deberemos eliminar la carpeta de instalación pulsando el botón “Eliminar carpeta de instalación”. Si se produce algún error se puede eliminar manualmente (rm
A. Instalación, ejecución y mantenimiento Biblioteca de actividades 129 -r /var/www/instalation). Una vez concluida la instalación podemos comprobar el correcto funcionamiento del frontend (http://localhost/index.php) y del backend (http://localhost/administrator/). 1.3. Instalación de extensiones Para finalizar la instalación del sitio web, tendremos que instalar las extensiones necesarias. Para ello, entraremos en el gestor de extensiones en el panel de administración. Desde allí podremos seleccionar el fichero correspondiente a la extensión y clicar en ‘Subir e instalar’. Ilustración A-7 Icono del gestor de actividades y formulario de instalación de extensiones. A continuación se indica el orden recomendado para la instalación de los componentes. 1. Paquetes de traducción al español para Frontend y Backend. 2. Componente actividades. 3. Plantilla pfc. 4. Paquete ITPConnect para conectarse con Facebook. 5. Paquete JSocialComments para comentarios en redes sociales. 6. Paquete Kunena para la creación del foro. Para la instalación habrá que pulsar adicionalmente el botón Instalar Kunena. Lo más importante es instalar primero los ficheros de idioma. Si Joomla! ya estaba disponible en español podemos omitir este paso. Hay que tener en cuenta que si instalamos un componente con soporte para un idioma no existente en el sistema, este sistema no podrá ser utilizado. Para que el paquete ITPConnect funcione correctamente se deberá crear una aplicación en Facebook y configurar en el panel de administración de Joomla (desde el menú Componentes ITPConnect) el identificador de la aplicación y el código secreto que permiten la comunicación con la aplicación de Facebook. Para crear la aplicación de Facebook se ha seguido el artículo de Alberto Varela [BERRIART].
A. Instalación, ejecución y mantenimiento Biblioteca de actividades 130 2. Ejecución Debian configura automáticamente Apache y MySQL para que se inicien automáticamente durante el encendido de la máquina. Si por algún motivo deseas detener, iniciar o reiniciar alguno de estos servicios puedes hacerlo mediante los siguientes comandos con permisos de superusuario: /etc/init.d/apache2 stop|start|restart /etc/init.d/mysql stop|start|restart 3. Mantenimiento Para el mantenimiento del servidor se deberá comprobar periódicamente que el sistema funciona correctamente. Para ello, habrá que revisar los ficheros de registros (o logs) del servidor web, de la base de datos y del propio Joomla!. Los registros de apache se almacenan por defecto en los el directorio /var/log/apache2/. Existen dos tipos de registros. El fichero access.log registra los accesos de los usuarios, mostrando la fecha y el recurso solicitado. El fichero error.log registra los errores que se han producido por causas de apache o de PHP. Del mismo modo que Apache registra los errores sufridos, MySQL dispone de un fichero con el mismo objetivo. El fichero error.log de MySQL se puede encontrar en /var/log/mysql/. En cuanto a Joomla!, este dispone de un directorio dentro del directorio raíz del servidor web para almacenar los errores producidos en Joomla!. Los ficheros de registro se pueden encontrar en /var/www/logs/. El administrador del sitio web tendría que comprobar que la lista de materiales es correcta (los usuarios pueden crear nuevos materiales si no lo encuentran en la lista) y también se tiene que encargar de controlar los contenidos y sus respectivos archivos multimedia.
B. Manual de usuario Biblioteca de actividades 131 B) Manual de usuario 1. Frontend Registro e identificación El usuario dispone de dos vías para identificarse ante el sistema. La primera consiste en rellenar un formulario de registro para crearse una cuenta. La segunda utiliza su cuenta de Facebook para darse de alta en el sistema. Ilustración B-1 Área de identificación de usuario 1ª opción. Registro de usuario 1. El usuario hace clic en ‘Registrarse’ y se muestra un formulario. 2. El usuario rellena y envía el formulario pulsando el botón ‘Registro’. 3. El sistema indicará si los pasos son correctos. En ese caso, el usuario ya podrá acceder mediante la caja superior derecha de la página indicando su nombre de usuario y su contraseña. 2ª opción. Cuenta de Facebook 1. El usuario pulsa el botón ‘Entrar con Facebook’ y el sistema muestra una ventana donde pide los datos de acceso a Facebook. 2. El usuario rellena los datos y pulsa ‘Entrar’. 3. Si es la primera vez que accede, se le pedirá permiso para que la aplicación creada recopile los datos necesarios para crear el usuario en el sistema. El usuario deberá aceptar. 4. El sistema redirigirá al usuario a la página principal y habrá iniciado su sesión. Ilustración B-2 Ventana de acceso a Facebook
B. Manual de usuario Biblioteca de actividades 132 Crear actividades Para crear una actividad el usuario debe estar previamente identificado. Los pasos para crear una actividad son los siguientes: 1. El usuario hace clic en la opción ‘Crear actividad’ dentro del menú Actividades que le lleva a un formulario. Ilustración B-3 Menú actividades 2. El usuario rellena los campos del formulario (se marcan con un * los campos obligatorios). 3. El usuario pulsa el botón ‘Guardar actividad’. Ilustración B-4 Formulario de actividad Si los datos introducidos son correctos, la actividad se crea. El sistema pregunta al usuario si desea añadir contenido multimedia a la actividad. Si el usuario pulsa „Finalizar edición’ la creación finaliza. En caso que el usuario puse „Añadir archivo‟ se mostrará un formulario en el que podrá enviar contenido multimedia desde su disco duro o bien indicar la URL del archivo. Además, en todo momento podrá ver los archivos multimedia que tiene asociados la actividad.
B. Manual de usuario Biblioteca de actividades 133 Ilustración B-5 Envío y gestión de contenido multimedia Mis actividades La opción del menú „Mis actividades‟ dentro de „Perfil’ muestra al usuario una tabla con todas las actividades creadas. Para modificar una actividad el usuario deberá visualizarla previamente (haciendo clic en el título) y acto seguido pulsar la imagen de edición . Ilustración B-6 Vista de las actividades del usuario Gestionar favoritos Desde la pantalla de actividad, el usuario puede añadir esa actividad a su lista de favoritos pulsando la imagen correspondiente . Si esa actividad ya pertenece a su lista de favoritos la imagen cambiarán por y permitirá eliminar la actividad de favoritos. También se pueden consultar y eliminar favoritos desde el menú „Perfil’ seleccionando la opción „Favoritos’.
B. Manual de usuario Biblioteca de actividades 134 Votaciones y comentarios Un usuario podrá votar una actividad cuando la esté visualizando. Solamente deberá marcar la puntuación deseada (del 1 al 5) y pulsar el botón „Valoración’ para que el sistema registre el voto. Ilustración B-7 Votación de contenidos Acceso al foro A través del menú „Foro’ el usuario accederá al foro del sitio web. Su funcionamiento es muy similar al de la mayoría de foros existentes en Internet. Ilustración B-8 Vista de las categorías del foro
B. Manual de usuario Biblioteca de actividades 135 2. Backend Gestionar contenido El administrador podrá gestionar todo el contenido a través de los menús que aparecen en la parte superior de la pantalla. Ilustración B-9 Menú de administración La gestión de artículos se encuentra dentro del menú „Contenido’. El gestor de artículos nos permitirá ver modificarlas o eliminarlas las noticias del sistema. Desde el mismo apartado, también se tendrá acceso a la gestión de las categorías de noticias mediante su correspondiente pestaña. Ilustración B-10 Pestañas del Gestor de artículos La gestión de actividades y materiales se encuentra en „Componentes Actividades’. Se podrá gestionar las actividades, sus categorías y los materiales a través de las pestañas, de manera similar a la gestión de noticias. Ilustración B-11 Gestor de materiales La gestión del foro se encuentra en „Componentes Foros Kunena’ y del mismo modo que los otros contenidos, permite gestionar categorías y mensajes. Ilustración B-12 Panel de control de Kunena
B. Manual de usuario Biblioteca de actividades 136 Gestionar usuarios La gestión de usuarios se encuentra en el menú Usuarios. Desde el menú usuarios se pueden visualizar los usuarios del sistema y se permite modificarlos, bloquearlos o eliminarlos. Además se pueden cambiar el grupo al que pertenece. También se permite consultar y modificar la jerarquía la gestión de grupos. Ilustración B-13 Gestor de usuarios
C. Pruebas de rendimiento Biblioteca de actividades 137 C) Pruebas de rendimiento Carga nula Configuración: 1 único usuario realizando diferentes tareas. 1 2 3 4 5 MEDIA (s) Filtrar actividades 0,933 0,986 0,993 1,01 1,03 0,9904 Comentar actividad 2,3 2,19 2,25 2,17 2,14 2,21 Enviar actividad 2,18 1,58 1,76 1,52 1,53 1,714 Enviar post 2,31 2,79 2,19 2,28 2,16 2,346 Buscar noticia 1,36 1,4 1,46 1,38 1,61 1,442 Tabla C-1 Pruebas de rendimiento con carga nula Carga media Configuración: 5 usuarios realizando peticiones constantemente. 1 usuario realizando diferentes tareas. 1 2 3 4 5 MEDIA (s) Filtrar actividades 3,63 3,55 3,43 3,64 3,54 3,558 Comentar actividad 3,83 3,63 3,41 3,55 3,64 3,612 Enviar actividad 5,36 5,11 5,21 5,27 5,34 5,258 Enviar post 9,52 8,9 9,13 11,29 9,25 9,618 Buscar noticia 5,58 4,74 4,73 4,55 4,84 4,888 Tabla C-2 Pruebas de rendimiento con carga media Carga alta Configuración: 20 usuarios realizando peticiones constantemente. 1 usuario realizando diferentes tareas. 1 2 3 4 5 MEDIA (s) Filtrar actividades 15,03 12,7 15,94 12,11 12,96 13,748 Comentar actividad 2,54 2,2 2,2 2,31 2,24 2,298 Enviar actividad 25,46 21,2 20,84 16,44 24,62 21,712 Enviar post 29,12 29,39 29,85 30,38 30,65 29,878 Buscar noticia 14,27 15,09 14 14,49 14,35 14,44 Tabla C-3 Pruebas de rendimiento con carga alta