PONTIFICIA UNIVERSIDAD CATOLICA DEL ECUADOR SEDE SANTO DOMINGO Direccion Académica- Escuela de Sistemas DISENO Y DESARROLLO DE UN SITIO WEB PARA LA UNIDAD EDUCATIVA SAGRADOS CORAZONES DEL CANTON LA CONCORDIA EN EL ANO 2013. Disertacién de Grado previa la obtenci6n del Ingenieros de Sistemas y Computaciéa Linea de investigacién: Estudio, Diseiio ¢ Implementacién de Software Autores: DELIA PAULINA GUZMAN VARGAS DANIBL FABIAN VEGA GONZALEZ Director: Msc, ADRIAN ROLANDO CEVALLOS DUENAS Santo Domingo ~ Beuador Marzo, 2015o von SOHN, ey, i PONTIFICIA UNIVERSIDAD CATOLICA DEL ECUADOR SEDE SANTO DOMI Direccién Académica- Escuela de Sistemas y Computacién HOJA DE APROBACION DISENO Y DESARROLLO DE UN SITIO WEB PARA LA UNIDAD EDUCATIVA SAGRADOS CORAZONES DEL CANTON LA CONCORDIA EN EL ANO 2013. Linea de investigacién: Estudio, Diseito e Implementacién de Software Autores: DELIA PAULINA GUZMAN VARGAS DANIEL FABIAN VEGA GONZALEZ. Msc. Adrién Rolando Cevallos Duefias FR DIRECTOR DE LA DISERTACION DE GRADO. Ing. Carlos Vicente Galarza Macancela F CALIFICADOR Ledo, Juan Pablo Ruiz F. CALIFICADOR Msc. Rodallo Stilo Cézdova Galvez E DIRECTOR ESCUELA DE SISTEMAS ‘Santo Domingo — Beuador Marzo, 2015DECLARACION DE AUTENTICIDAD YY RESPONSABILIDAD Yo, Delia Paulina Guzman Vargas portadora de la eédula de ciudadanfa No. 172209206-9 declaro que los resultados obtenidos en la investig én que presento como informe final, previo la obtencién del Grado de Inger ra de Sistemas y Computaci6n son absolutamente originales, auténtic s y personales En tal virtud, declaro que el contenido, las conclusiones y los efectos legales y académicos que se desprenden del trabajo propuesto de investigacion y luego de la redaccién de este documento son y serdn de mi sola y exclusiva responsabilidad legal y académica, Delia Paulina Guzman Vargas CL. 172209206-9DECLARACION DE AUTENTICIDAD YY RESPONSABILIDAD Yo, Daniel Fabian Vega Gonzalez portador de la cédula de ciudadanfa No. 172267482-5 declaro que los resultados obtenidos en la investig én que presento como informe final, previo la obtencién del Grado de Ingeniero de Sistemas y Computaci6n son absolutamente originales, autént s y personales, En tal virtud, declaro que el contenido, las conclusiones y los efectos legales y aca cos que se desprenden del trabajo propuesto de investigacion y Inego de la redaccién de este documento son y serdn de mi sola y exclusiva responsabilidad legal y académica, Daniel Fabian Vega Gonzalez CL. 172267482-5DEDICATORIA Con carifio y amor para las personas que admiro que son mi orgullo, que han sido un ejemplo de vida por su esfuerzo y tenacidad, que gracias a su sabidurfa influyeron en mi para convertirme en la. persona que soy ahora para lograr todo los objetivos y no decaer en los fracasos, por brindarme el apoyo en todo lo posible para lograr uno de mis suelios y forjar un camino en el yo debo continua. Ante todo eso estoy muy agradecida por eso esta Disertacién que con esmero y voluntad se realiz6 0s dedico a Ustedes en agradecimiento por no dejar de creer en mi y por todo su amor Como mi Sr. padre NO ENVIDIES MI FUTURO SI NO SABES MI SACRIFICIO. "Eh cumplido un pedazo de mi promesa”, Graci s Mami, Papi y en especial A mis Amados Abuelitos Mami Delia y Papi Eloy Delia Guzman Vargas Al culminar mi carrera, quiero dedicar esta disertaci6n a Dios por mostrarme siempre el camino de luz, a mis padres que han estado junto a mf para apoyarme, darme esas palabras de aliento cuando mis fuerzas deca‘an, gracias padres por siempre impulsar mis, sueiios. A mis abuelitos por esas palabras de énimo y amor que me brindaron siempre y muy especialmente a ti mi viejo que siempre me inculcaste 1a honradez, sencillez y humildad, aunque ya no estas junto a mi sé que siempre me seguirés guiando, cumpli mi promesa, esta disertacién es dedicada para ti Abuelito Vinicio gracias por todo. “SANCHO, SI LOS PERROS LADRAN ES SENAL DE QUE AVANZAMOS” Daniel Vega GonzalezAGRADECIMIENTOS A Dios por permitimnos gozar de alegria y salud durante nuestros dias, a nuestros padres por estar siempre junto a nosotros, por brindarnos su amor, y animarnos cuando més lo necesitamos en aquellos momentos que decaimos. A nuestros profesores aquellos que dia a dfa nos compartieron sus conocimientos en especial Ing, Enrique Constante, Ing, Carlos Galarza, Ing. Margareth Hurtado. Y a todas las demas personas que formaron parte de esta disertacién por apoyarnos y guiamos en este arduo camino Mg. Marco Polo Silva, Mg. Rodolfo Cérdova, Ing, Boris, Pa . Dis. Cindy Navia Roman,RESUMEN La presente disertacién consistié en desarrollar ¢ implementar un sitio web para la Unidad Educativa Sagrados Corazones, institucién dedicada a brindar una educacién de calidad en La Concordia, la principal caracteristica de este sitio es la facilidad de edicion de informaci6n gracias a su desarrollo simple y entendible, resolviendo ast necesidades especificas requeridas por a institucion y ayudando a la difusion de su trabajo, razén social, sugerencias y continua actualizacisn de los alumnos, del personal adminis rativo y docentes pertenecientes a la Institucion. El presente proyecto de ingenieria de sistemas implica tres ramas. La primera de estas ramas es la Programacién Web siendo esta la base principal del proyecto, se apoyard en la rama de Diseio Web y sustentaré toda su informacién en la rama de Base de Datos. Para la realizacion de esta disertacion es importante basarse en una metodologia especializada en aplicaciones Web, apoyada en el lenguaje de modelamiento UML, permite el desarrollo de todos los diagramas que servirin como base para la programaci6n. Las herramientas utilizadas para el diseiio y diagramacién son Rational Rousse y Visio, para Ia programacién se utilizaré el lenguaje PHP, para facilitar el acceso a datos, y se implementara en el motor de base de datos MysqlABSTRACT The current dissertation consisted in developing and implementing a web site for Unidad Educativa Sagrados Corazones, institution dedicated to offer an education of quality in La Concordia, the main characteristic of this site is the facility of editing information thanks to its simple and understandable development, solving specific needs required by the institution and helping to work dissemination, business name, suggestions and continuously update of students, administrative staff and teachers belonging to the Institution. The current engineering system project contains three branches. The first of these branches is Web Programming being the main basic of the project; it will support in the branch od Web Design and sustain all its information in the branch of Database. For carrying out this dissertation is important to base on an specialized methodology in Web applications, supported UML modeling language, it permits the development of all diagrams that will serve as ba for programming The tools used for design and layout are Relational Rousse and Visio, for programming PHP language will be used to facilitate the acces to data and it will be implemented in database MYSQL engine.L t. 21 INDICE DE CONTENIDOS Pag INTRODUCCION.. 1 PLANTEAMIENTO DEL PROBLEMA. ANTECEDENTES DEL PROBLEMA DE INVESTIGACION...... 3 PROBLEMA DE INVESTIGACION. 3 Preguntas de investigacién 4 JUSTIFICACION DE LA INVESTIGACION. 4 OBJETIVOS DE LA INVESTIGACION.. Objetivo General Objetivos Especificos. FASE DE VIABILIDAD. 6 FASE DE FACTIBILIDAD. 7 HIPOTESIS. 1 MARCO REFERENCIAL....sscsssessssesssseessssseessessnesesssssese 8 BASE DE DATOS csspssccssssnsvosssssssrssorssssisiensssssosssiinensenn 8 Componentes de una base de dato: 8 Tipos de usuarios de base de datos. 9 DBMS —— 9 Caracteristicas de un DBMS. 10 DDL. 10 DML. 10 DCL. 10 SORTWARR :seccvasssscescseesscessecnrssrneancecricccsrcmmeaes TT Ingenieria de software. "1 Ciclo de vida de ingenieria de software cesseeeenennee i Diagramas UML. 13 Diagramas de C1a8€.......ssesscsseeeeeconssnsseeeensssseeenees 13 Diagrama de caso de uso. 13, Diagrama de secuencia... ceccesstsesesnene 14 LENGUAJE DE PROGRAMACION. HTML. 15 PHP. 16 Caracteristicas de PHP. 16, ARQUITECTURA DE LA INFORMACION. 7 Componentes de la arquitectura de la informaciér 17PROTOCOLOS. 18 IP... : i 18 Servidor web... 19 INTERNET... wow. Sitio web...... Funcionamiento. Host. Dominio........... Seguridad de sitios......... ee 21 Seguridad en tecnologfas de la pagina web. conan 21 Disefio de politicas de seguridad.......sssssccssseeeeeeneesssmmnnene 22 JOOMLA. 22 Funcionamiento de Joomla 23 K2. ¥ ee 24 METODOLOGIA DE INVESTIGACION. 25 TIPO DE INVESTIGACION. 25 Cualitativa 25 Investigacién de campo. 25 Cuantitativa 25 Investigaci6n aplicada 26 METODOS DE INVESTIGACION. 26 Método analitico — deductivo.... ee . 26 METODOLOGIA DE DESARROLLO. 27 INVESTIGACION. 27 ARQUITECTURA LA INFORMACION. 27 Inventario de contenidos deseables. - 27 Disefio conceptual.......eev. 2 ‘Maqueta de la arquitectura de las paginas. . 28 Produccion y operacién..... Inventario de paginas web. INGENIERIA DE SOFTWARE. ..s.cssssssssscssssssssnssneessessssine 29, Anilisis.... 29 Disefio, 29 Desarrollo, 29 Implementacién y pruebas.......... 29 VALIDACION ossesssseessiveessesseeessieenseceniieeen sone 30. RESULTADOS. 32INVESTIGACION feos vccrarresresvcerssnesseesesnemarsasicaty 32 Introduccién... 32 Proposito y procedimiento. 32 Obtencion de la muestr: 32 Encuesta... 33 Estructura de la encuesta.. . 34 Tabulacion y analisis estadistico de la encuesta. 36 Entrevista cones 4d Elaboracion de SRS. ARQUITECTURA DE LA INFORMACION. Inventario de contenido deseable...........-..0.. vn 42 Disefio conceptual. Exploracién de metaforas. Escenarios. Plano de arquitectura de nivel superior. ert 4 47 ‘Magqueta de la arquitectura de las paginas. 48 Eisboz0 de disefl0..........ccsssssssssseeeeeeeeeeeneeeeenes wn 48 Produccién y operacién. 49 Planos detallados de la arquitectura, ae ar) Inventario de sitio web 51 INGENIERIA DE SOFTWARE. 52 Analisis. 52 Disefio. 53 Clases...... i ie ies “ ~ i « 33 Diagrama de clases 54 Casos de uso. vn Sh Diagrama de Casos de uso. sowaver a smumunaea 9 Diagramas de secuencia. 64 Disefio légico BDD. 70 Desarrollo. — 70 Diseiio fisico BDD. 70 Diagrama de interfaces... mn Implementacién y pruebas. 73 Subida de sitio web. B Entrega de documentacién... 14 Manual técnico. 4 Manual de usuario. lol VALIDACION osssessseessseescieesieesiieteeiessimesmneeccneeenees 109 Aplicacion del focus group...... ies 109 Btapas de preparacién del focus group. 109 Determinar el tipo de focus group. 109 Contratacién de moderador. 109 Seleccidn de participantes.. 110 Elaboracién de guia de animacién. 110 Analisis y resultados del focus group 10 Recursos necesarios. 1166.4.1.3 vat a1 ad Ventajas y Limitaciones, CONCLUSIONES Y¥ RECOMENDACIONES.. Conclusiones. Recomendaciones. REFERENCIA. Bibliograficas Lincograficas.. 116 wz 17 118 uy 119 121 122 125IMAGEN 1 IMAGEN 2 IMAGEN 3 IMAGEN 4 IMAGEN 5 IMAGEN 6 IMAGEN 7 AGEN 8 IMAGEN 9 IMAGEN 10 IMAGEN 12 IMAGEN 13 IMAGEN 14 IMAGEN 15 IMAGEN 16 IMAGEN 17 IMAGEN 18 IMAGEN 19 IMAGEN 20 IMAGEN 21 IMAGEN 22 IMAGEN 23 IMAGEN 24 IMAGEN 25, IMAGEN 26 IMAGEN 27 IMAGEN 28 IMAGEN 29 IMAGEN 30 IMAGEN 31 IMAGEN 32 IMAGEN 33 IMAGEN 34 IMAGEN 35, IMAGEN 36 IMAGEN 37 IMAGEN 38 IMAGEN 39 IMAGEN 40 IMAGEN 42 IN IMAGEN 44 IMAGEN 45 IMAGEN 46 LISTA DE IMAGENES Modelo cascada. Modelo espiral Ejemplo de diagrama de clases. 13 Ejemplo de diagrama de casos de uso. 14 Ejemplo de diagrama de secuencia........000c0ecceee 14 HTML. 16 Sitio web..... 6 seine 20 Funcionamiento web_ 21 Seguridad web. . i” . 2 Logotipo Joomla, 23 Funcionamiento de Joomla. 23 Esbozo de disefio. 49 Subida de sitio web. 2B Subida de sitio web. 3 Subida de sitio web. Manual Técnico. Manual Técnico. Manual Técnico. Manual Técnico. Manual Técnico. Manual Técnico. Manual Técnico. Manual Técnico. Manual Técnico... Manual Técnico... 79 Manual Técnico........... . .. 80 Manual Técnico. 80 Manual Tecmico.........csccecseesssteeeseersseseevieeeseneeee BL Manual Técnico. 82 Manual Técnico.........2--..0000++ ceeteseesssverenseereee 82 Manual Técnico. 83 Manual Técnico. 83 Manual Técnico. 84 Manual Técnico. 86 Manual Técnico. 86 Manual Técnico. 87 Manual Técnico. 87 Manual Técnico. 88 Manual Técttico......ccccsceeseessieesesseesseesaneenanees 88. Manual Técnico. 89 Manual Técnico........ - 96 Manual Técnico. 96 Manual Técnico........cs cess ceeseeieseeeseeessteneseeeneees OT Manual Técnico. 97 Manual Técnico... . 98 Manual Técnico... 98IMAGEN 47 IMAGEN 48 IMAGEN 49 IMAGEN 50 IMAGEN 51. IMAGEN 52 IMAGEN 53 IMAGEN 55, IMAGEN 56 IMAGEN 57 IMAGEN 58 IMAGEN 69 IMAGEN 60 IMAGEN 61 IMAGEN 62 IMAGEN 63 IMAGEN 64 IMAGEN 65 Manual Técnico. Manual Técnico. Manual Técnico. Manual Técnico... Manual Usuario. Manual Usuario. Manual Usuario. Manual Usuario, Manual Usuario. Manual Usuario. Manual Usuario. Manual Usuario. Manual Usuario. .. Manual Usuario... Manual Usuario... Manual Usuario, Manual Usuario... Manual Usuario. Manual Usuario. tol 102 102 103 103 104, 104, 105 = 105 106 106 107 . 107 108, 108,GRAFICO 1 GRAFICO 2 GRAFICO 3 GRAFICO 4 GRAFICO 5 GRAFICO 6 GRAFICO7 GRAFICO 8 GRAFICO9 GRAFICO 10 GRAFICO 11 GRAFICO 12 GRAFICO 13 GRAFICO 14 LISTA DE GRAFICOS Pregunta especifica 1 — Encuesta Pregunta especifica 2 — Encuesta Pregunta filtro 3 — Encuesta Pregunta filtro 3 parte 2 — Encuesta Pregunta selecci6n 4 — Encuesta... Pregunta seleccién 4 parte 2 Encuesta. Pregunta especifica 5 —Encuesta. Pregunta especifica 6 — Encuesta Pregunta especifica 7 — Encuesta. Actualizacién automética Pregunta 1 — Validacién.... Pregunta 2 ~ Validacién... Pregunta 3 ~ Validacion.... Pregunta 4 ~ Validacién...TABLA 1 TABLA 2 TABLA 3 TABLA 4 TABLA 5 TABLA 6 TABLA7 TABLA 8 TABLA 9 TABLA 10 TABLA 11 LISTA DE TABLAS Inventario de contenidos deseables Metaforas organizacionales Metaforas funcionales Escenario ficticio 1 Escenario ficticio 2. Escenario ficticio 3. Escenario ficticio 4. Inventario de contenido final Clases. . Recursos necesarios. Ventajas y limitaciones.FIGURA I FIGURA 2 FIGURA 3 LISTA DE FIGURAS Planos nivel superior Disefio detallado de paginas informativas Disefio detallado de subsitios Pag. 50 51DIAGRAMA 1 DIAGRAMA 2 DIAGRAMA 3 DIAGRAMA 4 DIAGRAMA 5 DIAGRAMA 6 DIAGRAMA 7 DIAGRAMA 8 DIAGRAMA 9 DIAGRAMA 10 DIAGRAMA IL DIAGRAMA 12 DIAGRAMA 13 DIAGRAMA 14 DIAGRAMA 15 DIAGRAMA 16 DIAGRAMA 17 DIAGRAMA 18 DIAGRAMA 19 DIAGRAMA 20 DIAGRAMA 21 DIAGRAMA 22 DIAGRAMA 23 DIAGRAMA 24 DIAGRAMA 25 DIAGRAMA 26 DIAGRAMA 27 DIAGRAMA 28 LISTA DE DIAGRAMAS ygrama de clases. Caso de uso —Ingresar al sistema. 50 Caso de uso ~ Material de Descarga. 60 ‘Caso de uso —Materias. 60 ‘Caso de uso ~ Notas. a 61 ‘Caso de uso ~ Estudiante. 61 Caso de uso — Asignalura.....scccecccecccceeesneeneeee 62 ‘Caso de uso — Curso. 62 Caso de uso ~ Matricula... . . 63 Caso de uso ~ Calificaciones 63 Secuencia — Consultar notas. . . . cee OF Secuencia — Consultar material de descarga. Secuencia — Consultar materia. . ‘Secuencia ~ Eliminar material de descarga......... 65 Secuencia ~ Ingresar material de descarga... Secuencia — Ingresar al sistema. Secuencia ~ Modificar material de descarga 67 Secuencia — Consultar estudiante. Secuencia ~ Consultar asignatura. Secuencia — Consultar curso. Secuencia — Consultar matricula... “ Secuencia — Consultar calificaciones Disento logico de base de datos...... Diseiio fisico de base de datos. 70 Interfaces — Principal.........sss000 . a Interfaces — Informativa see TL Interfaces — Login. 2 Terfaces Galera cas seccesrsecencsrenesencnmnxxaseernsecon DDLISTA DE ESQUEMAS Pag. ESQUEMA I Metodologfa de desarrollo. 31 ESQUEMA 2 — Aplicacién del focus group. 115ESQUEMA I ESQUEMA 2 ESQUEMA 3 ESQUEMA 4 ESQUEMA 5 ESQUEMA 6 ESQUEMA 7 ESQUEMA 8 ESQUEMA 9 ESQUEMA 10 ESQUEMA II ESQUEMA 12 ESQUEMA 13 ESQUEMA 14 LISTA DE ANEXOS: Encuesta. Informe de visita Informe de visita. Informe de visita Informe de Visita.........cccesscccceeeeessneseeeeee Especificacién de requerimientos de software. Banco de preguntas de focus group. Ficha de validacién de focus group. Certificado de validacién. Acta de entrega recepcién. Diccionario de Datos. sesseeeeeenneenenneeee Sistema de Notas (Script de ereacion Base de Datos). Acta de capacitacion webmaster y jefe de area informati Modelo entidad relacion sistema de gestion académica....1. INTRODUCCION En la actualidad existe una gran diversidad de tecnologias (TIC’S), las cuales nos permiten llevar acabo un variedad de tareas informativas de gran aleance, utilizando medios electronicos y servicios de red, frente a este incremento de servicios, se han desarrollado una gran cantidad de sitios Web con una arq ctura dindmica y estatica permitiendo cubrir necesidades de informaci6n y facil utilizacién de la comunidad. En virtud del aprovechamiento de las tecnologias las instituciones educativas en especial la educacién media, se encuentra en una biisqueda de nuevos mecanismos que permiten agilizar el intercambio de informacin mediante el uso de un Sitio Web, favoreciendo el acceso a informacin de interés como notas, horarios de clase, ctividades, entre otras. La Unidad Educativa Sagrado Corazones es una institucién dedicada a establecer la enseflanza a nivel basico y medio que requiere poner a disposicion de padres de familia, docentes, alumnos y comunidad en general una Sitio Web y asi poder presentar todos Jos acontecimientos tanto académicos como culturales. La diserta ign se estructura de la siguiente manera: © Seceién 1: Antecedentes del problema de investigacién se detalla el problema a resolver, este contiene la delimitacién del mismo ya que es importante conocer los limites del proyecto, también sus preguntas de investigacién formulando lo mas importante del proyecto, como también su respectiva justificacién que respalde el trabajo a realizarse y demuestre la importancia de este, sus objetivos mencionan a lo que se quiere llegar con el desarrollo del presente proyecto, © Seccién 2: Marco Referencial se toma en cuenta los procesos a trabajar o herramientas, como asi también otras fuentes de informacién que servirdn para adquirir diferentes técnicas para la resolucion del proyecto como tambien el planteamiento de la hipotesis obteniendo. lo més principal que se realizara en la disertaci6n.© Seceién 3: Metodologia de la investigacién esta describe con que métodos de la investigacion se analizara cada parte fundamental del proyecto, tipo de investigacion ya sea cuantitativamente 0 cualitativamente, la poblaci6n/ muestra a que porcentaje de la lo mas dirigida, también las variables e indicadores que indie: poblacion est importante de la hipotesis planteada, las técnicas e instruments de recogida de datos la recopilacion de datos necesarios y verificar la factibilidad, técnicas de anilisis de datos que se obtendra el anilisis de los datos obtenidos. © Seccién 4: Fuentes de Informa {gn tanto bibliograficas y lincograficas de donde se obtuvo referencia de consulta para el presente proyecto.I. PLANTAMIENTO DEL PROBLEMA 2.1. ANTECEDENTES DEL PROBLEMA DE INVESTIGACION La Unidad Educativa Sagrados Corazones del Cantén la Concordia es una instituci6n que brinda el servicio de educacién, en los niveles basico y bachillerato para los habitantes del c: 16n, Esta instituciGn otorga el servicio a personas de bajos y medianos recursos basados en una formacion con valores morales y espirituales. La institucién posee un sistema académico que no satisface sus necesidades actuales, debido a que no cumple con los nuevos requerimientos por parte del Ministerio de Educacién y tampoco cuenta con un medio de comunicacién que le permita una vinculacién directa con sus estudiantes, docentes y con la colectividad. Al ser unos de los colegios de mayor acogida en el sector, se ha visto en la necesidad de incrementar su servicio con un sistema académico de calidad y ponerse a la altura de las, exigencias actuales en la educacién media que establece el gobierno, para asi seguir brindando una educacién de calidad. 2.2. PROBLEMA DE INVESTIGACION Los cambios tecnologicos y la creciente demanda de excelencia en las instituciones, no han dejado al margen la educacién media en el pais, haciendo énfasis en el area de las Tecnologias de la Informacion y la Comunicaci6n (TIC), con el fin de conseguir una comunicacién abierta, ripida, eficaz en procesos administrativos y académicos. Debido a Ja firma del convenio Interinstitucional entre la Universidad Catélica del Ecuador Sede Santo Domingo y la Unidad Educativa Sagrados Corazones del Cantén la Concordia, en vinculacién con Ia colectividad se realizé esta disertacion degrado en dicha institucién 1a cual permitiré una comunicacion dindmica y eficiente, entre la comunidad que la conforma. Después de analizar las causas previamente mencionadas surge la necesidad de la creacion del Sitio Web para dicha unidad educativa, el cual se desarroll6 y disefo con la finalidad de ser una herramienta titil y beneficiar al personal administrativo del plantel, ya que estos son los principales beneficiarios de este proyecto, como también es valioso para los estudiantes, docentes y comunidad del Canton, Para realizar 1a delimitacién de la investigacién se realizé el SRS (Software Requirements Specification - Especificacién de Requerimientos del Software), el cual nos permiti6 recopilar toda la informaci6n, requerimientos del problema a resolver, para asf detallar los limites del mismo con mayor exactitud. (Ver anexo 6). 2.2.1 Preguntas de la Investigacién «(EI Sitio Web cubrira la necesidad de mejorar el proceso de secretaria en la muestra de notas, y la expectativa de generar mayor vinculacién con la comunidad que requiere la Unidad Educativa Sagrados Corazones? © (Elsit Web ayudara a mejorar la calidad de Comunicaci6n de la Us Sagrados Corazones con sus usuarios y personas externas? © Le es beneficiosa a la institucién la adquisicion de una nueva infraestructura tecnolégica considerando 1a fincién que esta tendra en base a las TIC’S? 2.3 JUSTIFICACION DE LA INVESTIGACION Para la unidad educativa Sagrados Corazones se hace imprescindible implementar un Sitio Web, donde permitiré a todas las personas que conforman la comunidad educativa y sociedad en si, apropiarse de las bondades que brindan las tecnologias de la Informacién y Comunicacién, y de esta manera se estimularé a los docentes,estudiantes, personal administrativo y padres de familia a la actualizacion de procesos y capacitaciones que reconozcan el desarrollo del sentido de pertenencia en cada uno de ellos, y asf posicionarse como una entidad educativa eficiente en el ambito tecnol6gico yeneel ambito organizacional, lo cual se lograra a través de la visualizacién de notas de los estudiantes. Al implementar este proyecto 1a unidad educativa no solo fortalecera su posicién sino que también incrementara la aceptacion de la comunidad al brindar un servicio mejorado de tecnologia para sus alumnos y para la colectividad, siendo los beneficiarios directos los estudiantes, personal administrativo, docentes y la sociedad en si. Una parte relevante del proyecto es llegar a conocer y comprender las nuevas tecnologias de la informacién y las consecuencias de estas, teniendo en cuenta la utilizacion adecuada de los recursos informéticos de comunicaci6n existente, agilizar procesos académicos que ayuden en el ambito pedagégico y fortalecer las habilidades y destrezas de los docentes, los alumnos y comunidad en si pudiendo tener mayor conocimientos de los procesos, proyectos y actividades que ocurren en Ia Institucion aplicando la comunicacién interactiva, Debido a la importancia de este proyecto y a todas las cualidades que este redne ha generado los siguientes impactos para la Unidad Educativa: Tecnolégico: Debido a que la Unidad educativa no consta con un Sitio Web, podré brindar a sus estudiantes, docentes una herramienta de interaccién que permita el uso de la ituciGn. ies y brinde un crecimiento tecnologico para la ins Social: El Sitio Web permitiré incrementar la vinculacisn con la colectividad el cual es unos de los intereses de la Unidad Educativa con este proyecto y asi fortalecer su nivel de aceptacién en la regién, Educativo: La implementacién del sitio web incentivara al personal docente a actualizarse en el uso de las ti de esta manera se ereara una cultura y educacién tecnoldgica en la Unidad educativa a través de su funcidn de visualizacién de notas y correo institucional.Ecoldgico: Tomando en cuenta que el sitio consta con un correo institucional y correo institucional, los cuales evitaran la impresi6n de material académico y entrega de tareas, y de esta manera cumplir con una de las normas del buen vivir que es el no uso de papeles 2.4 OBJETIVOS DE LA INVESTIGACION 2.4.1 Objetivo General Disefiar y desarrollar un sitio web para 1a unidad educativa Sagrados Corazones del in La Concordia en el afio 2013 2.4.2 Objetivos Especificos © Obtener los requerimientos funcionales, alcance y demas pardmetros del sitio web mediante la elaboracion del SRS. © Analizar, diseiar y administrar de una manera adecuada la arquitectura de la informacién, © Desarrollar el sitio web en hase a los reque © Realizar las pruebas del sitio web en linea, © Realizar la entrega del sitio web con su manual técnico y de usuario. 2.5. FASE DE VIABILIDAD La Unidad Educativa tiene como objetivo brindar un servicio de eficacia y excelencia en el Ambito académico, inculeando valores educativos ¢ interpersonales. Con Ia finalidad de promover y dar conocer las diferentes actividades de la instituci6n se decidié impulsar Ja creacion de un sitio web que incluy6 las siguientes funcionalidades:© Publicar contenido institucional relacionado con su estructura, organizacién y objetivos, ‘© Mostrar la informacion de actividades o proyectos realizados en la institucion, © Ofrecer la opci6n de_presentacion de notas de cada alumno a través de la web y el ahorro de recursos. © El sitio Web en su arquitectura ser4 compatible con los principales navegadores de internet (Mozilla Firefox, Internet Explorer, Opera, Safari, Google Chrome), todos los contenidos se almacenaran en una Base de Datos. 2.6 FASE DE FACTIBILIDAD La instituci6n cuenta con varios equipos de computacién, de igual manera consta con servicio de internet, con lo cual el Sitio Web fue téenicamente posible y tambien implica una serie de costos que son reflejados en la movilizacién para toma de requerimientosy pruebas, suministros de oficina, servicios basicos, equipos de computacisn, software para el disefto y desarrollo del sitio web. 2.7 HIPOTESIS El desarrollo del Sitio Web como gufa a las bondades que brinda la tecnologia ayudar a la Unidad Educativa Sagrados Corazones en la gestion académica especifica de visualizacién de notas y vinculacién con la colectividad.TI. MARCO REFERENCIAL 3.1. BASE DE DATOS. BDD, es la agrupacién de datos organizados y relacionados entre si, los cuales son recolectados y explotados por los sistemas de informacion de una empresa © negocio en particular. Las bases de datos se organizan por campos, registros y archivos. Un campo es un punto Gnico de informacién, los registros son campos completos del sistema, y un archivo es una amplia coleccién de registros. Las caracteristicas relevantes de una base de datos son: © Acceso concurrente por parte de multiples usuarios. © Independencia ldgica y fisica de los datos. © Redundancia minima. © Integridad de los datos. © Consultas complejas optimizadas © Seguridad de acceso y auditoria, © Respaldo y recuperacién, © Acceso a través de lenguajes de programacian estandar. 3.1.1. Componentes de una Base de Datos © Hardware: Es todo lo tangible para el usuario, como dispositivos de almacenamiento, ejemplo: discos, tambores, cintas, entre otros. © Software: Es el sistema que administra la base de datos como procesos, datos ¢ informacién ejemplo: Oracle, MySQL, entre otros.# Datos: Estan almacenados de acuerdo a la estructura externa y serdn procesados para. convertirse en informacién, 3.1.2. ‘Tipos de Usuarios de Base de Datos © Usuario Final : Es aquel que utiliza los datos que ya son convertidos en informacion. © Desarrollador de Aplicaciones: Se encarga de desarrollar los sistemas que interactian con la Base de Datos. © DBA (DataBase Administrator / Administrador de Base de datos): Se encarga de asegurar Ia integridad, redundaneia y consisteneia de los datos, un DBA también ejecuta el mantenimiento y control de la Base de datos. 3.1.3. DBMS DBMS (DataBase Management System / Sistema de Gestion de Base de Datos), es el conjunto de programas que permiten crear, administrar, mantener la informacién y estructura de una base de datos, manteniendo su integridad, seguridad confidencialidad. Un DBMS permite: © Definir la base de datos: especificar estructuras, tipos y restricciones de los datos. © Construir la base de datos: almacenar Jos datos en un ambiente controlado por el mismo DBMS. © Manipular Ia base de datos: realizar ingresos, consultas, eliminar datos y generar reportes.10 Caracteristicas de un DBMS © Control de Redundancia: Evita la duplicacién de datos (lo cual trae efectos negativos como: desperdiciar espacio en disco, inconsistencia de datos). © Restriccién de accesos no autorizados: Permite tener a cada usuario con sus respectivos permisos de acceso y autorizacién. ‘© Cumplimiento de las restricciones de integridad: El DBMS debe ofrecer recursos, para definir y garantizar el cumplimiento de las restricciones de integridad. 315. DDL DDL (Data Definition Language / Lenguaje de Definicién de Datos), es un lenguaje autificial que sirve para organizar de forma interna una base de datos, define y describe Jos objetos 1a misma, su estructura, restrieciones, relaciones. Sus principales instrucciones son: CREATE, ALTER, RENAME, DROP, TRUNCATE, DML DML (Data Manipulation Language / Lenguaje de Manipulacién de Datos), es un lenguaje artificial de cierta complejidad que permite la manipulacién, manejo, procesamiento de los datos existente en una base de datos, a través de cléusulas, comandos, operadores légicos, operadores de comparacié: son: SELECT, INSERT, UPDATE, DELETE. nn sus principales instrucciones DCL DCL (Data Control Languaje / Lenguaje de Control de Datos), es un lenguaje proporeionado por el DBMS que se utiliza para la creacion de roles, permisos y para la seguridad integral de los datos, permite controlar el acceso a la base de datos y dar seguridad a los objetos de esta. Sus comandos son GRANT, REVOKE, COMMIT, ROLLBACK.uw 3.2. SOFTWARE Seguin la definicién del IEEE, computadora, procedimientos, reglas, la documentacién asociada y los datos que ‘oftware es la suma total de los programas de pertenecen a un sistema de cémputo”. Segiin el mismo autor, "un producto de software es un producto disefiado para un usuario” (Lewis, 1994). 3.2.4. Ingenieria de Software “Ingenieria de software es la creatividad actividad de entender el problema de la empresa que viene con una idea de solucisn, y el disefio de los "planos" de la solucién”, (IvanMarsic, Rutger, 2012). 3.2.1.1. Ciclo de Vida Ingenieria de Software Para realizar un software, es necesario seguir un conjunto de actividades las cuales nos permitan Ilevar cl desarrollo del mismo de una manera ordenada, detallada y controlada, aeste conjunto de actividades se las denomina ciclo de vida del software, el cual tiene las siguientes fases: © “Especificacin de Requisitos Comprensi6n de los escenarios de uso y derivar el modelo de dominio es © Disefio Asignacion de responsabilidades a objetos y especificar dindmica detallada de sus interacciones en diferentes escenarios de uso © Implementacion Codificacion del disefto en un lenguaje de programacion, © Pruebas Clases / componentes individuales (pruebas unitarias) y todo el sistema (integracion pruebas).2 © Operacién y Mantenimiento La ejecucién del sistema, corrigiendo errores y afiadiendo nuevas caracteristicas.” (IvanMarsic, Rutger, 2012) El ciclo de vida tiene varias formas de realizarse como por ejemplo en cascada, espiral, en V y ottos mas. (Ver imagen 1 y 2). Tragen:Vodso cascode Fuerte tosautres Tragen:Vodeo cipral Fuente hrip//modelespreblogspot.com/ El objetivo es producir el sistema segtin las especificaciones del documento, que es una copia exacta de la descripcién de lo que se va a hacer en el sistema planificado.B El anilisis de requerimientos delimita el sistema y especifica los servicios que ofrece, se identifican los tipos de usuarios que van a interactuar con el sistema e sistemas que interactian con el nuestro requisites. 3.2.1.2. Diagramas UML Son la representacién grifica de un sistema, los cuales nos permiten tener una vision detallada, clara y téenica del mismo. Permitiendo documentarlo y posteriormente desarrollarlo correctamente. 3.2.1. Diagramas de Clase Es la representaci6n de un conjunto 0 agrupacisn de clases, interfaces, colaboraciones y relaciones que representan a un disefto estatico del sistema. (Ver imagen 3). fron Tinagansfpnple de arama dase Fuente Lor autres 3.2.1. Diagrama de Caso de Uso Son las representaciones de un conjunto de actores y de escenarios con sus relaciones, que permite organizar y modelar el comportamiento del sistema desde el punto de vista de sus interacciones en el exterior y sin entrar en la parte de la descripeién detallada Estos diagramas son utilizados en la recogida y documentacién de requisitos. (Ver imagen 4 en pagina siguiente).4 Tre empl deTgraa canes deus BAS. Diagrama de Secuencia Estos diagramas representan un grado cronologico de Ia interaccion entre objetos, es muy importante que no exista ninguna interrupcién entre los eventos de una continuidad, ademas demuestran los aspectos dinémicos de un sistema, cada objeto del diagrama esta representado con una linea vertical, correspondiente al eje del tiempo. (Ver imagen 5). We cee eer) Fay a15 3.3. LENGUAJE DE PROGRAMACION Es un Ienguaje o idioma artificial que esta definido para ser expresado 0 Tlevado a cabo por maquinas (computadoras). Estos lenguajes son usados para la creacién de programas, en si esté formado por un conjunto de simbolos y reglas sintécticas y semanticas, las cuales estructuran el significado de cada elemento y expresin dada, Estos cumplen un determinado niimero de procesos que se escriben, se prueban, se depuran, compilan y por ultimo se mantiene el mimos cédigo fuente a todo este conjunto se le denomina programacisn, Una caracteristica importante en el lenguaje de programacién es que una cantidad infinita de programadores pueden usar un sin niimero de instrucciones que sean entendidas y analizadas por ellos para tener una construcci6n y gufa colaborativa, 33... HTML Es un lenguaje de marcado de hipertexto donde se hace énfasis en elaboracién de sitios web, donde su utilizacién es la traduccion y descripcién de casi toda la informacién en un texto, como también la agregacién de imagenes. HTML tiene una presentacién de forma de etiquetas (<,>) que viene a estar definido desde el inicio del documento con su respectivo cierre HTML se mantiene siempre en un constante desarrollo para aleanzar todos los estindares o demandas que da el crecimiento del Internet. La ereacion de sitios web utilizando dicho lenguaje va de la mano de Java y JavaScript. (Ver imagen 6 en pagina siguiente).16 33.2, PHP Es un lenguaje de programacién interpretado PHP (Hipertexto Pre-Procesador), disefiado originalmente para la creacién de sitios web. Es usado principalmente en la interpretaci6n del lado del servidor, pero actualmente puede ser utilizado desde una interfaz de linea de comandos o en la creacidn de otros tipos de programas incluyendo aplicaciones con interfaz grifica. Es denominado de alto nivel, especialmente utilizado para desarrollos web y el cual puede ser aiiadido en paginas HTML. La mayor parte de su sintaxis es similar a C, Java y Perl. El objetivo de este lenguaje es permitir a los desarrolladores elaborar sitios web de una manera rapida y facil. 3.3.2.1. Caracteristicas de PHP © Orientado al desarrollo de sitios web con acceso a informacién almacenada en una base de datos, © Es un lenguaje facil de aprender, ya que se simplificaron distintas especificaciones como la definiciGn de las variables primitivas.v © Una capacidad de conexién en la base de datos que se utilizan en la actualidad (MySQL y PostgreSql) © Capacidad de expandir su poteneial utilizando modulos. © Pose una amplia documentacion en su sitio web oficial, entre la cual se destaca que todas las funciones del sistema estin explicadas y ejemplificadas en un tinico archivo de ayuda. * Bs libre, por lo que se presenta como una alternativa de facil acceso para todos. © Permite aplicar técnicas de programacién orientada a objetos. Incluso aplicaciones como Zend Framework, empresa que desarrolla PHP, estan totalmente desarrolladas mediante esta metodologia. 3.4. ARQUITECTURA DELA INFORMACION Es una disciplina que nace despues de ser definida por Richard Saul Wurman en 1975, en su libro denominado “Information Architects” (publicado al afto siguiente) En el cual determina que le arquitecto de la informaci6n es la persona que se encarga de organizar la informacién y sus patrones, haciendo a estos entendibles, Para definir a la Arquitectura de la informacién podemos afirmar que es una disciplina que se encarga del disefio y estructura de los sistemas de informacién, teniendo como esfuerzos principales la organizacién, recuperacién y presentacidn de toda la informacion que se emplee en estos, a través del disefto de entornos atractivos y de fail comprensién para el usuario. 3.4.1. Componentes de la Arquitectura de la Informacion. © Organizacion La organizacién se divide en dos: exactas y subjetivas. Las exactas son aquellas que se pueden interpretar de una sola forma, estan pueden ser de forma alfabética, cronol6gica y geogréfica18 Las subjetivas son basadas en varios criterios que son los temiiticos, funcionales, audiencia especifica y la metaforica. # Navegacion La navegaci n es parte importante en el disefio de una pagina web, para obtener una mejor usabilidad y accesibilidad. Se brinda al usuario las opciones de subir, bajar, desplazarse de un lado a otro, regresar y avanzar a diferentes lugares del sitio con el menor esfuerzo posible, esto brindara una cierta comodidad al usuario. Se puede dividir en navegaciones globales, locales y ad hoc. © Rotulado El rolulado es el sistema con el cual se identifica a los elementos de la pagina web, es una de las formas para representar la informacién, puede ser como: enlaces, iconos, encabezados, cumpliendo un papel muy importante al momento de indizar el documento, # Sistema de Biisqueda El sistema de busqueda permite encontrar de una menara facil y répida la informacién al usuario, Para la implementaci6n de esta metodologfa se deben realizar un numero de planos, metaforas y escenatios. 3.5. PROTOCOLOS Un protocolo es un método establecido por el cual dos ordenadores o puntos de red cuerdan comunicarse © intercambiar datos, al mismo tiempo se puede dar una especificacién que describe cémo los ordenadores hablan el uno al otro en una red, 3.5.1. IP (Intérprete de protocolo) interpreta el protocol y permite que el DTP pueda ser controlado mediante los comandos recibidos a través del canal de control. Esto es diferente en el cliente y el servidor: En esta configuracion, el protocolo indica que los canales de control deben permanecer abiertos durante la transferencia de datos,19 3.5.2. Servidor Web Programa informitico que trabaja del lado del servidor, realiza conexiones bilaterales, unilaterales, sincronas y asincronas con el cliente cediendo de esta manera cualquier peticion que se haga en cualquier lenguaje de programaci6n por el mismo. Las lineas de codificacin recibidas por el cliente pueden ser compiladas con un navegador web. Para la transmisién de los datos se utiliza un protocolo. 3.6. INTERNET Es el conjunto de redes de comunicacién interconectadas, las mismas que utili an protocolos para su funcionamiento, esto garantiza que las redes heterogéneas que la componen funcionen como una sola red I6gica. 3.6.1. www Conjunto de documentos de hipertexto relacionados entre si que pueden ser manipulados en la internet mediante un navegador web. 3.6.2. Sitio web Un Sitio Web es un conjunto de paginas web que se encuentran relacionadas © vinculadas en una misma direcci6n o un mismo dominio, Los Sitios Web son estaticos o dinamicos: Los Sitios estiticos son aquellos que su informacién no puede ser cambiada. Los Sitios dindmicos son aquellos que su informacién puede ser cambiada constantemente a través de una peticion recibida. Los Sitios Web se ejecutan a través de un software especializado que se denomina Navegador Web. (Ver imagen 7).20 Tagen sto we Fuente: hip? rwucomerdolamaiaom/dsene paginas web 3.6.2.1. Funcionamiento Una pagina se ejecuta en el servidor web, justo antes de que se envie la pagina a través de Internet al cliente. Las paginas que se ejecutan con el servidor pueden realizar conexiones con Ia base de datos y otras tareas adicionales para crear una pagina final dinamica, Los procedimientos para el funcionamiento son: © Peticidn del Sitio web al servidor. © EI servidor Hama al intérprete de PHP si es necesario, este retine la informacién necesaria, © PHP ejecuta los scripts (consultando a la base de datos 0 a otras paginas web). © El servidor responde enviando una pagina web (estética), pero su creacién ha sido dindmica. (Ver imagen 8 en pagina siguiente).21 IMAGEN 8: Funcionamiento pignest plea win _—, TinagensTuncianariona web Fuente: Lor autores in requerida para realizar un procedimiento mediante una aplicacidn cliente a la cual tenemos acceso. Un host debe tener una direccién IP y un nombre como todo computador conectado a internet. 3.6.4. Dominio Sistema de denominaci6n de host, esta formado por un conjunto de caracteres que identifican a un sitio de red accesible por el usuario. Seguridad De Sitios La seguridad web tiene como punto primordial la protecci6n de amenazas de internet, mediante las caracteristicas de visibilidad de las aplicaciones ayudard a gestionar los riesgos inherentes a las aplicaciones que acceden a la nube desde el lugar de trabajo, también e indo la filtracién de informacién personal 3.6.6. Seguridad en Tecnologias del Sitio Web La seguridad adquiere una confidencialidad, integridad y disponibilidad teniendo en cuenta las medidas de seguridad ya que su principal eliminacién 0 reduccién es la22 vulnerabilidad de la piigina como identificacion y autenticaci6n de usuarios, control de accesos, control de flujo, confidencialidad, integridad, auditor 3.6.7. Disefio de Politicas de Seguridad de El Desarrollo de la pagina web seria confiable respecto a una determinada politi seguridad, si ofrecen un mecanismo de protecei6n capaz de cumplir con los requisitos de seguridad impuestos por dicha politica. (Ver imagen 9). TagensSoqundad web Fuentes ot outoree 3.7. JOOMLA Es una herramienta muy eficaz en lo referente a la creacion de sitios web elegantes, dinamicos e interactivos. Por su modelo y flexibilidad y sus grandes posibilidades de aplicacion esta se ha convertido en un sistema privilegiado en muchos centros educativos y en web masters para el desarrollo de su portal web. Con Ia herramienta JOOMLA en poco tiempo se_creard un sitio web ya sea para un centro educativo © para una empresa, donde se podra publicar noticias, novedades, blogs, directorios de enlaces 0 documentos de descarga sin tener un maximo conocimiento en este ambito. (Ver imagen 10 en pagina siguiente).23 BY Joomla! open source $ Foote beeches eriemizakes hls nordresscon/ 2012/1 Voom 3.7.1. Funcionamiento de JOOMLA En el gestor de la base de datos, es donde se guarda toda la informacion y la mayor parte de la configuracidn del sistema Los scripts PHP: son aquellos que ejecutan acciones de consulta y realizan modificaciones en la base de datos convirtiendo Jos datos en simples paginas web. (Ver imagen 11). Tian: Fonclonariante de Teoma Fuente: Lov autores24 3.7.2. K2 Extensién de JOOMLA con caracteristicas CCK, que brinda soluciones fuera de la caja integrada permitiendo mejorar la apariencia de los articulos, categorfas y formas de los usuarios.IV. METODOLOGIA DE INVESTIGACION Conjunto de procedimientos ordenados que se siguen para la obtencién de un objetivo specifico basado en un fin cientifico, los cuales nos permitirén demostrar, aprobar, dicho conocimiento o investigacion. 4.1, TIPO DE INVESTIGACION 4.1.1. CUALITATIVA Se refiere al manejo de datos no estructurados, que se_basa de entrevistas 0 archivos de audio y video, 0 con notas de campo u otros documentos para lograr una comprer experiencia e ilustracién de los temas. 4.1.1.1. INVESTIGACION DE CAMPO Consiste en el proceso de andlisis directo en el campo real obteniendo nuevos conocimientos, encontrando las necesidades y problemas a estudiar mediante la observacién, cuestionario y entrevista. La investigacién se realiz6 con visitas periédicas a la Unidad Educativa Sagrados Corazones para recolectar toda informacién necesaria y de esta manera obtener todos los requerimientos favorables para el desarrollo de dicho sitio web. 4.1.2, CUANTITATIVA Se enfoca en examinar todos los datos en una forma numérica con la ayuda de las herramientas de campo como encuestas, para de esta manera minimizar todos los posibles errores, Se aplico la encuesta a los estudiantes, administrativos y docentes de la Unidad Educativa y posteriormente se realizé la tabulacién de las _encuestas. 2526 4.1.2.1 INVESTIGACION APLICADA Consiste en la utilizacion y aplicacion de cada uno de los conocimientos que se obtiene y depende del alcance y resultados que tenga la investigacién que sea de manera til para el investigador. Esta fase se aplicé con investigaciones, précticas y Ia tecnologia que nos guie a la resolucion del problema planteado, con una descripcién mais precisa de ciertos rasgos de la realidad que especifiquen las propiedades y muestren los origenes y las causas del problema. 4.2. METODOS DE INVESTIGACION En la disertacién se emple6 los siguientes métodos y técnicas de investigacion que se describen a continuacién, 4.2.1. METODO ANALITICO-DEDUCTIVO El Método Anal co es el anilisis de los elementos y partes para poder observar las causas y los efectos permitiendo conocer su funcionalidad en cada una de ellas explicando sus analogias y comprendiendo el comportamiento que realiza, El Método deductivo va de lo general a lo particular es aquel que parte de los datos generales, a una aplicaci6n individual y a su vez comparar su validez, en otras palabras aplicando el resultado de la induccién a nuevos casos de deduccién. Aplicacién: El_método permitira obtener informacisn referente al Sitio Web en el que se trabajard, descomponiendo y diferenciando detalladamente los problemas que se nas conformando un todo encontraran_ y asi poder analizar y adquirir soluciones 6p que de esta manera poder llegar a aleanzar todos los objetivos planteados.V. METODOLOGIA DE DESARROLLO Para el desarrollo de esta disertacion de grado debido a su temitica se tuvo que aplicar dos diferentes ramas de la ingenieria de sistemas como son: Arquitectura de Informacion ¢ Ingenieria de Software Para la parte de disefio y estructuraci6n del Sitio web y su informaci6n se utilize Arquitectura de la Informacién, aplicando parte de esta disciplina se realiz 5.1. INVESTIGACION Se realizaron encuestas orientadas a los diferentes usuarios que el sitio web tiene como son docentes y alumnos, aplicando una muestra para la correcta aplicacién de esta, obteniendo como resultado valiosa informacién para el diseito y desarrollo del sitio. (Ver anexo 1, Encuesta). 5.2. ARQUITECTURA DE LA INFORMACION 5.2.1. Inventario de Contenidos Deseables Debido a que la Unidad Educativa es parte de una congregacién mundial se realizé una investigaci6n previa de los contenidos de interés para una guia a las autoridades. Posteriormente se realizé una entrevista con i autoridades para ver las necesidades y expectativas y asf se detallé un inventario de contenidos que se desea tener en el sitio web. 5.2.2. Disefio Conceptual Obtenida 1a informacion sobre los contenidos deseados a implementar en el sitio web, se realiz6 el andlisis del disefio conceptual, teniendo en cuenta que debe ser de facil entendimiento por lo cual se analiz6 y utilizo metéfora organiz cionales, funcionales y 2728 textuales, De igual manera para tener una idea mas detallada sobre la funcionalidad del sitio se desarrollaron escenarios para los usuarios y finalmente se di 6 un plano de nivel superior el mismo que permite detallar la estructura del sitio. 5.2.3. Maqueta de la arquitectura de las paginas Si bien es cierto los planos son de vital ayuda para el desarrollo y diseito del sitio web, no es asi para todas las personas debido a que no son tan directos por esta razén se realizo un esbozo del disefto que detalla la estructura grafica que tendran las paginas, 5.2.4. Produccién y Operacién Antes de empezar esta etapa se coordiné todos los aspectos técnicos, de informacién y diseno, se realiz6 los Ultimos planos detallados del sub-sitio que permitio observar la estructura general que tendran los dos tipos de sub-sitios que existen en el sitio como son los informativos y los de intranet. 5.2.5. Inventario de Paginas Web Finalmente luego de analizar, organizar, disenar y desarrollar el contenido del sitio web se obtuvo el inventario final de este, Debido a que la disertacién de grado no es solo informativa se aplicé también conocimientos de ingenieria de software para el andlisis disefio y desarrollo de la parte de software que existe en esta. La Metodologia utilizada para Ia parte de ingenieria fue la de Prototipos debido a que esta nos permite tener una interaccién continua con el cliente en este caso las autoridades de la Unidad Edueativa Sagrados Corazones. Esta metodologia se la implement realizando 4 etapas que permitieron un ordenado y detallado desarrollo del sitio web en su parte funcional.29 5.3. INGENIERIA DE SOFTWARE 5.3.1. Anali: Se aplicé una encuesta a los estudiantes, docentes y administrativos de la Unidad Educativa Sagrados Corazones de la cual se logté obtener valiosa informacién para el desarrollo del sitio, de igual manera de realiz6 Ia toma de requerimientos a través del desarrollo del SRS. 5.3.2. Diseiio Ya obtenido los requerimientos se empez6 a diseffar la parte funcional del sitio web como es la base de datos, Visualizacién de notas a través de los diagramas: disefio ldgico de base de datos, diagrama de clases, casos de uso, diagramas de caso de uso, diagrama de secuencia. 5.3.3. Desarrollo Una vez elaborados Jos diagramas se empez6 a desarrollar el sitio web y sus componentes como fue la base de datos obteniendo el modelo fisico de esta, de igual manera en el transcurso de esta etapa se tuvo reuniones con las personas encargadas de la unidad educativa para conocer si era de su agrado y si habia que realizar modificaciones obteniendo como resultado final el sitio web. 5.3.4. Implementacién y Pruebas Se realizaron las pruebas internas del funcionamiento del sitio web, posteriormente se realiz6 el upload en el hosting adquirido y se efectuaron las prueba in situ ya en la web, finalmente para concluir la implementacisn se realiz6 la entrega del sitio web a las autoridades de la Unidad Educativa eon sus respeetives Manuales Técnico y de Usuario.30 5.4. VALIDACION En Ia Validacién del sitio web se realiz6 un tipo de entrevista denominado Focus Group, se realiz6 en las instalaciones de la Unidad Educativa teniendo como integrantes a 3 personas (director académico, docente y administrativo), Se realiz6 una explicaci6n del sitio web a los integrantes del focus group los mismos se encontraban ubicados cada uno en una computadora para poder divisar y utilizar la misma, posteriormente se inicio el focus group con los 3 miembros y su presentadora, En esta reunion se manifestaron los iterios de cada uno de los integrantes basindose en un banco de preguntas que la presentadora realizaba obteniendo resultados cualitativos, para la obtencin de datos cuantitativos se entregé a cada uno una ficha con preguntas para calificar ciertos aspectos del sitio web. Finalmente se pudo determinar los impactos que el sitio web ha generado para la Unidad educativa,an Ua celslol Rotel La cL ele) proceoimento |} btenerinomacin de @- i mesticacion = — ‘lente através ce serbia y ones Visiar Unidad Eaucatva r Prequnias para conocer: FRealzarenirevistas, Reale encuestas (procenos “actvidases ; labora S25 provedimientos requerimentos) Le ARQUITECTURADELA | raizar, Otofery Detnbuir INFORMACION, cee anes sce F inventaro de Contenides Desoablos F Disero conceotua [ Magueta do a arqutectura ce Paginas——+ Esboz0 de diseho F Produce y Operacisn a Ty Rremecon y Qpetacién ——_,ptanos detalados de arqutectura Metals Organtacionales Motaioras Funconalee Mainforas Texto Eseonarios Plancs Niel Susenor INGENIERIA DE Ana, iota ydesorotr coseos @ Nsortware la docuntatnyrntdoe de Nets, Dagrama de Cases estes Case de Use agra de Casoe de Uso — Cage de Sectrora peas rose Tigeo tse oe 02s F Bsero F Sesarrato [ implomertacién y Pracbae Dison Fiscn de Base de datos Disgrama de iterfaces 5 Subida de Sito web Manual Tecnico Erivega ce documentacion Manual Usuario Artes co entesee __, suave © —svativacion “Sees” ccue grouse 9 U Hojas, Estéros, Lapis, Borstores , 8 Libros, Foletos, Revistas “~ DOCUMENTOS Y ENSERES See PO, MAG, Flash Memory Cémaras otogrfcas,Tipede+— MAQUINAS V EQUIPOS. ‘Adobe: lustraor, Photoshop! Mscroaot: Word, Excel | 1 Joomis «— PLATAFORNAVI. RESULTADOS 6.1, INVESTIGACION 6.1.1. Introduccién A continuacién se dari a conocer el resultado de Ia investigaci6n realizada, con la finalidad de fortalecer y sustentar el disefio y desarrollo del sitio web. Se utilizé dos tipos de tenicas, para la parte cuantitativa se realiz6 la encuesta y en la parte cualitativa se realiz6 la entrevista. La investigacion se realiz6 en la provincia de Santo Domingo de los Tsdchilas en el cantén La Concordia, en la Unidad educativa Sagrados Corazones institucién con la cual la Pontificia Universidad Catslica del Ecuador sede Santo Domingo tiene un convenio interinstitucional con la finalidad de fortalecer su vinculacién con la colectividad, a través de este se dio paso a esta disertaci6n. Los resultados obtenidos son favorables, debido a que se muestra un alto porcentaje de viabilidad y aceptaci6n para el desarrollo del sitio en la institucién, 6.1.2. Propésito y Procedimiento La investigacién tiene como finalidad determinar la viabilidad que tiene el desarrollo del sitio web, también determinar los elementos a utilizar en el disefio del mismo. Los datos necesarios sobre niimero de alunos, docentes y personal administrative se obtuvieron de la Unidad Educativa, Otras técnicas metodolégicas son la encuesta, y entrevista para lo cual se realizé un banco de preguntas especificas para la encuesta y para la entrevista, las preguntas se basaron en tres aspectos fundamentales: informacién y diseio, Usabilidad y funcionalidad, Software. 6.1.3. Obtencidn de la muestra Debido a que la poblacién de esta disertacién son alumnos, docentes y administrativos y es una poblacién cuantificable o finita se aplicé para la obtencién de la muestra la siguiente formula en estos tres segments. 3233 - Formula n= el tamaito de la muestra, N=tamatio de la poblacién. o = Desviacién estindar de la poblacion que, generalmente cuando no se tiene su valor, suele utilizarse un valor constante de 0,5. Z= Valor obtenido mediante niveles de confianza = Limite aceptable de error muestral su valor que varia entre el 1% (0,01) y 9% (0.09), valor que queda a criterio del encuestador. - Aplicando para alumnos Poblacion: 256 alumnos 256(0,5)7(1,96)? ™* @56— 1005) + (,5)°U1, 96)" Resultado: n=154 alumnos - Aplicando para personal administrativo Poblacién: 14 - Aplicando docentes Poblaci6n: 24 6.1.4. Encuesta Se aplicé las encuestas al personal administrativo, docente y alumnos de la Unidad Educativa para obtener informacion sobre la misma, referente a su aceptacion y is. (Ver funcionalidad que esta deberia tener, siendo fundamental para el posterior an anexo 1, Encuesta)34 Estructura de la Encuesta Marque con una X segiin corresponda: Ie 3. Jestis? {Qué relacién tiene usted con la Unidad Educativa Sagrados Corazones de (Paced | Alumno Docente Administrativo Qué tan frecuente accede usted en internet? Diariamente 2 veces a la semana I vez ala semana Casi nunca ge gustaria a usted que la Unidad Educativa incremente un Sitio Web? s Ow a En el caso de responder sia la pregunta anterior seleccione de las siguientes opciones que le gustaria que tuviese el portal Vista de Notas Zona de descarga de material (para mejora del aprendizaje) éConoce usted sobre el uso de las TICS (Tecnologias de la informacion y la Comunicacién)? \st NO En caso de responder si en la pregunta anterior seleccione de las siguientes opciones cuales conoce. [Base de Datos35 Programas de Presentacién (Power Point, Prezzi, EducaPlay) [Jeorreo Eleetrénico Espacio Web Hojas de Célculo (Excel) 5. 2En la Unidad Educativa existe alguna plataforma o alguna herramienta que incentive al uso de las TIC? — + SL INO 6. ge gustaria que se utilice el Sitio Web en parte como una plataforma educativa para incrementar el uso de las TIC en el plantel? SL No 7. gEn relacién a la Colectividad como crees que un sitio web ayudaria al plantel? [Bato MEDIO ALTO [Muy acto Se hha estructurado a la encuesta con diferentes términos para diferenciar a cada una de las preguntas, esto ayuda a mantener un orden especifico al momento de su realizacién, La estructura se refiere al grado en que las preguntas y posibles repuestas son formales y estandarizadas (preguntas establecidas de antemano, en un orden, offecen opciones de respuesta). La clasificacidn es la siguiente: - Cuerpo de estudio Forma de la encuesta, - Pregunta filtro Realizada previamente a otra pregunta con el fin de eliminar aquellas personas que no les afecten determinadas preguntas, es decir, marcan la realizacién o no de preguntas posteriores. - Pregunta especifica Se refiere « un tema concrete.36 - Pregunta de seleccion El encuestado tiene que seleccionar una o varias opciones de respuestas. 6.1.4.2. Tabulacién y Anilisis Estadistico de la Encuesta {Qué rela n tiene usted con la Unidad Educativa Sagrados Corazones ? Tee wALUMNO mDOCENTE WADMINISTRADO R ‘Gree: Pregunia 1 dela rsa Puente: Unthad Edestiva Sogrados Coraeones de ess © Aniilisis: Se puede observar en los resultados que del total de nuestra muestra encuestada la mayoria de nuestro ptblico objetivo son estudiantes, y que también consta de un ngimero de personal administrative y docente, por lo cual podemos determinar que la disertaci6n esta correctamente enfocada con sus objetivos y servicios a prestar. (Ver grafico 1).37 2. {Qué tan frecuente accede usted en internet? unta Es 1 Dramente 7 vermis seman (a2 veces ls seman Reenter Unidad ducati SogrodesCvarooe de es © Anilisis: Segdin los resultados se puede determinar que tres cuartas partes de nuestra muestra acceden a internet diariamente, por lo tanto es factible que el sitio web sea utilizado con mucha frecuencia debido a la capacidad de acceso que se tiene. (Ver gréfico 2). 3. gLe gustaria a usted que la Unidad Educativa incremente un Sitio Web? rate Sala Foca Ilda FaucarsSagradoeConczonee de esis En el caso de responder si a la pregunta anterior sele ‘one de las siguientes opciones gue le gustaria que tuviese el portal38 ured En Meee ‘correo insttuconal avista de Notes Midescarge de material ‘Gedicas Pegunts la Beast = © Anilisis: La muestra desea que la unidad educativa cuente con un sitio web y sus expectativas son que los servicios principales que otorgue sea correo institucional y vista de notas, con este resultado se refarzara los servicios del sitio web. (Ver grdfico 3 y 4). 4. {Conoce usted sobre el uso de las TICS (Tecnologias de la informacion y Comunicacion)? Soe Front: linda Eaves grades Conarones de ose En caso de responder si en la pregunta anterior seleccione de las siguientes opciones cuales conoce.39 uc ee eee espacio Web Gatco Pegs ae Eacune Poort Unbod Ewan Sagrado Covasones de © Aniilisis: Mas de la mitad de los encuestados conocen sobre las TIC, lo cual es una gran ventaja para la utilizaciGn del sitio web debido al enfoque tecnolégico que es el incentivar el uso de Jas mismas en la unidad educativa, a través de sus servicios principales como, visualizacién de notas y correo electrénico instituci nal. (Ver grafico 5 y 6). 5. {En la Unidad Educativa existe alguna plataforma o alguna herramienta que incentive al uso de las TICS? Gade Peon Ta ae ener Unda ec Seadoo dees40 © Anilisis: Como se puede observar en Ia pregunta 3 y en esta pregunta, existe una confusién por parte de los alumnos, debido a que responden que si existe una plataforma, la misma que es un blog que se realizd como deber por parte de los alumnos. Por lo tanto es necesario aclarar que la Unidad Educativa no cuenta en la actualidad con una plataforma oficial que incentive el uso de las TIC, por consiguiente el proyecto tiene una aceptacién, factibilidad y viabilidad en la institucién, (Ver grdfico 7). 6. {Te gustaria que se utilice el Sitio Web en parte como una plataforma educativa para incrementar el uso de las TIC en el plantel? eee “Grea: Pregunia 6aeTa naa Pent Ith Educative Sogrados Corazones es © Anilisis: Segtin los datos reflejados en las encuestas aplicadas a la muestra se determin6 que el sitio web debe tener servicios que permitan incrementar el uso de las TIC combinando la tecnologia con el dmbito educativo, por lo cual el sitio web tiene el servicio de correo institucional. (Ver grdfico 8).a usa ako Grice: Pega 7aeTa Ermer Fuente: Unidad Reta gras Corzenes de eis © Analisis En Ia actualidad toda institucién desea y debe tener una relacién con la colectividad marcada, por esa raz6n la Unidad Educativa desea implementar el sitio web y nuestra muestra ratifi que esta servird de gran apoyo a la instituci6n para este objetivo. (Ver grdfico 9 en pagina anterior). 6.1.5. Entrevista Se realizaron 4 entrevistas con las personas encargada en Ia institueion de apoyar a la disertaci6n teniendo la primera como objetivo conocer la problemética de la disertacién (ver anexo), la segunda realizar la toma de los requerimientos especificos para el sitio web (ver anexo), en la tercera visita se presente un borrador del SRS a presentar (ver anexo), en la tiltima se present6 el disefio del sitio web y se solicit6 el host y dominio (Ver anexo 2, 3, 4 5, Informe de Visita). 6.1.6. Elaboracién de SRS Después de haber recolectado la informacion necesaria mediante las encuestas realizadas y las entrevistas efectuadas, se procedi6 al analisis de la informacion y elaboracién del SRS el cual permitié tener claros los objetivos y alcance de la disertaci6n (Ver anexo 6, Especificacién de Requerimientos de Software).42 6.2, ARQUITECTURA DE LA INFORMACION 6.2.1. Inventario de Contenido Deseable El principal objetivo es identificar los contenidos deseables para empezar el disefto de la nueva arquitectura, Se desea entender la amplitud y profundidad que tendré la informacion y posteriormente se podra incrementar al sitio web, teniendo como finalidad una arguitectura escalable. El primer paso es recolectar un conjunto de contenidos generados por las necesidades de la Unidad Educativa y valorar estos segan su importancia. A continuacién en la tabla | se detalla los contenidos deseables. (Ver tabla 1 en pagina siguiente). eee Monee 1.lnicio 2.Quienes Somos 21 Mi 22Vision 2.3 Rectoria 24 Historia 2.5 Valores Institucionales, 3.Vicerrectorias, 3.1 Academia 3.1.1 Areas: 3.2 Formacion 3.2.1 Pastoral/Religién 3.22 Psicologia/Orientacion/Dobe 3.23 Co Programacisn 4, Educacion Tecnolégica 4.1 Videos 4.2 Temas Interés 5,Comunidad SSCC 5.1 Concejo Estudiantil 5.2 Asociacién Padres Familia 5.3 Ex Alumnos 5.4 Vinculos Colegios SC 5.5 Comunidad SC 6. Descargas 7.Galeria 8.Intranet 8.1 Notas parcial 8.2 Ingreso Notas 8.3 Correo Institucional 2.Contacto Tablas vantari de contenidosdeseabTer Fuentes Los outores43, 6.2.2. Dis ‘io Conceptual Con la informacisn obtenida en la fase preliminar ahora debemos ordenar todo, ;C6mo debe organizarse y rotularse la informacién segén sus jerarquias? ;,Cémo funcionaran las buisquedas? Un aspecto principal de un sitio web es su usabilidad, 0 accesibilidad a la informaci6n por parte de los usuarios propios 0 externos que estén navegando en nuestro sitio web, Para el sitio web se ha elegido un modelo de organizacién jerarquica con un conjunto de niveles relacionados n la amplitud y profundidad de los contenidos, garantizando una navegaci6n y accesibilidad eficiente. 6.2.2.1. Exploracién de Metiforas Las metéforas son utilizadas para facilitar la comprension a las personas sobre las ideas complejas de lo nuevo relaciondndolo con Io familiar. Se pueden aplicar tres tipos de metaforas al desarrollar un sitio web: organizacionales, funcionales y visuales. © Metéforas Organizacionales: Utilizan el conocimiento que se tiene sobre algiin sistema para aplicar y generar en el desarrollo de uno nuevo, (Ver tabla 2). Meee + Inicio + Quiénes Somos + Congregaciones + Galeria + Contacto Taegan Front toravoree + Metéforas Funcionates: Son tareas que se pueden realizar en un medio tradicional como en uno nuevo. (Ver tabla 3).+ Consulta de Notas + Descargas + Correo Tabla eferar once © Metéforas Textuales: Se aplican utilizando colores y palabras claves que fuciliten la naveg: sitio. 6.2.2.2. Escenarios én y comprensi6n del 44 Permiten a las personas tener una visién de cémo navegard el usuario en el sitio web, de igual manera permite generar nuevas ideas para la arquitectura y para su sistema de navegacién. (Ver tabla 4,5,6 y 7 en paginas siguientes).Pedro, estudiante del 2do Ciencias Generales de la Unidad Educativa Sagrados Corazones visita diaria- mente el sitio web de la institucién debido a que le interesan mucho las actividades que realiza la Unidad Educativa, Le interesa también el material que suben sus docentes sobre las materias impartidas, Es un estudiante muy dedicado y le gusta estar en contacto con sus docentes y compafiero a través del correo institucional, y también le gusta estar pendientes de sus notas. Estar informado sobre las actividades extracurriculares tambien es de su interes. Taare etc Fala Unidad daca SagradarCoraranes Far Marco es docente de la Unidad Educativa Sagrados Corazones, accede al sitio web de la institucion debido a que le interesa compartir informacion de sus materias con sus estudiantes para fortalecer el uso de las TIC, de igual manera revisa la informacion que sus estudian- tes le otorgan. Le gusta comunicarse con los estudiantes y personas de la institucién a través de su correo institucional. También le gusta estar informado sobre las actividades. extracurriculares debido a que es un docente muy activo. Tablax_ Doconte Un dod Educative agrador Corarons Puente: ton autores 45,