Modelado de Aplicaciones Web

Un acercamiento sistemtico y una

especificacin de la aplicacin web para ser
construido bajo la forma de modelos visuales
se recomiendan si necesitamos desarrollar
aplicaciones Web complejas.

Las disciplinas de Ingenera han utilizado

modelos para reducir la complejidad,
documentar las decisiones de diseo y
facilitar la comunicacin entre el equipo del
proyecto.
El modelado provee una especificacin del
sistema a ser construido en un grado de
detalle suficiente para su implementacin.
El objeto del modelado es la aplicacin a ser
construida.

3 Dimensiones:
Niveles: Lgica de Aplicacin(Qu?), Interface del
usuario(Cmo?)
Aspectos: Estructura(objetos y relacionamientos) y
comportamiento (funciones y procesos). Herramientas CASE
Fases de Desarrollo: Anlisis, Diseo e Implementacin

Considerar: Similar a documentos y navegacin no lineal del

hipertexto

Se tiene 3 niveles: esta separacin permite el reuso.

Contenido: informacin y lgica de aplicacin
Hipertexto: contenido en nodos y enlaces entre los mismos.
Presentacin: Interface del Usuario o disposicin de la pgina.

4ta Dimensin:
Personalizacin: informacin de contexto y adaptar la
aplicacin web

El ms utilizado: Casos de Usos para requerimientos

funcionales.
Diagrama de actividades, describe los requerimientos
funcionales en ms detalle.
Para contemplar la funcionalidad de navegacin se utiliza el
modelo de casos de usos con el estereotipo <<navigation>>
Las aplicaciones Web al menos tienen un usuario humano
desconocido.
Cada caso de uso debe ser descrito en detalle: en forma
textual o utilizar un diagrama de comportamiento.
Ejemplo: Sistema de revisin de papers para conferencia

La informacin proveda por la aplicacin Web es

uno de los factores ms importantes para el
xito del mismo.
Modelar el contenido (ER o diagrama de clases) y
el comportamiento, aspectos estticos y
dinmicos.
Se debe considerar las caractersticas Web:

Centrado en documentos y multimedia: diferentes

formatos multimediales y la estructura de la informacin
Integracin de datos y programas existentes: Se
construyen sobre repositorios de datos y componentes
de softwares existentes.

Objetivo: Transferir la informacin y los

requisitos funcionales determinados por la
ingenera de requerimientos a un modelo

Propiedad importante a considerar: navegacin

no lineal del hipertexto.
Objetivo: Especificar la navegacin entre el
contenido de una aplicacin Web.
Centrado en el aspecto estructural del
hipertexto (cules clases del Modelado de
Contenido pueden ser visitadas por la
navegacin) y el acceso a los elementos.
Basado en el concepto de hipertexto:nodos y
enlaces
Las clases que representan nodos tienen el
estereotipo <<navigation class>>

Segn los requerimientos funcionales de la

aplicacin Web, UWE (UML-based Web
Engineering; Koch y Kraus 2002,2003):

Enlaces de navegacin: utilizado para navegar entre

nodos. Ej: enlaces entre los papers y sus autores
Enlaces de procesos: Punto del nodo inicial de un
proceso. Ej: El inicio del envo de revisiones.
Enlaces externos: enlace a un punto que no pertenece
directamente a la aplicacin. Ej: enlace a la gua del
formato establecido por el publicador de la conferencia,
el cual no est directamente almacenado en el sistema.
Relacin con el modelado de contenido: Qu clases y qu
conjuntos de objetos forman un nodo en el hipertexto?

Vista del Comite del

Programa (PC) en el
sistema de Revisin

El Modelado de la estructura del hipertexto no

es suficiente para cmo los nodos pueden ser
accedidos por la navegacin.
Estructuras de accesos recurrentes son
descritos como patrones de diseo.
Estructuras de acceso:

Index: permite al usuario seleccionar un tem.

Menu: permite al usuario acceder nodos hetereogneos
u otros submens
Guided tour: permite al usuario navegar
secuencialmente a travs de un nmero de nodos
Query: permite al usuario buscar los nodos.

Patrones de navegacin especiales incluyen

home y landmark (un nodo accedido desde
cualquier nodo)

Modela la interface del usuario y el look&feel de la

aplicacin.
Los objetivos: Asegurarse que la interaccin con la
aplicacin web sea simple y auto explicado.
Produce un concepto de presentacin uniforme
modelando elementos recurrentes en la pgina. Ej:
cabecera, pie, etc
Describe los apectos orientados al comportamiento de la
interface del usuario. Ej: qu botn activa una funcin de
la aplicacin.
El diseo de la disposicin grfica de la interface no es
soportado por las tcnicas de modelado.

Los elementos del modelo son descritos en tres niveles

jerrquicos:
Una pgina de presentacin: describe una pgina
presentada al usuario como una unidad de visualizacin.
Puede estar compuesta de diferentes unidades de
presentacin:
Una unidad de presentacin: agrupa elementos
relacionados de la interface del usuario, representando
una unidad lgica de la pgina. Representa un nodo del
modelo de hipertexto.
Un elemento de presentacin: es la unidad bsica del
modelo de presentacin. Representa un conjunto de
nodos de informacin y puede incluir texto, imagen,
audio, etc.
Utiliza los estereotipos de clase <<page>> y <<presentation
unit>>