Maestría en Ingeniería

Transcripción

1 Maestría en Ingeniería Curso de Ingeniería Web Sesión 2: Metodologías de Diseño de Aplicaciones Web Parte B Fernando Barraza A. fbarraza@javerianacali.edu.co

2 Sesión 2 Parte B Objetivo: Presentar las metodología para diseño de aplicaciones Web OOWS y WebML Temas: OOWS Vision General Estrategia de desarrollo Técnicas de mapero Caso de Ejemplo WebML Enfoque Modelado Caso de Ejemplo

3 OOWS Object-Oriented Approach for Web Solutions Modeling Es una aproximación para definir semántica de navegación en modelos Orientados a Objeto. Utiliza la notación UML adaptada para definir de una manera precisa un modelo de navegación. Define nuevos conceptos (primitivas navegacionales) que se aplicarán en el Modelo Conceptual.

4 Visión General OOWS

5 Aproximación OOWS

6 Arquitectura

7 Estrategia de desarrollo

8 Estrategia

9 Mapeo mediante patrones de traducción

10 mapeo

11 mapeo

12 mapeo

13 Ejemplo: Tienda de música en línea

14 Descripción del Sistema

15 Modelo de Objetos

16 Mapa Navegacional

17 Contexto Navegacional Autores

18 Aplicación Web Generada

19 Web Modeling Language (WebML) Lenguaje conceptual para diseño de alto nivel de aplicaciones web intensivas en el manejo de datos Representa muchos años de investigación y desarrollo en el Politécnico de Milano, Italia. Implementado comercialmente en la herramienta WebRatio ( Ejemplos reales de su uso para desarrollar aplicaciones comerciales:

20 El enfoque WebML WebML soporta una colección de conceptos poderosos que posibilitan un diseño de alto nivel y provee especificaciones gráficas para producir una descripción (a nivel abstracto) de la aplicación Web.

21 Objetivos de WebML Los objetivos principales de WebML son: Expresar la estructura de una aplicación; Proveer múltiples vistas del mismo contenido; Separar el contenido de la información de su composición en páginas, y navegación; Almacenar meta-información; Modelar usuarios y comunidades Posibilitar la especificación de operaciones de manipulación de datos.

22 Características WebML Combina técnicas de modelado ER con UML Se basa en la distribución de nodos en los niveles del hipertexto sobre las paginas del nivel de presentación. Enlaces Intra-page cuando la fuente y destino están en la misma pagina (Ej. Un resumen del paper en el primer caso de ejemplo) Enlaces Inter-page cuando la fuente y el destino están en diferentes páginas (Ej. Información detallada del autor y de sus papers)

23 WebML: Conceptos básicos Web application = Structure + Hypertext + Presentation entities, relationships units, pages, links, site views styles data model navigation + composition model presentation

24 Modelos Un modelo proporciona los planos de un sistema. Los modelos pueden involucrar planos detallados, así como planos mas generales que ofrecen una visión global del sistema en consideración.

25 Diseño en WebML El diseño de aplicaciones en WebML consiste en especificar sus características en términos de varios tipos de abstracciones ortogonales Cada una capturada mediante un modelo distinto los cuáles son: El modelo estructural El modelo de hipertexto El modelo de presentación

26 El modelo estructural El modelo estructural que describe la organización conceptual de datos; este modelo es compatible con: el modelo Entidad-Relación [Chen, 76] los diagramas de clases en UML.

27 El modelo de hipertexto El modelo de hipertexto que posibilita la definición de páginas y enlaces de hipertexto que constituyen la aplicación. Este utiliza, a su vez, dos sub modelos: El modelo de composición El modelo de navegación

28 El modelo de composición El modelo de composición, que concierne con la definición de páginas y su organización interna en términos de unidades elementales de contenido.

29 El modelo de navegación El modelo de navegación, que describe los enlaces entre páginas y unidades de contenido. Esto permite que la información contextual necesaria esté disponible al computar el contenido de las páginas que presentarán dicha información a los usuarios.

30 El modelo de presentación El modelo de presentación que describe la apariencia (look & feel) de las páginas. Este es específico para un dispositivo de acceso dado. Este modelo usualmente asocia construcciones de un lenguaje de presentación (p.ej., HTML o WML) con cada unidad de presentación (p.ej., páginas, marcos).

31 Naturaleza de cada modelo Cada uno de los modelos anteriores corresponden con distintos aspectos de una aplicación Web. Los recursos de datos son un valor empresarial que es relativamente estable. Los aspectos de composición y navegación son aspectos más dinámicos.

32 Modelos extendidos Los modelos pueden ser extendidos para lidiar con la especificación de administración de contenido e integración con servicios externos, Se pueden agregar que pueden ser definidas y agregadas al modelo de hipertexto. Dichas operaciones son invocadas como un efecto colateral de la navegación.

33 El desarrollo en WebML El ciclo de desarrollo de una aplicación Web se basa en un núcleo sólido de conceptos y notaciones. El proceso de desarrollo en WebML consiste de diferentes fases incrementales, que abarcan desde la recolección de requerimientos hasta la implementación, y que son ejecutadas en forma iterativa.

34 Especificación de requerimientos La especificación de requerimientos es la actividad en que el arquitecto de información recolecta y formaliza la información esencial sobre el dominio de la aplicación y funciones esperadas. El insumo de esta etapa es el conjunto de requerimientos del negocio que motivan el desarrollo de la aplicación.

35 El diseño de datos El diseño de datos es la fase en que se organizan los principales objetos de información en un modelo conceptual de datos que sea comprensivo y coherente. El resultado del diseño de datos es un esquema conceptual. Este muestra en una forma simple y legible el conocimiento disponible sobre los datos de la aplicación.

36 El diseño de hipertexto El diseño de hipertexto es la actividad que transforma los requerimientos funcionales en una o más vistas del sitio abarcando la entrega de la información necesaria y los servicios de manipulación de datos. El diseño de hipertexto opera en un nivel conceptual que permite al arquitecto de información el especificar cómo las unidades, definidas sobre objetos de datos, son compuestas dentro de las páginas

37 La implementación Implementación es la actividad de producir los módulos de software necesarios para transformar los diseños de datos e hipertexto en una aplicación ejecutable en la plataforma seleccionada. La implementación se divide en sub actividades: implementación de datos implementación de hipertexto.

38 La implementación de datos La implementación de datos consiste de transformar los esquemas E-R en una o más fuentes de datos.

39 La implementación de hipertexto La implementación de hipertexto consiste de la producción de plantillas de páginas dinámicas o programas, traduciendo las unidades y páginas del nivel conceptual en lenguaje de marcado (HTML) y guiones (scripts).

40 WebML: Hipertextos Papers Page Authors Page Papers Index CurrPaper:OID Paper Data Authors Multidata Paper Paper [OID=CurrPaper] Author Index of Papers Daml-s and WSDL WebML Web services Selected paper title: Web services abstract: XXX Go to all authors page All Authors

41 WebML: Operaciones Entry - Author Page Entry unit Modify Error Page KO OK Success Page Author Insert Your Data Fname Lname submit

42 Ejemplo: Un sitio de música Caso de Uso ver Álbum de un artista Incluye (included): Ver información del álbum Opcional (extend): Ver listado de canciones del álbum Ver comentarios del álbum Ver biografía del artista Diagrama de clases

43 Ejemplo: Un sitio de música (2) Especificación de los diagramas De composición y navegación

44 Ejemplo: Un sitio de música (3) Algunas unidades y su representación en HTML

45 Ejemplo: Un sitio de música (4) Vista general del sitio

46 Créditos Jill Aden Lead Technologist Minnesota Solution Centre. M.W. Richardson Lead Applications Engineer. I-Logix UK Simon Pickin Departamento de Ingeniería Telemática, Universidad Carlos III de Madrid. Nora Koch, Andreas Kraus. The Expressive Power of UML-based Web Engineering. Nora Koch, Rolf Hennicker. Modeling the User Interface of Web Applications with UML. Armando Arce O. Instituto Tecnológico de Costa Rica. Oscar Pastor. Universidad Politécnica de Valencia.