UNIVERSIDAD NACIONAL

“SANTIAGO ANTUNEZ DE MAYOLO”

FACULTAD DE CIENCIAS
ESCUELA ACADÉMICO PROFESIONAL DE INGENIERÍA
DE SISTEMAS E INFORMÁTICA

INFORME DE PRACTICAS PRE-PROFESIONALES

NOMBRE DEL PROYECTO:

“DESARROLLO E IMPLEMENTACION DE UNA APLICACIÓN WEB

PARA LA GESTIÓN ACADÉMICA DEL INSTITUTO CIBERTRONIC”

AUTOR:

LÁZARO RODRIGUEZ CRISTIAN

DOCENTE GUIA:

Msc. MINAYA GONZALEZ JAIME

HUARAZ – ANCASH - PERU

2016
 DEDICATORIA

A mis padres con mucho amor y cariño por

el apoyo y esfuerzo que hacen para lograr
mis metas y objetivos.

A mis hermanos por su constante

colaboración y apoyo en los buenos y malos
momentos y por estar la mayor parte del
tiempo conmigo.

AGRADECIMIENTO

El desarrollo del presente proyecto de practicas pre profesionales de ingeniero de

Sistemas, requirió de mucho esfuerzo y sacrificio, pero no se hubiese logrado sin apoyo
incondicional de muchas personas a las cuales quiero manifestar mis más sinceros
agradecimientos.

A Dios por ser aquella fuerza de aliento y superación y estar conmigo en los momentos
más difíciles por las que pase.
A mis padres por su sacrificio y valor para poder brindarme una educación de calidad, y
por inculcarme buenos principios y valores de convivencia.

A mi Alma mater, la Universidad Nacional Santiago Antúnez de Mayolo por haberme

acogido en sus aulas universitarias para darme una formación profesional.

A mis docentes que con sus palabras y conocimientos me han ido guiando en mi
formación profesional, orientándome a un camino del conocimiento y por sus concejos
para seguir adelante en este largo camino del conocimiento.

Finalmente, a mis amigos con los cuales pude compartir momentos inolvidables dentro y
fuera de la universidad, por su apoyo y sus consejos que nunca los olvidare, gracias.

I. PRESENTACIÓN

El presente informe de prácticas pre – profesionales en la especialidad de

Ingenieria de Sistemas e Informatica de la Facultad de Ciencias fue desarrollado
en el Instituto CIBERTRONIC de Huaraz – Ancash – Perú.

El informe contiene el desarrollo íntegro y descriptivo de las funciones realizadas

a lo largo de las practicas, mencionando datos referentes del Instituto
CIBERTRONIC.

El objetivo de este informe es dar a conocer en forma detallada todas las

actividades realizadas en el Instituto CIBERTRONIC, y la elaboración del
proyecto de una aplicación web.

El proyecto consta de una aplicación web para la gestión académica del Instituto
CBETRONIC, que favorecerá al desarrollo tecnológico de dicha institución y
 permitirá la integración de nuevas tecnologías para los procesos que se
realizaban manualmente.

En el desarrollo del proyecto se pudo conocer los procesos que se realizan en las
distintas áreas, esto condujo a un análisis de integración de todos los procesos a
ser unificado en la aplicación web.

II. PLAN DE PRÁCTICAS

II.1. GENERALIDAES:

II.1.1. TÍTULO
“Desarrollo e implementación de una aplicación web para la Gestión
Académica del instituto CIBERTRONIC”

II.1.2. AUTOR

II.1.2.1. NOMBRE
Lázaro Rodríguez Cristian Franco

II.1.2.2. CONDICIÓN
 Practicante de Ingeniería de Sistemas e Informática

II.1.2.3. DIRECCIÓN
Av. Mancocapac N° 422 Independencia

II.1.2.4. CARRERA PROFECIONAL

Ingeniería de Sistemas e Informática

II.1.3. DOCENTE GUÍA

II.1.3.1. NOMBRE
MINAYA GONZALEZ, Jaime

II.1.3.2. GRADO ACADÉMICO

Bachiller en Ingenieria.
II.1.3.3. CARRERA PROFECIONAL
Ingeniería Electrónica.

II.1.4. DATOS DEL CENTRO DE PRÁCTICAS

II.1.4.1. NOMBRE DE LA INSTITUCION
Instituto CIBERTRONIC
II.1.4.2. UBICACIÓN
JIRON 13 DE DICIEMBRE N° 615, Huaraz.

II.1.4.3. DESCRIPCION DEL CENTRO DE PRACTICAS

 El Instituto CIBERTRONIC fue creada en el año 2002 con fines
educativos por la demanda de profesionales técnicos en distintos rubros,
en la actualidad cuenta con 12 especialidades técnicas con profesores
especializados para cada especialidad, los horarios que ofrece son
flexible y los egresados se le entrega un certificado a nombre del
ministerio de educación, el instituto cuenta con aulas especialidades, en
el área de informática está constituida por un centro de cómputo para
diferentes especialidades con computadoras en las que están instaladas
softwares necesarios para cada especialidad, y las oficinas que se
encuentran interconectadas para el intercambio de información.

II.1.4.4. RESPONSABLE
 Gerente - Director
Edgardo Guzmán Rodríguez
II.1.4.5. DATOS DEL ÁREA DE PRÁCTICAS
 Nombre:

Área de informática.

 Responsable del área Informática:

Lic. Ulises Alva Sánchez

II.1.4.6. MISIÓN
Formar líderes y profesionales en tecnologías, para el mundo laboral,
capaces de dominar y generar conocimiento, con compromiso de trabajo
y responder de manera eficaz, a las necesidades y retos laborales con
calidad, productividad y una visión global.
II.1.4.7. VISIÓN
Ser una institución líder en la formación técnica superior en la región y el
país, comprometiendo a sus estudiantes a desarrollarse con
competitividad, solvencia plena, lograr el reconocimiento de la sociedad
a nivel local. regional y nacional al brindar un servicio eficiente y de
calidad a los estudiantes de nuestra institución.

II.1.4.8. OBJETIVOS DE LA ORGANIZACIÓN

Formar profesionales Técnicos capacitados para el mundo laboral,
ampliar las oportunidades educativas para reducir desigualdades entre
 los grupos sociales, cerrar brechas e impulsar la equidad con liderazgo.

I. I.1.
I.2.
I.3.
I.4.
I.4.1.
I.4.2.
I.4.3.
I.4.4.
I.4.5.
I.4.6.
I.4.7.
I.4.8.
II.1.4.9. ORGANIGRAMA DE LA EMRPESA

II.2. ESTADO SITUACIONAL

En la actualidad el Instituto CIBERTRONIC cuenta con el área de Informática que
abarca el centro de cómputo y las oficinas académicas no obstante el área de
informática presenta falta de mantenimiento en la estructura de las redes y en
software que utilizan, no cuenta con una plataforma web, todo proceso académico
y de información es personal y en el mismo lugar, esto genera demora y
desconformidad de parte de los estudiantes docentes y público que vienen a
solicitar información en la que involucra la matricula, registro de alumnos, las
 notas, registro de docentes, asignaturas, horarios, etc.
Por tal motivo, es importante realizar un diagnóstico de las problemáticas que
tiene el área de informática y la necesidad de contar con una aplicación web que
en el uso diario permita reducir tiempo en los procesos académicos y recursos de
material de oficina, lo que contribuirá a la reducción de carga de trabajo del
personal que se encarga de estas actividades. También facilitara información de
forma inmediata.

II.2.1. PLANTEAMIENTO DEL PROBLEMA

En la actualidad el Instituto CIBERTRONIC no cuenta con una plataforma
web, todo proceso académico y de información es personal y en el mismo
lugar, esto genera demora y desconformidad de parte de los estudiantes y
público que vienen a solicitar información.
Por tal motivo, es importante contar con una aplicación web que permita
almacenar las notas en una base de datos y proporcionar información.
Por un lado, los programas administradores de archivos son muy útiles
porque posibilitan una adecuada gestión. Por otro lado, con un software
conveniente se puede crear, nombrar, renombrar, mover y borrar archivos y
carpetas con la finalidad de almacenar información. Por lo expuesto,
anteriormente, el presente trabajo de investigación desarrollará una
Aplicación.

II.2.2. FORMULACIÓN DEL PROBLEMA

¿En qué medida podrá mejorar la gestión académica del instituto
CIBERTRONIC con una aplicación web?

II.3. OBJETIVOS
II.3.1. OBJETIVO GENERAL
Desarrollo de una aplicación web para mejorar la gestión en los procesos
académico del instituto CIBERTRONIC
II.3.2. OBJETIVOS ESPECÍFICOS
 Automatizar los procesos académicos.
 Facilitar los procesos de gestión de notas y matrícula.
 Desarrollar una interfaz sencilla que permita ingresar información al
sistema.
 Acceso a información de manera rápida y eficaz.
II.4. JUSTIFICACIÓN
La presente investigación permitirá analizar y desarrollar nuevos servicios de
control académico para el Instituto CIBERTRONIC. Para que de esta manera
ofrezca una asistencia de mayor calidad al alumno mediante el uso de las
tecnologías de la información como es una aplicación web en la cual será
desarrollado a través de herramientas tecnológicas web.
Además, es necesario tener una adecuada información de los procesos
académicos para así facilitar controlar eficazmente estos servicios, teniendo
registrado toda la información adecuada por parte del instituto para su uso
adecuado en mejoría de la institución y así llevar una atención, rápida y eficiente
a sus alumnos.
El desarrollo del sistema web hará posible disminuir significativamente el tiempo
que incurre realizar estos servicios brindados por la institución, así mismo
brindará la información necesaria para desarrollar una política adecuada a las
necesidades del alumnado.

II.4.1. JUSTIFICACIÓN ECONÓMICA

La implantación del proyecto minimizara el impacto económico permitiendo
obtener ahorros significativos al medir y controlar la utilización de recursos
humanos y materiales.
Por ende, es necesario el desarrollo del sistema que se propone en el
presente proyecto.

II.4.2. JUSTIFICACIÓN OPERATIVA

El desarrollo del presente proyecto implica un compromiso del personal de la
institución, ya que ellos serán los principales administradores de la
aplicación web, quienes tendrán nuevas responsabilidades en el desarrollo
de sus funciones como parte del diseño de procesos académicos que realiza
la institución.

II.4.3. JUSTIFICACIÓN TECNOLOGIA

El proyecto contara con herramientas que faciliten los procesos académicos
ya que la institución cuenta con computadoras, acceso a internet y software
necesarios, y la disponibilidad de la compra de un hosting dedicado para la
aplicación web.
II.4.4. JUSTIFICACION LEGAL

La viabilidad legal de la implementación de este sistema informático web

está completamente supeditada a los lineamientos estratégicos de
innovación y desarrollo tecnológico de la Institución, así como la
normatividad de la universidad con las prácticas pre profesionales.

 Reglamento de Practicas Pre Profesional. Aprobado con Resolución

Nº 078-2011-UNASAM-FC/D del 21 de Junio del 2011.
 Ley Universitaria 23733
 Estatuto de la UNASAM
 Reglamento de Estudios
 Plan Curricular

II.5. ACTIVIDADES A DESARROLLAR

II.5.1. ETAPA DE ANÁLISIS SITUACIONAL
 Estudios preliminares
 Identificación de los principales procesos del área
 Recopilación de los requerimientos
 Validación de la información
 Elaboración del Plan de Prácticas Pre Profesionales

II.5.2. ETAPA DE PROCESO

 Definir las herramientas de gestión que se emplearán
 Analizar la información recopilada
 Clasificar la información de acuerdo a las herramientas de gestión
 Determinar si la información obtenida es la necesaria.

II.5.3. ETAPA DE SOLUCION

 Analizar la situación actual del área de Informática
 con referencia al proceso de desarrollo del sistema para el área de
Informática.
 Elaborar el diagrama de causa – efecto
 Delimitar las limitaciones del área de Informática con respecto a la
creación del sistema web en desarrollo.
 Dar un diagnóstico de la situación actual para iniciar con las
actividades de desarrollo del sistema web.
II.6. INGENIERÍA DEL PROYECTO
II.6.1. PROCESO UNIFICADO RACIONAL (RUP)
El Proceso Unificado de Rational es una metodología de desarrollo de
software, que proporciona un acercamiento disciplinado a la asignación de
tareas y responsabilidades en una organización de desarrollo. Su propósito
es asegurar la producción de software de alta calidad que se ajuste a las
necesidades de sus usuarios finales con unos costos y calendario
predecibles.

Por otro lado es una metodología que intenta integrar todos los aspectos a
tener en cuenta durante todo el ciclo de vida del software, con el objetivo
de hacer abarcables tanto pequeñas como grandes proyectos de software.

Características

• Guiado/Manejado por Casos de Uso:

La razón de ser de un sistema software es servir a usuarios ya sean

humanos u otros sistemas; un caso de uso es una facilidad que el software
debe proveer a sus usuarios.

Los casos de uso reemplazan la antigua especificación funcional

tradicional y constituyen la guía fundamental establecida para las
actividades a realizar durante todo el proceso de desarrollo incluyendo el
diseño, la implementación y las pruebas del sistema.

• Centrado en Arquitectura:

La arquitectura involucra los elementos más significativos del sistema y

está influenciada entre otros por plataformas software, sistemas
operativos, manejadores de bases de datos, protocolos, consideraciones
de desarrollo como sistemas heredados y requerimientos no funcionales.
Es como una radiografía del sistema que estamos desarrollando, lo
suficientemente completa como para que todos los implicados en el
desarrollo tengan una idea clara de qué es lo que están construyendo,
pero lo suficientemente simple como para que si quitamos algo una parte
importante del sistema quede sin especificar. Se representa mediante
varias vistas que se centran en aspectos concretos del sistema,
abstrayéndose de lo demás. Todas las vistas juntas forman el llamado
modelo 4+1 de la arquitectura, recibe este nombre porque lo forman las
vistas lógica, de implementación, proceso y despliegue, más la de casos
de uso que es la que da cohesión a todas.
• Iterativo e Incremental:

Para hacer más manejable un proyecto se recomienda dividirlo en ciclos.

Para cada ciclo se establecen fases de referencia, cada una de las cuales
debe ser considerada como un mini proyecto cuyo núcleo fundamental
está constituido por una o más iteraciones de las actividades principales
básicas de cualquier proceso de desarrollo. En concreto RUP divide el
proceso en cuatro fases, dentro de las cuales se realizan varias iteraciones
en número variable según el proyecto y en las que se hace un mayor o
menor hincapié en los distintas actividades.
• Desarrollo basado en componentes:

La creación de sistemas intensivos en software requiere dividir el sistema

en componentes con interfaces bien definidas, que posteriormente serán
ensamblados para generar el sistema. Esta característica en un proceso
de desarrollo permite que el sistema se vaya creando a medida que se
obtienen o que se desarrollen y maduran sus componentes.

• Utilización de un único lenguaje de modelado:

UML es adoptado como único lenguaje de modelado para el desarrollo de

todos los modelos.
• Proceso Integrado:

Se establece una estructura que abarque los ciclos, fases, flujos de

trabajo, mitigación de riesgos, control de calidad, gestión del proyecto y
control de configuración; el proceso unificado establece una estructura que
integra todas estas facetas. Además esta estructura cubre a los
vendedores y desarrolladores de herramientas para soportar la
automatización del proceso, soportar flujos individuales de trabajo, para
construir los diferentes modelos e integrar el trabajo a través del ciclo de
vida y a través de todos los modelos.
La estructura estática del proceso unificado se define en base a cuatro
elementos, que son: los roles (antes workers), que responde a la pregunta
¿quién?, las actividades (activities), que responden a

la pregunta ¿cómo?, y disciplinas productos (artifacts), que responden a la

pregunta ¿qué?, y los flujos de trabajo (workflows), que responden a la
pregunta ¿cuándo?
• Roles:

Un rol define el comportamiento y responsabilidades de un individuo, o de

un grupo de individuos trabajando juntos como un equipo. Una persona
puede desempeñar diversos roles, así como un mismo rol puede ser
representado por varias personas.
Las responsabilidades de un rol son tanto el llevar a cabo un conjunto de
actividades como el ser el ‘dueño’ de un conjunto de artefactos.
• Actividades:

Una actividad de un trabajador en concreto es una unidad de trabajo que

una persona que desempeñe ese rol puede ser solicitado a que realice.
Las actividades tienen un objetivo concreto, normalmente expresado en
términos de crear o actualizar algún producto.
• Productos:

Un producto o artefacto es un trozo de información que es producido,

modificado o usado por un proceso. Los productos son los resultados
tangibles del proyecto, las cosas que va creando y usando hasta obtener el
producto final.
• Flujos de Trabajo:

La enumeración de rolos, actividades y artefactos no define un proceso,

necesitamos definir la secuencia de actividades realizadas por los
diferentes roles, así como la relación entre los mismos, que nos producen
unos resultados observables. RUP define varios flujos de trabajo distintos,
 entre los que distingue entre dos grupos, los de proceso, y los de apoyo.
Las distintas iteraciones a realizar consistirán en la ejecución de estos
flujos de trabajo con una mayor o menos intensidad dependiendo de la
fase e iteración en la que nos encontremos. EJECUCIÓN DE LA
ITERACIÓN
Cada día el equipo realiza una reunión de sincronización. Cada miembro
del equipo inspecciona el trabajo que el resto está realizando
(dependencias entre tareas, progreso hacia el objetivo de la iteración,
obstáculos que pueden impedir este objetivo) para poder hacer las
adaptaciones necesarias que permitan cumplir con el compromiso
adquirido. En la reunión cada miembro del equipo responde a tres
preguntas:
¿Qué he hecho desde la última reunión de sincronización?

¿Qué voy a hacer a partir de este momento?

¿Qué impedimentos tengo o voy a tener?

Durante la iteración el Facilitador se encarga de que el equipo pueda

cumplir con su compromiso y de que no se merme su productividad.
Elimina los obstáculos que el equipo no puede resolver por sí mismo.
Protege al equipo de interrupciones externas que puedan afectar su
compromiso o su productividad.

2.6.2. Fases del Proceso Unificado de Racional

Figura N° 04:

“Fases y flujos de trabajo de RUP”

 Fuente: https://ingsoftwarefinal1.wordpress.com/tema1/

FASE DE CONCEPCIÓN

 Definición del alcance del sistema. Se captura el contexto y los

más importantes requisitos y restricciones hasta el nivel en el cual
se puedan derivar criterios de aceptación para el producto final.

 Planificación y estimación de costes para el desarrollo del proyecto.

 Esto incluye la elaboración de un plan de gestión y de un plan de
trabajos que contempla el uso de recursos.

 Sintetizar una arquitectura candidata. El plan de trabajos se basa

en una arquitectura candidata, que es la mejor solución posible en
base las restricciones de costes, plazo de desarrollo y tecnología
disponibles. En algunos casos se puede requerir la construcción
de un prototipo inicial, pero sólo al efecto de demostrar la
viabilidad de la solución.

 Selección de la organización del proyecto, incluyendo metodología

y herramientas a utilizar para el control y ejecución del mismo.

FASE DE ELABORACIÓN

 Definir y validar una arquitectura estable, que será la base para

el resto del desarrollo.

 Refinamiento de la Visión del sistema, basándose en nueva

información obtenida durante esta fase, se establece una sólida
comprensión de los casos de uso más críticos que definen las
decisiones arquitectónicas y de planificación.

 Creación de los planes de desarrollo detallados para las

iteraciones de la fase de construcción.

 Se refina la arquitectura y se seleccionan los componentes. Se

evalúan y seleccionan los componentes más apropiados para su
integración en la arquitectura seleccionada.

FASE DE CONSTRUCCIÓN

 Gestión de los recursos, optimización y control de los procesos de

construcción del software.
  Se completa el desarrollo de los componentes y/o subsistemas,
probándolos contra un conjunto definido de criterios aprobados al
inicio del proyecto.

FASE DE TRANSICIÓN

 Ejecución de los planes de implantación Se finalizan los manuales

de usuario y mantenimiento.

 Pruebas del sistema en el entorno de explotación.

 Creación de una reléase del sistema.

 Validación del sistema por los usuarios.

 Ajuste fino del sistema según la validación con el usuario.

 Se facilita la transición del sistema al personal de mantenimiento

  Se pone el producto a disposición del usuario final.

Concluida las cuatro fases se produce una versión del producto, este
incluye la documentación del proyecto que contiene (manual de usuario,
casos de uso, requerimientos funcionales y no funcionales, código fuente
y otros documentos asociados).

II.6.3. ARQUITECTURA CLIENTE SERVIDOR DE 3 CAPAS

La especialización de la arquitectura cliente-servidor donde la carga se divide en

tres partes (o capas) con un reparto claro de funciones: una capa para la
presentación (interfaz de usuario), otra para el calculo (donde se encuentre
modelado el negocio) y otra para el almacenamiento (acceso a datos).
 Capa de presentación:
es la que ve el usuario (también se la denomina "capa de usuario"),
presenta el sistema al usuario, le comunica la información y captura la
información del usuario en un mínimo de proceso (realiza in filtrado previo
para comprobar que no hay errores de formato). También es conocida
como interfaz gráfica y debe tener la característica de ser "amigable"
(entendible y fácil de usar) para el usuario. Esta capa se comunica
únicamente con la capa de negocio.
 Capa de negocio:
es donde residen los programas que se ejecutan, se reciben las peticiones
del usuario y se envían las respuestas tras el proceso. Se denomina capa
de negocio (e incluso de lógica del negocio) porque es aquí donde se
establecen todas las reglas que deben cumplirse. Esta capa se comunica
con la capa de presentación, para recibir las solicitudes y presentar los
resultados, y con la capa de datos, para solicitar al gestor de base de
datos almacenar o recuperar datos de él. También se consideran aquí los
programas de aplicación.
 Capa de datos:
Es donde residen los datos y es la encargada de acceder a los mismos.
Está formada por uno o más gestores de bases de datos que realizan
 todo el almacenamiento de datos, reciben solicitudes de almacenamiento
o recuperación de información desde la capa de negocio.

Figura 03: Arquitectura Cliente/Servidor 3 capas

II.6.4. METODOLOGÍA UWE

UWE (UML-Based Web Engineering) es una propuesta basada en UML y

en el proceso unificado para modelar aplicaciones web. Esta propuesta
está formada por una notación para especificar el domino (basada en UML)
y un modelo para llevar a cabo el desarrollo del proceso de modelado.
Los sistemas adaptativos y la sistematización son dos aspectos sobre
los que se enfoca UWE. Además de estar considerado como una extensión
del estándar UML, también se basa en otros estándares como por ejemplo:
XMI como modelo de intercambio de formato, MOF para la meta-
modelado, los principios de modelado de MDA, el modelo de
transformación del lenguaje QVT y XML.

El modelo que propone UWE está compuesto por 6 etapas o sub-

modelos:
 Modelo de casos de uso: Modelo para capturar los
requisitos del sistema.

 Modelo de contenido: Es un modelo conceptual para el

desarrollo del contenido.

 Módulo de usuario: es modelado de navegación, en el cual se

incluyen modelos estáticos y modelos dinámicos.

 Modelo de estructura: en el cual se encuentra la

presentación del sistema y el modelo de flujo.

 Modelo Abstracto: incluye el modelo de interfaz de usuario y el

modelo de ciclo de vida del objeto.

 Modelo de la adaptación: en cuanto a los requisitos, UWE los

clasifica dependiendo del carácter de cada uno. Además
distingue entre las fases de captura, definición y validación de
requisitos.
 II.6.4.1. UWE Y SU RELACIÓN CON UML

UWE define una extensión del lenguaje modelado (UML). Esta, es

considerada como una extensión ligera de peso e incluye en su
definición tipos, etiquetas de valores y restricciones para, las
características específicas del diseño web, las cuales unidas a las
definiciones de UML forman el conjunto de objetos modelado que se
usaran para el desarrollo del modelo en UWE.

Las funcionalidades que cubren UWE abarcan áreas relacionadas con

la web como la navegación, presentación, los procesos de negocio y
los aspectos de adaptación.

Una de las ventajas de que UWE extienda el estándar UML es la

flexibilidad de este para la definición de un lenguaje de modelado
específico para el dominio web y sobretodo la aceptación universal de
dicho estándar en el campo de la ingeniería del software.

Otra gran ventaja es que actualmente existen múltiples herramientas

CASE basadas en UML con los cual es relativamente sencillo su
utilización y ampliación para utilizar los objetos de modelado definidos
en UWE. Estas herramientas se verán en el siguiente punto.

II.6.4.2. MODELOS DE UWE

En esta sección se explicarán los modelos para cada una de los

aspectos web que cubre la metodología UWE, recordemos que estos
aspectos eran navegación, presentación, los procesos de negocio y
adaptación. Así procedemos a explicar con un breve ejemplo cada
uno de estos modelos.
A. Modelo de contenido

Este modelo especifica cómo se encuentra relacionados los

contenidos del sistema, es decir, define la estructura de los datos que
se encuentran alojados en el sitio web. A continuación se muestra un
ejemplo de este modelo contenido en la página web de UWE.

Figura N° 06:

“Modelo de Contenido”

En este ejemplo se puede ver representado que el contenido web está

formado por una agenda básica de contactos, está agenda
representada por la clase AddressBook contiene un conjunto de uno o
más contactos (clase Contact) , cada uno de ellos tiene un nombre, un
email, una dirección y un teléfono. De los cuales los dos primeros son
de tipo String y los dos últimos a son estructuras de otros atributos,
representadas por las clases Address y Phone, cada contacto puede
tener una dirección y secundarios.

B. Modelo de Navegación

Este modelo indica cómo el diseño de páginas web del sitio está
relacionada internamente, es decir cómo se enlazan los elementos de
navegación. Para ello se utilizan unidades de navegación llamadas
“nodos” conectadas por enlace de navegación. Estos nodos pueden
ser mostrados en la misma página web, no tienen por qué estar en
páginas diferentes. Al mismo tiempo que explicamos este modelo con
el ejemplo de la agenda de contactos, podemos ir viendo los
distintos elementos que introduce la metodología UWE, los
elementos introducidos son los siguientes:

Figura N° 07:

“Estereotipos y sus íconos M.N”

Aquí tenemos el ejemplo de navegación del sitio web que representa

una agenda de contactos:
 Figura N° 08:

“Modelo de Navegación”

Para empezar tenemos AddressBook como página de inicio, así que

está etiquetada como {isHome} y como clase de navegación con el
símbolo correspondiente (ver símbolos más abajo). La página de
inicio enlaza con un menú, que sería nuestra página de índice, para
ello la clase Main Menú esta etiquetada como página Menú.

Desde la clase Main Menú enlazamos con las clases Search (que
implementará la función de buscar un contacto y es etiquetada con la
etiqueta de query que es un proceso predefinido, y con la clase

Para finalizar vemos que la clase ConctactCreation está enlazada con

Conctact ya que cuando se crea un nuevo contacto, este se debe
mostrar. Como también cuando se realiza una búsqueda se debe
mostrar la lista con los contactos del resultado, de ahí que exista otro
processLink entre las clases Search y ConctactList, esta última
además etiquetada como index, al ser una lista.

C. Modelo de presentación

En este modelo se representan las clases de navegación y de

procesos que pertenecen a cada página web. Estos son los
elementos que introduce la metodología UWE en este modelo:

Figura N° 09:

“Estereotipos y sus íconos M.P”

D. Modelo de proceso

Este modelo especificó las acciones que realiza cada clase de

proceso, en este modelo se incluye:

E. Modelo de estructura de procesos

Que define las relaciones entre las diferentes clases proceso. Un

ejemplo de diagrama de clases de este modelo siguiendo el caso de
la Agenda de contactos sería:
 Figura N° 11:

“Modelo de estructura de procesos”

En este diagrama se puede ver que hay clases para definir 3 operaciones que necesita una confirmación. Así
por ejemplo si el usuario quiere borrar un contacto el mensaje será mostrado y después haciendo clic en “ok”
el contacto será borrado. Las operaciones de actualización y creación funcional de manera similar, ambas
heredan de ConctacProcessing, asegurando que los campos de datos tienen valores válidos.

II.6.4. BASES DE DATOS

Base de datos o banco de datos (en ocasiones abreviada BB.DD.) es un conjunto de datos pertenecientes a un mismo
contexto y almacenados sistemáticamente por su posterior uso. En este sentido, una b biblioteca puede considerarse una
base de datos compuesta en su mayoría por documentos y textos impresos en papel e indexados para su consulta. En la
actualidad, y debido al desarrollo tecnológico de campos como la informática y la electrónica, la mayoría de las bases de
datos están en formato digital (electrónico), que ofrece un amplio rango de soluciones al problema de almacenar datos.
 Existen programas denominados sistemas gestores de bases de datos abreviados SGBD, que permiten almacenar y
posteriormente acceder a los datos de forma rápida y estructurada. Las propiedades de este SGBD, así como su utilización
y administración, se estudian dentro del ámbito de la informática.

 Nivel físico:

El nivel más bajo de abstracción describe como almacén realmente los datos. En el nivel físico se describen en detalle las
estructuras de datos complejas de bajo nivel.

 Nivel lógico:

El siguiente nivel más alto de abstracción describe que datos se almacenan en la base de datos y que relaciones existen
entre esos datos y que relaciones existen entre esos datos. La base de datos completa se describe así en términos de un
número pequeño de estructuras relativamente simples. Aunque la implementación de estructuras simples en el nivel lógico
puede involucrar estructuras completas de nivel físico, los usuarios del nivel lógico no necesitan preocuparse de esta
complejidad. Los administradores de base de datos, que pueden decidir la información que se mantiene en la base de
datos, usan el nivel lógico de abstracción.

 Modelo entidad relación

Denominado por sus siglas como: E-R; este modelo representa a la realidad a través de un esquema grafico empleando la
terminología de entidades, que son objetos que existen y son los elementos principales que se identifican en el problema a
resolver con el diagramado y se distinguen de otros por sus características particulares denominados atributos, el enlace
que rige la unión de las entidades está representada por la relación del modelo.
Recordemos que un rectángulo nos representa a las entidades; una elipse a los atributos de las entidades, y una etiqueta
dentro de un rombo nos indica la relación que existe entre las entidades, destacando con líneas las uniones de estas y que
la llave primaria de una entidad es aquel atributo que se encuentra subrayado.

 Elementos del modelo entidad-relación

a. Entidad

Se trata de un objeto del que se recoge información de interés de cara a la base de datos. Gráficamente se representan
mediante un rectángulo. Un ejemplo seria la entidad banco, donde se recogerían los datos relativos a ese banco, como
puede ser el nombre, el número de sucursal, la dirección, etc.

Dentro de las entidades pueden ser fuertes o débiles. Las fuertes son las que no dependen de otras entidades para
existir, mientras que las entidades débiles siempre dependen de otra entidad sino tienen sentido por ellas mismas.

b. Relación

Podemos definir la relación como una asociación de dos o más entidades. A cada relación se le asigna un nombre para
poder distinguirla de las demás y saber su función dentro del modelo entidad-relación. Otra característica es el grado de
relación. Siendo las de grado 1 relaciones que solo relacionan una entidad consigo misma. Las de grado 2 son relaciones
que asocian dos entidades distintas, y las de grado n que se tratan de relaciones que unen más de dos entidades.

Las relaciones se representan gráficamente con rombos, dentro de ellas se coloca el nombre de la relación.

Otra característica es el tipo de correspondencia entre dos relaciones:

 1: 1. Uno a uno, a cada ocurrencia de una entidad le corresponde como máximo una ocurrencia de la otra entidad
relacionada.

1: N. uno a mucho, a cada ocurrencia de la entidad A le puede corresponder varias de la entidad B.

N: M. Muchos a muchos, cada ocurrencia de una entidad puede contener varias de la otra entidad relacionada y
viceversa.

Para finalizar las características de la relación tenemos la cardinalidad que define el número máximo y mínimo de
ocurrencias de cada tipo de entidad. Se representa con los valores máximos como mínimo encerrados entre paréntesis
encima de la relación, (Máximo, Mínimo).

c. Atributo

se define como cada una de las propiedades de una entidad o relación. Cada atributo tiene un nombre y todos los
posibles valores que puede tener. Dentro de una entidad tiene que haber un atributo principal que identifica a la entidad y
su valor tiene que ser único. Un ejemplo de atributo principal seria el DNI dentro de la entidad persona.

II.6.5. W3C

En el año de1994, cinco años después de la invenció0n de la World Wide Web, Tim Berners-Lee fundó el World Wide Web
Consortium (W3C) en el Instituto de Tecnología de Massachusetts (MIT). Esta organización es la encargada de definir
todos los estándares de la web.
Cuando se habla de un HTML limpio se está queriendo decir que cumple con todos los estándares actuales de la W3C.
Cumplir estos estándares es muy importante para el buen posicionamiento en buscadores del sitio desarrollado en
cuestión.

Aunque no solamente la W3C define estándares para los sitios web que se visualizan en computadoras, también en todos
los dispositivos móviles o PDA que puedan tener a internet. Además de no cumplirse correctamente los estándares
posiblemente el sitio web no pueda visualizarse en algún navegador.

La WC3, revisa todo el código de la página web, y busca los errores que deben corregir en el código, esto busca que la
páginas web sean más homogéneas, con mayor accesibilidad, navegación fácil para el usuario, carga con mayor rapidez
en los navegadores, mejor posicionamiento en el ranking de la página.

La misión del W3C es conducir la Web hacia su potencial más elevado, realizando el perfeccionamiento de protocolos y
modelos que afirmen el desarrollo a largo plazo de la Web, aunque W3C tiene sus inconvenientes, la comunidad
concuerda en que el hoy de W3C goza de respeto y el apoyo de una amplia gama de industrias clave, organizaciones,
individuos y entes colaborativos.

La W3C engloba cerca de 400 organizaciones de todo el mundo. Reúne a vendedores de productos, proveedores de
contenidos, laboratorios de investigación, organismos de estandarización y gobiernos.

La organización W3C tiene cuatro objetivos básicos:

Web para todos:

Accesibilidad para todo el mundo de forma global, sin barreras tecnológicas, limitaciones físicas o culturales.
Web sobre todo:

Intentar añadir el máximo de dispositivos a la Web, actualmente estan en un proceso de apertura donde las PDAs,
televisiones están iniciando su camino hacia la Web.

Base de conocimiento:

Permitir que cada usuario pueda hacer un buen uso de la web.

Seguridad:

Guiar al desarrollo de la web respetando las normas legales, comerciales y los aspectos sociales originados por esta
tecnología.

II.6.6. Herramientas en uso

II.6.6.1. MySQL.

MySQL es un sistema de gestión de bases de datos relacional, multihilo y multiusuario con más de seis
millones de instalaciones. MySQL AB desde enero de 2008 una subsidiaria de Sun Microsystems y ésta a su
vez de Oracle Corporation desde abril de 2009— desarrolla MySQL como software libre en un esquema de
licenciamiento dual.

Por un lado, se ofrece bajo la GNU GPL para cualquier uso compatible con esta licencia, pero para aquellas
empresas que quieran incorporarlo en productos privativos deben comprar a la empresa una licencia específica
que les permita este uso. Está desarrollado en su mayor parte en ANSI C.
Al contrario de proyectos como Apache, donde el software es desarrollado por una comunidad pública y los
derechos de autor del código están en poder del autor individual, MySQL es patrocinado por una empresa
privada, que posee el copyright de la mayor parte del código. Esto es lo que posibilita el esquema de
licenciamiento anteriormente mencionado. Además de la venta de licencias privativas, la compañía ofrece
soporte y servicios. Para sus operaciones contratan trabajadores alrededor del mundo que colaboran vía
Internet. MySQL AB fue fundado por David Axmark, Allan Larsson y Michael Widenius.

Permite administrar información de otros servidores de datos.

II.6.6.2. Hypertext Pre-Processor PHP.

PHP es un lenguaje de programación de uso general de código del lado del servidor originalmente diseñado para
el desarrollo web de contenido dinámico. Fue uno de los primeros lenguajes de programación del lado del
servidor que se podían incorporar directamente en el documento HTML en lugar de llamar a un archivo externo
que procese los datos. El código es interpretado por un servidor web con un módulo de procesador de PHP que
genera la página Web resultante.

Publicado bajo la PHP License, la Free Software Foundation considera esta licencia como software
libre. Permite la conexión a diferentes tipos de servidores de bases de datos tales como MySQL, PostgreSQL,
Oracle, ODBC, DB2, Microsoft SQL Server, Firebird y SQLite. PHP también tiene la capacidad de ser ejecutado
en la mayoría de los sistemas operativos, tales como Unix (y de ese tipo, como Linux o Mac OS X) y
 Microsoft Windows, y puede interactuar con los servidores de web más populares ya que existe en versión CGI,
módulo para Apache, e ISAPI.

II.6.6.3. HTML5:
HTML5 (HyperText Markup Language, versión 5) es la quinta revisión importante del lenguaje básico de la World Wide
Web, HTML. HTML5 especifica dos variantes de sintaxis para HTML: un «clásico» HTML (text/html), la variante conocida
como HTML5 y una variante XHTML conocida como sintaxis XHTML5 que deberá ser servida como XML.1 2 Esta es la
primera vez que HTML y XHTML se han desarrollado en paralelo.
Todavía se encuentra en modo experimental, lo cual indica la misma W3C, aunque ya es usado por múltiples
desarrolladores web por sus avances, mejoras y ventajas.
Al no ser reconocido en viejas versiones de navegadores por sus nuevas etiquetas, se recomienda al usuario común
actualizar a la versión más nueva, para poder disfrutar de todo el potencial que provee HTML5.
El desarrollo de este lenguaje de marcado es regulado por el Consorcio W3C.

II.6.6.4. CSS3:
Las hojas de estilo nos permiten definir de manera eficiente la representación de nuestras páginas y es uno de los
conocimientos fundamentales que todo diseñador web debe manejar a la perfección para realizar su trabajo.
La primera versión de CSS fue publicada a fines del año 1996 y fue logrando popularidad y aceptación hasta llegar a la
versión 2.1, estándar actual que ofrece gran compatibilidad con la mayoría de los navegadores del mercado.
A partir del año 2005 se comenzó a definir el sucesor de esta versión, al cual se lo conoce como CSS3 o Cascading Style
Sheets Level 3. Actualmente en definición, esta versión nos ofrece una gran variedad de opciones muy importantes para
las necesidades del diseño web actual. Desde opciones de sombreado y redondeado, hasta funciones avanzadas de
movimiento y transformación, CSS3 es el estándar que dominará la web por los siguientes años.

II.6.6.5. PDF:
Portable Document Format (formato de documento portable) es el formato de archivos desarrollado por Adobe
Systems y creado con los programas Adobe Acrobat Reader, Acrobat Capture, Adobe Distiller, Adobe Exchange,
y el plugin Amber de Adobe Acrobat.

Esta tecnología ha tenido éxito estandarizando el formato de los documentos que se utilizan y transfieren en
Internet.

II.7. CRONOGRAMA DE EJECUCIÓN

III. METODOLOGÍA EMPLEADA