METODOLOGIA UWE

En la siguiente imagen #nombre podemos observar que para el desarrollo del caso
de estudio con la integración de directrices debe contar con los siguientes
modelos que son : el modelo requerimiento, el modelo de contenido, el modelo
navegacional, el modelo de procesos y el de presentación.

Diagrama 1: Modelos de Metodología UWE

REQUISITOS:

En esta etapa haremos énfasis en el modelo de requisitos y en el modelo de contenido

que son parte de la metodología UWE:

1. Modelo de Requerimiento:

Se realizó una descripción general de los diferentes procesos que podría contener
el sistema para ello se plasma a través de casos de usos, que son una descripción
del comportamiento del sistema al afrontar una tarea o requisito de negocio.

El modelado de requisitos de la uwe consiste en el desarrollo de dos partes:

 Casos de uso de la aplicación y sus relaciones.

 Diagrama de proceso que son la descripción de los casos de uso al detalle

1.1. Caso de uso

Se utilizó para describir la relación que existe entre los actores y el sistema. En los
diferentes diagramas de casos de usos que veremos a continuación, veremos el uso
de diferentes estereotipos como son:

 «navegación» ( ): Se utiliza cuando, el usuario realiza cualquier acción que

no afecta drásticamente a la aplicación o no realiza ningún cambio a nivel de
base de datos.
 «proceso» ( ): Sirve para ilustrar si los datos persistentes de la aplicación
son modificados o no.

En la siguiente imagen (diagrama#), nos da una visión general de lo que

contendrá el sistema, la cual cuenta con 3 procesos que son la creación de
exámenes, la corrección de exámenes y rendir el examen.

Diagrama 2: Visión general del Sistema de Exámenes Online

A continuación mostraremos los diferentes diagramas que se realizó en los casos

de uso:

a. Diagrama de actores:

Sirve para la identificación de los diferentes actores que harán uso de la

aplicación. Para este caso de estudio tendremos los siguientes actores:

 El docente: Quien es el encargado de la creación y corrección de

exámenes.
 El alumno: Quién es el encargado de la resolución de exámenes.
 Diagrama 3: Diagrama de Actores del Sistema

b. USE CASE DIAGRAM Crear examen :

Diagrama 4: Casos de Uso: Crear Examen

c. USE CASE DIAGRAM Corregir Examen

 Diagrama 5: Caso de Uso: Corregir Examen

d. USE CASE DIAGRAM Dar examen:

 Diagrama 6: Casos de Uso: Rendir Examen

1.2. Diagrama del Flujo Procesos (DFP)

Los diagramas de procesos, son una serie de secuencia de pasos, que sirve para
modelar el comportamiento del sistema. Como con casos de uso solamente es
posible capturar poca información, cada caso de uso puede ser descripto más
detalladamente mediante un proceso. Es decir, las acciones que son parte de un
caso de uso así como los datos presentados al usuario y aquellos requeridos como
entrada de datos pueden ser modelados con precisión como actividades.

Para el desarrollo de los diferentes diagramas de proceso que veremos a

continuación, veremos el uso de diferentes estereotipos como son:

 «user Action» ( ): Es utilizado para indicar interacciones que el usuario

realiza en el sistema.
 «system Action»( ) describe acciones que son ejecutados por el sistema.

A continuación mostraremos los diferentes diagramas que se realizaron el diagrama

del flujo de proceso.
a. Diagrama del Flujo del Proceso Crear Examen:

Diagrama 7: Diagrama del Flujo del Proceso: Crear Examen

b. Diagrama del Flujo del Proceso: Actualizar Examen

Diagrama 8: Diagrama del Flujo del Proceso: Actualizar Examen

c. Diagrama del Flujo del Proceso Rendir Examen

Diagrama 9: Diagrama del Flujo de Proceso: Rendir Examen

d. Diagrama del Flujo del Proceso Corregir Examen

 Diagrama 10: Diagrama del flujo del proceso: Corregir Examen

e. Diagrama del Flujo del Proceso: Eliminar Examen

 Diagrama 11: Diagrama del Flujo del Proceso Eliminar Examen

f. Diagrama del Flujo del Proceso Generar Reporte

 Diagrama 12: Diagrama del Flujo del Proceso Generar Reporte

g. Diagrama del Flujo del Proceso ver examen

 Diagrama 13: Diagrama del Flujo del Proceso Ver examen

h. Diagrama del Flujo del Proceso de Publicar Notas

Diagrama 14: Diagrama del Flujo del Proceso Publicar Notas

 i. Diagrama del Flujo del Proceso de Logearse

Diagrama 15: Diagrama del Flujo del Proceso Login

En los diagramas de flujo de proceso se han incluido los requerimientos funcionales

de usabilidad generados a partir de la aplicación de UPSEPS, que hacen referencia
a los mecanismos de usabilidad:

a) Warning.
b) System Status Feedback:
c) Interaction Feedback:
d) Abort Operation:
 Nombre del Mecanismo de
Componente representativo
diagrama Usabilidad

Warning

System Status
DFP Crear Feedback
Examen
Interaction
Feedback

Abort Operation

Warning

DFP Actualizar System Status

Examen Feedback

Interaction
Feedback

Abort Operation
 Warning

System Status
Feedback
DFP Rendir
Examen

Interaction
Feedback

Abort Operation

Warning

System Status
Feedback

DFP Corregir
Examen Interaction
Feedback

Abort Operation
 Warning

System Status
Feedback

DFP Eliminar Interaction

Examen Feedback

Abort Operation

Warning

System Status
Feedback
DFP Generar
Reporte

Abort Operation

Warning

DFP Ver Examen

System Status
Feedback
 Abort Operation

Warning

System Status
Feedback

DFP Publicar
Interaction
Notas
Feedback

Abort Operation

Warning

DFP Logearse

System Status
Feedback

2. 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.
 Diagrama 16: Modelo de Contenido

En el diagrama de contenido se han incluido los requerimientos funcionales de

usabilidad generados a partir de la aplicación de UPSEPS, que hacen referencia a
los mecanismos de usabilidad:

a) Help
b) User Profile
c) Warning
d) System Status feedback
 REQUERIMIENTO DE
MECANISMO DE
ALMACENAMIENTO DE DESCRIPCIÓN
USABILIDAD
INFORMACIÓN

System Status
feedback

El sistema deberá almacenar la

información correspondiente a
los mensajes de alertas que se
Warning
pueden ser mostrados en el
sistema.

El sistema deberá almacenar la

Help información correspondiente a la
ayuda que el sistema puede dar al
usuario que haga uso del sistema.

El sistema deberá almacenar la

información correspondiente a la
personalización que le da el
usuario al sistema, en cuanto al
User Profile
Choose Skin (tema o color) según
su preferencia así como la
locación del menú, ya sea
izquierda o derecha.
User Input Error El sistema deberá almacenar la
Prevention información correspondiente con
un formato específico.

3. Modelo de Navegación:
Este modelo indica como el sistema de página web del sitio está relacionado
internamente. Es decir aquí veremos cómo se enlazan los elementos de navegación.
Pa ello se utilizan unidades de navegación llamadas “nodos” conectadas por enlaces
de navegación.

En los diferentes diagramas de navegación que veremos a continuación, veremos el

uso de diferentes estereotipos como son:

 «navegationClass» ( ): Representa un nodo navegable de la estructura de

hipertexto y establecer la conexión entre el modelo de navegación y el modelo
de contenido.
 «index» ( ): Permite la selección de una instancia de clase de contenido a
partir de un conjunto de instancias que ha sido recopilada durante la
navegación anterior.
 «menu» ( ): Se utiliza para controlar rutas de navegación
alternativos.
 «query» ( ): Se utiliza cuando se va a recuperar el contenido de una

fuente de datos.
 «processclass» ( ): Sirve para ilustrar si los datos persistentes de la
aplicación son modificados o no.
 «processLink»: Te permite conectar dos nodos
 «NavigationLink»: Es un enlace que conecta a cualquier tipo de nodos.

a. Modelo Nvegacional del Docente

 Diagrama 17: Modelo Navegacional del Docente

b. Modelo Nvegacional del Alumno

 Diagrama 18: Modelo Navegacional del Alunno

c. Modelo Navegacional del Administrador

Diagrama 19: Modelo Navegacional del Administrador

En el diagrama navegacional, no se ha incorporado ningún mecanismo de usabilidad,
debido a que aquí solo se plasma la interacción que el usuario deberá tener al usar
el sistema.

4. Estructura del diagrama de Procesos.

En este diagrama se define las relaciones entre las diferentes clases proceso.

En los diferentes diagramas de navegación que veremos a continuación, veremos el

uso de diferentes estereotipos como son:

 «processclass» ( ): Se utilizan para integrar los procesos de negocio en el

modelo de navegación y para definir los datos que se intercambia con el
usuario durante el proceso.
a. Estructura de Proceso Crear Examen
 Diagrama 20: Estructura del Proceso de Crear Examen

b. Estructura de Proceso Corregir Examen

Diagrama 21: Estructura del Proceso Corregir Examen

c. Estructura de proceso Rendir Examen

 Diagrama 22 Estructura del Proceso de Rendir Examen

d. Estructura de Proceso Login

 Diagrama 23: Estructura del proceso de Login

En los diagramas de estructura de proceso se han incluido los requerimientos

funcionales de usabilidad generados a partir de la aplicación de UPSEPS, que hacen
referencia a los mecanismos de usabilidad:

a) Warning.
b) System Status Feedback:
c) User Input Error Prevention

Nombre del Mecanismo de

Componente representativo
diagrama Usabilidad

Warning

Estructura de
procesos Crear
Examen
System Status
Feedback
 User Input Error
Prevention

Warning

Estructura de System Status

procesos Rendir Feedback

Examen

User Input Error

Prevention

Warning

System Status
Estructura de Feedback

procesos Corregir
Examen

User Input Error

Prevention
 Warning

System Status
Feedback
Estructura de
procesos de Login

User Input Error

Prevention

5. Diagrama de Presentación:
En este modelo se representan las clases de navegación y de procesos que pertenecen a
cada página web.
En los diferentes diagramas de presentación que veremos a continuación, veremos
el uso de diferentes estereotipos como son:

 <<presentacionAlternatives>> ( )
 <<presentacionGroup>> ( )
 <<iteratedPresentacionGroup>> ( )
 <<inputForm>> ( )
 <<presentacionPage>> ( )
 <<<tab>> ( )
 <<button>> ( )
 <<anchor>> ( )
 <<text>> ( )
 <<image>> ( )
 <<selection>> ( )
 <<textInput>> ( )
 a. Modelo de presentación del Login

Diagrama 24: Modelo de presentación del Login

b. Modelo de presentación del Docente

 Diagrama 25: Modelo de presentación del docente

c. Modelo Navegacional del Alumno

 Diagrama 26: Modelo de presentación del Alumno

En los diagramas de presentación se han incluido los requerimientos funcionales de

usabilidad generados a partir de la aplicación de UPSEPS, que hacen referencia a
los mecanismos de usabilidad:

a) Warning.
 b) System Status Feedback:
c) Interaction Feedback
d) User Input Error Prevention
e) Help

f) User Profile

Mecanismo Componente Nombre del

de usabilidad representativo Diagrama
Modelo de Mecanismo de
Presentación del usabilidad
Logeo incorporado en
Modelo de cada uno de los
Presentación del modelos de
Warning Docente presentación
para el aviso de
Modelo de
mensajes, sobre
Presentación del
acciones que
Alumno
afectaran al
sistema.
Modelo de Mecanismo de
Presentación del usabilidad
Logeo incorporado en
Modelo de todos los
Presentación del modelos de
System
Docente presentación
Status
para el aviso de
Feedback
Modelo de mensajes, sobre

Presentación del errores al

Alumno realizar una
determinada
acción.
 Modelo de
La incorporación
Presentación del
de User Input
Logeo
Error Prevention
en los modelos de
User Input
presentacion sirve
Error Modelo de
para especificar la
Prevention
Presentación del entrada de texto
Docente en cada uno de
los diferentes
Modelo de diagrams.
Presentación del
Alumno

Modelo de La incorporación
Presentación del del Help en los
Logeo modelos de
Modelo de presentación,
Presentación del hace referencia
Help Docente a una ventana
de ayuda
Modelo de
cuando el
Presentación del
usuario solicite
Alumno
como realizar
una actividad.
Modelo de La incorporación
Presentación del de User Profile
Logeo en el pódelo de
User Profile
Modelo de presentacion,
Presentación del hace referencia
Docente a cambios que el
 Modelo de usuario podría
Presentación del realizar el
Alumno diseño del
sistema.