UNIVERSIDAD NACIONAL DEL ALTIPLANO PUNO

Facultad de Ingeniera Estadstica e Informtica

MTODO DE DISEO DE

HIPERMEDIA ORIENTADO A

OBJETOS

PUNO PER 2015

Presentado por: Karol Pamela Ortega Maquera

Bernarda Quispe Alania Csar Reynaldo Mamani Turpo

Guido Torres

1

1 Mtodo de diseo de hipermedia orientado a objetos

OOHDM - Mtodo de Diseo de Hipermedia Orientado a

Objetos

Contenido

1. Historia: ......................................................................................................................... 2

2. Definicin: ..................................................................................................................... 2

3. Fases de desarrollo: ....................................................................................................... 3

3.1 Obtencin de Requerimientos: ................................................................................. 3

3.2 Diseo conceptual: .......................................................................................................... 3

3.3. Diseo navegacional:...................................................................................................... 4

3.4. Diseo de interfaz abstracta: ......................................................................................... 4

3.5. Ejecucin o Implementacin: ......................................................................................... 4

4. Ventajas: ........................................................................................................................ 4

5. Desventajas: .................................................................................................................. 4

6. SymWeb: Modelado de una Aplicacin de Simulacin Web mediante OOHDM: ........ 5

7. Bibliografa: ................................................................................................................... 8

2

2 Mtodo de diseo de hipermedia orientado a objetos

Object Oriented Hypermedia Design Method (OOHDM)

1. Historia:

Object Oriented Hypermedia Design Method (Mtodo de Diseo de Hipermedia Orientado a Objetos) para diseo de aplicaciones hipermedia y para la web, fue diseado por Daniel Schwabe y Gustavo Rossi. Originalmente surgi como una extensin de del mtodo HDM con orientacin a objetos, que se est convirtiendo en una de las metodologas ms utilizadas. Fue utilizada para disear diferentes tipos de aplicaciones hipermedia como galeras interactivas, presentaciones multimedia, CD-ROM promocionales, enciclopedias, museos virtuales y sobre todo numerosos sitios web.

2. Definicin:

OOHDM es un mtodo para el desarrollo de aplicaciones Web. Fue uno de los primeros mtodos para separar de las dificultades que definan diferentes modelos que se separaban en cinco etapas que son las siguientes fases del diseo:

Obtencin de Requerimientos

Diseo conceptual

Diseo navegacional

Diseo de interfaz abstracta

Ejecucin o implementacin

3

3 Mtodo de diseo de hipermedia orientado a objetos

En OOHDM las aplicaciones Web se construyen en las cinco etapas mencionadas, que permiten un modelo de proceso incremental o basado en prototipos. Cada etapa se centra en un diseo en particular y se construye un modelo orientado a objeto para cada etapa. Conceptos como clasificacin, agregacin y generalizacin se utilizan frecuentemente por los procesos de manera proveer un mayor poder de abstraccin y reutilizacin de componentes. Los principios utilizados en OOHDM tambin pueden ser aplicados en otra versin del modelo conocido como SHDM (Schawabe, 2004) en el cual el modelo de datos utilizado se encuentra basado en RDF y RDFS (Brickley y Guha, 2004). La diferencia principal con OOHDM es que SHDM utiliza tecnologa basada en Web semntica para representar de sus modelos. A continuacin, se presentan las cinco actividades propuestas por dicho modelo.

3. Fases de desarrollo:

3.1 Obtencin de Requerimientos:

La herramienta en la cual se fundamenta esta fase son los diagramas de casos de usos, los cuales son diseados por escenarios con la finalidad de obtener de manera clara los requerimientos y acciones del sistema.

3.2 Diseo conceptual:

La finalidad principal durante esta fase es capturar el dominio semntico de la aplicacin teniendo en cuenta el papel de los usuarios y las tareas que desarrollan. Se construye un modelo del dominio de la aplicacin, a travs de las tcnicas de modelado orientado a objetos, se puede partir de un modelo E/R. El resultado de esta fase es un modelo de clases relacionadas que se divide en subsistemas.

Productos: Diagrama de Clases, Divisin en subsistemas y relaciones.

Herramientas: Tcnicas de modelado O.O, patrones de diseo.

Mecanismos: Clasificacin, agregacin, generalizacin y especializacin.

Objetivo de diseo: Modelo semntico de la aplicacin

4

4 Mtodo de diseo de hipermedia orientado a objetos

3.3. Diseo navegacional:

La estructura de navegacin de una aplicacin hipermedia est definida por un esquema de clases de navegacin especfica, que refleja una posible vista elegida. Para construir la estructura navegacional se debe tener en cuenta:

Nodos que sern navegables, establecer los atributos que poseen y sus relaciones.

Contextos en que el usuario navegar para organizar el espacio navegacional.

Vistas de los objetos navegacionales

Estructuras que permitirn acceder a los nodos, por ejemplo: mens, ndices, guas de ruta, entre otros.

3.4. Diseo de interfaz abstracta:

En esta etapa se define la forma en la que sern percibidos los objetos a travs de la interfaz de usuario y tambin la apariencia que tendrn. Esto consiste en definir:

Qu objetos de interfaz va a percibir el usuario

El camino en el cul aparecern los diferentes objetos de navegacin

Qu objeto de interfaz actuarn en la navegacin

La forma de sincronizacin de los objetos multimedia y el interfaz de transformaciones.

3.5. Ejecucin o Implementacin:

Una vez cumplidas las 4 fases anteriores solo queda llevar los objetos a un lenguaje concreto de programacin. A partir de los modelos diseados, se deben escoger las correspondencias con los objetos concretos de la plataforma de implementacin. Es una etapa totalmente dependiente de la plataforma de implementacin escogida.

4. Ventajas:

Separacin clara entre lo conceptual, lo navegacional y lo visual. Esta independencia hace que el mantenimiento de la aplicacin sea mucho ms sencillo.

Hace un estudio profundo de los aspectos de interfaz, esencial no solo en las aplicaciones multimedia, sino que es un punto crtico en cualquiera de los sistemas que se desarrollan actualmente.

Hace uso tambin de la orientacin a objetos y de un diagrama tan estandarizado como el de clases, para representar el aspecto de la navegacin a travs de las clases navegacionales.

5. Desventajas:

o Ha dejado fuera de su mbito un aspecto esencial que es el tratamiento de la funcionalidad del sistema.

o No ofrece ningn mecanismo para trabajar con mltiples actores.

5

5 Mtodo de diseo de hipermedia orientado a objetos

6. SymWeb: Modelado de una Aplicacin de Simulacin Web mediante

OOHDM:

SymWeb est enfocado a la simulacin de modelos matemticos veterinarios por parte

de personas interesadas en el tema, se definieron los roles dependiendo de las

caractersticas particulares que puede poseer un usuario. El listado de roles (omitiendo

tareas por cuestin de espacio) se presenta en el siguiente cuadro:

El rol bsico es el Usuario No Registrado. Este tipo de actor puede cambiar de rol dependiendo del evento denominado Registro de Usuario, en donde este actor pasa ahora a ser parte de otro grupo (Usuario Registrado). Por otra parte, algunos de estos usuarios registrados tienen la capacidad de poder ejecutar otro rol de manera simultanea: Usuario Publicador. Existe el actor de la aplicacin que le indica a un Usuario Registrado cuando puede desempear el rol alterno, ste es el Administrador, quien al fin y al cabo es un actor multifactico, ya que puede desempear todos los roles dentro de la aplicacin. Segn el anlisis realizado en los requerimientos, se obtuvieron 10 especificaciones de escenarios que se consideraron bsicas para el modelado de la aplicacin, las cuales van desde navegar SymWeb hasta salirse de SymWeb, entre otros. En consecuencia, se realizaron 12 CU, los cuales se enlistan a continuacin: Registro de Usuario, Inicio de Sesin, Actualizacin de Datos del Usuario, Simulacin de Modelos Matemticos, Graficacin de Resultados, Publicacin de Modelos Matemticos, Bsqueda Interna General, Bsqueda Interna Avanzada, Dar de baja a un Usuario, Dar de baja a un Modelo, Darse de baja como Usuario y Salirse de SymWeb. Para el desarrollo de SymWeb se enriqueci el significado de las elipses que componen los UID para sealar el lugar (fsico o abstracto) que se ve afectado por el procesamiento de informacin. Tambin se adaptaron stos con etiquetas aadidas a las elipses para facilitar su lectura. En la Figura 1 se presenta el UID para el Registro de Usuario. Los UID en SymWeb se realizaron en el orden determinado por los CU.

6

6 Mtodo de diseo de hipermedia orientado a objetos

Para abstraer las clases involucradas con SymWeb hay que tener en cuenta que sta es una aplicacin que consiste en simular modelos matemticos que generen resultados grficos por usuarios que probablemente tendrn la capacidad de publicar tales modelos bajo el control de un administrador, quin por defecto publica los modelos. El enunciado anterior encierra los puntos sealados en los escenarios realizados previamente. De esta forma se obtuvieron las clases preliminares: Modelos Matemticos, Grficas, Usuarios y Administrador. Como resultado de un diseo detallado, se abstrajeron 17 clases (presentadas sintticamente en la Figura 2) que definen 11 enuncia dos que describen SymWeb de manera conceptual. La definicin de los nodos en SymWeb se bas en realizar preguntas concretas sobre los eventos y acciones asociados a la clase conceptual. Como resultado se obtuvo 8 tipos de nodos diferentes. Como puede observarse en la Figura 3 correspondiente al nodo Administrador, el nodo admin es una instancia de la clase Admin que se reconoce dentro de la aplicacin con la variable admin. Este nodo hereda los atributos (e.g. login) y mtodos (e.g. Darse_de_baja()) de la clase Usuario. Diseando de manera similar los dems nodos, se establecen 4 esquemas de clases navegacionales para SymWeb, donde cada una est relaciona con el usuario actual de la aplicacin.

En el caso de SymWeb se concluy el diseo navegacional con tan solo un esquema de contexto navegacional. Esto se debe a que modelamos la aplicacin SymWeb de manera particular, por lo que no llegamos a un esquema conceptual adaptable a todas las aplicaciones de hipermedia que hagan simulacin. Para poder realizar este esquema fue necesario instanciar los contextos genricos en contextos particulares dentro de los nodos. En el esquema de contexto navegacional se pueden observar ciertos detalles. Primeramente, se tiene un ndice general denominado Opciones de SymWeb que procede segn el tipo de usuario que navegue (i.e. registrado o no registrado). Los usuarios no registrados solo acceden a los nodos generales del modelo y de grfica. Si un usuario es

7

7 Mtodo de diseo de hipermedia orientado a objetos

registrado, entonces accede al nodo de login donde dispara el mtodo inicio_de_sesion() para despus acceder al Men General que est representado por un ndice (i.e. una lista de enlaces a las opciones). Adjunto a este ndice estn el de Men Publicacin y Men Administracin, los cuales estn etiquetados con un ovalo negro a su izquierda; este ovalo indica que son ndices de acceso restringido y que en nuestro caso solo estn disponibles para un usuario con permiso de publicar y para un usuario que tenga adems permiso de administrador, respectivamente. Se observa tambin que todos los usuarios pueden acceder a un ndice de Bsqueda, el cual devuelve informacin tanto de modelos encontrados, as como de archivos relacionados a stos, almacenados en el servidor. Durante el proceso de AID, se definieron varios ADV, los cuales indicaban que componentes de informacin seran utilizados en secciones particulares de la navegacin. Con respecto a la implementacin, se defini que SymWeb fuera una aplicacin basada en pginas web dinmicas que interactan entre ellas. Estas pginas fueron desarrolladas con la tecnologa de Pginas de Servidor Activas (ASP) de Microsoft, incluyndose tambin JavaScript para analizar rutinas de validacin y otras funciones en el lado del cliente. La decisin de utilizar ASP se bas en la tecnologa disponible al momento de iniciar el proyecto. Sin embargo, se tiene contemplado realizar futuros trabajos que permitan comparar la tecnologa empleada con otras existentes. El acceso por parte de los usuarios se realiza a travs de sesiones. La entrada de toda la informacin se hace a travs de elementos de formulario, la cual es procesada siempre del lado del servidor. El proceso de publicacin de un modelo se realiza a travs del pre procesamiento de un archivo de texto que contiene ecuaciones diferenciales generadas a partir de un software de simulacin para PC. Este proceso se auxilia con un componente para cargar archivos en el servidor. Cuando se realiza la simulacin de un modelo, la tabulacin de resultados se establece en un archivo XML que es pasado como parmetro a un componente de graficacin. Se cuida que ninguna grfica se presentada hasta que algn modelo se simule. El manejo de los datos del lado del servidor se realiza utilizando tres tablas: Una para los usuarios, otra para los modelos y una tercera para archivos que contengan informacin sobre los modelos. El sitio est compuesto por una raz denominada SymWeb y que ser el elemento final de la cadena correspondiente al URL. En esta carpeta se encuentran todas las pginas a las que accede el usuario. En adicin, se encuentran otras carpetas de propsito especfico (e.g. carpeta de modelos). Vista (sintetizada) de Datos Abstracto correspondiente a la graficacin de resultados de un usuario registrado:

8

8 Mtodo de diseo de hipermedia orientado a objetos

Se conceptualiza la GUI tomando en cuenta los cinco atributos de definicin de la usabilidad segn Nielsen. Se utiliz un smil de carpetas. Cuando fue necesario, se present al usuario retroalimentacin o mensajes de error procurando ser siempre claros. Se consider una GUI en tonalidades verdosas debido al perfil del usuario potencial y se emple tipografa fcil de leer en monitor con el fin de incrementar la satisfaccin subjetiva que marca la usabilidad web [9]. Incluso se emple en el diseo de interfaz los principios de la psicologa Gestalt. Portal de acceso Interfaz Grfica de Usuario de SymWeb:

7. Bibliografa:

Anay Carrillo Ramos (2009), Enseanza de la metodologa rup de ingeniera del software [Internet]. Disponible en: http://www.eumed.net/libros-gratis/2009c/587/Metodologias%20y%20Tecnologias%20Actuales%20para%20la%20construccion%20de%20Sistemas%20Multimedia.htm

Aime Ros (2015), OOHDM (Modelo de Diseo de Hipermedia Orientado a

Objetos [Internet]. Disponible en: https://prezi.com/awcjzx3xucxq/oohdm-

modelo-de-diseno-de-hipermedia-orientado-a-objetos-/

OOHDM(2014)[Internet]. Disponible en: https://es.wikipedia.org/wiki/OOHDM

Omar Sosa-Tzec, Vctor Menndez-Domnguez, Luis Vargas-Villamil (2014),

SymWeb: Modelado de una Aplicacin de Simulacin Web mediante OOHDM

[Internet]. Disponible en: https://www.researchgate.net/publication/2

60782194_SymWeb_Modelado_de_una_Aplicacion_de_Simulacion_Web_mdi

ante_OOHDM