DISEÑO DE LA ARQUITECTURA DEL SOFTWARE (DAS)

Transcripción

1 REPÚBLICA BOLIVARIANA DE VENEZUELA MINISTERIO DEL PODER POPULAR PARA LA EDUCACIÓN COLEGIO UNIVERSITARIO DE CARACAS PROYECTO SOCIO TECNOLÓGICO TRAYECTO 3 TRIMESTRE II DISEÑO DE LA ARQUITECTURA DEL SOFTWARE (DAS) Cedula Apellidos y Nombres Correo Electrónico V Silva R. Ángel A. ang3lsilva@gmail.com V González Edgar gonzalezo.edgarj@gmail.com V Jansasoy Yaribeth yaribethjansasoy@gmail.com V Prada R. Alejandro J. alejandro.pradareyes@gmail.com Profesor(es) Marcos Gómez

2 Sección: Índice de contenido INTRODUCCIÓN...5 Propósito del Documento...6 Definiciones Siglas y Abreviaturas...7 I.DIAGRAMAS DE ESTRUCTURA Diagrama de Clases Descripción de Diagrama de Clases Diagrama de Objetos Descripción de Diagrama de Objetos Diagrama de Paquetes Descripción de Diagrama de Objetos Diagrama de Componentes Descripción del Diagramas de Componentes Diagrama de Despliegue Descripción del Diagrama de Despliegues...17 I.DIAGRAMAS DE COMPORTAMIENTO Diagrama de Estado...18 I.Descripción del Diagramas Estado...18 II.DIAGRAMAS DE INTERACCIÓN Diagrama de Secuencia Descripción del Diagrama de Secuencia TDR y ERS Página 2

3 III.MODELO VISTA CONTROLADOR Diagrama de MVC Descripción Modelo Vista Controlador...21 IV.INTERFAZ USUARIO...24 V.REPORTES...25 PDF de Generación de Tarjeta QR TDR y ERS Página 3

4 INTRODUCCIÓN El presente trabajo está diseñado de forma práctica y sencilla para comenzar a conocer un poco más del diseño de arquitectura del sistema a implementar para la comunidad del Colegio Universitario de Caracas (CUC), a través de una serie de diagramas y su respectiva descripción representaremos la secuencia de las operaciones que se realizarán para obtener la ejecución del proyecto propuesto. Aplicando el uso de los diagramas facilita la compresión de problemas complicados y usualmente muy largos. Para la realización de los diagramas se utilizó una herramienta para moldeamiento en los estándares UML. Brevemente facilitaremos una explicación del proyecto a ejecutarse, el Estudiante del CUC necesitara obtener una Tarjeta de código de respuesta rápida (Quick Response, QR), el cual se generara desde el portal web de la institución. Este diseñó para ser decodificado a alta velocidad, a través del escaneo con un dispositivo móvil inteligente, así el estudiante podrá tener fácil acceso a su información académica mediante un portal de consultas intuitivo y adaptable a cualquier dispositivo, logrando de esta manera una automatización del proceso de consultas académicas. 1- TDR y ERS Página 4

5 Propósito del Documento Siguiendo las mejores prácticas de un compendio de metodologías, los profesores y Especialistas de área del Colegio Universitario de Caracas (CUC) coincidieron en solicitar los diferentes diagramas que en este documento se realizaran, con el fin de mantener un estándar de documentación, sin importar que ciertos criterios no apliquen para todos los proyectos. En cumplimiento con esta solicitud de la institución, que para nosotros también pasa a ser la comunidad, se desarrollan todos los diagramas solicitados, a fin de cumplir con los estándares. 1- TDR y ERS Página 5

6 Definiciones Siglas y Abreviaturas Código QR (Quick Response Code, «Código de Respuesta Rápida») es un módulo para almacenar información en una matriz de puntos o en un código de barras bidimensional. El objetivo del código fue que su contenido se leyera a alta velocidad. PHP (Acrónimo recursivo de PHP: Hypertext Preprocessor) es un lenguaje de código abierto muy popular especialmente adecuado para el desarrollo web y que puede ser incrustado en HTML. MySql Es un sistema de gestión de bases de datos relacionales (RDBMS) basado en SQL (Lenguaje de Consultas Estructuradas). PDF (Portable Document Format,) Formato de documento portátil, es un formato de almacenamiento para documentos digitales independiente de plataformas de software o hardware. Este formato es de tipo compuesto (imagen vectorial, mapa de bits y texto). HTML5 (HyperText Markup Language, version 5) Es un estándar que sirve de referencia para la elaboración de páginas web en sus diferentes versiones, define una estructura básica y un código (denominado código HTML) para la definición de contenido de una página web, como texto, imágenes, videos, entre otros. JQuery Permite simplificar la manera de interactuar con los documentos HTML, manipular el árbol DOM, manejar eventos, desarrollar animaciones y agregar interacción con la técnica AJAX a páginas web. CSS3 (cascading style sheets) Hoja de estilo en cascada, es un lenguaje usado para definir y crear la presentación de un documento estructurado escrito en HTML o XML2 (y por extensión en XHTML). 1- TDR y ERS Página 6

7 DATACUC Es el departamento de desarrollo del Colegio Universitario de Caracas, se encarga del Diseño, Desarrollo y Mantenimiento de la plataforma tecnológica de esta comunidad y pertenece a la Coordinación de Desarrollo Tecnológico. BOOTSTRAP Es un framework o conjunto de herramientas de software libre para diseño de sitios y aplicaciones web. Contiene plantillas de diseño con tipografía, formularios, botones, cuadros, menús de navegación y otros elementos de diseño basado en HTML y CSS, así como, extensiones de JavaScript opcionales adicionales. 1- TDR y ERS Página 7

8 I. DIAGRAMAS DE ESTRUCTURA 1. Diagrama de Clases 1- TDR y ERS Página 8

9 1.2. Descripción de Diagrama de Clases En el recuadro principal se representan las clases pertenecientes al sistema DATACUC, del cual se generararn varios de los repostes disponibles en el sistema QR, en la cual solo se necesita el acceso a la Base de datos para obtener la informacion de los usuarios en sesion. 1- TDR y ERS Página 9

10 2. Diagrama de Objetos 2.1.Descripción de Diagrama de Objetos El estudiante representa el principal usuario del sistema, este debe crear un reporte con el código QR desde el actual sistema que se encuentra en Este reporte tendrá la información para ingresar al sistema de consulta de datos de una forma más simple. Las consulta realizadas por los estudiantes, se generaran en un archivo PDF, el cual podrán guardar en sus dispositivos móviles o imprimir directamente. 1- TDR y ERS Página 10

11 3. Diagrama de Paquetes 3.1.Descripción de Diagrama de Objetos El paquete de interfaz de usuario (GUI), el cual contiene el código QR y el acceso al sistema. Cada uno de los elementos pertenecientes al paquete Alumno, corresponde a las consultas que este puede realizar desde el sistema. 1- TDR y ERS Página 11

12 4. Diagrama de Componentes 4.1. Descripción del Diagramas de Componentes Diagrama de Componentes del Sistema (Generar Código QR) Para Generar el Código QR lo estudiantes deben acceder a la página una vez que cargue la página debes iniciar sesión dando clic en el botón donde indica Estudiante / Trabajador, en el recuadro siguiente se solicita datos de acceso (Usuario y contraseña), al colocar los datos correctamente se ingresa a la página principal del aplicativo (Homecuc.html), una vez allí se debe seleccionar la Opción GenerarQR, al dar clic llamara a la clase GeneraReporteQR.php donde utilizara la librería FPDF.php para generar el PDF y la ChartAPI para generar la imagen del Código QR con los Datos de la sesión (La cedula del estudiante). Diagrama de Componentes del Sistema (Consulta de Datos y generar PDF) Para Ingresar se debe escanear el Código QR con un dispositivo Inteligente (Tener Instalado un APP que escanee el Código QR), una vez es escaneado el Código QR accederá a la página en Login.php donde se debe introducir la contraseña (la misma 1- TDR y ERS Página 12

13 contraseña que se usa para acceder al portal desde la página web del CUC), allí dispara la acción ValidaAcceso.php, donde consultara la contraseña en la Base de Datos, de ser incorrecta la contraseña volverá a pedir la misma (entra en LoginError.php) hasta ser la correcta, al Tercer Intento entra en Logut.php; de ser correcta la contraseña abrirá la página Index.html donde mostrara las opciones segun el alcance definido. Al seleccionar Inscripción Actual llamara a la acción Constancia de Inscripcion.php donde retornara los datos de la Base de Datos (UPC) y generará el PDF con FPDF. Al seleccionar Notas del Período llamara a la acción Constancia de Notas Simples.php donde retornara los datos de la Base de Datos (UPC) y generará el PDF con el FPDF. Al seleccionar Notas Definitivas por Trayecto llamara a la acción ConstanciaNotasLapsoImpreso.php donde se retornara los datos de la Base de Datos (UPC) y generará el PDF con el FPDF. 1- TDR y ERS Página 13

14 5. Diagrama de Despliegue 5.1.Descripción del Diagrama de Despliegues Diagrama de Despliegues del Sistema (Generar Código QR) En el Servidor 01 Se encuentra el HTML y los PHP donde se comunicara con el Servidor 02 donde se encuentra la Base de datos. Diagrama de Despliegues del Sistema (Consulta de Datos y generar PDF) En el Servidor 01 Se encuentra el HTML y los PHP donde se comunicara con el Servidor 02 donde se encuentra la Base de datos. 1- TDR y ERS Página 14

15 I. DIAGRAMAS DE COMPORTAMIENTO 1. Diagrama de Estado I. Descripción del Diagramas Estado Se identifica cada una de las fases de ejecución del proyecto, mediante un tiempo de espera se obtendrán resultados de cada uno de los estados presentados en el diagrama de estado. Se presenta cuatro (4) estados definidos en: tiempo de Espera, Aceptado, Espera de Respuesta y Creado para la ejecución y el fin de cada uno de los proceso del Proyecto. 1- TDR y ERS Página 15

16 II. DIAGRAMAS DE INTERACCIÓN 1. Diagrama de Secuencia 1- TDR y ERS Página 16

17 1.1.Descripción del Diagrama de Secuencia En el Diagrama presentado observamos la ejecución del proceso en forma secuencial. El Estudiante al obtener la Tarjeta QR y escanear el código accederá al sistema mediante una validación. El sistema proporcionará la opción al estudiante de elegir la información que desee obtener, que a su vez será de su elección imprimir o guardar el reporte generado. III. MODELO VISTA CONTROLADOR 1. Diagrama de MVC 1- TDR y ERS Página 17

18 1.1.Descripción Modelo Vista Controlador Implementación Modelo Vista Controlador: Generación Tarjeta QR Modelo: La base de datos es en Mysql, se trabajara bajo la estructura del esquema UDTDATACUC suministrada por la comunidad, ya que la única función de la aplicación es consultar información. Vista: Codifica y mantiene la presentación final de la aplicación de cara al usuario, la misma será elaborada código HTML5 con CSS3 y Jquery, Mantiene el home que conserva la comunidad actualmente, y se agrega una nueva Opción que se denomina "Generar Tarjeta QR. Se utilizara Framework de Bootstrap para obtener un diseño ajustable a cualquier resolución. Controlador: Es la parte más importante del sistema, ya que es el enlace entre el modelo y la vista. El sistema a implementar será elaborado y mostrado con un Generar.PHP, generando un archivo PDF el cual tendrá anexa un código QR para el escaneo del mismo. Esta es la parte lógica de la aplicación. 1- TDR y ERS Página 18

19 Implementación Modelo Vista Controlador: Código QR Modelo: La base de datos es en Mysql, se trabajará con la estructura del esquema UDTDATACUC suministrada por la comunidad, ya que la única función de la aplicación es consultar información. Vista: Codifica y mantiene la presentación final de la aplicación de cara al usuario, para esta el código es en HTML5 con CSS3 y Jquery, se utilizara Framework de Bootstrap para obtener un diseño ajustable a cualquier resolución. Controlador: Es la parte más importante, ya que es el enlace entre el modelo y la vista. El sistema a implementar será elaborado con PHP. Mostrando una serie de opciones con las que trabaja actualmente la comunidad. 1- TDR y ERS Página 19

20 Entre los controladores se encuentra: ValidaAcceso.php: Permite la validación y acceso del estudiante al sistema. ConstanciaNotasLapsoImpreso.php: Genera un Archivo PDF con las notas de lapso, el archivo puede ser impreso o guardado dependiente del complacencia del estudiante ConstanciadeInscripcion.php: Genera un Archivo PDF constando que el estudiante está Inscrito en la Institución, el archivo puede ser impreso o guardado dependiente del complacencia del estudiante ConstanciadeNotassimpleInscripcion.php: Genera un Archivo PDF mostrando un constancia simple de las notas del estudiante, el archivo puede ser impreso o guardado dependiente del complacencia del estudiante. 1- TDR y ERS Página 20

21 IV. INTERFAZ USUARIO 1- TDR y ERS Página 21

22 V. REPORTES PDF de Generación de Tarjeta QR 1- TDR y ERS Página 22

23 1- TDR y ERS Página 23

24 1- TDR y ERS Página 24