Desarrollo de Aplicaciones para Entornos Web Escuela Técnica Superior de Informática Aplicada, 3er. Curso Universitat Politècnica de València, 2003/2004 Professor: Joan Fons i Cors (
[email protected])
Unidad Temática II: Aplicación de la Ingeniería Web al Desarrollo de Aplicaciones Web OOWS: Un Método de Producción de Aplicaciones Web
“Modelar la Web...”
2
Contenidos Introducción OOWS : Un Método de Producción de Aplicaciones Web
Proceso
de Desarrollo Modelado de Aplicaciones Web Estrategia de Implementación
Conclusiones
3
Desarrollo de Aplicaciones para Entornos Web Escuela Técnica Superior de Informática Aplicada, 3er. Curso Universitat Politècnica de València, 2003/2004 Professor: Joan Fons i Cors (
[email protected])
Introducción
Introducción Internet Paradigma de computación Clasificación de Sistemas Web
Estáticos Estáticos
con formularios de entrada Con dinámico a datos Construidos dinámicamente Aplicaciones Software para el Web
Comercio electrónico, hipermedia, aplicaciones clásicas, etc... 5
Introducción. Necesidades (I)
Estas aplicaciones necesitan gestionar esencialmente: Requisitos
de Navegación dentro de la aplicación Presentación de información Gestión de información (filtrados, búsquedas, ...) Tratamiento de s:
Gran cantidad de tipos de s (taxonomías) Adaptación / Personalización
+ ... requisitos de las aplicacions “clásicas” 6
Introducción. Necesidades (II)
... especificar búsquedas ... Permita capturar la navegación ...
... tratar la visualización de información ...
... y la ejecución de servicios
7
Introducción. Camino a seguir ...
Construir entornos de desarrollo Web que ... definan
un proceso sistemático y estructurado de producción de software faciliten la especificación de los sistemas usando técnicas basadas en el modelado conceptual permitan la rápida prototipación
¡¡Ingeniería Web!! 8
Introducción. OOWS
Un método de desarrollo Web ... introduce
nuevos conceptos OO para dar la noción de semántica navegacional y de presentación (primitivas de modelado) define un proceso de producción sistemático adaptado al web usa una estrategia de generación de código basada en modelos (patrones software) extiende adecuadamente OO-Method (un método OO de desarrollo de software) 9
Desarrollo de Aplicaciones para Entornos Web Escuela Técnica Superior de Informática Aplicada, 3er. Curso Universitat Politècnica de València, 2003/2004 Professor: Joan Fons i Cors (
[email protected])
OOWS : Un Método de Producción de Aplicaciones Web Proceso de Desarrollo
OOWS. Proceso de desarrollo
El proceso de desarrollo de aplicaciones web que propone OOWS tiene dos grandes pasos: Especificación
conceptual de la aplicación
Uso de modelos conceptuales
Desarrollo
de la solución final
11
OOWS. Proceso de desarrollo
En la especificación conceptual: Descripción
Clásico
Web
de las necesidades de las aplicaciones convencionales (estructura y comportamiento) usando modelos OO (OOMethod) Descripción de las características web mediante modelos web
Modelo Navegacional, de Presentación, etc…
12
(Problem Space)
(Solution Space)
DESARROLLO DE SOLUCIÓN
ESPECIFICACIÓ CONCEPTUAL
OOWS. Proceso de desarrollo ELICITACIÓN REQUISITOS (Casos Uso, Escenarios)
Modelado Conceptual
MODELO ESTRUCTURAL
MODEL NAVEGACIONAL
MODELO DINÁMICO MODELO FUNCIONAL
MODEL PRESENTACIÓ
Extensiones Web
Implementación Automàtica CAPA DE INTERFAZ (Entornos Web) OO-Method (SW clásico)
CAPA DE LÓGICA DE APLICACIÓ (Lógica de Negoci)
CAPA DE PERSISTENCIA (SGBD)
Arquitectura Software
OOWS (SW web)
13
Desarrollo de Aplicaciones para Entornos Web Escuela Técnica Superior de Informática Aplicada, 3er. Curso Universitat Politècnica de València, 2003/2004 Professor: Joan Fons i Cors (
[email protected])
OOWS : Un Método de Producción de Aplicaciones Web Modelo de Navegación
Introducción ¿Qué es la navegación?
Idea Intuitiva (bajo nivel de abstracción): La navegación es un salto de una página web a otra página web, provocado por la selección de un enlace, en el que se cambia de contenido (información y/o funcionalidad) 15
Modelo de Navegación
Especifica las características navegacionales de las aplicaciones web ( a información y ejecución de servicios) Se construye mediante primitivas (gráficas) de abstracción navegacional Define y estructura el al sistema para los diferentes tipos de s 1º.
Gestión de s Diagrama de s 2º. Especificación de las Propiedades Navegacionales Mapas Navegacionales 16
Desarrollo de Aplicaciones para Entornos Web Escuela Técnica Superior de Informática Aplicada, 3er. Curso Universitat Politècnica de València, 2003/2004 Professor: Joan Fons i Cors (
[email protected])
OOWS : Un Método de Producción de Aplicaciones Web Modelo de Navegación Gestión de s
Modelo de Navegación. Gestión de s Detección de potenciales tipos de s Cada tipo de representará un conjunto de s con objetivos y responsabilidades comunes en el sistema Especificación de inter-relaciones entre s (taxonomías de s)
18
Modelo de Navegación. Gestión de s.
Se distinguen tres tipos de , en función del tipo de que tengan con el sistema: Anónimos Registrados Sin
permiso
19
Modelo de Navegación. Gestión de s. Anónimos
Al conectarse al sistema, estos s no necesitan identificarse Habitualmente sus permisos con el sistema son muy reducidos ? No se pueden establecer políticas de personalización individuales Internauta 20
Modelo de Navegación. Gestión de s. Registrados
Estos s necesitan identificarse al conectarse al sistema Habitualmente, gestionan la funcionalidad del sistema y la información sensible Se pueden establecer políticas de personalización individuales Socio 21
Modelo de Navegación. Gestión de s. Sin permiso
Estos s no pueden acceder al sistema Son s “virtuales” (no existen en la realidad) Se utilizan para expresar responsabilidades comunes entre s Departamento Técnico
22
Modelo de Navegación. Gestión de s. Diagrama de s Los s se organizan en un diagrama de s Este diagrama permite expresar:
los
tipos de s que pueden usar el sistema y su accesibilidad al sistema las relaciones entre los s
23
Modelo de Navegación. Diagrama de s. Fases
Para construir un diagrama de s debemos seguir las siguientes fases: Detectar cada tipo de 2. Asignar el modo de a cada tipo de 3. Detectar las relaciones entre los s 1.
24
Modelo de Navegación. Diagrama de s. Detección de s 1.
Para cada tipo de que pueda usar el sistema, se añade al diagrama
Internauta Bibliotecario
Socio
Director
Responsable de compras
Ejemplo: En esta biblioteca hay Internautas (exploran el catálogo), Bibliotecarios (gestionan el catálogo), Socios (pueden sacar libros), el/los Director/es (gestiona la biblioteca), Responsables de compras (se encargan de comprar material bibliográfico) 25
Modelo de Navegación. Diagrama de s. Asignación del Modo de 2.
A cada se le asigna un modo de : anónimo ó registrado ?
Internauta Bibliotecario
Socio
Director
Responsable de compras
Ejemplo: En esta biblioteca los Internautas son s anónimos, y el resto (Bibliotecarios, Socios, el/los Director/es, Responsables) necesitan identificación 26
Modelo de Navegación. Diagrama de s. Relaciones entre s (I) 3.
Detectar las relaciones entre los s
La relación posible entre s es la de especialización (is-a) de s Las relaciones entre s permiten expresar la compartición de propiedades navegacionales El especializado hereda la accesibilidad al sistema (mapa de navegación1) del base
1
Se estudian estas propiedades más adelante en el Modelo de Navegación
27
Modelo de Navegación. Diagrama de s. Relaciones entre s (II)
El especializado puede: definir
nuevas propiedades navegacionales cancelar propiedades navegacionales modificar propiedades navegacionales
Los s Anónimos no pueden especializarse a partir de otro tipo de s 28
Modelo de Navegación. Diagrama de s. Relaciones entre s (III)
Se pueden introducir s “sin permiso” de : cuando
existen s que comparten gran parte de sus propiedades navegacionales para expresar la jerarquía funcional en una empresa (departamentos, secciones, etc.) para organizar y estructurar los s del sistema 29
Modelo de Navegación. Diagrama de s.
?
Relaciones entre s (IV) Internauta
Sin Permiso. No puede acceder al sistema. Se usa para describir las propiedades navegacionales comunes entre sus s especializados (Directores y Responsables de Compras)
Direccion
Registrado. Un Director necesitará identificarse para acceder al sistema
Bibliotecario
Anónimo. Es el elemental. Todos los demás s extienden sus posibilidades navegacionales
Socio
Diagrama de s de una Biblioteca Director
Responsable de compras
30
Desarrollo de Aplicaciones para Entornos Web Escuela Técnica Superior de Informática Aplicada, 3er. Curso Universitat Politècnica de València, 2003/2004 Professor: Joan Fons i Cors (
[email protected])
OOWS : Un Método de Producción de Aplicaciones Web Modelo de Navegación Especificación de las Propiedades Navegacionales
Modelo de Navegación. Definición de las Propiedades Navegacionales Las propiedades navegacionales de una aplicación web se describen asociando un mapa navegacional para cada tipo de
?
Internauta Socio
Dirección
Internauta E «contexto» Libros E
E
«contexto» Libros
«contexto» Autores
Direccion
Bibliotecario
E
S
«contexto» Libros
«contexto» Prestados
Socio Bibliotecario Responsable de compras
Anonymous
E «context» Activities
E
E «context» Group
«context» Projects
E
S
E
«contexto» Prestados
«contexto» Libros
E E
«contexto» Director. Autores
E << contexto >>
<< contexto >>
Libros
Tematicas
«context» ResearchLines
Director
E «context» Publications
S E «context»
Responsable de compras
S
S << contexto >>
<< contexto >>
Detalles_Libro
Libros_Tematica
«context» Guests
32
Modelo de Navegación. Mapa Navegacional
Proporciona la vista global del sistema para cada tipo de (descripción global) Grafo navegacional, compuesto de: Anonymous Member
Nodos
Navegacionales Enlaces Navegacionales
E «context» Activities
Define la estructura del Web Site
E
E «context» Group
«context» Projects
E «context» ResearchLines
E «context» Publications
S E
«context» Guests
«context»
33
Modelo de Navegación. Enlace Navegacional
Define una relación de alcanzabilidad entre nodos de navegación
Anonymous
E
Dos tipos de enlaces: de secuencia: (flechas
«context» Activities
E
E «context» Group
continuas) definidos implícitamente por las relaciones navegacionales de contexto (en definición de contexto). Llevan información contextual.
«context» Projects
E «context» ResearchLines
E «context» Publications
S E «context»
«context» Guests
de exploración: (flechas discontinuas) definidos implícitamente por los contextos de Exploración. No llevan información contextual 34
Modelo de Navegación. Nodos Navegacionales
Hay dos tipos nodos navegacionales: Contextos: definen contenido de información Subsistemas: permiten estructurar la navegabilidad
dentro del sistema
35
Modelo de Navegación. Contexto Navegacional (I) Unidad de Interacción básica con el Representa una vista parcial del sistema para realizar cierta actividad/operación
Especifica
un a un conjunto de datos (atributos) y funcionalidad (operaciones)
Gráficamente representada por un paquete UML, con el estereotipo « contexto »
E «context» Book
name
36
Modelo de Navegación. Contexto Navegacional (II)
Hay dos tipos de contextos: Exploración: son siempre accesibles Anonymous
(uno de estos puede ser marcado como “Home”) E
Secuencia:
H
«context» Activities
E
sólo accesibles a través de caminos de navegación preestablecidos
«context» Group
E «context» Projects
E «context» ResearchLines
E «context» Publications
S E «context»
«context» Guests
37
Modelo de Navegación. Contexto Navegacional (III)
Los contextos navegacionales de Exploración definen los enlaces de exploración del mapa de navegación
Al crear un contexto de exploración, automáticamente aparece un enlace de exploración en el mapa de navegación E « contexto » Libros
38
Modelo de Navegación. Contexto Navegacional (IV)
Un contexto navegacional está compuesto por (descripción detallada): Clases
navegacionales
especifican una recuperación de información (atributos) y a una funcionalidad (operaciones) son una vista sobre las clases del diagrama (« view »)
Relaciones
navegacionales
enlazan las clases navegacionales mediante vistas sobre relaciones estructurales del diagrama de clases (asoc/agreg/comp, espec/general) 39
Modelo de Navegación. Contexto Navegacional (V)
Clases Navegacionales «view»
Relaciones Navegacionales
Contexto Navegacional « contexto »
40
Modelo de Navegación. Clase Navegacional (I) Define una proyección de visibilidad sobre clases del diagrama de classes con respecto a: Atributos:
datos visibles por el Servicios: funcionalidad ejecutable por el
Clases UML estereotipades con « view » « view »
Libro
Vista (clase)
ISBN titulo año paginas
Atributos visibles
prestar()
Métodos visibles
año = 2004
Filtro de selección
41
Modelo de Navegación. Clase Navegacional (II)
Hay dos tipos de clases navegacionales:
Directora:
complementarias
clase principal del contexto toda la exploración de información parte de ella sólo puede haber una por contexto
Complementarias:
“complementan” la información de la clase directora usan relaciones navegacionales para definirse pueden haber varias
directora
42
Modelo de Navegación. Clase Navegacional (III) Se puede especificar un filtro de selección asociado a una clase navegacional E « view » Libro ISBN titulo año páginas
Navegación a un contexto (BestSellers) que dará información de best-sellers (más 1,000,000 ejemplares vendidos)
Se recuperarán únicamente los libros con más de 1,000,000 de unidades vendidas
« contexto » BestSellers « view » Autor
nombre
prestar() ventas > 1,000,000
43
Modelo de Navegación. Relación Navegacional (I) Es una relación binaria unidireccional existente entre dos clases de un contexto Se define sobre una relación estructural del diagrama de clases Representa un requisito para recuperar información complementaria relacionada
44
Modelo de Navegación. Relación Navegacional (II)
Dos tipos: Relaciones
de Dependencia Contextual: no definen
navegación Relaciones de Contexto: definen una navegabilidad a un contexto destino (llevando información contextual) « view » Clase Nav.
« view » Clase Nav.
Relación de Dependencia de Contexto (no define navegabilidad)
« view » Clase Nav.
« view » Clase Nav.
Relación de Contexto (define navegabilidad) 45
Modelo de Navegación. Relación de Dependencia Contextual (I)
Es una relación navegacional que recupera información complementaria de una clase Se define sobre una relación estructural del diagrama de clases, y recupera las instancias relacionadas Puede aparecer un / atributo rol / para eliminar ambigüedades en caso de más de una relación estructural entre las dos clases de la relación (en diagrama de clases) 46
Modelo de Navegación. Relación de Dependencia Contextual (II) E Libro
« contexto » Libros Escrito_por
ISBN título páginas año
0:M
prestar() devolver()
0:M
0:M
Revisado_por
Autor nombre pseudonimo año_nacimiento
« view » Autor
« view » Libro ISBN título
/ Escrito_por /
nombre
1:M
Diagrama de Clases
Contexto Libros (con relación de Dependencia Contextual)
El contexto Libros define un contexto donde se recuperarán libros y los nombres de los autores que han escrito el libro. 47
Modelo de Navegación. Relación de Dependencia Contextual (III) E « view » Libro ISBN titulo año páginas
« contexto » Libros
/ Escrito_por /
« view » Autor nombre
prestar()
Contexto Libros
Una implementación en HTML del contexto Libros 48
Modelo de Navegación. Relación de Contexto (I)
Es una relación navegacional que recupera información complementaria de una clase y define una navegabilidad a un contexto destino Se define sobre una relación estructural del diagrama de clases, y recupera las instancias relacionadas Al igual que en las relaciones de dependencia de contexto, puede aparecer un / atributo rol /
49
Modelo de Navegación. Relación de Contexto (II)
Una relación de contexto define una navegabilidad a un contexto destino. Para ello necesita definirse: Un
atributo de enlace: ancla que se utilizará para provocar la navegación Un [ atributo de contexto ]: contexto destino (definido en el mapa) donde se navegará « view » Clase Nav.
atributo de enlace
« view » Clase Nav.
/ atributo de rol / [ atributo de contexto ]
Relación de Contexto (define navegabilidad)
50
Modelo de Navegación. Relación de Contexto (III)
El atributo de contexto debe indicar el contexto destino de la navegación. La clase directora del contexto destino (atributo de contexto) debe ser la misma que la clase de navegación destino de la relación de contexto E
E « view » Libro ISBN titulo año páginas
« contexto » Autores
« contexto » Libros nombre / Escrito_por /
« view » Autor nombre
[ Autores ]
« view » Autor nombre pseudónimo año_nacimiento
prestar()
51
Modelo de Navegación. Relación de Contexto. Navegabilidad
Una relación de contexto define dos tipos de navegabilidad al contexto destino, en función de la información contextual que se envía entre contextos y el filtrado de objetos que se realiza: Navegabilidad
de Objeto Navegabilidad de Relación
52
Modelo de Navegación. Relación de Contexto. Navegabilidad de Objeto (I) La navegabilidad de objeto se utiliza para navegar a un contexto destino para recuperar información adicional de un objeto La información contextual que se lleva al contexto destino es el objeto seleccionado
El
contexto destino filtrará la población de la clase directora para recuperar sólo el objeto que “llega” seleccionado en la navegación 53
Modelo de Navegación. Relación de Contexto. Navegabilidad de Objeto (II)
En la clase destino de la relación de navegación debe aparecer visibilidad sobre al menos un atributo « view » Libro ISBN titulo año páginas
nombre / Escrito_por /
« view » Autor nombre
[ Autores ]
prestar()
54
Modelo de Navegación. Relación de Contexto. Navegabilidad de Objeto (III)
En la navegabilidad de objeto, el atributo de enlace debe ser un atributo de la clase destino de la relación de navegación 1
« view » Libro ISBN titulo año páginas
nombre / Escrito_por /
« view » Autor
nombre [ Autores ]
prestar()
Por motivos de calidad es más intuitivo mejora la usabilidad
1
55
Modelo de Navegación. Relación de Contexto. Navegabilidad de Objeto (IV) Ejemplo: Definir un contexto que muestre libros y sus autores, de modo que al seleccionar un autor se produzca una navegación a otro contexto para ver detalles del autor seleccionado. La clase destino posee algún atributo. Por tanto se trata de navegabilidad de objeto
E « view » Libro ISBN titulo año páginas
« contexto » Libros nombre / Escrito_por /
« view » Autor nombre
[ Autores ]
La información contextual que “navegará” de un contexto a otro es el identificador del autor seleccionado
E « contexto » Autores « view » Autor nombre pseudónimo año_nacimiento
prestar()
Cuando el esté en el contexto Libros y seleccione el nombre de un Autor, navegará al contexto Autores y verá la información de ese autor
56
Modelo de Navegación. Relación de Contexto. Navegabilidad de Objeto (V) E « view » Libro ISBN titulo año páginas
« contexto » Libros nombre / Escrito_por /
« view » Autor nombre
[ Autores ]
prestar()
Contexto Libros
Una implementación en HTML del contexto Libros 57
Modelo de Navegación. Relación de Contexto. Navegabilidad de Relación (I)
La navegabilidad de relación se utiliza para navegar a un contexto destino para recuperar información adicional de los objetos relacionados con un determinado objeto
58
Modelo de Navegación. Relación de Contexto. Navegabilidad de Relación (II)
La información contextual que se lleva al contexto destino es el objeto de la clase origen de la relación de navegación y la relación sobre la que se navega El
contexto destino filtrará la población de la clase directora para recuperar sólo los objetos que estén relacionados por la relación que “llega” seleccionada con el objeto que “llega” seleccionado 59
Modelo de Navegación. Relación de Contexto. Navegabilidad de Relación (III)
La clase destino de la relación de navegación no tiene definida visibilidad sobre atributos ni operaciones (ni filtro de población) « view » Clase Nav.
atributos operaciones
atributo de enlace
« view » Clase Nav.
/ atributo de rol / [ atributo de contexto ]
Relación de Contexto con Navegabilidad de Relación 60
Modelo de Navegación. Relación de Contexto. Navegabilidad de Relación (IV)
Con respecto al atributo de enlace, existen dos casos válidos: No
se especifica atributo de enlace (más habitual y de mayor calidad). En implementación, aparecerá el nombre de relación como “ancla” de la navegación (enlace) El atributo de enlace es un atributo de la clase origen de la relación de navegación (menor calidad menos intuitivo menor usabilidad) 61
Modelo de Navegación. Relación de Contexto. Navegabilidad de Relación (V) Ejemplo: Definir un contexto que muestre libros y permita navegar a otro contexto para ver los autores que han escrito el libro seleccionado No hay atributos en la clase destino. Por tanto se trata de navegabilidad por relación. Tampoco aparece el atributo de enlace.
E « view » Libro ISBN titulo año páginas
« contexto » Libros
/ Escrito_por / [ Autores ]
« view » Autor
La información contextual que “navegará” de un contexto a otro es el identificador del libro seleccionado y la relación Escrito_por
E « contexto » Autores « view » Autor nombre pseudónimo año_nacimiento
prestar()
Cuando el esté en el contexto Libros y seleccione Escrito_por, navegará al contexto Autores para ver todos los autores que estén relacionados por la relación Escrito_por con el libro seleccionado
62
Modelo de Navegación. Relación de Contexto. Navegabilidad de Relación (VI) E « view » Libro ISBN titulo año páginas
« contexto » Libros
/ Escrito_por /
« view » Autor
[ Autores ]
prestar()
Contexto Libros
Una implementación en HTML del contexto Libros 63
Modelo de Navegación. Relación Navegacional. Mapa Navegacional
Las relaciones navegacionales de contexto (especificadas dentro de un contexto) definen enlaces de secuencia en el mapa navegación E
« view » Libro ISBN titulo año páginas
« contexto » Libros nombre / Escrito_por /
« view » Autor
nombre [ Autores ]
prestar()
64
Modelo de Navegación. Enlace de Servicio (I)
Asociado a un servicio, puede definirse una capacidad de navegación Se representa como: servicio() [ contexto_destino ]
« view »
Libro ISBN titulo año paginas prestar() [ Prestados ] 65
Modelo de Navegación. Enlace de Servicio (II)
Cuando se ejecute el servicio, se realizará una navegación al contexto destino indicado Existen dos tipos de enlaces de servicio:
Enlaces
Contextuales de Servicio : navegan al contexto destino “llevando” el (los) objeto(s) sobre los que se ejecuta el servicio Enlaces No Contextuales de Servicio : navegan al contexto destino sin “llevar” información contextual 66
Modelo de Navegación. Enlace de Servicio (III)
Los Enlaces Contextuales de Servicio se representan: servicio() [ contexto_destino ]
Los Enlaces No Contextuales de Servicio se representan como: servicio() [ contexto_destino ]
67
Modelo de Navegación. Enlace Contextual de Servicio E
Cuando el ejecute el servicio prestar() sobre algún libro, habrá una navegación por secuencia (en el mapa navegacional) del contexto Libros al contexto Prestados indicando el libro prestado. El contexto Prestados sólo recuperará la información del libro seleccionado
« contexto » Libros « view » Libro ISBN titulo año paginas
prestar() [ Prestados ]
S « contexto » Prestados
Libro(identificador)
« view » Libro ISBN titulo año paginas
self.prestado = TRUE
68
Modelo de Navegación. Enlace No Contextual de Servicio Cuando el ejecute el servicio prestar() sobre algún libro, habrá una navegación por secuencia (en el mapa navegacional) del contexto Libros al contexto Prestados, sin proporcionar información contextual. El contexto Prestados recuperará todos los libros que estén prestados
E « contexto » Libros « view » Libro ISBN titulo año paginas
prestar() [ Prestados ]
S « contexto » Prestados « view » Libro ISBN titulo año paginas
self.prestado = TRUE
69
Modelo de Navegación. Enlace de Servicio. Mapa Navegacional
Los enlaces de atributo (especificados dentro de un contexto) definen enlaces de secuencia en el mapa de navegación
E « contexto » Libros « view » Libro ISBN titulo año paginas
prestar() [ Prestados ]
70
Modelo de Navegación. Subsistema de Navegación (I)
Aparece como un nodo en un mapa navegacional A diferencia de los contextos, los subsistemas sólo pueden ser de Exploración Gráficamente se representa E como un paquete UML, «subsistema» estereotipado con
«subsistema» 71
Modelo de Navegación. Subsistema de Navegación (II)
Permite dar una estructuración adicional a la navegabilidad por la aplicación Define un submapa que sólo será visible cuando el navegue al subsistema El submapa está formado por:
Otros
subsistemas Contextos navegacionales 72
Modelo de Navegación. Subsistema de Navegación (III)
Internauta
H E
E
« subsystema »
« subsystema »
DEPARTAMENTO
DOCENCIA
E
E
E
E
E
« subsystema »
« subsystema »
« subsystema »
« contexto »
« contexto »
INVESTIGACIÓN
Profesor. INTRANET
DIRECTORIO
ENLACES
DSIC INFO
subsistemas http://www.dsic.upv.es/ Mapa del Internauta 73
Modelo de Navegación. Subsistema de Navegación (III) Internauta
H E « subsystema »
E « subsystema »
DEPARTAMENTO
DOCENCIA
E « subsystema » DIRECTORIO
E « subsystema » INVESTIGACIÓN
E
E
E
« subsystema »
« contexto »
« contexto »
Profesor. INTRANET
ENLACES
DSIC INFO
Internauta
E
E
E
<< context >>
<< context >>
<< context >>
PERSONAL
COLABORADORES
MAPA SEDE DSIC
S << context >> TUTORÍAS
Detalle del Subsistema Directorio
74
Modelo de Navegación. Subsistema de Navegación (IV)
Implementación del Subsistema Directorio
75
Modelo de Navegación. al conectado (I)
La primitiva # tipo_ # permite acceder al conectado Ejemplos:
# Bibliotecario #, # Socio #, …
Esta primitiva permite capturar difinir ciertos aspectos de personalización
76
Modelo de Navegación. al conectado (II)
Se utiliza en dos casos: Para
recuperar información filtrada específicamente para el conectado
Se especifica en los filtros de selección de población de las clases navegacionales
En
la inicialización de argumentos en la ejecución de servicios
Para establecer como valor de inicialización una propiedad del conectado 77
Modelo de Navegación. al conectado. Ejemplo (I) Paciente num_ident nombre dirección
Medico
Cita solicita > 1:1
0:M
fecha hora parte
asignada > 0:M
1:1
num_colegiado nombre consulta
reservar() cancelar()
Diagrama de Clases Hospital (gestión de resevas de citas para consultas médicas)
78
Modelo de Navegación. al conectado. Ejemplo (II) Un Paciente es un registrado que puede ver sólo sus citas en el sistema … E « contexto » Citas Socio Paciente
« view » Cita fecha hora
« view » Medico nombre
E
« contexto »
Citas
self.Paciente = #Paciente#
79
Modelo de Navegación. al conectado. Ejemplo (III) … y sólo puede reservar nuevas citas para él mismo E « contexto » Citas « view » Cita
Socio Paciente
fecha hora
« view » Medico
nombre
E
« contexto » Citas
reservar( , , , #Paciente#, ) self.Paciente = #Paciente#
La declaración de la operación reservar es: reservar( p_fecha: Date, p_hora: Time, p_parte: String, p_Paciente:Paciente, p_Medico : Medico) 80
Modelo de Navegación. Navegación con cambio de (I)
Cuando un se conecta al sistema como un , puede definirse navegabilidad a un contexto o un subsistema del mapa navegacional de otro Para ello debe definirse una navegación con cambio de
81
Modelo de Navegación. Navegación con cambio de (II)
Si el destino necesita identificación, se pedirá al que se identifique como un del mapa destino antes de realizar la navegación Se puede aplicar a:
Enlaces
de exploración Enlaces de secuencia (relaciones de contexto y enlaces de servicio) 82
Modelo de Navegación. Navegación con cambio de por Exploración
Se representa directamente en el mapa navegacional El enlace de exploración aparece decorado con un El contexto destino está precedido del tipo de al que se debe identificar el . Este contexto debe estar definido en el mapa de ese (Bibliotecario)
83
Modelo de Navegación. Navegación con cambio de por Secuencia
Se representa en la definición del contexto … E
E « view » Libro ISBN titulo año páginas
« contexto » Libros
« contexto » Libros « view » Libro
ó [ Bibliotecario.Prestados ]
ISBN titulo año paginas
prestar() prestar() [ Bibliotecario.Prestados ]
Puede ser definido por una relación de contexto
Puede ser definido por un enlace de serivicio
84
Modelo de Navegación. Navegación con cambio de por Secuencia
… y se refleja en el mapa de navegación El enlace de secuencia aparece decorado con un El contexto destino está precedido del tipo de al que se debe identificar el . Este contexto debe estar definido en el mapa de ese .
85
Modelo de Navegación. Contexto Navegacional. Ejemplo 1 Página Web
E
Contexto de Navegación «context» Book «view» Book
/ writen_by / name
«view» Author
86
Modelo de Navegación. Contexto Navegacional. Ejemplo 2 Información sobre un miembro E
Información relacionada a un miembro << context >> «view» Member Member
Esta página web proporciona información sobre de un grupo de investigación
Modelado en OOWS como un Contexto Navigacional
-name -surname -personalID -email -isDoctor -isPhDStudent -web -photo +modify() not hasGone
«view» WorkOn WorkOn -phones -status
/ Leader / RGroup.name [ RGroup ]
ATTRIBUTE ACCESS STRUCTURE ATTRIBUTES name, email, isPhD, WorkOn.status LINK ATTRIBUTES name
«view» Entity Entity -name -address -web -city -state -country
RGroup -name -acronym -web
ATTRIBUTE FILTER ByName ATTRIBUTES name TYPE APPROXIMATE 87
Modelo de Navegación ¿Qué es la navegación?
Según OOWS (alto nivel abstracción): La navegación es un cambio de contexto navegacional al activar un enlace navegacional (navegación conceptual) 88
Desarrollo de Aplicaciones para Entornos Web Escuela Técnica Superior de Informática Aplicada, 3er. Curso Universitat Politècnica de València, 2003/2004 Professor: Joan Fons i Cors (
[email protected])
OOWS : Un Método de Producción de Aplicaciones Web Modelo de Presentación
Modelo de Presentación Este modelo captura los requisitos abstractos de presentación de información Se basa en el modo de presentación asociado a cada nodo (contexto) del modelo de navegación Asocia patrones de presentación a los elementos que constituyen estos contextos navegacionales (clases navegacionales, relaciones
navegacionales, índices, ...) 90
Modelo de Presentación
Los patrones de presentación son: Disposición
de información (Layout)
[ Registro, Tabular, Árbol, Maestro-Detalle ]
Criterios
de Ordenación de información por valor de atributos
[ ASCendente, DESCendente ]
“Paginación”
de información
Cardinalidad de conjuntos (num. elementos) [ estática, dinámica ] Modo de a los conjuntos [ secuencial, aleatorio] 91
Modelo de Presentación. Patrones de Presentación (I)
E
Disposición (“layout pattern”): [Tabular, Registro, Árbol, Maestro-Detalle] Se aplica a: relaciones navegacionales, clase directora
Se aplican los patrones de presentación a los elementos que componen un Contexto de Navegación
Pattern: Pagination: Static Cardinality 1 Sequential access Order: isDoctor (ASC) surname (ASC)
<< context >>
WorkOn Pattern:
Member
RGroup Pattern:
Pattern:
Entity
Paginación de Información: Cardinalidad bloque [estática, dinámica] - Modo de [secuencial, aleatorio] - Circularidad Se aplica a: contexto, relaciones navegacionales, índices y filtros Ordenación: [ASCendente, DEScendente] Se aplica a: clases navegacionales (atributos), índices y filtros
92
Modelo de Presentación. Ejemplo
E
LAYOUT PATTERN CARDINALIDAD Sólo una instancia visible Toda la información sees dipone CRITERIO ORDENACIÓN
eninstancias cada momento. en modo Registro Las de los Aparecen se mecanismos para explorar recuperan ordenadamente: primero secuencialmente los doctores, por apellidos (ASC)
Pattern: Pagination: Static Cardinality 1 Sequential access Order: isDoctor (ASC) surname (ASC)
<< context >>
WorkOn Pattern:
Pattern:
Entity
Member
RGroup Pattern:
93
Desarrollo de Aplicaciones para Entornos Web Escuela Técnica Superior de Informática Aplicada, 3er. Curso Universitat Politècnica de València, 2003/2004 Professor: Joan Fons i Cors (
[email protected])
OOWS : Un Método de Producción de Aplicaciones Web Estrategia de Implementación
Estrategia de Implementación OOWS extiende la estrategia de generación de código de OO-Method: introduce ESPECIFICACIÓN CONCEPTUAL (Problem Space)
la interfaz web reusa la lógica de negocio y la persistencia
DESARROLLO SOLUCIÓN (Solution Space)
ELICITACIÓN DE REQUISITOS
Modelado Conceptua l
MODELO ESTRUCTURAL
MODELO NAVEGACIÓN
MODELO DINÁMICO MODELO FUNCIONAL
Extensiones Web
MODELO PRESENTACIÓN
GG ee CAPA INTERFAZ (Entornos Web) nn CAPA LÓGICA NEGOCIO (Servicios Web, Componentes ee SW) rr Arquitectura CAPA DE PERSISTENCIA (SGBD) Software aa cc
95
Estrategia de Implementación. Interfaz Web
A partir de los modelos conceptuales navegacionales: Modelo Navegación y de Presentación Aplicación
Mapa Navegacional Define la estructura de páginas web enlazadas para cada tipo de Contexto de Navegación Página Web
de patrones de traducción:
Contextos de Exploración Páginas web siempre accesibles Contexto Home (si no se define, se crea uno automáticamente)
Clases y Relaciones Navegacionales Requisitos de consulta de información y operaciones Relación de Contexto “enlace contextual” a otra “página” ... 96
Implementación de la Interfaz Web Mapa Navegacional (I) Convertiremos
cada nodo del mapa navegacional en un tipo de página Los tipos de página básicos son: Páginas
de información Páginas de accesibilidad Páginas de entrada de datos
97
Implementación de la Interfaz Web Mapa Navegacional (II)
Las páginas de información dan a información y funcionalidad del sistema Las páginas de accesibilidad permiten estructurar la navegabilidad por el sistema Las páginas de entrada de datos permiten al introducir los argumentos necesarios para invocar a los servicios
98
Implementación de la Interfaz Web Mapa Navegacional (III) Anonymous
E «context» Activities
E
E «context» Group
«context» Projects
E «context» ResearchLines
Implementación Automática
Estructura del Web Site
E «context» Publications
S E «context»
«context» Guests
(Espacio de la Solución)
Mapa de Navegación (Espacio del Problema)
99
Implementación de la Interfaz Web Contexto Home Anonymous
E «context» Activities
E
E «context» Group
«context» Projects
E «context» ResearchLines
Implementación Automática
Contexto Home
E «context» Publications
S E «context»
«context» Guests
(Espacio de la Solución)
Mapa de Navegación (Espacio del Problema)
El contexto Home suele convertirse en una página de accesibilidad
100
Implementación de la Interfaz Web Contextos Navegacionales
Cada contexto se traduce en una página de información La especificación del contexto permite definir:
La
consulta al sistema para recuperación de datos El conjunto de servicios que podrán ser invocados El modo en que la información se presentará (del modelo de presentación) 101
Implementación de la Interfaz Web Ejecución de servicios
Por cada servicio del diagrama de clases, se crea una página de entrada de datos que pida todos los argumentos (en campos de entrada adecuados al tipo de datos del argumento) Estas páginas se invocarán al activar la ejecución de un servicio
102
Implementación de la Interfaz Web Las páginas web (I)
Se propone una estrategia de implementación de páginas web basadas en contenidos Cada zona es responsable de proporcionar información sobre un contenido en concreto Una página web se implementa como un conjunto de zonas, en función del tipo de página web
103
Implementación de la Interfaz Web Las páginas web (II)
Los contenidos ó zonas más habituales en la web son: Información Ubicación Institucional Enlaces de Aplicación Estructuras de
Navegación Información del Entrada de Datos Personalización “Otras”
104
Implementación de la Interfaz Web Las páginas web (III)
Zona de Información: Zona encargada de acceder al repositorio del sistema (base de datos), recuperar la información y proporcionar a la funcionalidad Zona de Navegación: Zona encargada de proporcionar al el conjunto de enlaces (de exploración) que puede activar Zona de Ubicación: Zona encargada de notificar al de la ubicación de esta página dentro de la aplicación, indicando el camino navegacional seguido o secuencia de páginas web que se ha seguido hasta llegar a la actual 105
Implementación de la Interfaz Web Las páginas web (IV)
Zona de Información del : Zona responsable de notificar al de sus datos para s con identificación Zona Institucional: Zona encargada de proporcionar al información sobre la institución, empresa, organismo, etc. que está detrás de la aplicación Zona de Entrada de Datos: Zona encargada de proporcionar un formulario al para la introducción de datos y responsable de enviar los datos del formulario al servicio encargado de procesarlos 106
Implementación de la Interfaz Web Las páginas web (V)
Zona de Enlaces de Aplicación: Zona donde aparecen enlaces a funcionalidades/enlaces comunes a todas las aplicaciones para la web, como pueden ser las funcionalidades de , Home, etc. Zona de Personalización: Es una zona de información que depende de (está personalizada para) el concreto que está conectado Zona de Estructuras de : Zona que contiene los mecanismos avanzados de exploración (filtros, índices, etc.) dentro de una página Zona “Otras”: Zona para introducir contenidos no esté catalogado en ninguno de los anteriores 107
Implementación de la Interfaz Web Las páginas web (VI) Pág. Información
Pág. Accesibilidad
Pág. Entrada Datos
Z. Navegación
,
Z. Ubicación
,
,
,
,
Z. Enlaces Aplic.
Z. Entrada Datos
Z. Personalización
,
,
,
Z. Estruc.
,
,
,
Z. “Otras”
,
,
,
Z. Información Z. Z. Institucional
- obligatorio
- recomendable
- no recomendable
- opcional
- pueden aparecer varias 108
Implementación de la Interfaz Web Ejemplo de Página de Información (I)
Elegimos los siguientes contenidos para la página de información que vamos a implementar: Pág. Información
Pág. Accesibilidad
Pág. Entrada Datos
Z. Navegación
,
Z. Ubicación
,
,
,
,
Z. Enlaces Aplic.
Z. Entrada Datos
Z. Personalización
,
,
,
Z. Estruc.
,
,
,
Z. “Otras”
,
,
,
Z. Información Z. Z. Institucional
109
Implementación de la Interfaz Web Ejemplo de Página de Información (I)
Zona de Información
E << context >>
«view» Member Member -name -surname -personalID -email -isDoctor -isPhDStudent -web -photo +modify() not hasGone
«view» WorkOn
«view» Entity
WorkOn -phones -status
Entity -name -address -web -city -state -country
E RGroup / Leader / Pattern: RGroup.name Pagination: -name Static Cardinality 1 -acronym [ RGroup ] access Sequential
<< context >>
-web
Order: isDoctor (ASC) surname (ASC)
WorkOn Pattern:
Pattern:
Entity
Member
ATTRIBUTE ACCESS STRUCTURE ATTRIBUTES name, email, isPhD, WorkOn.status LINK ATTRIBUTES name
ATTRIBUTE FILTER ByName ATTRIBUTES name RGroup TYPE APPROXIMATE Pattern:
Gestión de contenidos Recuperación de información, activación de servicios y navegación contextual
110
Implementación de la Interfaz Web Ejemplo de Página de Información (II)
Zona de Navegación
Menu Navegacional ¿A dónde puede navegar el a partir de esta página web?
111
Estrategia de Implementación. Interfaz Web. Ejemplo de Página de Información
Zona de Ubicación Camino Navegacional ¿Dónde está el ? ¿Cómo ha llegado aquí?
112
Estrategia de Implementación. Interfaz Web. Ejemplo de Página de Información
Zona de Enlaces de Aplicación
Enlaces de Aplicación Home …
113
Estrategia de Implementación. Interfaz Web. Ejemplo de Página de Información
Zona de Estructuras de
Estructuras intra-contextual Filtros de búsqueda Índices de Mecanismos de exploración …
114
Estrategia de Implementación. Interfaz Web. Ejemplo de Página de Información
Zonas Institucionales
Zona Institucional Organización/Empresa Logos Información o …
115
Desarrollo de Aplicaciones para Entornos Web Escuela Técnica Superior de Informática Aplicada, 3er. Curso Universitat Politècnica de València, 2003/2004 Professor: Joan Fons i Cors (
[email protected])
Conclusiones
Conclusiones (I)
Se han definido facilitades de modelado conceptual para especificar aplicaciones web Modelo
de Navegación: captura requisitos navegacionales Modelo de Presentación : especifica patrones abstractos de presentación aplicados a los nodos navegacionales ESPACIO PROBLEMA
Generación sistemática de código Proceso prototipación rápida Automático estrategia dirigida por modelos ESPACIO SOLUCIÓN 117
Conclusiones (II) Se ha descrito un proceso sistemático para desarrollar aplicaciones web Aplicado el método a diferentes tipos de aplicaciones
Ingeniería del SW aplicada a la Web ...
¡¡Ingeniería Web!! 118