UNIVERSIDAD CENTRAL DEL ECUADOR FACULTAD DE INGENIERÍA, CIENCIAS FÍSICAS Y MATEMÁTICA CARRERA DE INGENIERÍA IFORMÁTICA TÍTULO: “DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB DE ACUERDO CON EL REGLAMENTO DE LA LEY DE TRANSPARECIA Y ACCESO A LA INFORMACIÓN PÚBLICA, APLICADO A LA “UNIDAD EDUCATIVA FISCAL QUITO SUR” TRABAJO DE GRADUACIÓN PEVIO A LA OBTENCIÓN DEL TÍTULO DE INGENIERO INFORMÁTICO AUTORA NANCY VERÓNICA LÓPEZ OLMOS TUTOR ING. CESAR MORALES MEJÍA, MSC QUITO-ECUADOR 2015 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB DEDICATORIA Este proyecto dedico a mis padres y hermanas que han apoyado de una u otra manera para que pueda culminar y poder obtener mi Título. Gracias a la paciencia, empuje y ayuda del Ingeniero Cesar Morales, se pudo terminar este proyecto, y a todas las personas que estuvieron pendiente de este proceso. Y no podía faltar mi Dios que me dio la salud, la perseverancia y personas gratas para que pueda esto desarrollarse. Nancy López ii DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB AGRADECIMIENTO A mis padres y hermanas que han sido mi apoyo para poder realizar el proyecto, por cada momento que supieron disculpar mi ausencia y el tiempo que no he podido estar con ellos. Mi profesor Cesar Morales, tutor de mi tesis, fue un apoyo, empuje y guía para poder culminar con el proyecto. A las personas que estuvieron pendientes del proceso de elaboración y los avances, como la señora Rectora de la Unidad Educativa Fiscal “Quito Sur”, donde se implementó el proyecto de tesis. A Pablo Herrera, Gerente de Sistemas de Alianza compañía de Seguros y Reaseguros, lugar que actualmente estoy laborando, le agradezco por su comprensión y la facilidad para poder realizar las visitas con el tutor y los trámites necesarios para culminar con la tesis. Y a mis revisores que dieron su tiempo para poder revisar y dar sus opiniones sobre el tema, de esta manera culminar con el proceso y obtener el título de ingeniera en Informática. . Nancy iii DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB AUTORIZACIÓN DE LA AUTORÍA INTELECTUAL iv DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB CERTIFICADO DEL TUTOR v DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB INFORME SOBRE LA CONCLUSIÓN DE PROYECTO vi DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB INFORME SOBRE LA CONCLUSIÓN DEL TRABAJO DE GRADUACIÓN vii DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB CALIFICACIÓN DEL TRIBUNAL viii DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB CONTENIDO DEDICATORIA ............................................................................................... ii AGRADECIMIENTO ...................................................................................... iii AUTORIZACIÓN DE LA AUTORÍA INTELECTUAL ...................................... iv CERTIFICADO DEL TUTOR .......................................................................... v INFORME SOBRE LA CONCLUSIÓN DE PROYECTO ................................ vi CALIFICACIÓN DEL TRIBUNAL ................................................................. viii LISTA DE GRÁFICOS .................................................................................. xii LISTA DE TABLAS ...................................................................................... xiv LISTA DE FIGURAS ..................................................................................... xv LISTA DE IMÁGENES ................................................................................ xvii RESUMEN ................................................................................................... xix ABSTRACT ................................................................................................... xx INTRODUCCIÓN ........................................................................................... 1 CAPÍTULO 1 .................................................................................................. 2 1. PRESENTACIÓN DEL PROBLEMA ....................................................... 2 1.1. Planteamiento del Problema.......................................................... 2 1.2. Formulación del Problema ............................................................. 2 1.3. Interrogantes de la Investigación ................................................... 3 1.4. Objetivo de la Investigación ........................................................... 3 1.4.1 Objetivo General ....................................................................... 3 1.4.2 Objetivos Específicos ................................................................. 3 1.5. Justificación ................................................................................... 4 1.6. Alcance .......................................................................................... 6 CAPÍTULO 2 .................................................................................................. 8 2. REVISIÓN BIBLIOGRÁFICA .................................................................. 8 2.1. Antecedentes................................................................................. 8 2.2. Fundamentación Teórica ............................................................... 9 2.2.1. Ingeniería de Software ............................................................... 9 2.2.2. RUP (Rational Unified Process) .............................................. 10 2.2.3. Lenguaje Unificado de Modelado (UML) .................................. 12 2.2.4. Página Web .............................................................................. 13 2.2.5. Explorador Web ....................................................................... 13 2.2.6. Servidor Web............................................................................ 14 ix DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 2.2.7. Plataforma JAVA ....................................................................... 15 2.2.8. Motor de Base de Datos .......................................................... 16 2.2.9. PHP ......................................................................................... 18 2.2.10. HTML5 con Responsive ........................................................... 19 2.2.11. Wordpress ............................................................................... 19 2.3. Identificación de Variables ........................................................... 26 2.4. Hipótesis ...................................................................................... 26 CAPÍTULO 3 ................................................................................................ 27 3. MARCO METODOLÓGICO .................................................................. 27 3.1 Diseño de la Investigación ........................................................... 27 3.2 Diseño Experimental ................................................................... 36 3.3 Desarrollo de la aplicación........................................................... 43 3.3.1 Casos de Uso ........................................................................... 43 3.3.2 Diagramas de Secuencia ......................................................... 68 Base de Datos plugin calificaciones ......................................................... 80 3.4 Presentación de datos y resultados en gráficos .......................... 81 CAPÍTULO 4 ................................................................................................ 85 4. MARCO ADMINISTRATIVO ........................................................ 85 4.1. Recursos ..................................................................................... 85 4.1.1. Recursos Institucionales .......................................................... 85 4.1.2. Recursos del egresado ............................................................ 86 4.2. Presupuesto ................................................................................ 86 4.3. Recursos de infraestructura tecnológica ..................................... 86 CAPÍTULO 5 ................................................................................................ 87 5. CONCLUSIONES Y RECOMENDACIONES ....................................... 87 5.1. Conclusiones ............................................................................ 87 5.2. Recomendaciones.................................................................... 89 BIBLIOGRAFÍA ............................................................................................ 90 ANEXO A: CRONOGRAMA DE ACTIVIDADES ......................................... 93 ANEXO B: PRESUPUESTO ........................................................................ 94 ANEXO C: MATERIALES DE REFERENCIA .............................................. 95 TERMINOLOGÍA BÁSICA ........................................................................ 95 ANEXO D: TABLA DE ACHIVO PARA SUBIR AL MÓDULO DE CALIFICACIONES ....................................................................................... 97 x DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB ANEXO E: MANUAL DE USUARIO ............................................................. 98 1. FUNCIÓN USUARIOS .......................................................................... 98 2. FUNCIÓN PROFESORES.................................................................. 101 3. FUNCIÓN CURSOS ........................................................................... 102 4. FUNCIÓN MEDIOS ............................................................................ 102 5. FUNCIÓN EVENTOS ......................................................................... 103 6. FUNCIÓN LMS ................................................................................... 104 7. FUNCIÓN PÁGINAS .......................................................................... 106 8. FUNCIÓN APARIENCIA ..................................................................... 111 9. FUNCIÓN HERRAMIENTAS .............................................................. 115 10. FUNCIÓN AJUSTES .......................................................................... 116 ANEXO F: MANUAL DE INSTALACIÓN ................................................... 122 BACKUP Y RESTAURACIÓN DEL SITIO WEB DESDE HOSTING ......... 137 ANEXO G: FOTOS .................................................................................... 144 ANEXO H: ACTAS FIRMADAS DEL PROYECTO .................................... 146 xi DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB LISTA DE GRÁFICOS Gráfico 2. 1: Metodología RUP .................................................................... 11 Gráfico 2. 2: IDE Eclipse .............................................................................. 16 Gráfico 3. 1: Fases Desarrollo RUP ............................................................. 30 Gráfico 3. 2: Descripción del sistema........................................................... 37 Gráfico 3. 3: Proceso general del sistema ................................................... 44 Gráfico 3. 4: Ingreso a la administración del Portal Web ............................. 46 Gráfico 3. 5: Administración de usuarios ..................................................... 47 Gráfico 3. 6: Creación de Usuarios Asignados ............................................ 48 Gráfico 3. 7: Buscar usuarios asignados ..................................................... 50 Gráfico 3. 8: Editar usuarios asignados ....................................................... 51 Gráfico 3. 9: Eliminar usuarios asignados .................................................... 54 Gráfico 3. 10: Roles de usuario administrador ............................................. 55 Gráfico 3. 11: Roles de usuario editor .......................................................... 57 Gráfico 3. 12: Roles de usuario autor .......................................................... 58 Gráfico 3. 13: Roles de usuario colaborador ................................................ 59 Gráfico 3. 14: Roles de usuario suscriptor ................................................... 60 Gráfico 3. 15: Ingreso de Calificaciones ...................................................... 61 Gráfico 3. 16: Reseteo de clave usuario representante ............................... 63 Gráfico 3. 17: Ingreso Consulta de Calificaciones ....................................... 65 Gráfico 3. 18: Ingreso usuario Invitado ........................................................ 66 Gráfico 3. 19: Proceso de creación de Usuarios .......................................... 68 Gráfico 3. 20: Proceso Ingreso de Información al Portal Web ..................... 69 Gráfico 3. 21: Proceso Ingreso de archivo de calificaciones ....................... 70 Gráfico 3. 22: Proceso Presentación de calificaciones a los usuarios representantes ............................................................................................. 71 Gráfico 3. 23: Proceso Reseteo clave usuario representante ...................... 72 Gráfico 3. 24: Base de datos Wordpress ..................................................... 79 Gráfico 3. 25: Pantalla Principal del Portal Web .......................................... 81 Gráfico 3. 26: Menú- Institución ................................................................... 82 xii DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Gráfico 3. 27: Menú – Ley de transparencia ................................................ 82 Gráfico 3. 28: Menú- Calificaciones ............................................................. 83 Gráfico 3. 29: Presentación de datos a los usuarios representantes ........... 84 Gráfico 3. 30: Menú – Contáctenos ............................................................. 84 xiii DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB LISTA DE TABLAS Tabla 3. 1: Necesidad Gestión de Usuarios ................................................. 39 Tabla 3. 2: Necesidad Información Portal Web ............................................ 41 Tabla 3. 3: Consulta de calificaciones de los estudiantes ............................ 41 Tabla 3. 4: Módulo de Calificaciones ........................................................... 42 Tabla 3. 5: CU-01- Proceso General del Sistema ........................................ 45 Tabla 3. 6:CU-02-Ingreso a la administración del Portal Web ..................... 47 Tabla 3. 7: CU-03- Administración de usuarios ........................................... 48 Tabla 3. 8: CU-04-Crear usuario asignado .................................................. 49 Tabla 3. 9: CU-05-Buscar usuario asignado ................................................ 51 Tabla 3. 10: CU-06-Editar usuario asignado ................................................ 53 Tabla 3. 11: CU-07-Eliminar usuarios asignados ......................................... 54 Tabla 3. 12: CU-08-Roles de usuarios administrador .................................. 56 Tabla 3. 13: CU-09-Roles de usuario editor ................................................. 57 Tabla 3. 14: CU-10-Roles de usuario autor ................................................. 58 Tabla 3. 15: CU-11-Roles de usuario colaborador ....................................... 59 Tabla 3. 16: CU-12- Roles de usuario suscriptor ......................................... 61 Tabla 3. 17: CU-13-Ingreso de Calificaciones.............................................. 62 Tabla 3. 18: CU-14-Reseteo de clave usuario representante ...................... 64 Tabla 3. 19: CU-15-Ingreso consulta de calificaciones ................................ 66 Tabla 3. 20: CU-16-Ingreso Usuario Invitado ............................................... 67 Tabla 3. 21: Tabla wp_comment .................................................................. 73 Tabla 3. 22: Tabla wp_postmeta .................................................................. 74 Tabla 3. 23: Tabla wp_post .......................................................................... 75 Tabla 3. 24: Tabla wp_terms........................................................................ 75 Tabla 3. 25: Tabla wp_term_relationships ................................................... 76 Tabla 3. 26: Tabla wp_usermeta.................................................................. 76 Tabla 3. 27: Tabla wp_users ........................................................................ 77 Tabla 3. 28: Tabla wp_notas_cabecera ....................................................... 77 Tabla 3. 29: Tabla wp_notas_detalle ........................................................... 78 xiv DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB LISTA DE FIGURAS Figura 1: Añadir usuarios ....................................................................................... 98 Figura 2: Ingreso de datos usuario ....................................................................... 99 Figura 3: Asignación de roles .............................................................................. 100 Figura 4: Modificación de Usuarios .................................................................... 100 Figura 5: Agregar profesores............................................................................... 101 Figura 6: Agregar cursos ...................................................................................... 102 Figura 7: Visualización de archivos en repositorio Medios............................. 103 Figura 8: Función eventos- Ubicación ............................................................... 104 Figura 9: Función eventos- Permisos ................................................................ 104 Figura 10: Función LMS ....................................................................................... 105 Figura 11: Opciones de Respaldos y restauración de las funciones. ........... 106 Figura 12: Creación de Páginas con LMS creador .......................................... 107 Figura 13: Opciones habilitadas con el LMS creador de Página................... 108 Figura 14: LMS opción columnas ....................................................................... 108 Figura 15: LMS opción General .......................................................................... 108 Figura 16: LMS opción Unique ............................................................................ 109 Figura 17: LMS opción Others ............................................................................ 109 Figura 18: LMS opción WP widgets ................................................................... 110 Figura 19: LMS opción Sample Layouts ............................................................ 111 Figura 20: Función Apariencia Portal ................................................................ 111 Figura 21: Widget footer (pie de página) ........................................................... 112 Figura 22: Añadir widget en las páginas ........................................................... 112 Figura 23: Footer columnas ................................................................................. 113 Figura 24: Añadir opciones en el Menú principal ............................................. 114 Figura 25: Ubicación en la estructura del menú la página seleccionada ..... 114 Figura 26: Widget importar y exportar ............................................................... 115 Figura 27: Exportar el portal en extensión .xml .............................................. 116 Figura 28: Función Ajustes .................................................................................. 117 Figura 29: Ingreso de calificaciones al Portal Web .......................................... 117 Figura 30: Selección archivo .csv de calificaciones......................................... 118 Figura 31: Insertar en la Entrada ........................................................................ 118 xv DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Figura 32: Inserta la información en la Base de datos .................................... 119 Figura 33: Verificación de calificaciones almacenadas................................... 119 Figura 34: Reseteo de clave ................................................................................ 120 Figura 35: Ingreso calificaciones por medio del usuario asignado .............. 121 xvi DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB LISTA DE IMÁGENES Imagen 1: Descarga de instalador xampp ................................................. 122 Imagen 2: Permisos al instalador ............................................................... 123 Imagen 3: Ejecutar el instalador Xampp .................................................... 123 Imagen 4: Pasos de la instalación de Xampp ............................................ 124 Imagen 5: Reiniciar equipo ........................................................................ 124 Imagen 6: Acceder a los archivos instalados ............................................. 125 Imagen 7: Reinicio de servicios de Xampp ................................................ 125 Imagen 8: Ver IP del servidor..................................................................... 126 Imagen 9: Ingresar a Xampp por medio del navegador ............................. 126 Imagen 10: Creación de carpeta escuela .................................................. 127 Imagen 11: Ingreso a la cuenta GoDaddy ................................................. 128 Imagen 12: Seleccionar opción Web Hosting ............................................ 128 Imagen 13: Ingreso a CPanel del servidor ................................................. 129 Imagen 14: Crear cuenta FTP Account ...................................................... 129 Imagen 15: Visualización de datos de acceso ........................................... 130 Imagen 16: Filezilla acceso al servidor FTP .............................................. 130 Imagen 17: Copia de archivos al servidor .................................................. 131 Imagen 18: Creación de base de datos en MySql ..................................... 132 Imagen 19: Crear base de datos................................................................ 132 Imagen 20: Usuario de la base de datos ................................................... 133 Imagen 21: Asignación de base de datos a un usuario ............................. 133 Imagen 22: Cambio de parámetros en el archivo wp-config.php ............... 134 Imagen 23: Ingresar al CPanel a PhpMyAdmin ......................................... 134 Imagen 24: Importar................................................................................... 135 Imagen 25: Importando base de datos modificada .................................... 135 Imagen 26: Base de datos escuela ............................................................ 136 Imagen 27: Ingreso CPANEL ..................................................................... 137 Imagen 28: Opciones de CPANEL ............................................................. 138 Imagen 29: Backup Wizard CPANEL ........................................................ 139 Imagen 30: Pasos de wizard Backup ......................................................... 139 Imagen 31: Pasos Wizard Full Backup ...................................................... 140 xvii DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Imagen 32: Generar Full backup............................................................... 141 Imagen 33: Restauración Wizard .............................................................. 141 Imagen 34: Pasos de restauración wizard ................................................. 142 Imagen 35: Visualizar la base de datos .................................................... 143 Imagen 36: Backup full para descargarse desde CPANEL ........................ 143 xviii DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB RESUMEN DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB DE ACUERDO CON EL REGLAMENTO DE LA LEY DE TRANSPARECIA Y ACCESO A LA INFORMACIÓN PÚBLICA, APLICADO A LA UNIDAD EDUCATIVA FISCAL “QUITO SUR” La creación de este portal Web tiene la finalidad de cumplir con una Ley que el Estado obliga a todas las Instituciones Públicas Educativas y también ofrece una búsqueda rápida de la información de la Institución y de las calificaciones de los estudiantes. El proyecto es administrable, basado en herramientas de software libre, adaptable y de fácil uso, lo cual le permite estructurarlo, diseñarlo y modificarlo según la Institución Pública Educativa. El proyecto contiene información general de la Institución, noticias, eventos, ley de transparencia, archivos descargables, imágenes y calificaciones de los estudiantes los cuales son añadidos, modificados y administrados por personal asignado de la Institución Pública Educativa, en nuestro caso aplicado e implementado en la Unidad Educativa Fiscal “Quito Sur”. DESCRIPTORES: PORTAL WEB/ WORDPRESS / PLUGIN WORDPRESS / CALIFICACIONES ESTUDIANTES/ PORTAL WEB INSTITUCIONES PUBLICAS/ UNIDAD EDUCATICA QUITO SUR/ LEY DE TRASPARENCIA Y ACCESO A LA INFORMACIÓN xix DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB ABSTRACT DESIGN AND IMPLEMENTATION OF A WEB SITE IN ACCORDANCE WITH THE RULES OF THE LAW TRANSPARECIA AND ACCESS TO PUBLIC INFORMATION, APPLIED IN “UNIDAD EDUCATIVA QUITO SUR" The creation of this Web site is intended to comply with a State law that force all Public Educational Institutions and also offers a quick search of institutional information and students grades. This project is manageable, based in free software tools, which is adaptable and easy to use, allowing structuring, designing and modifying according to the Public Educational Institution. The project provides general information of the Institution, news, events, transparency law, downloadable files, images and students grades that are added, modify and managed by assigned personal of the institution, in our case applied and implemented in “Unidad Educativa Fiscal Quito Sur” DESCRIPTORS: WEB SITE / WORDPRESS / PLUGIN WORDPRESS / RATINGS STUDENTS/ WEB PORTAL PUBLIC INSTITUTIONS /UNIDAD EDUCATIVA QUITO SUR / LAW OF TRANSPARENCY INFORMATION xx AND ACCESS TO DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB xxi DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB xxii DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB INTRODUCCIÓN El presente proyecto consiste en realizar un portal web generalizado para cualquier institución pública educativa, como una plantilla de fácil uso, el mismo que permitirá brindar información actualizada tanto de las actividades educativas administrativas como pedagógicas. El portal se diseñará bajo los requerimientos generales de acuerdo con la Normativa vigente de la Ley orgánica de Educación y su respectivo reglamento y añadido las calificaciones para los padres de familia representantes de sus niños. Este portal web será aplicado a la Unidad Educativa Fiscal Quito Sur El portal mostrará: Información general de la institución: Autoridades, el PEI (Misión, visión, idearios, entre otros), noticias, artículos importantes, plan de riesgos, oferta académica, croquis, organigrama, distributivo de trabajo y otros. Publicación de los reportes académicos parciales y quimestrales. Cronograma de actividades. Información para padres de familia: acceso a las notas de sus niños. Noticias en general. Ley de transparencia El proyecto tendrá un sistema 100% administrable basado en herramientas GNU, con PHP5.4, MySQL 5, y Apache2, será aplicado para el uso de herramientas de última tecnología usando HTML 5 con Responsive. 1 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB CAPÍTULO 1 1. PRESENTACIÓN DEL PROBLEMA 1.1. Planteamiento del Problema En la actualidad las normativas y leyes están en vigencia, lo cual hace que todas las Instituciones Educativas se actualicen de forma obligatoria en tener su propio portal Web, donde se encuentre la información de dicha Institución. De ahí parte la necesidad de ser aplicado en la Unidad Educativa Fiscal Quito Sur, que actualmente no cuenta con un medio de información Web y no disponen de presupuesto para su desarrollo. Actualmente, la institución entrega reportes académicos parciales y quimestrales impresos, que involucra una demanda excesiva de recursos materiales y humanos. Existe poca concurrencia de los representantes legales de los estudiantes a la institución a solicitar información sobre el rendimiento académico de sus hijos u otra información adicional, debido al tiempo ya que trabajan y dependen de esos recursos para sostener a sus familias porque son de clase media y baja. 1.2. Formulación del Problema Ahora el acceso a la información es muy importante para la comunidad desde cualquier lugar en todo momento, las instituciones educativas son las que deberían dar mayor apertura al avance tecnológico por el hecho de ser entes de educación. Es por ello que necesitan de un sistema informático que presente las actividades, noticias, información relevante de dicha institución y dando a conocer La ley de Trasparencia. 2 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 1.3. Interrogantes de la Investigación ¿Cuál es el acceso, las facilidades, el conocimiento de la información de la unidad educativa? ¿Quiénes serán los beneficiarios, la comunidad en general? ¿Se adaptara la comunidad de clase media y baja a los cambios y al uso de un Portal Web para obtener información? ¿Cómo las unidades educativas podrán dar a conocer su información, dependerá de la sistematización y presentación mediante el uso de la tecnología? 1.4. Objetivo de la Investigación El objetivo de la página generalizada para Instituciones Públicas Educativas es la ser acoplada, diseñada de manera fácil para dicha institución y presentar a la comunidad la información que se exige según la Ley de Transparencia. 1.4.1 Objetivo General Diseñar e implementar un portal web generalizado, para las instituciones públicas educativas, el cual será aplicado en la Unidad Educativa Fiscal Quito Sur de acuerdo con la normativa del Reglamento de la ley de trasparencia y acceso a la información, con la finalidad de difundir la información institucional a toda la comunidad educativa. 1.4.2 Objetivos Específicos Crear un portal web de fácil manejo y personalización, el cual pueda ser utilizado como plantilla para las Instituciones públicas educativas. Difundir por medio del portal, la información de las Instituciones públicas educativas de acuerdo con los requerimientos de la normativa de educación y la Ley de Transparencia. 3 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Promover la interacción de los padres y madres de familia con la Institución mediante las visitas al portal para ver información en general y académica. Promover el uso de la tecnología para cuidado y conservación del medio ambiente y evitar el uso de papel en reportes. Implementar un módulo de reportes de notas, con fácil navegación para los padres de familia y que puedan acceder a la información de sus niños en dicha Institución. Implementar el portal Web de la institución Educativa Fiscal Quito Sur, haciendo uso de la plantilla para Instituciones públicas generalizado basado en roles y perfiles de usuario. 1.5. Justificación La sociedad actual, frente al mundo globalizado en el que aparece la tecnología, que avanza rápidamente, todos nos vemos en la obligación de actualizarnos y ser parte del mundo tecnológico, con mayor razón el sector educativo, que debe ir a la vanguardia de estos procesos, pues los niños, niñas y jóvenes de esta generación necesitan desenvolverse y canalizar todo su potencial y conocimientos de acuerdo con los requerimientos y necesidades del mundo actual. Al diseñar este portal Web generalizado para cualquier Institución pública educativa, ya es una ayuda económica, social y de pocos recursos para su implementación. Por este motivo el objetivo de esta propuesta, es crear esta plantilla generalizada que ayude a los procesos, actividades, actores y otros que son parte de la comunidad educativa y que necesitan darse a conocer y ser partícipes de las actividades que promueve la Institución Educativa mediante un portal Web. 4 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Además, este medio contribuirá con el medio ambiente, al eliminar un gran porcentaje de uso de papel y recursos institucionales. Haciendo uso del Objetivo 4. Fortalecer las capacidades y potencialidades de la ciudadanía del Plan Nacional del Buen Vivir 2013-2017 en donde plantea o siguiente: Las personas, la familias y la sociedad tienen el derecho y la responsabilidad de participar en el proceso educativo 1; es así que este proyecto pretende educar a la comunidad educativa, incentivar al uso de medios tecnológicos dejando atrás el analfabetismo tecnológico, pues los padres y madres de familia, se verán en la obligación de aprender e interesarse en conocer cómo es el mundo tecnológico e instruirse de tal forma que con ayuda de sus niños o personas externas ellos puedan dejar el miedo a utilizar estas herramientas. El proyecto permitirá compartir experiencias entre padres e hijos al ingresar al portal web de la institución, existe ahorro en tiempo y espacio pues los representantes podrán obtener información actualizada del rendimiento académico de sus hijos, de las actividades a las que deben acudir entre otras. Hay que tomar en cuenta también que La Unidad Educativa Fiscal Quito Sur no posee el recurso humano que desarrolle este portal web y pueda cumplir con el Reglamento de la Ley de transparencia y acceso a la información pública según el artículo 7, Difusión de Información Pública, que dice lo siguiente: “Por la transparencia en la gestión administrativa que están obligadas a observar todas las Instituciones del Estado que conforman el sector público en los términos del artículo118 de la Constitución Política de la República y demás entes señalados en el artículo 1de la presente Ley, difundirán a través de un portal de información o página web, así como de los medios necesarios a disposición del público, implementados en la misma institución, 1 http://www.buenvivir.gob.ec/objetivo-4.-fortalecer-las-capacidades-y-potencialidades-de-laciudadania. (s.f.). 5 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB la siguiente información mínima actualizada, que para efectos de esta Ley se la considera de naturaleza obligatoria.”2 1.6. Alcance Diseñar un portal Web o plantilla que será aplicado para las Instituciones públicas educativas, con la perspectiva de que dicha plantilla sea instalada o alojada en un servidor de la Universidad Central del Ecuador, con el propósito de ser un proyecto fuente para las instituciones públicas que no tienen recursos para el desarrollo de su propio portal Web, y que sirva para la sociedad como un aporte y apoyo para la acreditación de nuestra Universidad Central del Ecuador. Diseñar e implementar un sistema que contenga una base de datos con la información de la escuela y el usuario de la institución sea el encargado de almacenar dicha información de manera fácil. El sistema que implementaremos será multitarget es decir que tiene como público destino a todo tipo de persona que desee visitar el portal para conocer sobre la Unidad Educativa Fiscal Quito Sur, esto lo podrán hacer, desde niños hasta personas adultas, solo necesita saber algo básico sobre el manejo de un computador y conocimiento informático. El sistema contará con cuatro módulos los mismos que serán visualizados a través de un computador o dispositivo que permita navegar: El primero denominado como Modulo Administrativo constara de dos usuarios de la Plataforma: Administrador y Usuario asignado : El Administrador, podrá manejar el sistema en su totalidad sin restricciones. Usuarios asignados, administración del portal son aquellas personas creadas en la web que podrán acceder a funciones especiales. Adicionalmente tienen la posibilidad de colaborar con datos, eventos, servicios, publicaciones, subir calificaciones, cambios específicos 2 http://www.cdc.gob.cl/wp-content/uploads/documentos/legislacion_internacional/. (s.f.). 6 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB e información necesaria de la Unidad Educativa Fiscal Quito Sur, según la Ley de transparencia y acceso a la información pública. Los usuarios representantes: son aquellas personas que se identifican con la cédula y una contraseña en la página de calificaciones, pueden consultar y acceder a las notas de sus hijos. El invitado, que es aquel que llega a la página pero no se identifica, solamente puede visualizar y navegar por el portal. El segundo Módulo es el acceso para los padres de familia con su identificación, que puedan visualizar la información de sus hijos, como reportes académicos parciales y quimestrales. El tercer Módulo es de presentación de notas, aquí se detallara los reportes de los niños, que los profesores subirán a nuestro servidor; este archivo que se sube tiene un formato .csv específico general para almacenarse en la base de datos y luego presentar a los padres de familia. El cuarto Módulo será el Portal donde contendrá toda la información general de la institución, cronograma de actividades, servicios educativos, noticias en general. El Sistema será desarrollado, probado e implementado sobre plataforma Unix Based con herramientas de software libre. Para la implementación se ha pensado en un ordenador con buenas características de hardware arrendado, esto es por motivos de mantenimiento, presupuesto económico y de personal capacitado. 7 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB CAPÍTULO 2 2. REVISIÓN BIBLIOGRÁFICA 2.1. Antecedentes Actualmente las instituciones tienen la obligación y a la vez la necesidad de implementar un portal Web para que el público en general tenga conocimiento de la institución, donde la Informática es un apoyo y con el uso de Tecnología y herramientas libres pueden solventar sus necesidades. La Unidad Educativa “Quito Sur” es una institución pública con trayectoria educativa de 22 años de trabajo, ubicada en la Urbanización La Santiago, calle Arica S12- 150 y Copihue, con aproximadamente a 2.489 niños(as) y jóvenes, distribuidos en la cantidad de 1199 mujeres y 1290 hombres. La institución ofrece Educación Inicial, General Básica y Bachillerato General Unificado. Funciona en dos jornadas, matutina y vespertina. En la jornada matutina asisten los estudiantes de Educación Inicial hasta tercer Curso de Bachillerato y en la jornada vespertina de Primer grado de Educación General Básica hasta Primer Curso de Bachillerato General Unificado. Cuenta con 86 docentes y 6 autoridades respectivas de acuerdo con la Normativa Vigente en la LOEI y su Reglamento. Brinda servicio educativo a estudiantes de sectores cercanos como La Dolorosa, La Biloxi, La Santiago, 4 de Diciembre, Magisterio de Pichincha, San Francisco del Pintado, Batallón Chimborazo y la Raya . 8 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 2.2. Fundamentación Teórica Empezamos esta sección revisando los principales conceptos y terminologías usados para la elaboración de este proyecto. 2.2.1. Ingeniería de Software Ingeniería de software es la disciplina o área de la informática que ofrece métodos y técnicas para desarrollar y mantener software de calidad. El proceso de desarrollo de software requiere por un lado un conjunto de conceptos, una metodología y un lenguaje propio. A este proceso también se le llama el ciclo de vida del software que comprende cuatro grandes fases: concepción, elaboración, construcción y transición. La concepción define el alcance del proyecto y desarrolla un caso de negocio. La elaboración define un plan del proyecto, especifica las características y fundamenta la arquitectura. La construcción crea el producto y la transición transfiere el producto a los usuarios. La ingeniería de software tiene varios modelos o paradigmas de desarrollo en los cuales se puede apoyar para la realización de software, de los cuales podemos destacar a éstos por ser los más utilizados y los más completos:3 Modelo en cascada o Clásico Modelo en espiral Modelo de Extreme Programming Desarrollo evolutivo SCRUM RUP (Proceso Unificado Racional) 3 http://procesosdesoftware.wikispaces.com/METODOLOGIAS+PARA+DESARROLLO+DE+SOFT WARE. (s.f.). 9 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Por lo tanto, la Ingeniería de Software nos aporta con metodologías para desarrollar el proyecto de software durante todas las etapas del ciclo de vida. Es así que nosotros hemos determinado que la metodología que se adapta de manera más adecuada a nuestro proyecto es la Metodología RUP. 2.2.2. RUP (Rational Unified Process) RUP sigue principios de ingeniería de software para la obtención de sistemas de información de calidad y de esta forma proporcionar una alternativa que permita evitar que los productos que se obtengan caigan en los aspectos que caracterizan a la crisis del software. RUP sigue una estrategia de ciclo de vida iterativo e incremental, pero de una forma un tanto peculiar, como vamos a ver a continuación. El ciclo de vida RUP se divide en 4 fases: Iniciación, Elaboración, Construcción y Transición. En cada fase se realizan una o más iteraciones (con el objeto de ir perfeccionando los objetivos, mediante un control de cambios) y hasta que no finaliza una fase no se comienza con la siguiente. Por general, la fase en la que se realizan más iteraciones es la Construcción. En cada fase se refinan los objetivos de las fases anteriores en el proceso de conseguir el objetivo u objetivos de la fase, por ejemplo, en la fase de construcción se pueden modificar, añadir o eliminar requisitos, casos de uso, etc… Las fases anteriores ayudan a que se realice ajustes hasta llegar a obtener un sistema que satisfaga las necesidades de los usuarios. En cada fase y en cada iteración se realiza un ciclo de vida en cascada con las siguientes etapas: Análisis, Diseño, Construcción (las tareas de programación que se realizan, sobre todo las fases de Construcción y Transición son perfectamente compatibles con la utilización de técnicas). El alcance del ciclo de vida depende en la fase en la que nos encontremos, es decir, aunque se realice un ciclo de vida en cascada en la fase de Iniciación, lo más probable es que no se llegue a construir nada o se llegue hacer algún prototipo de muy alto nivel. 10 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Los objetivos que se persiguen en cada fase son los siguientes: Iniciación: Obtención de los objetivos, catálogo de requisitos, identificación de casos de uso. Elaboración: Refinamiento de los objetivos de la fase anterior, casos de uso, análisis, diseño, definición y establecimiento de la arquitectura base del sistema. Construcción: Refinamiento de los objetivos de las fases anteriores y construcción del sistema de información. Transición: Refinamiento de los objetivos de las fases anteriores e implantación del sistema de información (preparación del producto para su entrega y pasos a producción de versiones no finales (porque hay que hacer ajustes) para luego llegar a la versión final prevista. Por tanto, como se comentó anteriormente, en cada etapa y en cada iteración se perfeccionan los productos previos que hayan requerido algún cambio, todo eso mientras se intentan conseguir los objetivos concretos de la fase. De esta forma el ciclo de vida RUP sigue un modelo adaptativo de desarrollo de software. De esta forma, el reparto de esfuerzos entre actividades varía de una fase a otra. Gráfico 2. 1: Metodología RUP 11 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Una característica importante del RUP es que todo el proceso está guiado por los casos de uso, algo que resulta lógico cuando hablamos de modelos incrementales, ya que están orientados al usuario y como tal es importante tener siempre presente el esquema de interacción usuarios/sistema, los cuales vienen definidos por los casos de uso y sus escenarios. RUP pretende la obtención de productos de muy alta calidad , no solo al cumplimiento de las expectativas del usuario, sino a la obtención de productos aceptables, sus características son: varias fases, múltiples iteraciones por fases, pueden provocar que el proceso de desarrollo sea costoso y que no se adapte a proyectos de pequeña escala, aunque el hecho de que siga un esquema incremental permitiría dar flexibilidad en el caso de que fuera necesario. RUP es muy potente ya que sigue una estrategia es incremental para obtener una nueva versión del proyecto, es decir, aproximarse al proceso real de desarrollo de software en el cual el proyecto va creciendo conforme los usuarios van comprendiendo cómo queda el sistema.4 2.2.3. Lenguaje Unificado de Modelado (UML) El “Lenguaje de Modelado Unificado” del inglés Unified Modeling Language (UML) es un lenguaje basado en diagramas para la especificación, visualización, construcción y documentación de cualquier sistema complejo, aunque nosotros nos centraremos en el caso específico de sistemas software. UML le ayuda a especificar, visualizar y documentar esquemas de sistemas de software, incluyendo su estructura y diseño, de una manera que cumpla con todos estos requisitos. (Usted puede usar UML para el modelado de negocios y modelado de otros sistemas no-software también.) El uso de cualquiera de la gran cantidad de herramientas basadas en UML en el 4 https://jummp.wordpress.com/2011/04/06/desarrollo-de-software-ciclo-de-vida-rup-rational-unifiedprocess/. (s.f.). 12 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB mercado, se pueden analizar los requisitos de su aplicación en el futuro y diseñar una solución que les satisfaga, en representación de los resultados utilizando trece tipos de diagramas estándar de UML 2.0 . Usted puede modelar casi cualquier tipo de aplicación, que se ejecuta en cualquier tipo y combinación de hardware, sistema operativo, lenguaje de programación, y la red, en UML. Su flexibilidad le permite modelar aplicaciones distribuidas que utilizan casi cualquier middleware en el mercado. Construido en conceptos OO fundamentales incluyendo aquellos en clase y operación, es un paso natural para lenguajes orientados a objetos y entornos tales como C ++, Java, y la reciente C #, pero se puede utilizar para modelar aplicaciones no OO, así, por ejemplo, Fortran, Perfiles VB, o COBOL. UML (es decir, subconjuntos de UML a medida para fines específicos) le ayudan modelo transaccional, en tiempo real, y los sistemas de alta disponibilidad en una forma natural.5 2.2.4. Página Web Una página web se define como un documento electrónico el cual contiene información textual, visual y/o sonora que se encuentra alojado en un servidor y puede ser accesible mediante el uso de navegadores. Una página web forma parte de una colección de otras páginas webs dando lugar al denominado sitio web el cual se encuentra identificado bajo el nombre de un dominio. La creación y desarrollo de una página web se realiza bajo un lenguaje de programación capaz de ser interpretados por los navegadores, lenguajes como el HTML, PHP, ASP, JSP o RUBY son ejemplos entre otros.6 2.2.5. Explorador Web El navegador web o navegador de internet es el instrumento que permite a los usuarios de internet navegar o surfear entre las distintas páginas de sus sitios webs preferidos. Se trata de un software que posee una interfaz gráfica 5 http://www.uml.org/. (s.f.). 6 http://www.quees.info/que-es-una-pagina-web.html. (s.f.). 13 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB compuesta básicamente de: botones de navegación, una barra de dirección, una barra de estado (generalmente, en la parte inferior de la ventana) y la mayor parte, en el centro, que sirve para mostrar las páginas web a las que se accede. 7 2.2.6. Servidor Web Es un programa que gestiona cualquier aplicación en el lado del servidor realizando conexiones bidireccionales y/o unidireccionales y síncronas o asíncronas con el cliente generando una respuesta en cualquier lenguaje o aplicación en el lado del cliente. El código recibido por el cliente suele ser compilado y ejecutado por un Navegador Web. Para la transmisión de todos estos datos se utiliza algún protocolo. Generalmente se utiliza el protocolo HTTP para estas comunicaciones, perteneciente a la capa de aplicación del Modelo OSI. El término también se emplea para referirse al ordenador que ejecuta el programa. Herramientas para el Desarrollo del Sistema La aplicación presentará una interfaz gráfica amigable y fácil de manejar que se lo desarrollará con la utilización de herramientas libres.8 El Proyecto Apache HTTP Server es un esfuerzo para desarrollar y mantener un servidor HTTP de código abierto para sistemas operativos modernos, incluyendo UNIX y Windows NT. El objetivo de este proyecto es proporcionar un servidor seguro, eficiente y extensible que proporciona servicios HTTP en sincronización con los estándares HTTP actuales. Apache httpd se puso en marcha en 1995, ha sido el servidor web más popular en Internet desde abril de 1996.9 7 http://www.informatica-hoy.com.ar/aprender-informatica/Que-es-un-navegador-web.php. (s.f.). 8 http://www.ecured.cu/index.php/Servidor_Web. (s.f.). 9 http://httpd.apache.org/. (s.f.). 14 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 2.2.7. Plataforma JAVA Eclipse es una plataforma de desarrollo de código abierto basada en Java. Por si misma, es simplemente un marco de trabajo y un conjunto de servicios para la construcción del entorno de desarrollo de los componentes de entrada. Afortunadamente, Eclipse tiene un conjunto de complementos, incluidas las Herramientas de Desarrollo de Java (JDT). Mientras que la mayoría de los usuarios están felices de usar Eclipse como un IDE de Java, sus ambiciones no se detienen ahí. Eclipse también incluye el Entorno de Desarrollo de Complementos (PDE), que es de interés principalmente para los desarrolladores que quieren extender Eclipse, dado que les permite construir herramientas que se integran sin dificultades con el entorno de Eclipse. Dado que todo en Eclipse es un complemento, todos los desarrolladores de herramientas tienen un campo de juego de nivel para ofrecer extensiones a Eclipse y para proporcionar un entorno de desarrollo integrado y unificado para los usuarios.10 Esta paridad y consistencia no está limitada a las herramientas de desarrollo de Java. Aunque Eclipse se escribe en el lenguaje Java, su uso no se limita al lenguaje Java. Por ejemplo, los complementos se encuentran disponibles o planificados para incluir soporte para los lenguajes de programación como C/C++ y COBOL. El marco de trabajo de Eclipse puede también utilizarse como base para otros tipos de aplicaciones que no se relacionen con el desarrollo del software, como los sistemas de gestión de contenido.11 10 11 http://www.ibm.com/developerworks/ssa/library/os-ecov/. (s.f.). http://downloads.mysql.com/docs/refman-5.0-es.pdf. (s.f.). 15 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Gráfico 2. 2: IDE Eclipse 2.2.8. Motor de Base de Datos MySQL, el sistema de gestión de bases de datos SQL Open Source más popular, lo desarrolla, distribuye y soporta MySQL AB. MySQL AB es una compañía comercial, fundada por los desarrolladores de MySQL. Es una compañía Open Source de segunda generación que une los valores y metodología Open Source con un exitoso modelo de negocio. MySQL es un sistema de gestión de bases de datos. Una base de datos es una colección estructurada de datos. Para añadir, acceder, y procesar los datos almacenados en una base de datos, necesita un sistema de gestión de base de datos como MySQL Server. Al ser los computadores muy buenos en tratar grandes cantidades de datos, los sistemas de gestión de bases de datos juegan un papel central en computación, como aplicaciones autónomas o como parte de otras aplicaciones. MySQL es un sistema de gestión de bases de datos relacionales Una base de datos relacional almacena datos en tablas separadas en lugar de poner todos los datos en un gran almacén. Esto añade velocidad y flexibilidad. La parte SQL de "MySQL" se refiere a "Structured Query Language". SQL es el lenguaje estandarizado más común para acceder a bases de datos y está definido por el estándar ANSI/ISO SQL. 16 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB MySQL software es Open Source. Open Source significa que es posible para cualquiera usar y modificar el software. Cualquiera puede bajar el software MySQL desde internet y usarlo sin pagar nada. Si lo desea, puede estudiar el código fuente y cambiarlo para adaptarlo a sus necesidades.12 Prestaciones MySQL es un SGBD que ha ganado popularidad por una serie de atractivas características:13 Está desarrollado en C/C++. Se distribuyen ejecutables para cerca de diecinueve plataformas diferentes. La API se encuentra disponible en C, C++, Java, Perl, PHP, Python, Ruby y otros. Está optimizado para equipos de múltiples procesadores. Es muy destacable su velocidad de respuesta. Se puede utilizar como cliente-servidor o incrustado en aplicaciones. Cuenta con un rico conjunto de tipos de datos. Soporta múltiples métodos de almacenamiento de las tablas, con prestaciones y rendimiento diferentes para poder optimizar el SGBD a cada caso concreto. Su administración se basa en usuarios y privilegios. Se tiene constancia de casos en los que maneja cincuenta millones de registros, sesenta mil tablas y cinco millones de columnas. Sus opciones de conectividad abarcan TCP/IP, Sockets UNIX y sockets NT, además de soportar completamente ODBC. Los mensajes de error pueden estar en español y hacer ordenaciones correctas con palabras acentuadas o con la letra ’ñ’. 13 http://es.scribd.com/doc/50829167/Tutorial-MySQL. (s.f.). prestaciones. 17 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Es altamente confiable en cuanto a estabilidad se refiere. Para todos aquellos que son adeptos a la filosofía de UNIX y del lenguaje C/C++, el uso de MySQL les será muy familiar, ya que su diseño y sus interfaces son acordes a esa filosofía: “crear herramientas que hagan una sola cosa y que la hagan bien”. MySQL tiene como principal objetivo ser una base de datos fiable y eficiente. Ninguna característica es implementada en MySQL si antes no se tiene la certeza que funcionará con la mejor velocidad de respuesta y por supuesto, sin causar problemas de estabilidad. La influencia de C/C++ y UNIX se puede observar de igual manera en su sintaxis. Por ejemplo, la utilización de expresiones regulares, la diferenciación de funciones por los paréntesis, los valores lógicos como 0 y 1, la utilización del tabulador para completar sentencias, por mencionar algunos.14 2.2.9. PHP PHP es un lenguaje interpretado de propósito general ampliamente usado, diseñado especialmente para desarrollo web y que puede ser incrustado dentro de código HTML. Generalmente se ejecuta en un servidor web, tomando el código en PHP como su entrada y creando páginas web como salida. Puede ser desplegado en la mayoría de los servidores web y en casi todos los sistemas operativos como son Unix, Linux, Windows y plataformas sin costo alguno. 15 Permite la conexión a diferentes tipos de servidores de bases de datos tales como MySQL, Postgres, Oracle, ODBC, DB2, Microsoft SQL Server, Firebird y SQLite. Utilizaremos el PHP v5.4 en nuestro proyecto. 14 15 http://dev.mysql.com/doc/refman/5.1/en/. (s.f.). https://developer.mozilla.org/es/docs/User:Marti1125. (s.f.). php. 18 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 2.2.10. HTML5 con Responsive Es una colección de estándares para el diseño y desarrollo de páginas web adaptables. Esta colección representa la manera en que se presenta la información en el explorador de internet y la manera de interactuar. HTML5 nos permite una mayor interacción entre nuestras páginas web y contenido media (video, audio, entre otros) así como una mayor facilidad a la hora de codificar nuestro diseño básico.16 Todo comenzó con Responsive Web Design, un artículo de Ethan Marcotte en A List Apart. En esencia, el artículo propone abordar el paisaje siempre cambiante de los dispositivos, navegadores, tamaños de pantalla y orientaciones flexibles, fluidos y sitios web adaptativos. En lugar de responder a las necesidades de hoy en día para una versión web de escritorio adaptado a la resolución de pantalla más común, junto con una versión móvil particular (a menudo específicos de un solo dispositivo móvil), la idea es abordar el problema al revés: uso flexible y diseños fluidos que se adaptan a casi cualquier pantalla.17 2.2.11. Wordpress WordPress es una potente plataforma de publicación de semántica, y viene con un gran conjunto de características diseñadas para hacer que su experiencia como editor en Internet tan fácil, agradable y atractivo posible. Un sistema de gestión de contenidos de libre distribución compatible con los estándares, rápida, ligera y libre, con la configuración por defecto y característica, y un núcleo muy personalizable. La siguiente es una lista de algunas de las características que vienen de serie con WordPress, sin embargo hay literalmente decenas de miles de 16 17 http://www.alvasolution.com/. (s.f.). https://msdn.microsoft.com/en-us/magazine/hh653584.aspx. (s.f.). 19 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB plugins que amplían lo que hace WordPress, por lo que la funcionalidad real es casi ilimitada. Usted también es libre de hacer lo que quiera con el código de WordPress, extenderlo o modificar de alguna manera, no lo utilice para proyectos comerciales sin derechos de licencia. Esa es la belleza de software libre , libre de significado no sólo el precio, sino también la libertad de tener el control del mismo.18 Fue creado en un principio para la creación de blogs (sitios web periódicamente actualizados) pero ha evolucionado muchísimo, por la comunidad de desarrolladores y diseñadores, encargados de desarrollarlo en general o crear complementos y temas para la comunidad. Esta desarrollado en PHP para entornos que ejecuten MySQL y Apache, código modificable y su fundador es Matt Mullenweg. Características: Fácil instalación, actualización y personalización. Para los desarrolladores es el CMS más cómodo por la sencillez y estructura del código y por la gran cantidad de documentación que existe al respecto. Actualización automática del sistema implementada: Es un CMS muy seguro ya que te permite actualizar directamente desde el gestor de forma fácil y además hace una media de 6 o más actualizaciones anuales para evitar hackers. Presenta muchísimos themes gratuitos, plugin para ser integrados y desarrollados con un nivel de conocimientos no muy altos en programación o desarrollo. Muchísima documentación al respecto y foros activos tanto es español como en inglés.19 18 http://codex.wordpress.org/WordPress. (s.f.). 19 http://www.colorvivo.com/que-gestor-de-contenidos-elijo-para-mi-web/. (s.f.). 20 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Funcionalidades Fácil instalación, actualización y personalización. Actualización automática del sistema implementada en la versión 2.7. Múltiples autores o usuarios, junto con sus roles o perfiles que establecen distintos niveles de permisos (desde la versión 2.0). Sitios con varios blogs (a partir de la versión 1.6). Capacidad de crear páginas estáticas (a partir de la versión 1.5). Permite ordenar artículos y páginas estáticas en categorías, subcategorías y etiquetas. Cuatro estados revisión (nuevo en por entrada: Publicado, Borrador, Esperando Wordpress 2.3) y Privado (solo usuarios registrados), además de uno adicional: Protegido con contraseña. Publicación mediante correo electrónico. Guardado automático temporizado del artículo como borrador (a partir de la versión 2.2). Admite el uso desenlaces permanentes y fáciles de recordar. Distribución de los comentarios (mediante RSS 2.0 y ATOM 1.0). Gestión y distribución de enlaces. Subida y gestión de datos adjuntos y archivos multimedia. Admite complementos (versión 1.5). Admite plantillas y widgets. Búsqueda integrada en entradas y páginas estáticas, y widget predeterminado para la búsqueda integrada de Google desde la versión 2.5.9 Integración: bbPress, sistema de foros de los mismos creadores, se integra automáticamente con Wordpress. Integración con el foro Vanilla de Lussumo factible, al menos hasta la versión 2.2 no inclusive. 21 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Multisitio WordPress admite un blog por instalación, pero gracias a extender el blog por medio de complementos específicos es fácil administrar y configurar múltiples blogs desde una sola instalación. Esta característica está implementada en el núcleo de WordPress desde la versión 3.0.5 Luego de habilitarse la opción de Multisitio, se crea una red (WordPress Network10 ), por lo que podrán administrarse varios blogs dentro de una misma instalación de WordPress, compartiendo temas, plantillas, plugins y dominios. Cada blog puede ser accedido dentro de un subdirectorio. Plantillas Las plantillas o temas de WordPress son plantillas de diseño que sirven para establecer la apariencia y estructura de tu blog. Hay una gran comunidad oficial, tanto profesional como de usuarios, dedicada al diseño de estas plantillas que se suelen listar en el sitio de WordPress una vez han sido comprobadas y aprobadas oficialmente. Aunque la filosofía de Wordpress apuesta por un marcado válido según las directrices del W3C, las posibilidades de este sistema, tanto a nivel de diseño, estructura o gestión, y la flexibilidad del sistema de plantillas y widgets en concreto, son enormes y prácticamente permiten tener desde un simple blog hasta un CMS personalizado. Widgets WordPress incorpora un sistema de widgets para sus plantillas desde la versión 2.2 que ofrece numerosas posibilidades y flexibilidad para el diseño y estructura de sus blogs. Si bien son sumamente útiles, no todas las plantillas lo soportan. Complementos Hay un gran número de complementos que potencian el uso de WordPress más allá de un simple blog y que lo hace un sistema flexible y prácticamente 22 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB de propósito general. Los complementos de WordPress se incorporaron en la versión 1.6.13. También conocidos como Plugin, son herramientas que extienden la funcionalidad del WordPress. Los hay gratuitos y de pago, y se encuentran listados o se puede crearlos. Plugin de WordPress Un plugin de WordPress es un programa, o un conjunto de una o más funciones, escrito en el lenguaje de programación PHP, que añade un conjunto específico de funciones o servicios en el weblog de WordPress, que se puede integrar a la perfección con el weblog usando el acceso puntos y métodos proporcionados por el WordPress Plugin Application Program Interface (API) . Hay fuentes Plugin que ya existen, o primero que debe hacer es buscar si existe uno que se acople o crearlo desde cero. Para crear un Plugin se debe tener conocimientos de programación PHP y saber sobre el funcionamiento básico de WordPress. Crear un Plugin Esta sección indica los pasos que debe seguir y considerar al crear una bien estructurada WordPress Plugin. Nombres, Archivos y Ubicaciones Nombre Plugin: La primera tarea en la creación de un plugin de WordPress es pensar en lo que el plugin va a hacer, dependiendo de eso el nombre del Plugin de tal forma que su nombre sea único. La mayoría de los desarrolladores de plug-in eligen utilizar nombres que describen un poco lo que hace el Plugin; por ejemplo, un plugin relacionado con el clima probablemente tendría la palabra "tiempo" en el nombre. El nombre puede tener varias palabras. 23 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Plugin archivos: El siguiente paso es crear un archivo PHP con un nombre derivado de su nombre Plugin elegido. Por ejemplo, si su Plugin se llamará "La funcionalidad fabulosa", que se podría llamar su archivo PHP fabuloso-functionality.php. Una vez más, trate de elegir un nombre único. Las personas que instalan su Plugin estarán poniendo este archivo PHP en el directorio de plugins de WordPress en su instalación (normalmente wp-content / plugins /), así que no hay dos plugins que están utilizando puede tener el mismo nombre del archivo PHP. Otra opción es dividir su Plugin en varios archivos. Su WordPress Plugin debe tener al menos un archivo PHP; también podría contener archivos JavaScript, archivos CSS, archivos de imágenes, archivos de idiomas, etc. Si hay varios archivos, elegir un nombre único para un directorio y un nombre de su elección (por lo general la misma) para el archivo PHP principal de su Plugin, como en nuestro caso Calificaciones, el archivo sería calificaciones.php todo el directorio en wp-content / plugins /. Hay que tener en cuenta que la instalación de WordPress se debe utilizar plugin_dir_path () yplugins_url () para rutas absolutas y URLs. La parte superior del archivo PHP principal de su Plugin debe contener una norma de información Plugin cabecera . Esta cabecera permite WordPress reconocer que existe su Plugin, agregarlo a la pantalla de gestión Plugin para que pueda ser activado, cargarlo, y ejecutar sus funciones; sin la cabecera, su Plugin nunca se activará y nunca se ejecutará. Aquí está el formato de cabecera: <? Php / ** * Plugin Nombre: Nombre del plugin, debe ser único. * Plugin URI: http: // URI_Of_Page_Describing_Plugin_and_Updates * Descripción: Una breve descripción del plugin. * Versión: número de versión del plugin. Ejemplo: 1.0.0 * Autor: Nombre del autor del plugin 24 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB * Autor URI: http: // URI_Of_The_Plugin_Author * Dominio de Texto: Opcional. Dominio texto de Plugin para la localización. Ejemplo: mytextdomain * Ruta de dominio: Opcional. Ruta de directorio relativa del plugin para .MO archivos. Ejemplo: / locale / * Red: Opcional. Si el plugin sólo puede ser la red activa de ancho. Ejemplo: true * Licencia: A nombre de licencia corto. Ejemplo: GPL2 La información mínima que WordPress tiene que reconocer su Plugin es la línea Nombre Plugin. El resto de la información (si existe) se utilizará para crear la tabla de Plugins en la pantalla de gestión Plugin. El orden de las líneas no es importante. La mayoría de los plugins de WordPress tendrá que obtener algunas aportaciones de los usuarios o propietarios de blogs y sitios guardarlo entre sesiones, para su uso en sus funciones de filtro, funciones de acción, y las funciones de plantilla. Esta información tiene que ser guardado en la base de datos de WordPress, con el fin de ser persistentes entre sesiones. Hay cuatro métodos para guardar los datos de plug-in en la base de datos: Utilice el mecanismo de WordPress "opción" (descrito más adelante). Este método es apropiado para almacenar cantidades relativamente pequeñas, piezas con nombre de datos, el tipo de datos que espera el propietario del sitio para entrar a la configuración del plugin. Crear una nueva tabla de base de datos personalizada. Este método es adecuado para los datos no relacionados con puestos individuales, páginas, archivos adjuntos, comentarios, tipo de datos que crecerá a medida que pasa el tiempo, y que no tienen nombres individuales. En nuestro caso se añadió tablas para poder almacenar la información de las calificaciones. 20 20 http://codex.wordpress.org/Writing_a_Plugin. (s.f.). 25 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Identificación de Variables 2.3. Se definen los siguientes: Rectora y Vicerrectora matutina de la Unidad Educativa Fiscal “Quito Sur”. Rector y Vicerrectora vespertina de la Unidad Educativa Fiscal “Quito Sur”. Docentes de la Unidad Educativa Fiscal “Quito Sur”. Alumnado del Unidad Educativa Fiscal “Quito Sur”. Padres de familia del alumnado. La comunidad en general. Los períodos lectivos. 2.4. Hipótesis El portal web brindará un beneficio para la actual generación y las generaciones futuras que podrán contar con un portal web informativo, fácil de usar y al alcance de todos, teniendo así a disposición de todo público la información de dicha institución y el informe académico de sus niños. 26 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB CAPÍTULO 3 3. MARCO METODOLÓGICO 3.1 Diseño de la Investigación El Rational Unified Process o Proceso Unificado de Rational es una implementación comercial del Proceso Unificado. En este proceso de ingeniería de software se asigna las tareas y responsabilidades dentro de una organización en nuestro caso en la Institución Fiscal. El objetivo es asegurar la producción de software de alta calidad que satisfaga la necesidad del usuario final dentro de un tiempo y presupuesto previsto. El RUP mejora la productividad del equipo ya que permite que cada miembro del grupo sin importar su responsabilidad específica acceda a la misma base de datos de conocimiento. Esto hace que todos compartan el mismo lenguaje, la misma visión y el mismo proceso acerca de cómo desarrollar software.21 Las actividades de RUP se centran en crear y mantener modelos, utilizando UML, Lenguaje de Modelización Unificado, en forma efectiva. Como no existe un único proceso que sea apropiado para todos los desarrollos, RUP es un proceso configurable. Se adapta tanto a grupos pequeños de desarrollo como a grandes organizaciones. Basándose en lo que se consideran “best practices”, las mejores prácticas de desarrollo de software, RUP resulta apropiado para una amplia gama de proyectos y organizaciones. Las 6 mejores prácticas de desarrollo que aplica RUP: Desarrollo de software en forma iterativa Gestión de requerimientos Uso de arquitecturas basadas en componentes 21 http://dspace.ucacue.edu.ec/bitstream/reducacue/5963/1/RATIONAL%20UNIFIED%20PROCESS %20(RUP).pdf 27 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Modelización visual del software Verificación de calidad del software Control de cambios 1. Desarrollo de software en forma iterativa Dada la complejidad de los sistemas de software moderno no es posible definir el problema entero en forma secuencial, diseñarlo en su totalidad, construirlo y testearlo. El enfoque iterativo permite ir creciendo en el entendimiento del problema a través de refinamientos sucesivos. 2. Gestión de requerimientos Los casos de uso y escenarios resultaron ser una forma excelente de capturar requerimientos funcionales y de asegurar que estos rijan el diseño, la implementación y el testeo de software; haciendo más probable que el sistema final cumpla exactamente con lo que pidió el cliente. 3. Uso de arquitecturas basadas en componentes RUP apoya el desarrollo de software basado en componentes. Los componentes son módulos no triviales, subsistemas que satisfacen una función definida. RUP proporciona un acercamiento sistemático definiendo una arquitectura usando componentes nuevos y existentes. Éstos están montados en una arquitectura bien definida, o en una infraestructura de componentes reutilizables tal como el Internet y Wordpress. 4. Modelización visual del software El proceso le demuestra cómo modelar visualmente software para capturar la estructura y el comportamiento de arquitecturas y de componentes. Esto permite que usted oculte los detalles y que escriba código usando “bloques de construcción gráficos. El UML es la base de esta modelización visual. 28 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 5. Verificación de calidad del software Una performance y una confiabilidad pobres son los factores comunes que inhiben dramáticamente la aceptabilidad de los usos del software hoy en día. Por lo tanto, la calidad se debe revisar con respecto a los requerimientos basados en la confiabilidad, funcionalidad, performance de la aplicación y del sistema. RUP le asiste en el planeamiento, el diseño, la puesta en marcha, la ejecución, y la evaluación de estos tipos de pruebas. El estudio de la calidad está incorporado como parte del proceso, en todas las actividades, implicando a todos los participantes, usando medidas y criterios objetivos, y no se trata de una actividad separada realizada por otro grupo. 6. Control de cambios La capacidad de manejar los cambios asegurándose que cada cambio sea aceptable, y pudiendo continuar con los mismos es esencial en un ambiente en el cual el cambio es inevitable. El proceso describe cómo controlar, seguir y supervisar cambios para permitir el desarrollo iterativo acertado. También guía sobre cómo establecer los espacios de trabajo seguros para cada desarrollador proporcionando el aislamiento de los cambios realizados en otros espacios de trabajo y controlando los cambios de todos los dispositivos de software (modelos, código, documentos, etc.). Describiendo cómo automatizar la integración, hace que el equipo trabaje como una sola unidad. 29 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB INICIO TRANSICIÓN RUP ELABORACIÓN CONSTRUCCIÓN Gráfico 3. 1: Fases Desarrollo RUP El ciclo de vida del software está particionado en ciclos, cada ciclo trabaja en una nueva generación del producto. El RUP divide un ciclo de desarrollo en cuatro fases consecutivas. Fase de inicio Fase de elaboración Fase de construcción Fase de transición Cada fase constituye un eslabón bien definido, un punto en el tiempo en el cual ciertas decisiones críticas deben tomarse, y por lo tanto afinar metas debe haber sido alcanzadas. Fase de inicio Durante la fase del inicio, se establece el caso de negocio para el sistema y delimita el alcance del proyecto. Para lograr se identifica los actores que interactúan. Esto implica identificar todos los casos de uso y describir sólo los más significativos. El caso de negocio incluye criterios de éxito, la evaluación de riesgos, y la estimación de los recursos necesarios, y un plan de la fase que muestre las fechas previstas e hitos importantes. 30 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Resultado de la Fase de inicio Un documento de la visión: una visión general de los requerimientos básicos del proyecto, de las características dominantes, y de las restricciones principales. Un modelo inicial de casos de uso Una estimación de riesgo inicial. Un plan de proyecto, demostrando fases e iteraciones. Un modelo de negocio, en caso de necesidad. Uno o más prototipos. 1er. Hito: Objetivos del Ciclo de vida Los objetivos del ciclo de vida en el final de la fase del inicio son el primer hito principal del proyecto: el hito de los objetivos del ciclo de vida. Los criterios de la evaluación para la fase del inicio son: Participación de los involucrados en la definición del alcance y estimaciones de costo y tiempos. Entendimiento de los requerimientos según los casos de uso primarios. Estimaciones de costos y tiempos, de las prioridades, de los riesgos, y del proceso del desarrollo. Gastos reales contra gastos planeados. El proyecto puede ser cancelado o ser repensado considerablemente si no puede pasar este hito. 31 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Fase de elaboración El propósito de la fase de elaboración es analizar el dominio del problema, establecer una fundación arquitectónica sana, desarrollar el plan del proyecto, y eliminar los elementos del riesgo más alto del proyecto. Para lograr estos objetivos, se debe tener una visión completa del sistema. Las decisiones arquitectónicas tienen que tomarse con una comprensión cabal del sistema: su alcance y funcionalidad importante. Es fácil argumentar que la fase de elaboración es la más crítica de las cuatro fases. En el final de esta fase, la “ingeniería dura” se considera completa y el proyecto experimenta su día más importante: la decisión sobre si o no confiar en las fases de la construcción y de la transición. Para la mayoría de los proyectos, esto también corresponde a la transición de una fase de operatoria móvil, ligera y ágil, poco arriesgada, a una de alto costo, riesgo elevado con una inercia substancial. Mientras que el proceso siempre debe acomodarse a los cambios, las actividades de la fase de elaboración aseguran que la arquitectura, los requerimientos y los planes sean bastante estables, y que los riesgos se atenúan lo suficiente, así usted puede determinar el costo y fecha de terminación del desarrollo en forma bastante certera. Durante fase de elaboración, se construye un prototipo ejecutable de la arquitectura en unas o más iteraciones, dependiendo del alcance, del tamaño, del riesgo, y de la novedad del proyecto. Este prototipo debe tratar por lo menos los casos de uso más críticos identificados en la fase del inicio, que exponen típicamente los mayores riesgos técnicos del proyecto. Mientras que un prototipo evolutivo de un componente de calidad es siempre la meta, no excluye el desarrollo de unos o más prototipos exploratorios, desechables, para atenuar riesgos específicos. Resultado de la Fase de Elaboración Un modelo de caso de uso y actores deben haber sido identificados, y se han desarrollado la mayoría de las descripciones de casos de uso. 32 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Requerimientos suplementarios que capturan los requerimientos no funcionales o cualquier requerimiento que no se asocie a un caso de uso específico. Una descripción de la arquitectura del software. Un prototipo arquitectónico ejecutable. Una lista revisada del riesgo y un caso de negocio revisado. Un caso actualizado del desarrollo que especifica el proceso que se utilizará. Un manual preliminar del usuario (opcional). 2do. Hito: La arquitectura del ciclo de vida La arquitectura del ciclo de vida en el final de la fase de elaboración es el segundo hito importante del proyecto. En este punto, se examinan los objetivos y el alcance detallado del sistema, la opción de la arquitectura, y la resolución de los riesgos principales. Los criterios principales de la evaluación para la fase de elaboración implican las respuestas a estas preguntas: ¿Qué tan estable es la visión del producto? ¿La arquitectura es estable? ¿La demostración ejecutable muestra que se han tratado y resuelto los principales elementos de riesgo? ¿El plan para la fase de la construcción está suficientemente detallado? ¿Todos los involucrados en el proyecto están de acuerdo en que la visión actual se puede alcanzar si el plan actual se ejecuta para desarrollar el sistema completo, en el contexto de la arquitectura actual? El proyecto puede ser abortado o ser repensado considerablemente si no puede pasar este hito. 33 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB La fase de la construcción Durante la fase de la construcción, todos los componentes y características restantes se desarrollan, se integran en el producto, y se prueban a fondo. La fase de la construcción es, en cierto sentido, un proceso de fabricación donde el énfasis se pone en manejar los recursos y controlar las operaciones para optimizar costos, tiempos y calidad. Una arquitectura robusta y un plan comprensible están íntimamente relacionados. Es decir, una de las cualidades críticas de la arquitectura es su facilidad de la construcción. Ésta es una razón por la que durante la fase de elaboración se pone el énfasis en el desarrollo equilibrado de la arquitectura y del plan. El resultado de la fase de la construcción: El resultado de esta fase es un producto listo para poner en las manos de los usuarios finales. Como mínimo, consta de: El producto de software integrado en las plataformas adecuadas. Los manuales del usuario. Una descripción de la versión o reléase actual. 3er. Hito: La capacidad operacional inicial El final de la fase de construcción es el tercer hito principal del proyecto En este punto, se decide si el software, los sitios, y los usuarios están operativos, sin exponer el proyecto a demasiados riesgos. Este lanzamiento a menudo se llama un lanzamiento “beta”. Los criterios de la evaluación para la fase de la construcción implican el contestar de estas preguntas: ¿Esta versión es lo suficientemente estable y madura para entregar al usuario? ¿Todos los involucrados están listos para la transición del producto a producción? 34 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB ¿La diferencia entre los gastos reales versus los planeados es aún aceptable? La transición puede tener que ser pospuesta si el proyecto no puede alcanzar este hito. Fase de la transición El propósito de la fase de la transición es justamente la transición del producto de software al ambiente de producción. Una vez que el producto se haya entregado al usuario final, surgen algunos temas que llevan al desarrollo de nuevas versiones, a corregir errores, o a terminar algunas características que habían sido pospuestas. Se ingresa a esta fase cuando el producto está lo suficientemente maduro para comenzar a pasar a producción. Esto requiere que un cierto subconjunto del sistema se encuentre en un nivel aceptable de la calidad y que la documentación del usuario está disponible de modo que la transición proporcione resultados positivos para todas las partes. Esto incluye: La “prueba beta” para validar el nuevo sistema contra las expectativas del usuario. Operación en paralelo con un sistema anterior que el nuevo sistema esté sustituyendo. Entrenamientos y capacitación de los usuarios y la gente de mantenimiento. Uso del sistema en general . La fase de transición se centra en las actividades requeridas para poner el software en manos de los usuarios. Típicamente, esta fase incluye varias iteraciones, incluyendo lanzamientos beta, lanzamientos de disponibilidad general, así como la reparación de errores y el lanzamiento de versiones mejoradas. Un esfuerzo considerable se realiza en la documentación orientada al usuario final, en entrenar a los mismos, en brindar apoyo en las primeras etapas del uso, y en reaccionar al feedback que generen los mismos usuarios. 35 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 4to. Hito: Lanzamiento del Producto En este, se decide si los objetivos fueron alcanzados, y si se comienza otro ciclo de desarrollo. En algunos casos, este hito puede coincidir con el final de la fase del inicio para el ciclo siguiente. Los criterios primarios de la evaluación para la fase de la transición implican las respuestas a estas preguntas: ¿El usuario está satisfecho? ¿Los gastos reales versus los planeados son aun aceptables? Iteraciones Cada fase de RUP puede descomponerse en una o más iteraciones. Una iteración es un ciclo completo de desarrollo que resulta en una versión o reléase (interno o externo) de un producto ejecutable, un subconjunto del producto final que se encuentra bajo desarrollo y que crece incrementalmente en cada iteración hasta llegar al producto final. El proceso iterativo tienen las ventajas siguientes: Los riesgos son mitigados en forma temprana Los cambios son más manejables Alto nivel de reusabilidad El equipo de desarrollo puede aprender durante el proceso Mejor calidad global 3.2 Diseño Experimental El sistema de un portal web generalizado para las instituciones públicas educativas apoyará a las instituciones públicas a cumplir con la ley de transparencia y poder publicar a toda la comunidad la información de sus niños y la información relevante de estas instituciones. 36 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Administrador PC Servidor WEB Usuario registrado PC Usuario representante PC Invitado Reportes Gráfico 3. 2: Descripción del sistema Necesidades A través del análisis en conjunto con el personal de la escuela Fiscal Quito Sur se ha llegado a definir las siguientes necesidades que se encuentran citadas a continuación en base a los perfiles de los usuarios, cabe indicar que cada necesidad será cubierta por uno o más requerimientos funcionales. 37 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Función: Administrador Código Necesidad Gestión de usuarios Gestionar usuarios Creación Búsqueda Edición Eliminar N1 Los usuarios con perfiles de Administrador serán los encargados de la creación de usuarios y de asignar los permisos de acuerdo al rol que desempeñe en el proceso. De igual forma, la modificación de permisos sobre la aplicación deberá ser notificada para proceder a retirar los privilegios correspondientes a un usuario determinado. Gestionar la seguridad. Identificación de sesión de usuario Control de accesos N2 La aplicación tiene un acceso para la gestión del mismo y se desplegará los componentes a utilizar según los roles asignados por el administrador. Gestionar parámetros N-3 Creación Edición Publicación 38 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Los parámetros corresponden a información global de la aplicación en cuanto a la institución Nombre de la institución Sello Ubicación Autoridades Misión y Visión Ideario Ley de Transparencia Eventos Calificaciones Gestionar Usuarios Asignados Creación Edición N4 Eliminación El usuario asignado será el que tenga diferentes tipos de roles para poder gestionar la aplicación. Gestión de usuario representante (representante de los estudiantes de la Unidad Educativa Quito Sur). Creación Edición N-5 La opción de creación de usuario representante es de forma automática y está sujeta a una búsqueda inicial por Cédula de Identidad para evitar que se duplique la información. El olvido de contraseña el administrador podrá reestablecerla o un usuario asignado. Tabla 3. 1: Necesidad Gestión de Usuarios 39 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Función: Usuario asignado Código Necesidad Información Portal Web Administrar la información del portal web Crear Editar Insertar Modificar Eliminar Publicar Dependiendo el rol que tiene el usuario asignado tendremos diferentes accesos a las funciones del portal Web. N6 Describiremos los roles que se tiene en nuestro portal: Administrador - alguien que tiene acceso a todas las funciones de administración en un solo sitio Editor - alguien que pueda publicar y gestionar la información incluida de otros usuarios. Autor - alguien que pueda publicar y administrar su propia información. Contribuyente - alguien que puede escribir y gestionar su propia información pero no puede publicarlos. Suscriptor - alguien que sólo puede gestionar su perfil y crear eventos. 40 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Los usuarios asignados podrán crear, editar, insertar, eliminar y modificar las siguientes funciones. Entradas Portafolios Profesores Cursos N6 Medios Paginas Comentarios Eventos Contactos Perfil Herramientas Tabla 3. 2: Necesidad Información Portal Web Función: Usuario representante Código Necesidad de Consulta de calificaciones Consultar las calificaciones de los estudiantes Identificarse dentro del portal Web Cambio de clave de ingreso N7 Realizar consulta según opciones Un usuario representante podrá consultar las calificaciones de sus niños según las opciones que se desplegará y podrá imprimir los resultados. Tabla 3. 3: Consulta de calificaciones de los estudiantes 41 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Función: Sistema Código Necesidad Módulo de calificaciones Consulta de datos calificaciones El sistema proporciona las claves de los representantes automáticamente y graba una nueva contraseña. N8 Proporciona los datos y calcula las calificaciones según la información ingresada por los profesores. Datos ingresados por usuarios asignados Visualizar la información ingresada en el portal Web. Tabla 3. 4: Módulo de Calificaciones Según los requerimientos funcionales se han establecido los siguientes dentro de la tecnología que usaremos en la elaboración del Portal Web. Lenguaje de programación PHP 5.4 Ambiente de Desarrollo Eclipse Motor de base de Datos Mysql 5 Servidor de Aplicaciones Apache2 Gestor de Contenidos Wordpress 42 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 3.3 Desarrollo de la aplicación En base a las necesidades funcionales levantadas en este proyecto, se procede a desarrollar dos tipos de diagramas UML usados en la ejecución de este proyecto y que se encuentran relacionados con las fases de desarrollo de la metodología propuesta RUP: Casos de uso. Diagramas de secuencia. 3.3.1 Casos de Uso Luego de realizar el análisis preliminar de las necesidades y en base del alcance de este proyecto, se ha determinado los perfiles, basados en los actores que participan, los mismos que son: Administrador: perfil que cuenta con acceso total a todas las funciones del portal Web. Usuario asignado: perfil con acceso exclusivo a funciones específicas dependiendo el rol. Usuario representante: perfil con acceso a la información de calificaciones. Invitado: perfil de acceso a la información sin restricción. 43 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 1. Diagrama Caso de Uso: Proceso General del Sistema. System Creación usuarios Usuario asignado Ingreso de Información Usuario Administrador Calificaciones Usuario representante Información general Invitado Gráfico 3. 3: Proceso general del sistema Nombre del Caso de Uso: CU-01-Proceso General del Sistema Actores: Usuario Asignado, Administrador, Usuario Usuario Representante, Usuario Invitado Función: Proceso general del Portal Web Usuario del Sistema Respuesta del Sistema 1. El usuario administrador o usuario asignado ingresa a la administración del portal Web y se registra 2. Valida información ingresada 3. Ingresa el usuario asignado a la administración del portal Web y dependiendo el rol tiene las funciones asignadas. 4. Información del portal Web 44 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Ingreso de datos institucionales. Ingreso de noticias varias. Ingreso de calificaciones. Ingreso de eventos. Ingreso de usuarios Reseteo de claves 5. Ingreso usuario representante al portal Web 6. Ingreso al portal Web y realiza consulta de calificaciones. Verificación de datos Ingreso a consulta de calificaciones. Imprimir datos 7. Ingreso Invitado al portal Web 8. Revisión de la información añadida por los usuarios asignados. Tabla 3. 5: CU-01- Proceso General del Sistema 45 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 2. Diagrama Caso de Uso: Ingreso a la administración del Portal Web System Ingreso usuario y contraseña Verificación de datos Usuario asignado Sistema Negar acceso Permitir acceso Error de ingreso usuario y contraseña Funciones asignadas Gráfico 3. 4: Ingreso a la administración del Portal Web Nombre del Caso de Uso: CU-02-Ingreso a la administración del Portal Web. Actores: Usuario asignado Función: Validación de datos de ingreso Usuario del Sistema Respuesta del Sistema 1. Ingresar nombre de usuario y contraseña 2. Validar datos: Que ingrese correcto el nombre de usuario. Que ingrese la contraseña correcta. 3. Retorna mensaje: En caso de estar correcto los datos, ingresa a la administración del portal Web. En caso de estar incorrecto los datos, mensaje: Ingrese usuario y contraseña…” 46 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 4. En caso de ingresar al sistema continuar trabajando. 5. Caso contrario volver a digitar datos de usuario. Tabla 3. 6:CU-02-Ingreso a la administración del Portal Web 3. Diagrama Caso de Uso: Administración de Usuarios System Crear usuario Buscar usuario Usuario Administrador Editar usuarios Eliminar usuarios Gráfico 3. 5: Administración de usuarios Nombre del Caso de Uso: CU-03-Administración de usuarios Actores: Usuario Administrador del Sistema Función: Administrar usuarios Usuario del Sistema Respuesta del Sistema 1. Ingresar a la administración del Portal Web. 2. Ingreso usuario y contraseña. 47 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 3. Permitir el acceso si son correctos los parámetros digitados; caso contrario negar el acceso. 4. Al ingresar al sistema el administrador podrá realizar: Crear usuarios. Buscar usuarios. Editar usuarios. Eliminar usuario. Tabla 3. 7: CU-03- Administración de usuarios 4. Diagrama Caso de Uso: Creación de Usuarios Asignados System Crear usuario asignado Ingresar datos Asignar roles Usuario administrador Sistema Cancelar creación Guardar creación Verificación de datos Mensaje de información notificando cual es el error Guardar usuario asignado Gráfico 3. 6: Creación de Usuarios Asignados 48 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Nombre del Caso de Uso: CU-04-Crear usuario asignado Actores: Usuario Administrador del Sistema Función: Creación de usuarios asignados Usuario del Sistema Respuesta del Sistema 1. Ingresar a la administración del portal Web. 2. Seleccionar la función Usuarios 3. Añadir nuevo usuario asignado 4. Presentar campos en blanco. 5. Ingresar datos. 6. Definir el rol para el usuario asignado. 7. Decidir si guardar o cancelar la creación. 8. Guardar información de usuario asignado 9. Verificar datos ingresados Si es todo correcto guarda en la base de datos Si esta incorrecto saldrá un mensaje en la parte superior informando el error 10. Cancelar la creación usuario asignado 11. No guarda la información Tabla 3. 8: CU-04-Crear usuario asignado 49 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 5. Diagrama Caso de Uso: Buscar usuarios asignados System Ingreso a función Usuarios Ingresar datos en buscar usuarios Usuario administrador Sistema Buscar usuarios Enlista los usuarios encontrados No se han encontrado usuarios que se ajusten a lo que buscas. Gráfico 3. 7: Buscar usuarios asignados Nombre del Caso de Uso: CU-05-Buscar usuario asignado Actores: Usuario Administrador del Sistema Función: Buscar usuarios Usuario del Sistema Respuesta del Sistema 1. Ingresar a la administración del portal Web. 2. Seleccionar la función Usuarios. 3. Ingresar datos de usuario opción buscar asignado 4. Seleccionar Usuarios 50 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 5. Buscar usuarios asignados Enlistar los usuarios encontrados Caso contrario mensaje de: saldría No se un han encontrado usuarios que se ajusten a lo que buscas. Tabla 3. 9: CU-05-Buscar usuario asignado 6. Diagrama Caso de Uso Editar Usuarios Asignados System Seleccionar usuario asignado a editar Presentar datos Sistema Usuario Administrador Modificar datos Cancelar cambios Verificar datos Actualizar datos usuario asignado Mensaje de información notificando cual es el error Gráfico 3. 8: Editar usuarios asignados 51 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Nombre del Caso de Uso: CU-06-Editar usuario asignado Actores: Usuario Administrador del Sistema Función: Editar usuarios asignados Usuario del Sistema Respuesta del Sistema 1. Ingresar a la administración del portal Web. 2. Buscar usuario asignado a editar. 3. Seleccionar editar usuario asignado. 4. Presentar usuario asignado a editar. 5. Cambiar datos. 6. Decidir si guardar o cancelar la edición. 7. Guardar información de usuario asignado 8. Verificación de datos de usuario asignado Actualizar datos de usuario asignado. Si esta incorrecto saldrá un mensaje en la parte superior informando el error En caso de cambiar la contraseña de usuario, envía automáticamente la nueva clave al mail del asignado. 52 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 9. Cancelar la edición de usuario asignado 10. No actualiza la información Tabla 3. 10: CU-06-Editar usuario asignado 53 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 7. Diagrama Caso de Uso: Eliminar Usuarios Asignados System Buscar usuario asignado Seleccionar usuario asignado Usuario administrador Sistema Eliminar o borrar usuario asignado Gráfico 3. 9: Eliminar usuarios asignados Nombre del Caso de Uso: CU-07-Eliminar usuario asignado Actores: Usuario Administrador del Sistema Función: Eliminar usuarios asignados Usuario del Sistema Respuesta del Sistema 1. Ingresar a la administración del portal Web. 2. Buscar usuario asignado a eliminar. 3. Seleccionar el usuario asignado a eliminar. 4. Escoge la opción Borrar 5. Se actualiza en la base de datos del sistema y se elimina el usuario asignado. Tabla 3. 11: CU-07-Eliminar usuarios asignados 54 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 8. Diagrama Caso de Uso: Roles de usuario administrador System Entradas Portafolios Porfesores System Cursos Ingreso usuario y contraseña Comentarios Verificación de datos Eventos Usuario asignado Contacto Administrador Apariencia Sistema Plugins Usuarios Herramientas Ajustes Revolution Slyder Layerslyder Perfil Widget importar y exportar Gráfico 3. 10: Roles de usuario administrador 55 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Nombre del Caso de Uso: CU-08-Roles de usuario administrador Actores: Usuario Asignado Función: Roles o funciones asignadas al usuario administrador Usuario del Sistema Respuesta del Sistema 1. Ingresar a la administración del portal Web. 2. Ingreso de usuario y contraseña. 3. Verificación de datos 4. Despliegue de roles o funciones asignadas. Este usuario tiene todos los permisos para gestionar el portal Web. Tabla 3. 12: CU-08-Roles de usuarios administrador 56 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 9. Diagrama Caso de Uso: Roles de usuario Editor System Entradas System Portafolios Ingreso de usuario y contraseña Porfesores Verificación de datos Cursos Usuario asignado Comentarios Sistema Editor Eventos Contacto Medios Páginas Perfil Gráfico 3. 11: Roles de usuario editor Nombre del Caso de Uso: CU-09-Roles de usuario editor Actores: Usuario Asignado Función: Roles o funciones asignadas al usuario editor Usuario del Sistema Respuesta del Sistema 1. Ingresar a la administración del portal Web. 2. Ingreso de usuario y contraseña. 3. Verificación de datos 4. Despliegue de roles o funciones asignadas. Este usuario tiene 11 funciones a gestionar. Tabla 3. 13: CU-09-Roles de usuario editor 57 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 10. Diagrama Caso de Uso: Roles de usuario Autor System Entradas Portafolios Porfesores System Cursos Ingreso usuario y contraseña Comentarios Verificación de datos Usuario asignado Eventos Contacto Autor Sistema Medios Ajustes Gráfico 3. 12: Roles de usuario autor Nombre del Caso de Uso: CU-10-Roles de usuario autor Actores: Usuario Asignado Función: Roles o funciones asignadas al usuario autor Usuario del Sistema Respuesta del Sistema 1. Ingresar a la administración del portal Web. 2. Ingreso de usuario y contraseña. 3. Verificación de datos 4. Despliegue de roles o funciones asignadas. Este usuario tiene 10 funciones a gestionar. Tabla 3. 14: CU-10-Roles de usuario autor 58 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 11. Diagrama Caso de Uso: Roles de usuario colaborador System Entradas System Portafolios Ingreso usuario y contraseña Porfesores Usuario asignado Verificación de datos Cursos Sistema Colaborador Comentarios Eventos Contacto Ajustes Perfil Gráfico 3. 13: Roles de usuario colaborador Nombre del Caso de Uso: CU-11-Roles de usuario colaborador Actores: Usuario Asignado Función: Roles o funciones asignadas al usuario colaborador Usuario del Sistema Respuesta del Sistema 1. Ingresar a la administración del portal Web. 2. Ingreso de usuario y contraseña. 3. Verificación de datos 4. Despliegue de roles o funciones asignadas. Este usuario tiene 9 funciones a gestionar. Tabla 3. 15: CU-11-Roles de usuario colaborador 59 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 12. Diagrama Caso de Uso: Roles de usuario Suscriptor System System Ingreso usuario y contraseña Perfil Calificaciones Verificación de datos Usuario asignado Reseteo claves representantes Suscriptor Gráfico 3. 14: Roles de usuario suscriptor Nombre del Caso de Uso: CU-12-Roles de usuario suscriptor Actores: Usuario Asignado Función: Roles o funciones asignadas al usuario suscriptor Usuario del Sistema Respuesta del Sistema 1. Ingresar a la administración del portal Web. 2. Ingreso de usuario y contraseña. 3. Verificación de datos 4. Despliegue de roles o funciones asignadas. Este usuario tiene 3 funciones a gestionar. Este usuario solo tiene la función de subir los formatos con extensión .CSV de calificaciones al portal Web. Este usuario al igual que el resto de usuarios asignados permite resetear la clave del 60 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB usuario representante. Este usuario puede modificar el perfil al igual que todos los usuarios asignados. Tabla 3. 16: CU-12- Roles de usuario suscriptor 13. Diagrama Caso de Uso: Ingreso de Calificaciones System Ingreso administración portal Web Ingreso usuario y contraseña Usuario Asignado Verificación de datos usuario Negar acceso Ingreso datos calificaciones Error de ingreso usuario y contraseña Subir formato archivo Validación de datos Guardar archivo Error archivo Gráfico 3. 15: Ingreso de Calificaciones Nombre del Caso de Uso: CU-13-Ingreso Calificaciones Actores: Usuario Asignado Función: Ingreso datos calificaciones Usuario del Sistema Respuesta del Sistema 1. Ingresar a la administración del portal Web. 2. Ingreso de usuario y contraseña. 61 Sistema DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 3. Verificación de datos Ingresa a la función de calificaciones. Caso contrario mensaje de error de usuario y contraseña. 4. Pantalla de ingreso de datos 5. Subir el archivo con el formato de las calificaciones. (ANEXO C), pulsar en el botón INSERTAR EN LA ENTRADA, luego pulsar botón pantalla principal ENVIAR 6. Validación de datos Guarda información en la base de datos. Caso contrario archivo. Tabla 3. 17: CU-13-Ingreso de Calificaciones 62 error de DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 14. Diagrama Caso de Uso: Reseteo de clave usuario representante System Ingreso administración portal Web Ingreso usuario y contraseña Usuario Asignado Verificación de datos usuario Negar acceso Reseteo de clave Error de ingreso usuario y contraseña Sistema Ingreso cédula usuario representante Validación de datos Resetea La cédula no existe Gráfico 3. 16: Reseteo de clave usuario representante Nombre del Caso de Uso: CU-14-Reseteo de clave representante Actores: Usuario Asignado Función: Reseteo de clave Usuario del Sistema Respuesta del Sistema 1. Ingresar a la administración del portal Web. 2. Ingreso de usuario y contraseña. 63 usuario DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 3. Verificación de datos Ingresa a la función de Reseteo de clave. Caso contrario mensaje de error de usuario y contraseña. 4. Pantalla de reseteo calve de usuario representante. 5. Ingreso de cédula del representante. 6. Validación de datos Resetea la cédula; el sistema automáticamente cambia la clave por el mismo número de cédula. Nota: la primera vez que ingrese o después de ser reseteada la clave, el sistema le obliga a cambiar su contraseña. Caso contrario mensaje de la cédula no existe. Tabla 3. 18: CU-14-Reseteo de clave usuario representante 64 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 15. Diagrama Caso de Uso: Ingreso Consulta de Calificaciones System Ingreso Portal Web Módulo calificaciones Ingreso cédula y contraseña Usuario representante Sistema Validación de datos Cambiar clave Ingreso consulta calificaciones Presentación de calificaciones Imprimir No se pudo ingresar por favor comuníquese con el administrador del sitio Gráfico 3. 17: Ingreso Consulta de Calificaciones Nombre del Caso de Uso: CU-15-Ingreso Consulta Calificaciones Actores: Usuario Representante Función: Ingreso al módulo de calificaciones Usuario del Sistema Respuesta del Sistema 1. Ingresar al portal Web 2. Ingresa al módulo de calificaciones sea por el botón de la pantalla inicial o por las opciones en el menú del portal Web. 65 de DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB |3. Presentación de la pantalla de ingreso 4. Ingreso de cédula y contraseña 5. Validación de datos Cambiar clave Ingreso a consulta de calificaciones. Caso contrario mensaje: No se pudo ingresar por favor comuníquese con el administrador del sitio. 6. Imprimir calificaciones Tabla 3. 19: CU-15-Ingreso consulta de calificaciones 16. Diagrama Caso de Uso: Ingreso usuario Invitado System Visualizar Home o Inicio Visualizar información de la Institución Usuario Invitado Ley de Transparencia Noticias en general Gráfico 3. 18: Ingreso usuario Invitado 66 Sistema DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Nombre del Caso de Uso: CU-16-Ingreso Usuario Invitado Actores: Usuario Invitado Función: Ingreso a información Usuario del Sistema Respuesta del Sistema 1. Ingresar al portal Web 2. Presentación de la pantalla inicial con el menú de opciones Inicio Institución Ley de transparencia Calificaciones Contáctenos 3. Seleccionar la opción Institución 4. Presenta como opciones Autoridades Eventos Misión y Visión Ideario 5. Seleccionar Ley de transparencia 6. Presenta información de la LOAIP de los diferentes años, estos son documentos que se exige dar a conocer a toda la comunidad según la Ley de transparencia sobre Institución Educativa Pública. Tabla 3. 20: CU-16-Ingreso Usuario Invitado 67 una DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 3.3.2 Diagramas de Secuencia Proceso: Creación de Usuarios Gráfico 3. 19: Proceso de creación de Usuarios 68 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Proceso: Ingreso de Información al Portal Web Gráfico 3. 20: Proceso Ingreso de Información al Portal Web 69 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Proceso: Ingreso de archivo de calificaciones Gráfico 3. 21: Proceso Ingreso de archivo de calificaciones 70 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Proceso: Presentación de calificaciones a los usuarios representantes Gráfico 3. 22: Proceso Presentación de calificaciones a los usuarios representantes 71 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Proceso: Reseteo clave usuario representante Gráfico 3. 23: Proceso Reseteo clave usuario representante 72 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Diccionario de datos 1. Tabla:wp_comment Descripción de la tabla: Los comentarios en WordPress se almacenan aquí. Los comentarios son añadidos por lectores y autores como respuestas a entradas en el blog. Campo Tipo Llave Valor Predeter minado comment_ID bigint(20) unsigned PRI NULL comment_post_ID int(11) IND comment_author tinytext comment_author_email varchar(100) comment_author_url varchar(200) comment_author_IP varchar(100) comment_date datetime comment_date_gmt datetime comment_content comment_karma text int(11) comment_approved varchar(20) comment_agent varchar(255) comment_type varchar(20) comment_parent bigint(20) user_id bigint(20) IND & IND Pt2 Extra auto_incre ment FK0 >wp_posts. ID 0000-0000 00:00:00 0000-0000 00:00:00 0 IND & Ind Pt1 1 FK0 >wp_comm ent.ID FK0 >wp_users. ID Tabla 3. 21: Tabla wp_comment 73 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 2. Tabla: wp_postmeta Descripción de la tabla: Los metadatos de cada entrada en el blog se mantienen aquí. Algunos plugins de etiquetas (tags) y otros pueden agregar su propia información a esta tabla. Campo Tipo Llave Valor Predeter minado meta_id bigint(20) PRI NULL post_id bigint(20) IND meta_key varchar(255) IND NULL meta_value longtext NULL Extra auto_incre ment FK0 >wp_posts. ID Tabla 3. 22: Tabla wp_postmeta 3. Tabla: wp_post Descripción de la tabla: La información principal de WordPress son las entradas (posts), que son guardados en esta tabla. Campo Tipo Llave ID bigint(20) unsigned PRI & IND Pt4 post_author bigint(20) post_date datetime post_date_gmt datetime post_content post_title post_category post_excerpt longtext text int(4) text post_status varchar(20) IND Pt3 Valor Predetermi nado auto_incre ment FK0 >wp_users .ID 0000-00-00 00:00:00 0000-00-00 00:00:00 0 74 IND PT2 Extra publish DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB comment_status varchar(20) open ping_status varchar(20) open post_password varchar(20) post_name varchar(200) IND to_ping Pinged text text post_modified datetime post_modified_gmt datetime post_content_filtered text post_parent bigint(20) Guid varchar(255) menu_order int(11) post_type varchar(20) |post_mime_type varchar(100) comment_count bigint(20) 0000-00-00 00:00:00 0000-00-00 00:00:00 FK- 0 wp_posts.ID 0 IND Pt1 post 0 Tabla 3. 23: Tabla wp_post 4. Tabla: wp_terms Descripción de la tabla: Las categorías de las entradas y las ligas se mantienen aquí. Campo Tipo Llave term_id bigint(20) Name varchar(55) Slug varchar(200) UNI term_group bigint(10) Valor Predeter minado auto_incre ment PRI 0 Tabla 3. 24: Tabla wp_terms 75 Extra DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 5. Tabla: wp_term_relationships Descripción de la tabla: Asociaciones de las entradas con categorías y etiquetas de la tabla, wp_terms, junto con asociaciones de ligas con sus respectivas categorías. Llave Valor Predetermin ado bigint(20) PRI Pt1 0 Campo Tipo object_id term_taxonomy_id bigint(20) term_order int(11) Extra FK>wp_term_ta 0 xonomy.term _taxonomy_i d 0 PRI Pt2 & IND Tabla 3. 25: Tabla wp_term_relationships 6. Tabla : wp usermeta Descripción de la tabla: Cada usuario tiene sus propios metadatos, que se guardan en esta tabla. Campo Tipo Llave PRI Valor Predetermi nado umeta_id bigint(20) user_id bigint(20) '0' meta_key varchar(255) IND NULL meta_value longtext NULL IND NULL Extra auto_increme nt FK>wp_users.ID Tabla 3. 26: Tabla wp_usermeta 7. Tabla: wp_users Descripción de la tabla: La lista de usuarios se mantiene aquí. Campo ID Tipo bigint(20) unsigned Llave PRI 76 Valor Predetermin ado NULL Extra auto_increm ent DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB user_login varchar(60) IND user_pass varchar(64) user_nicename varchar(50) user_email varchar(100) user_url varchar(100) user_registered datetime user_activation_key varchar(60) user_status int(11) display_name varchar(250) IND 0000-00-00 00:00:00 0 Tabla 3. 27: Tabla wp_users 8. Tabla: wp_notas_cabecera Descripción de la tabla: Esta tabla contiene la cabecera del archivo de calificaciones, ingresadas por los profesores (usuarios asignados). Campo Tipo Llave Valor Predeterminado ID mediumint (9) periodo varchar(10) not null nivel varchar(10) not null paralelo varchar(1) not null materia varchar(400) not null profesor varchar(200) not null quimestre varchar (10) not null parcial varchar (10) not null PRI not null Tabla 3. 28: Tabla wp_notas_cabecera 77 Extra auto_increm ent DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 9. Tabla: wp_notas_detalle Descripción de la tabla: Esta tabla contiene los detalles, aquí se almacena los datos de los estudiantes y sus notas. Campo Tipo Llave Valor Predeterminado ID mediumint(9) PRI not null estudiante varchar(400) not null tareas varchar(10) not null actuacion_clase double(10,2) not null actuaciones_grupales double(10,2) not null lecciones double(10,2) not null examen_parcial double(10,2) not null promedio double(10,2) not null cualitativo varchar(100) not null cabecera_id mediumint(9) not null representante varchar(10) not null clave text not null ingreso int(11) not null Tabla 3. 29: Tabla wp_notas_detalle 78 Extra auto_incre ment DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Base de datos Wordpress Gráfico 3. 24: Base de datos Wordpress 79 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Base de Datos plugin calificaciones wp_notas_cabecera ID mediumint (9) periodo varchar(10) nivel varchar(10) paralelo varchar(1) materia varchar(400) profesor varchar(200) quimestre varchar (10) parcial varchar (10) wp_notas_detalle ID mediumint(9) estudiante varchar(400) tareas varchar(10) actuacion_clase double(10,2) actuaciones_grupales double(10,2) lecciones double(10,2) examen_parcial double(10,2) promedio double(10,2) cualitativo varchar(100) cabecera_id mediumint(9) representante varchar(10) clave text ingreso int(11) 80 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 3.4 Presentación de datos y resultados en gráficos Presentaremos las pantallas principales que toda escuela tendrá como estándar para poder subir la información correspondiente. Pantalla Principal del Portal Web En esta pantalla se despliega las fotos de la Institución y el Menú, con noticias y eventos principales. Gráfico 3. 25: Pantalla Principal del Portal Web Menú- Institución En este menú Institución tenemos varias opciones estandar que toda Institución Fiscal debe publicar a la comunidad. Autoridades Eventos Misión y Visión Ideario Noticias 81 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Gráfico 3. 26: Menú- Institución Menú – Ley de transparencia En esta pantalla se despliega la información mas relevante de la Institución que por Ley se debe dar a conocer a la comunidad según el artículo 7 antes detallado. El LOAIP de la Institución, este cambia todos los años y se lo tiene que detallar y presentar en documentos, estos sean en .pdf, .xls, .doc. Gráfico 3. 27: Menú – Ley de transparencia 82 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Menú- Calificaciones Esta pantalla presenta a los padres de familia un ingreso personal para que puedan visualizar las notas de los alumnos, el padre puede tener dos o más niños a su cargo, se le desplegara los niños asignado y podrá acceder a las calificaciones que fueron ingresadas por los profesores correspondientes. Gráfico 3. 28: Menú- Calificaciones Presentación de datos a los representantes, en esta pantalla tenemos diferentes opciones para escoger, si queremos ver las notas en general o podemos observar una por una de manera más detallada. 83 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Gráfico 3. 29: Presentación de datos a los usuarios representantes Menú – Contáctenos Presenta la ubicación, contacto e información de la Escuela Fiscal Quito Sur. Gráfico 3. 30: Menú – Contáctenos 84 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB CAPÍTULO 4 4. MARCO ADMINISTRATIVO 4.1. Recursos La persona encargada de ejecutar de éste proyecto es un estudiante egresado de Ingeniería Ciencias Físicas y Matemáticas, Facultad de Ingeniería Informática. Adicionalmente se cuenta con la guía de un tutor y dos profesores revisores. Por parte de la Escuela Fiscal Quito Sur tenemos el apoyo de la Rectora de la Matutina, Vicerrectora Matutina, Rector de la Vespertina y Vicerrectora Vespertina de la Unidad Educativa. Así mismo se indica que, para el análisis de costo asociado a éste proyecto se ha planteado un valor de 10 USD por hora. El mismo contempla honorarios profesionales, la utilización de equipos, servicio de internet y gastos de movilización en que se ha incurrido para la realización de éste trabajo. 4.1.1. Recursos Institucionales La Escuela Fiscal Quito Sur se compromete a poner a disposición la infraestructura como equipos, red, internet y el personal que administre, actualice el Portal Web, se encargara de vigilar los procesos detallados en el capítulo anterior. Adicionalmente se requerirá del compromiso y participación de las autoridades de la Unidad Educativa en cada una de las fases del proyecto, donde deberán expresar su conformidad y aceptación de los módulos entregables. Esta acción garantizará que el sistema está desarrollado según los requerimientos solicitados. Fueron definidas reuniones en donde el ejecutor del proyecto, el tutor y el usuario (autoridades de la Escuela Fiscal Quito Sur) definieron requerimientos, y soluciones a los mismos, con el fin de que el Portal Web cumpla con los objetivos planteados. 85 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 4.1.2. Recursos del egresado La tesista de este proyecto cubrirá los gastos del proyecto durante todas las fases que implica el desarrollo de un proyecto: Fase de análisis Fase de diseño Desarrollo Pruebas Capacitación Implantación del Sistema. 4.2. Presupuesto Teniendo en cuenta que este es un trabajo de tesis el costo para la Institución Fiscal Quito Sur es de 0.00 USD (cero dólares americanos con cero centavos); sin embargo para el alumno tesista si representa un aporte económico para este proyecto, se hizo un análisis de costos, se adjunta una tabla con dichos valores. 4.3. Recursos de infraestructura tecnológica Un servidor donde se implementara el proyecto funcional, este es un servidor contratado por la estudiante tesista un año. El diseño de la base de datos del proyecto será implementado utilizando la base de datos Mysql. La Unidad Educativa Fiscal Quito Sur tendrá que tener acceso a Internet, para cargar la información requerida. Un equipo portable donde se realizara el proyecto. Contrato de un hosting para la institución por un año, contratado por la estudiante que desarrolla el proyecto. 86 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB CAPÍTULO 5 5. CONCLUSIONES Y RECOMENDACIONES 5.1. Conclusiones Al desarrollar el proyecto detallado se llegó a las siguientes conclusiones: La Unidad Educativa Quito Sur, actualmente cuenta con un Portal Web que permite difundir la información de la escuela a la comunidad en general, por lo que este trabajo de grado apoya en general a todas las Instituciones Educativas Fiscales con una aplicación fácil de instalar y modificar tanto la estructura, presentación y diseño. La Unidad Educativa Fiscal Quito Sur es una Institución del Estado que posee un recurso humano profesional para que administre este Portal Web y pueda cumplir con los requerimientos del Reglamento de la Ley de transparencia y acceso a la información pública según el artículo 7, que consiste en la Difusión de Información, misma que es obligatoria para todas las dependencias públicas , para lo cual esta plantilla generalizada ayudará a todas las instituciones Fiscales que aún no la dispongan. Las Instituciones Educativas Fiscal Quito Sur cuenta con un Portal Web de fácil manejo y personalización, solo con un costo de alojamiento (hosting), en este caso de renovación. La implementación del Portal Web promueve la interacción de la Institución con los padres de familia, ya que pueden acceder al Portal para ver la información general y académica y así satisfacer las necesidades inmediatas como las calificaciones e impresión de éstas, solo en el caso de que necesitaren; a la vez contribuyen en el ahorro de papel y el cuidado del medio ambiente. 87 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB La difusión de la información por medios tecnológicos permite a los padres de familia y estudiantes acceder a la tecnología y estar acorde a los cambios tecnológicos de acuerdo a lo señalado en el capítulo 4 del Plan del Buen Vivir. La implementación del Portal Web es un software que fácilmente puede ser adaptado por otras Instituciones Educativas Fiscales. El Portal Web puede ser utilizado de acuerdo con los roles y perfiles del usuario, desde cualquier lugar que tenga acceso a internet. El uso de las herramientas tecnológicas en las Instituciones Educativas facilitan la comunicación y ahorran tiempo en la difusión de los mismos. 88 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 5.2. Recomendaciones Las autoridades de la Institución Educativa deben promover talleres de capacitación para que los profesores actualicen la información de las calificaciones en los tiempos y cronogramas establecidos. El o los administradores del sistema deberán gestionar permisos o roles a los docentes e ingresar la información del usuario; realizar el mantenimiento y generar respaldos periódicamente, tomando en consideración los manuales de usuario proporcionados en este proyecto. Se recomienda que las Autoridades gestionen los recursos para que los profesores puedan tener acceso a internet en la Institución de tal manera que puedan utilizar el sistema y les sirva de apoyo para sus tareas. Se recomienda al usuario administrador gestionar bien los usuarios asignados para la colaboración de información en el portal Web, documentando y con las autorizaciones por parte de la máxima autoridad de la institución. La Institución debe socializar y motivar a los representantes de los estudiantes sobre las nuevas facilidades que brinda el Portal Web, tanto en la información como en las calificaciones. Deben realizar e talleres prácticos y sociabilizarse con los manuales de usuario entregados, para garantizar la correcta ejecución de los datos. Proveer la renovación del hosting en donde se aloja el Portal Web, el mismo que estará vigente hasta 1 de Marzo del 2016 en GoDaddy. 89 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB BIBLIOGRAFÍA 1. http://codex.wordpress.org/WordPress. (s.f.). 2. http://codex.wordpress.org/Writing_a_Plugin. (s.f.). 3. http://dev.mysql.com/doc/refman/5.1/en/. (s.f.). 4. http://downloads.mysql.com/docs/refman-5.0-es.pdf. (s.f.). 5. http://es.kioskea.net/contents/156-css-hojas-de-estilo. (s.f.). hojas de estilo css. 6. http://es.scribd.com/doc/50829167/Tutorial-MySQL. (s.f.). prestaciones. 7. http://openaccess.uoc.edu/webapps/o2/bitstream/10609/9121/1/Intro_ UML.pdf. (s.f.). 8. http://procesosdesoftware.wikispaces.com/METODOLOGIAS+PARA+ DESARROLLO+DE+SOFTWARE. (s.f.). 9. http://procesosdesoftware.wikispaces.com/METODOLOGIAS+PARA+ DESARROLLO+DE+SOFTWARE. (s.f.). 10. http://programacion.net/articulo/tomcat_-_introduccion_134. (s.f.). 11. http://www.alvasolution.com/. (s.f.). 12. http://www.ecured.cu/index.php/Servidor_Web. (s.f.). 13. http://www.ibm.com/developerworks/ssa/library/os-ecov/. (s.f.). 14. http://www.ibm.com/developerworks/ssa/library/os-ecov/. (s.f.). 15. http://www.informatica-hoy.com.ar/aprender-informatica/Que-es-unnavegador-web.php. (s.f.). 16. http://www.monografias.com/trabajos75/servidores-web/servidoresweb.shtml. (s.f.). 17. http://www.quees.info/que-es-una-pagina-web.html. (s.f.). 18. http://www.uml.org/. (s.f.). 19. https://developer.mozilla.org/es/docs/User:Marti1125. (s.f.). php. 20. https://docs.google.com/document/d/1r1hYEZqARp4joualX0QwU1eyx dMNqpI_1tDvxRIvPrg/edit. (s.f.). mysql. 21. https://jummp.wordpress.com/2011/04/06/desarrollo-de-software-ciclode-vida-rup-rational-unified-process/. (s.f.). 22. https://msdn.microsoft.com/en-us/magazine/hh653584.aspx. (s.f.). 23. IBM. (s.f.). http://www.ibm.com/developerworks/ssa/library/os-ecov/. 24. wordpress., h. (. (s.f.). 90 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 25. http://httpd.apache.org/. (s.f.). 26. http://programacion.net/articulo/tomcat_-_introduccion_134. (s.f.). 27. http://wordpress-studio.com/como-hacer-un-plugin-para-wordpressprincipiante/. (s.f.). 28. http://www.cdc.gob.cl/wpcontent/uploads/documentos/legislacion_internacional/. (s.f.). 29. http://www.cdc.gob.cl/wpcontent/uploads/documentos/legislacion_internacional/. (s.f.). 30. http://www.colorvivo.com/que-gestor-de-contenidos-elijo-para-mi-web/. (s.f.). 91 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB ANEXOS 92 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB ANEXO A: CRONOGRAMA DE ACTIVIDADES 2014 Nombre de la tarea AGOSTO SEPTIEMBRE 2015 OCTUBRE NOVIEMBRE FASE 1: PLANIFICACION Revisión Requerimientos Revisar Presupuesto Plan de desarrollo FASE 2: ANALISIS DE REQUERIMIENTOS Captura de requerimientos Análisis de Requerimientos Validación de Requerimientos Refinar Plan FASE 3: DISEÑO Diseño casos de uso Definir interfaces de usuario Definir diagrama de relación y casos de uso Definir esquema de Base de Datos FASE 4: IMPLEMENTACIÓN Módulo página general Módulo calificaciones para padres de familia FASE 5: PRUEBAS Pruebas de módulos Pruebas de integración Pruebas de aceptación FASE 6: ENTREGABLES Fuentes, documentación y manuales 93 DICIEMBRE ENERO FEBRERO MARZO ABRIL MAYO DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB ANEXO B: PRESUPUESTO ÍTEM RUBRO DE GASTOS No. 1 Valor Cantidad Unitario Rubro Unidad No. RECURSOS UNIDAD EDUCATIVA QUITO SUR $ $ 0 0 SUBTOTAL UEQS 2 Valor 0 RECURSOS INSTITUCIONALES Uso de equipos 0 0 SUBTOTAL EMPRESA 0 0 RECURSOS HUMANOS Tutor de trabajo de graduación 3 Tribunal de trabajo de graduación Investigadores(Autores de trabajo de grado) 1 0 0 2 0 0 3 0 0 SUBTOTAL RECURSO HUMANOS 0 RECURSOS MATERIALES Material de escritorio: 100 ● Resma de papel 4 3 5 15 ● Tóner 1 80 80 ● Copias 1000 0.02 20 ● Caja de CDs 1 10 10 ● Lápices 6 0.7 4.2 ● Minas 10 0.35 3.5 ● Borrador 6 0.22 1.32 6 45 270 ● Empastado de tesis 2 15 30 ● Fotocopias de libros 1000 0.02 hojas Material bibliográfico: ● Internet meses SUBTOTAL RECURSO MATERIALES 20 454.02 OTROS 5 ● Web hosting año ● Gastos varios 1 150 150 300 SUBTOTAL OTROS 450 TOTAL PRESUPUESTO 904.02 94 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB ANEXO C: MATERIALES DE REFERENCIA TERMINOLOGÍA BÁSICA WORDPESS “Word prees es un sistema de gestión de contenidos, enfocado a la creación de cualquier tipo de sitio, y es un software libre.” HTML “Lenguaje de Marcas de Hipertexto, usado para describir la estructura y el Contenido en forma de texto, y complementar el texto con imágenes, audio y video”. HTTP “Protocolo de Transferencia Hipertexto, es usado en cada transmisión de la web, sigue el esquema petición-respuesta entre servidor y cliente”. RUP “Proceso Racional Unificado, permite asignar tareas y responsabilidades a cada uno de los miembros del equipo de trabajo.” SERVIDOR WEB “Permite verificar el tipo de servicio web que corre la herramienta por ejemplo: Tomcat, Apache, IIS, etc.)”. SUBIR “Agregar información en el portal web, desde un ordenador a algún tipo de la Internet” USUARIO ADMINISTRADOR “Este usuario tiene todos los privilegios o permiso para modificar el portal Web.” 95 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB USUARIO ASIGNADO “Este usuario tiene privilegios asignado por el administrador según el rol que este desempeñe dentro del Portal Web.” USUARIO REPRESENTANTE “Este usuario tiene el ingreso solo a la revisión de calificaciones del estudiante, este usuario se crea automáticamente en el archivo de calificaciones que cada profesor sube.” 96 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB ANEXO D: TABLA DE ACHIVO PARA SUBIR AL MÓDULO DE CALIFICACIONES ESCUELA "QUITO SUR" La Santiago Periodo:( en números el periodo) Nivel: (en letras el nivel) Materia: en letras la materia Parcial: (en números el parcial) Paralelo: (en letras del arParalelo) Profesor: (nombre del profesor) Quimestre: (en números el quimiestre que corresponda) Estudiantes Nombre del estudiante Tareas # Actuación en Actuaciones Clases Agrupales # # 97 Lecciones # Examen Parcial # Promedio Cualitativo Representante # letra del cualitativo cédula del correspondiente representante DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB ANEXO E: MANUAL DE USUARIO Se realizará un detalle del usa de las funciones que contiene el Portal Web para la modificación del mismo, con la finalidad que el usuario que lo administre pueda ingresar información. 1. FUNCIÓN USUARIOS Creación de Usuarios: 1. Ingresar a la administración del portal Web (http://uequitosur.com/wpadmin) 2. Registrarse con el usuario y contraseña 3. Escoger función Usuarios 4. Pulsar botón : Añadir nuevo Figura 1: Añadir usuarios 98 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 5. Ingresar los datos necesarios para la creación de usuario Figura 2: Ingreso de datos usuario 6. Escoger el rol que tendrá el usuario según las necesidades y tendrá las funciones asignadas. Suscriptor: perfil, eventos, reseteo de clave y calificaciones. Colaborador: entrada, portafolio, profesores, cursos, contactos, eventos, comentarios, herramientas y perfil. Editor: entrada, portafolio, profesores, cursos, contactos, eventos, comentarios, herramientas, perfil y medios. Autor: entrada, portafolio, cursos, medios, profesores, cursos, contactos, eventos, comentarios y perfil. Administrador: entrada, portafolio, profesores, cursos, medios, páginas, contactos, eventos, comentarios, LMS, apariencias, usuarios, herramientas, ajustes, revolution slider y perfil. 7. Pulsar botón: Añadir nuevo usuario 99 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Figura 3: Asignación de roles Modificar Usuarios 1. Escoger Función Usuarios 2. Buscar el usuario a ser modificado 3. Click en Editar 4. Modificar la información 5. Click botón Actualizar Usuario Figura 4: Modificación de Usuarios 100 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Eliminar Usuario 1. Escoger Función Usuarios 2. Buscar el usuario a ser eliminado 3. Click en Borrar 2. FUNCIÓN PROFESORES Creación de Profesores 1. Escoger Función Profesores 2. Click botón Agregar Nuevo 3. Llenar la información que requiere el profesor 4. Click en botón Publicar Figura 5: Agregar profesores Eliminar Profesores 1. Escoger Función Profesores 2. Click en Todos los profesores 3. Para borrar click en Papelera o seleccionar profesor y en opciones seleccionar Mover a papelera. 101 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 3. FUNCIÓN CURSOS Agregar Cursos 1. Escoger Función Cursos 2. Agregar Nuevo 3. Ingresar datos del Curso 4. Utilización de LMS 5. Click botón Publicar 6. En el caso que se desee poner una imagen de entrada, seleccionar en imagen destaca. Figura 6: Agregar cursos 4. FUNCIÓN MEDIOS Aquí encontraremos todos los archivos del portal que han sido cargados, de todo tipo de extensiones. 1. Escoger Función Medios 2. Buscar archivo de diferentes extensiones: .jpg, xls, .csv, png, pdf, etc. 3. Seleccionamos el archivo a Editar, Ver, o Borrar permanentemente. 4. Si la opción es Editar, se desplegará los datos para su modificación 5. Si la opción es Ver, se visualiza o se descarga el archivo. 102 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 6. Si la opción es Borrar permanentemente, se elimina del portal el archivo. Figura 7: Visualización de archivos en repositorio Medios 5. FUNCIÓN EVENTOS Permite crear en un formato los eventos de la escuela y categorizar. 1. Escoger la Función Eventos 2. Tenemos varias opciones que las describiremos: Eventos: enlista todos los eventos existentes. Añadir Evento: permite Agregar un nuevo evento con todos sus datos, objetos e imagen destacada. Personalizar el evento cuánto durará la publicación o cuando se presentará en el Portal. Ubicaciones: permite dar a conocer la ubicación del lugar del evento, por medio de google earth y visualizar en un mapa. Eventos periódicos: esta opción ayuda cuando se tiene eventos que son recurrentes en un tiempo y para no repetirlos se crea con las fechas de publicación. 103 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Figura 8: Función eventos- Ubicación Configuración: permite dar permisos o capacidades a los usuarios sobre los eventos creados o por crear. Figura 9: Función eventos- Permisos 6. FUNCIÓN LMS Esta función es muy importante, aquí permite configurar de forma o apariencia, como es el logo, la apariencia, el tema a utilizar, si en las 104 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB opciones no hay la modificación desde aquí se puede instalar o activar el Plugin. 1. Escoger la Función LMS 2. Permite subir el logo 3. Escoger la apariencia, el color de todo el Portal Web: Cabecera Menú Cuerpo Pie de Página Figura 10: Función LMS 4. Respaldos: esta opción es importante y se debe utilizar en períodos, para respaldar la información del portal o para restaurar todas las opciones. 105 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Figura 11: Opciones de Respaldos y restauración de las funciones. 7. FUNCIÓN PÁGINAS Esta función es la más usada, aquí creamos todas las páginas con sus propios diseños que serán publicadas. 1. Escoger la Función Páginas 2. Tenemos las opciones: todas las páginas y Añadir nueva. 3. Añadir nueva se desplegará las opciones para ingresar los datos: Nombre de la página Utilización del LMS creador diseño de la página (se detallara en el punto 6) Permitir comentarios Imagen destacada (como portada de la página) Atributos de página (enlaces de otras páginas) 4. Click botón guardar borrador (para que después se publique los cambios) 5. O click botón Publicar (si se elige esta opción hará que se visualicen los cambios automáticamente en el Portal). 106 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 6. LMS Creador de Páginas: En algunas funciones del Portal Web, tenemos esta opción que nos permite crear un plantilla para la creación de la página. Click en el botón LMS creador de páginas Aparecerá una pantalla donde damos click en (NO) Activar creador de página (habilita opciones) Figura 12: Creación de Páginas con LMS creador 107 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Figura 13: Opciones habilitadas con el LMS creador de Página Escoger tipo de componente a utilizar Columnas: es el espacio que daremos en la página para añadir una función. Figura 14: LMS opción columnas General: opciones para desplegar información de una manera atractiva y generalizada. Figura 15: LMS opción General 108 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Unique: formatos para ingresar información, búsquedas, formularios, gráfico de pastel. Figura 16: LMS opción Unique Other: Ingreso de texto rápido con identificación (correo, dirección teléfono …) Figura 17: LMS opción Others 109 formato e DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB WP widget: permite añadir un función o widget Figura 18: LMS opción WP widgets LMS Widget Sample layout: permite añadir contactos Botón Agregar CSS personalizado: añade la plantilla que se está creando para reutilizarlo. 110 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Figura 19: LMS opción Sample Layouts 8. FUNCIÓN APARIENCIA Esta función permite escoger la forma, colores generales, imagen de cabecera, imagen de fondo, pie de página con opciones de la apariencia escogida en la función LMS, instalación de plugins. 1. LMS: el estilo inicial de la página Figura 20: Función Apariencia Portal 2. Título del Sitio 3. Colores del portal 4. Imagen de cabecera 5. Imagen de fondo 6. Navegación 7. Página estática: página por defecto (INICIO) 8. Widget para pie de página en general. 111 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Figura 21: Widget footer (pie de página) Widgets: permite añadir widget en las páginas para que sean desplegadas. Figura 22: Añadir widget en las páginas 112 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Footer: tenemos cuatro columnas que permiten añadir opciones para despliegue en las páginas, como búsqueda, accesos rápido. Figura 23: Footer columnas Menú: Este paso es importante ya que ayuda a personalizar el Menú principal, aquí podemos añadir un nuevo enlace. 1. Se selecciona en la parte izquierda la página que añadiremos al menú. 2. Click en el botón Añadir al menú 3. Aparece en la parte izquierda en Estructura del Menú 4. Se selecciona y con click retenido en la página, movemos hacia la ubicación que mostraremos. 5. Click en el botón Guardar 113 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Figura 24: Añadir opciones en el Menú principal Figura 25: Ubicación en la estructura del menú la página seleccionada 114 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 9. FUNCIÓN HERRAMIENTAS Esta función permite importar y exportar el contenido del portal Web. 1. Escoger la función Herramientas Importar widget: para poder importar se debe tener un respaldo anterior, lo buscamos e importamos el archivo. El archivo que se debe buscar tiene extensión (.wie) Exportar widget: se descarga en .wie Figura 26: Widget importar y exportar 115 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Exportar: esta opción se descarga toda la página en .xml Figura 27: Exportar el portal en extensión .xml 10. FUNCIÓN AJUSTES Los ajustes se incluyen los datos Generales: El título del sitio Dirección Zona Horaria Miembros Formato de Hora Formato de la fecha 116 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Figura 28: Función Ajustes En los ajustes tenemos: Ajustes de escritura Ajustes de lectura Medios: formato del tamaño de las imágenes. Enlaces permanentes: personaliza el nombre de publicación en el URL. Calificaciones: Esta opción permite al usuario profesores subir sus calificaciones en el formato .csv (ANEXO C), al portal Web para que puedan visualizar los padres de familia. Figura 29: Ingreso de calificaciones al Portal Web 117 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 1. Aquí seleccionamos el archivo .csv desde el equipo o dispositivo. Figura 30: Selección archivo .csv de calificaciones 2. Una vez seleccionado el archivo dar click en el botón Insertar en la entrada. Figura 31: Insertar en la Entrada 118 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 3. Se presenta esta pantalla donde damos click en el botón ENVIAR. Figura 32: Inserta la información en la Base de datos 4. Saldrá este mensaje cuando ya esté el archivo almacenado. Figura 33: Verificación de calificaciones almacenadas 119 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Reseteo de clave: esta opción permite restaurar la clave de los padres de familia para que puedan acceder a las calificaciones de sus niños. o Ingresar el número de cédula a resetear o Click botón Resetear La clave le asigna el sistema automaticamente, es el mismo número de cédula, la primera vez que accede el sistema le obliga cambiar. Figura 34: Reseteo de clave En el caso de los usuarios asignados con rol de suscriptor, vienen a ser todos los profesores, mostraremos la siguiente interfaz con dos opciones, ingreso de calificaciones y el reseteo de clave de los representantes. 120 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Figura 35: Ingreso calificaciones por medio del usuario asignado 121 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB ANEXO F: MANUAL DE INSTALACIÓN Instalación Local En este manual detallaremos los puntos a considerarse para la instalación de software. Pasos de Instalación Tener un equipo instalada cualquier versión de Centos de 64 bits Para instalar el servidor Lampp en este caso el Xampp (instalación local) 1. Descargar el instalador Xampp o usar el instalador del CD. http://hivelociy.dl.sourceforge.net/project/xampp/XAMPP%20Linux/1.8.3/xampplinux-x64-1.8.3-5-installer.run Imagen 1: Descarga de instalador xampp 2. Copiar el archivo en el servidor y si se descarga ponerlo en la carpeta /tmp como muestra la Imagen 1. 3. Al instalador le damos permisos de ejecución del archivo. Chmod 755 xampp-linux-x64-1.8.3-5-installer.run 122 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Imagen 2: Permisos al instalador 4. Ejecutar el instalador Xampp ./xampp-linux-x64-1.8.3-5-installer.run Imagen 3: Ejecutar el instalador Xampp 5. En todas las preguntas durante la instalación digitar (Y) 123 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Imagen 4: Pasos de la instalación de Xampp 6. Reiniciar el equipo reboot Imagen 5: Reiniciar equipo 7. Los archivos se cargan en la siguiente dirección /opt/lampp, accedemos a los archivos. cd /opt/lampp 124 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Imagen 6: Acceder a los archivos instalados 8. Permitir que todos los de la red tengan acceso a Xampp En el archivo httpd-xampp.conf editar y poner Requiere all granted y comentar la línea Requiere local haciendo uso del símbolo (#) al inicio de ésta línea. 9. Restaurar los servicios mediante el uso de Xampp ./lampp start Imagen 7: Reinicio de servicios de Xampp 125 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 10. Revisar que IP tiene nuestro servidor para poder acceder por un navegador. Ifconfig o ip addr Imagen 8: Ver IP del servidor 11. Abrir en un navegador la dirección IP del servidor (se visualizará el tablero) Imagen 9: Ingresar a Xampp por medio del navegador 126 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 12. Para abrir Phpmyadmin se tiene que ingresar en un navegador y poner en el browser la IP seguido de phpmyadmin. http: // IP/ phpmyadmin NOTA: Crear la base como el punto 14 en el manual de Instalación hosting (parte inferior pag: 134). 13. Crear una carpeta escuela en el directorio htdocs/ Copiar todos los documento que se encuentran bajados desde FTP o desde el CD carpeta de Archivos Tesis. Imagen 10: Creación de carpeta escuela 127 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Instalación en un Hosting (recomendado) Se recomienda comprar en GoDaddy ya que este viene con el servidor de Base de Datos Mysql, servidor de aplicaciones Apache 2 y wordpress. En nuestro caso realizamos la compra en GoDaddy, empezaremos la explicación. 1. Ingresar en la cuenta de GoDaddy 2. Se debe seleccionar la opción “Web Hosting” Imagen 11: Ingreso a la cuenta GoDaddy Imagen 12: Seleccionar opción Web Hosting 128 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 3. Se ingresa en el CPANEL del servidor: Imagen 13: Ingreso a CPanel del servidor 4. Se debe crear una cuenta FTP para acceder seleccionando la opción “FTP Accounts”. Imagen 14: Crear cuenta FTP Account 129 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 5. En el formulario anterior se ingresan los datos de acceso y se puede visualizar en el listado en la parte inferior de la pantalla Imagen 15: Visualización de datos de acceso 6. De preferencia se debe utilizar el “FileZilla” para poder acceder al servidor por ftp: Imagen 16: Filezilla acceso al servidor FTP 130 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 7. Una vez en el servidor se debe copiar las carpetas dentro del proyecto: Imagen 17: Copia de archivos al servidor 8. Mientras se cargan los archivos en el servidor se debe crear la base de datos, para lo cual se debe regresar al CPANEL y seleccionar MySQL Databases,: 131 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Imagen 18: Creación de base de datos en MySql 9. Se debe ingresar el nombre de la base de datos: Imagen 19: Crear base de datos 132 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 10. Debemos crear el usuario para lo cual se debe bajar la misma pantalla hasta ver este formulario: Imagen 20: Usuario de la base de datos 11. Luego se debe asignar la base de datos al usuario bajando aún más la pantalla hasta llegar a esta sección Imagen 21: Asignación de base de datos a un usuario 12. Con esta información se debe editar el archivo de configuración wp-config.php Los parámetros q se deben cambiar son DB_NAME, DB_USER, DB_PASSWORD que fueron ingresados anteriormente. 133 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Imagen 22: Cambio de parámetros en el archivo wp-config.php 13. Ahora se debe cambiar los parámetros al nuevo dominio para lo cual se debe abrir el archivo escuela.sql o el archivo .sql donde está la base de datos exportada (se encuentra en el CD en la carpeta .zip) y reemplazar el contenido del dominio anterior (www.uequitosur.com) con el nuevo contenido (ie: www.escuelax.com). Y guardar el archivo 14. Una vez hecho esto debemos ingresar en el CPANEL nuevamente ahora en la opción PhpMyAdmin Imagen 23: Ingresar al CPanel a PhpMyAdmin 134 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 15. Una vez adentro se debe ingresar a la opción “Importar” Imagen 24: Importar 16. En esta opción ingresamos el .sql que cambiamos anteriormente: Imagen 25: Importando base de datos modificada 17. Se debe dar clic en continuar y la base de datos estará subida y podremos ver sus tablas en la parte izquierda: 135 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Imagen 26: Base de datos escuela 136 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB BACKUP Y RESTAURACIÓN DEL SITIO WEB DESDE HOSTING Para poder generar un backup del sistema se debe ingresar a la cuenta de CPANEL del servidor, para lo cual es necesario disponer de la información de usuario y contraseña y entrar en la URL: www.uequitosur.com/cpanel El usuario: nancyverito Clave: XXXXXX Imagen 27: Ingreso CPANEL Una vez que se ha ingresado al CPANEL, se mostrará una pantalla como la siguiente: 137 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Imagen 28: Opciones de CPANEL En la pantalla anterior se debe ingresar en la opción “Backup Wizard”. Una vez dentro de esa pantalla se mostrará el siguiente esquema: 138 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Imagen 29: Backup Wizard CPANEL En esta pantalla se puede visualizar dos opciones: 1. Backup: El Backup es la opción para generar un respaldo del sistema, al ingresar en esta sección se mostrará la siguiente pantalla: Imagen 30: Pasos de wizard Backup 139 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB En esta opción se puede seleccionar un “Full Backup” que es la opción para generar un backup completo de los archivos, base de datos y de correos electrónicos del servidor. O se puede seleccionar backups parciales (no recomendado). Al dar clic en la opción full backup se muestra la siguiente ventana: Imagen 31: Pasos Wizard Full Backup Aquí se debe ingresar el correo electrónico al cual llegará la notificación de que el backup se ha completado o simplemente si no se desea que llegue la notificación se selecciona la opción de no enviar notificación, en este caso no llegará una notificación de correo electrónico pero el backup se generará exitosamente. Se debe dar clic en el botón “Generate Backup” y el servidor iniciará el proceso de backup. 140 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Imagen 32: Generar Full backup 2. Restauración a. Esta opción sirve para restaurar archivos de respaldo parcial previamente generados, se muestra una pantalla como la siguiente donde se debe seleccionar la opción de restauración: Imagen 33: Restauración Wizard 141 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB En esta pantalla se debe escoger el tipo de restauración y a continuación se debe subir el archivo: Imagen 34: Pasos de restauración wizard Una vez que se da clic en cargar el proceso de restauración se iniciará. Descargar la base de datos del servidor Ingresar al CPANEL y en la pestaña Administración de Archivos en el siguiente directorio encontramos la base de datos. Click en la cajita a lado del nombre o escoger la opción en la parte superior download. 142 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Imagen 35: Visualizar la base de datos Si deseamos tener todo el backup .de la página en nuestro equipo simplemente nos descargamos el : backup-4.12.2015_12-52-31_nancyverito83.tar.gz Imagen 36: Backup full para descargarse desde CPANEL 143 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB ANEXO G: FOTOS Capacitación de la herramienta en la Unidad Educativa Quito Sur Profesores en capacitación en el laboratorio de la Escuela Quito Sur 144 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB Segundo grupo de capacitación 145 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB ANEXO H: ACTAS FIRMADAS DEL PROYECTO En este anexo se presentará las Actas firmadas por la Directora de la Instrucción Educativa Fiscal Quito Sur. Acta de revisión, aceptación y culminación del proyecto elaborado como plan de tesis. 146 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 147 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 148 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 149 DISEÑO E IMPLEMENTACIÓN DE UN PORTAL WEB 150