Aplicacin de la Ingeniera Web al Desarrollo de Aplicaciones Web

Prof. Martn Jacobo Huamn Consultor de Sistemas

Modelar la Web...
2

Introduccin
Internet Paradigma de computacin Clasificacin de Sistemas Web Estticos Estticos con formularios de entrada Con acceso dinmico a datos Construidos dinmicamente Aplicaciones Software para el Web Comercio electrnico, hipermedia, aplicaciones clsicas, etc...
3

Introduccin. Necesidades (I)

Estas aplicaciones necesitan gestionar esencialmente: Requisitos de Navegacin dentro de la aplicacin Presentacin de informacin Gestin de informacin (filtrados, bsquedas, ...) Tratamiento de usuarios:
Gran cantidad de tipos de usuarios (taxonomas) Adaptacin / Personalizacin

+ ... requisitos de las aplicacions clsicas

4

Introduccin. Necesidades (II)

... especificar bsquedas ... Permita capturar la navegacin ...

... tratar la visualizacin de informacin ...

5

... y la ejecucin de servicios

Introduccin. Camino a seguir ...

Construir entornos de desarrollo Web que ...
definan un proceso sistemtico y estructurado de produccin de software faciliten la especificacin de los sistemas usando tcnicas basadas en el modelado conceptual permitan el rpida prototipo

Ingeniera Web!!
6

Introduccin. OOWS
Un mtodo de desarrollo Web ... Mtodo de Produccin de Soluciones Web Orientadas a Objeto. introduce nuevos conceptos OO para dar la nocin de semntica navegacional y de presentacin (primitivas de modelado) define un proceso de produccin sistemtico adaptado al web usa una estrategia de generacin de cdigo basada en modelos (patrones software) extiende adecuadamente OO-Method (un mtodo OO de desarrollo de software)
7

OOWS : Un Mtodo de Produccin de Aplicaciones Web

Proceso de Desarrollo

OOWS. Proceso de desarrollo

El proceso de desarrollo de aplicaciones web que propone OOWS tiene dos grandes pasos:
Especificacin conceptual de la aplicacin Uso de modelos conceptuales Desarrollo de la solucin final
9

OOWS. Proceso de desarrollo

En la especificacin conceptual:
Clsico

Web

Descripcin de las necesidades de las aplicaciones convencionales (estructura y comportamiento) usando modelos OO (OOMethod) Descripcin de las caractersticas web mediante modelos web Modelo Navegacional, de Presentacin, etc
10

OOWS. Proceso de desarrollo

(Problem Space) ESPECIFICACI CONCEPTUAL
ELICITACIN REQUISITOS
(Casos Uso, Escenarios)

MODELO ESTRUCTURAL MODELO DINMICO MODELO FUNCIONAL

MODEL NAVEGACIONAL

Modelado Conceptual

Extensiones Web

MODEL PRESENTACI

DESARROLLO DE SOLUCIN

(Solution Space)

Implementacin Automtica
CAPA DE INTERFAZ (Entornos Web) OO-Method (SW clsico)

CAPA DE LGICA DE APLICACI (Lgica de Negoci)

CAPA DE PERSISTENCIA (SGBD)

11

Arquitectura Software

OOWS (SW web)

OOWS : Un Mtodo de Produccin de Aplicaciones Web

Modelo de Navegacin

Introduccin
Qu es la navegacin? Idea Intuitiva (bajo nivel de abstraccin): La navegacin es un salto de una pgina web a otra pgina web, provocado por la seleccin de un enlace, en el que se cambia de contenido (informacin y/o funcionalidad)
13

Modelo de Navegacin
Especifica las caractersticas navegacionales de las aplicaciones web (acceso a informacin y ejecucin de servicios) Se construye mediante primitivas (grficas) de abstraccin navegacional Define y estructura el acceso al sistema para los diferentes tipos de usuarios
1. Gestin de Usuarios Diagrama de Usuarios 2. Especificacin de las Propiedades Navegacionales Mapas Navegacionales
14

OOWS : Un Mtodo de Produccin de Aplicaciones Web

Modelo de Navegacin Gestin de Usuarios

Modelo de Navegacin.
Gestin de Usuarios

Deteccin de potenciales tipos de usuarios Cada tipo de usuario representar un conjunto de usuarios con objetivos y responsabilidades comunes en el sistema Especificacin de inter-relaciones entre usuarios (taxonomas de usuarios)
16

Modelo de Navegacin.
Gestin de Usuarios. Acceso

Se distinguen tres tipos de usuario, en funcin del tipo de acceso que tengan con el sistema:
Annimos Registrados Sin permiso
17

Modelo de Navegacin.
Gestin de Usuarios. Annimos Al conectarse al sistema, estos usuarios no necesitan identificarse Habitualmente sus permisos con el ? sistema son muy reducidos No se pueden establecer polticas de personalizacin individuales
Internauta

18

Modelo de Navegacin.
Gestin de Usuarios. Registrados
Estos usuarios necesitan identificarse al conectarse al sistema Habitualmente, gestionan la funcionalidad del sistema y la informacin sensible Se pueden establecer polticas de personalizacin individuales
Socio

19

Modelo de Navegacin.
Gestin de Usuarios. Sin permiso
Estos usuarios no pueden acceder al sistema Son usuarios virtuales (no existen en la realidad) Se utilizan para expresar responsabilidades comunes entre usuarios
Departamento Tcnico

20

Modelo de Navegacin.
Gestin de Usuarios. Diagrama de Usuarios
Los usuarios se organizan en un diagrama de usuarios Este diagrama permite expresar:
los tipos de usuarios que pueden usar el sistema y su accesibilidad al sistema las relaciones entre los usuarios
21

Modelo de Navegacin.
Diagrama de Usuarios. Fases

Para construir un diagrama de usuarios debemos seguir las siguientes fases:

1. Detectar cada tipo de usuario 2. Asignar el modo de acceso a cada tipo de usuario 3. Detectar las relaciones entre los usuarios
22

Modelo de Navegacin.
Diagrama de Usuarios.
Deteccin de Usuarios
1. Para cada tipo de usuario que pueda usar el sistema, se aade usuario al diagrama

Internauta

Bibliotecario

Socio

Director

Responsable de compras

Ejemplo: En esta biblioteca hay Internautas (exploran el catlogo), Bibliotecarios (gestionan el catlogo), Socios (pueden sacar libros), el/los Director/es (gestiona la biblioteca), Responsables de compras (se encargan de comprar material bibliogrfico)
23

Modelo de Navegacin.
Diagrama de Usuarios.
Asignacin del Modo de Acceso
2. A cada usuario se le asigna un modo de acceso: annimo registrado
?

Internauta

Bibliotecario

Socio

Director

Responsable de compras

Ejemplo: En esta biblioteca los Internautas son usuarios annimos, y el resto (Bibliotecarios, Socios, el/los Director/es, Responsables) necesitan identificacin
24

Modelo de Navegacin.
Diagrama de Usuarios.
Relaciones entre Usuarios (I)
3. Detectar las relaciones entre los usuarios

La relacin posible entre usuarios es la de especializacin (is-a) de usuarios Las relaciones entre usuarios permiten expresar la comparticin de propiedades navegacionales
El usuario especializado hereda la accesibilidad al sistema (mapa de navegacin1) del usuario base
1

Se estudian estas propiedades ms adelante en el Modelo de Navegacin

25

Modelo de Navegacin.
Diagrama de Usuarios.
Relaciones entre Usuarios (II)

El usuario especializado puede:

definir nuevas propiedades navegacionales cancelar propiedades navegacionales modificar propiedades navegacionales

Los usuarios Annimos no pueden especializarse a partir de otro tipo de usuarios

26

Modelo de Navegacin.
Diagrama de Usuarios.
Relaciones entre Usuarios (III)

Se pueden introducir usuarios sin permiso de acceso:

cuando existen usuarios que comparten gran parte de sus propiedades navegacionales para expresar la jerarqua funcional en una empresa (departamentos, secciones, etc.) para organizar y estructurar los usuarios del sistema

27

Modelo de Navegacin.
Diagrama de Usuarios.
Relaciones entre Usuarios (IV)
Usuario Sin Permiso. No puede acceder al sistema. Se usa para describir las propiedades navegacionales comunes entre sus usuarios especializados (Directores y Responsables de Compras)

Internauta

Usuario Annimo. Es el usuario elemental. Todos los dems usuarios extienden sus posibilidades navegacionales
Socio

Direccion

Bibliotecario

Usuario Registrado. Un Director necesitar identificarse para acceder al sistema

Director Responsable de compras

Diagrama de Usuarios de una Biblioteca

28

OOWS : Un Mtodo de Produccin de Aplicaciones Web

Modelo de Navegacin Especificacin de las Propiedades de Navegacin

Modelo de Navegacin.
Definicin de las Propiedades Navegacionales
Las propiedades navegacionales de una aplicacin web se describen asociando un mapa navegacional para cada tipo de usuario
?
Internauta
Socio

Direccin

E contexto Libros
E contexto Libros E contexto Autores

Internauta
E contexto Libros S contexto Prestados

Direccion

Bibliotecario

Socio
Bibliotecario

Anonymous

Responsable de compras

E
context Activities

S
E E
context Group context Projects

E contexto Libros

E contexto Director. Autores

E << contexto >> Libros E << contexto >> Tematicas

contexto Prestados

E
context ResearchLines

Director
E
context Publications

Responsable de compras
S S << contexto >> Detalles_Libro << contexto >> Libros_Tematica

S E
context Members context Guests

30

Modelo de Navegacin.
Mapa Navegacional
Proporciona la vista global del sistema para cada tipo de usuario (descripcin global) Grafo navegacional, compuesto de:
Member
Anonymous

Nodos Navegacionales Enlaces Navegacionales

E
context Activities

E E
context Group context Projects

E
context ResearchLines

Define la estructura del Web Site

31

E
context Publications

S E
context Members context Guests

Modelo de Navegacin.
Enlace Navegacional
Define una relacin de alcanzabilidad entre nodos de navegacin
E
Anonymous

Dos tipos de enlaces: de secuencia: (flechas

context Activities

E E
context Group context Projects

E
context ResearchLines

continuas) definidos implcitamente por las relaciones navegacionales de contexto (en definicin de contexto). Llevan informacin contextual.

E
context Publications

S E
context Members context Guests

de exploracin: (flechas discontinuas) definidos implcitamente por los contextos de Exploracin. No llevan informacin contextual
32

OOWS : Un Mtodo de Produccin de Aplicaciones Web

Modelo de Presentacin

Modelo de Presentacin
Este modelo captura los requisitos abstractos de presentacin de informacin Se basa en el modo de presentacin asociado a cada nodo (contexto) del modelo de navegacin Asocia patrones de presentacin a los elementos que constituyen estos contextos navegacionales (clases navegacionales, relaciones navegacionales, ndices, ...)
34

Modelo de Presentacin
Los patrones de presentacin son:
Disposicin de informacin (Layout) [ Registro, Tabular, rbol, Maestro-Detalle ] Criterios de Ordenacin de informacin por valor de atributos [ ASCendente, DESCendente ] Paginacin de informacin Cardinalidad de conjuntos (num. elementos)
[ esttica, dinmica ]

Modo de Acceso a los conjuntos

[ secuencial, aleatorio]
35

Modelo de Presentacin.
Patrones de Presentacin (I)
Se aplican los patrones de presentacin a los elementos que componen un Contexto de Navegacin
<< context >> Members

Disposicin (layout pattern): [Tabular, Registro, rbol, Maestro-Detalle] Se aplica a: relaciones navegacionales, clase directora Paginacin de Informacin: Cardinalidad bloque [esttica, dinmica] - Modo de Acceso [secuencial, aleatorio] - Circularidad Se aplica a: contexto, relaciones navegacionales, ndices y filtros Ordenacin: [ASCendente, DEScendente] Se aplica a: clases navegacionales (atributos), ndices y filtros
36

Pattern: Register Pagination: Static Cardinality 1 Sequential access Order: isDoctor (ASC) surname (ASC) Member

Pattern: Register

WorkOn

Pattern: Register

Entity

Pattern: Register

RGroup

OOWS : Un Mtodo de Produccin de Aplicaciones Web

Estrategia de Implementacin

Estrategia de Implementacin
OOWS extiende la estrategia de generacin de cdigo de OOMethod:
introduce la interfaz web reusa la lgica de negocio y la persistencia
ESPECIFICACIN CONCEPTUAL (Problem Space)
MODELO ESTRUCTURAL MODELO DINMICO MODELO FUNCIONAL

ELICITACIN DE REQUISITOS

MODELO NAVEGACIN

G G e e CAPA INTERFAZ (Entornos Web) n n e SW) CAPA LGICA NEGOCIO (Servicios Web, Componentes e rr Arquitectura CAPA DE PERSISTENCIA (SGBD) a Software a 38 cc

Modelado Conceptua l

Extensiones Web

MODELO PRESENTACIN

DESARROLLO SOLUCIN (Solution Space)

Estrategia de Implementacin.
Interfaz Web
A partir de los modelos conceptuales navegacionales: Modelo Navegacin y de Presentacin
Aplicacin de patrones de traduccin:
Mapa Navegacional Define la estructura de pginas web enlazadas para cada tipo de usuario Contexto de Navegacin Pgina Web
Contextos de Exploracin Pginas web siempre accesibles Contexto Home (si no se define, se crea uno automticamente)

Clases y Relaciones Navegacionales Requisitos de consulta de informacin y operaciones Relacin de Contexto enlace contextual a otra pgina ... 39

Implementacin de la Interfaz Web

Ejemplo de Pgina de Informacin (I)
Zona de Informacin

E << context >> Members

Member -name -surname -personalID -email -isDoctor -isPhDStudent -web -photo +modify()
not hasGone

view Member

WorkOn -phones -status

view WorkOn

Entity -name -address -web -city -state -country

view Entity

E
RGroup / Leader / Register RGroup.name Pattern: -name Pagination: Static Cardinality 1 [ RGroup ] -acronym Sequential access
Order: isDoctor (ASC) surname (ASC)

<< context >> Members

-web

Pattern: Register

WorkOn

Pattern: Register

Entity

Member

ATTRIBUTE ACCESS STRUCTURE Members ATTRIBUTES name, email, isPhD, WorkOn.status LINK ATTRIBUTES name

ATTRIBUTE FILTER ByName ATTRIBUTES name RGroup Pattern: Register TYPE APPROXIMATE

40

Gestin de contenidos Recuperacin de informacin, activacin de servicios y navegacin contextual

Implementacin de la Interfaz Web

Ejemplo de Pgina de Informacin (II)

Zona de Navegacin

Menu Navegacional A dnde puede navegar el usuario a partir de esta pgina web?

41

Estrategia de Implementacin.
Interfaz Web. Ejemplo de Pgina de Informacin

Zona de Ubicacin
Camino Navegacional Dnde est el usuario? Cmo ha llegado aqu?

42

Estrategia de Implementacin.
Interfaz Web. Ejemplo de Pgina de Informacin

Zona de Enlaces de Aplicacin

Enlaces de Aplicacin Home Log In

43

Estrategia de Implementacin.
Interfaz Web. Ejemplo de Pgina de Informacin

Zona de Estructuras de Acceso

Estructuras Acceso intra-contextual Filtros de bsqueda ndices de Acceso Mecanismos de exploracin

44

Estrategia de Implementacin.
Interfaz Web. Ejemplo de Pgina de Informacin

Zonas Institucionales

Zona Institucional Organizacin/Empresa Logos Informacin Contacto

45

Conclusiones

Conclusiones (I)
Se han definido facilitades de modelado conceptual para especificar aplicaciones web Modelo de Navegacin: captura requisitos navegacionales Modelo de Presentacin : especifica patrones abstractos de presentacin aplicados a los ESPACIO PROBLEMA nodos navegacionales Generacin sistemtica de cdigo Proceso Automtico prototipacin rpida estrategia dirigida por modelos
ESPACIO SOLUCIN
47

Conclusiones (II)

Se ha descrito un proceso sistemtico para desarrollar aplicaciones web Aplicado el mtodo a diferentes tipos de aplicaciones

Ingeniera del SW aplicada a la Web ...

Ingeniera Web!!
48