BLOQUE I 3 Técnicas en Ingeniería Web

35
1 BLOQUE I 3 Técnicas en Ingeniería Web Diseño Centrado en el Usuario Profesorado: Dra. María José Escalona Cuaresma [email protected] Dr. José Mariano González Romano [email protected] Master Oficial en Ingeniería y Tecnología del Software http://www.lsi.us.es/docencia/master-oficial.php Departamento de Lenguajes y Sistemas Informáticos Universidad de Sevilla Curso 2007/08

Transcript of BLOQUE I 3 Técnicas en Ingeniería Web

Page 1: BLOQUE I 3 Técnicas en Ingeniería Web

1

BLOQUE I

3 Técnicas en Ingeniería Web

Diseño Centrado en el Usuario

Profesorado:

Dra. María José Escalona

Cuaresma

[email protected]

Dr. José Mariano González

Romano

[email protected]

Master Oficial en Ingeniería y Tecnología del Software

http://www.lsi.us.es/docencia/master-oficial.php

Departamento de Lenguajes y Sistemas Informáticos

Universidad de Sevilla

Curso 2007/08

Page 2: BLOQUE I 3 Técnicas en Ingeniería Web

2

Técnicas WebIntroducción

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Como se ha visto, la Ingeniería Web ofrece un conjunto de

técnicas específicas para tratar los aspectos específicos de la web.

En este tema se van a presentar las técnicas más usadas en la

Ingeniería de Requisitos Web y se va a ofrecer un estudio

comparativo de las técnicas estudiadas en el tema anterior para ver

cómo se ha evolucionado.

Tras ver las técnicas de Ingeniería de Requisitos para la web, se

presentan técnicas específicas de la Ingeniería Web en análisis y

diseño.

Por último se presenta NDT en detalle como ejemplo de

metodología web orientada a los requisitos.

Page 3: BLOQUE I 3 Técnicas en Ingeniería Web

3

Técnicas WebIngeniería de Requisitos

Information

Validación de

requisitos

Correcciones

Definición de requisitos

Captura de requisitos

Catalogo de

requisitos

Analistas

Desarrolladores

Disenadores

Clientes

Usuarios

[Escalona & Koch, 2003]

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 4: BLOQUE I 3 Técnicas en Ingeniería Web

4

Técnicas WebIngeniería de Requisitos

1. Captura de requisitos: Actividad mediante la que se extraen las necesidades del sistema

TÉCNICAS:

Entrevistas

JAD (Joint Application DevelopmentBrainstormingConcept MappingSketches y StoryboardsCasos de UsoCuestionario y ChecklistComparación de terminología

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 5: BLOQUE I 3 Técnicas en Ingeniería Web

5

Técnicas WebIngeniería de Requisitos

2. Definición de requisitos: Proceso mediante el que se representan y describen los requisitos capturados

TÉCNICAS:

Lenguaje Natural

Glosarios y OntologíasPlantillas y PatronesEscenariosCasos de usoLenguajes Formales

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 6: BLOQUE I 3 Técnicas en Ingeniería Web

6

Técnicas WebIngeniería de Requisitos

3. Validación de requisitos: Proceso que tiene como misión demostrar que la definición de los requisitos define realmente el sistema que el usuario necesita.

TÉCNICAS:

Reviews o Walk-throughs

AuditoríasMatrices de trazabilidadPrototipos

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 7: BLOQUE I 3 Técnicas en Ingeniería Web

7

Técnicas WebComparativa

REQUISITOS TRATADOS

Req.

datos

Req.

interfaz

Req.

Naveg.

Req.

Personaliz.

Req.

Transacion.Req. no

funcionales

WSDM

SOHDM

RNA

HFPM

OOHDM

UWE

W2000

UWA

NDT

DDDP

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 8: BLOQUE I 3 Técnicas en Ingeniería Web

8

Técnicas WebComparativa

TÉCNICAS Y ACTIVIDADES CONTEMPLADAS: en captura

Entrevistas

JAD

Brainstorming

Concept

Mapping

Rol-

Activid.

Casos de uso

Cuestionario/

Checklist

Prototipos

Otra técnicas DFD

WS

DM

SO

HD

M

RN

A

HFP

M

OO

HD

M

UW

E

W2

00

0

UW

A

ND

T

DD

DP

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 9: BLOQUE I 3 Técnicas en Ingeniería Web

9

Técnicas WebComparativa

TÉCNICAS Y ACTIVIDADES CONTEMPLADAS: en definición

WS

DM

SO

HD

M

RN

A

HFP

M

OO

HD

M

UW

E

W2

00

0

UW

A

ND

T

DD

DP

Lengua. natural

Glosarios

Plantillas

Escenarios SAC

Casos de uso

Lenguaj. formal XML

Sketches

Prototipos

Otras técnicas Lista

even

.UID

Grafo

requis

.

Fras.

BNL

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 10: BLOQUE I 3 Técnicas en Ingeniería Web

10

Técnicas WebComparativa

TÉCNICAS Y ACTIVIDADES CONTEMPLADAS: en validación

WS

DM

SO

HD

M

RN

A

HFP

M

OO

HD

M

UW

E

W2

00

0

UW

A

ND

T

DD

DP

Reviews/

Walk-throughs

Auditorías

Matriz

trazabilidad

Prototipos

Otras técnicas Grafo

requis

.

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 11: BLOQUE I 3 Técnicas en Ingeniería Web

11

Técnicas WebComparativa

GRADO DE DETALLE EN DESCRIPCIONES

Orientación al

proceso

Orientación a

la técnica

Orientación al

resultado

WSDM o - -

SOHDM - + -

RNA + - -

HFPM + o +

OOHDM o + -

UWE + o o

W2000 o o -

UWA + o -

NDT o + +

DDDP + o -

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 12: BLOQUE I 3 Técnicas en Ingeniería Web

12

Técnicas WebComparativa

GRADO DE DETALLE EN DESCRIPCIONES

propuestas +

Propuestas o

Propuestas -

Orientación al proceso

Orientación a la técnica

Orientación al resultado

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 13: BLOQUE I 3 Técnicas en Ingeniería Web

13

Técnicas WebComparativa

Existen tendencias en las propuestas1- Representación gráfica2- Representación textual

Existe poco soporte en cuanto a herramientas case

Existe una terminología muy variada

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 14: BLOQUE I 3 Técnicas en Ingeniería Web

14

Técnicas WebConceptos heredados del análisis y diseño

La separación de conceptos: Modelo conceptual, de información, de clases, etc. Modelo navegacional Modelo de presentación etc.

Los modelos como extensiones formales. Se comenzó con modelos propios Luego se utilizaron modelos estándares como diagramas de clases Actualmente se marca como extensiones formales de lenguajes estándares como UML. Esto está permitiendo que se unifiquen conceptos

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 15: BLOQUE I 3 Técnicas en Ingeniería Web

15

Técnicas WebEjemplo. NDT

NDT es una aproximación que intenta salvar algunos problemas que se detectaron en los estudios comparativos.

Intenta salvar el “abandono” de la Ingeniería de Requisitos y trata las fases de Ingeniería de Requisitos y Análisis. Separa los conceptos desde la Ingeniería de Requisitos:

Requisitos de almacenamiento de información Requisitos de actores Requisitos funcionales Requisitos de interacción Requisitos no funcionales

Aunque también sigue las directrices de separación en análisis.

Modelo conceptual

Modelo de navegación

Modelo de interfaz

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 16: BLOQUE I 3 Técnicas en Ingeniería Web

16

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Técnicas WebEjemplo. NDT

Capturar y

definir requisitosValidar requisitos

Especificación de requisitos

Generar el

modelo conceptual

Generar el

modelo de

navegación

Análisis

[correctos]

Generar el

DRS

[no correctos]

[se han detectado errores]

[sin errores][sin errores]

[se han detectado errores]

Generar

prototipos

[se han

detectado

errores]

Generar el

DAS[sin errores]

DRS

DAS

Page 17: BLOQUE I 3 Técnicas en Ingeniería Web

17

Técnicas WebEjemplo. NDT

NDT es una aproximación que intenta salvar algunos problemas que se detectaron en los estudios comparativos.

Sigue las directrices buscando modelos y formas de trabajoestándar que permita una fácil adecuación a otras metodologías.

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 18: BLOQUE I 3 Técnicas en Ingeniería Web

18

Técnicas WebEjemplo. NDT

NDT es una aproximación que intenta salvar algunos problemas que se detectaron en los estudios comparativos.

Sigue las directrices buscando modelos y formas de trabajo estándar que permita una fácil adecuación a otras metodologías.

Captura de

requisitos

Definición

de requisitosValidación de

requisitos

Generación de

modelos

Definición de

modelosValidación de

modelos

Procesos de

derivación

Requisitos

Analisis

NDT

Modelos de

requisitos

Modelos de

análisis

Patrones basados

en metamodelos

METODOLOGÍA PARA

LA ELICITACIÓN DE REQUISITOSBNL UML

UWEOOHDM

The approach

Influencias

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 19: BLOQUE I 3 Técnicas en Ingeniería Web

19

Técnicas WebEjemplo. NDT

NDT es una aproximación que intenta salvar algunos problemas que se detectaron en los estudios comparativos.

En la actualidad ha evolucionado hacia los entornos MDDcomo veremos más adelante. Muchos grupos han detectado que pasar de Ingeniería de Requisitos a Análisis es complejo. NDT propone una forma de llevarlo.

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 20: BLOQUE I 3 Técnicas en Ingeniería Web

20

Técnicas WebEjemplo. NDT

Metamodelos para la fase de requisitos

Metamodelos para la fase de análisis

Modelos básicos

Modelos finales

Sistemático

Controlado

NDT (Navigational Development Techniques)

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 21: BLOQUE I 3 Técnicas en Ingeniería Web

21

Técnicas WebEjemplo. NDT

NDT es una aproximación que intenta salvar algunos problemas que se detectaron en los estudios comparativos.

Introduce al usuario en el proceso de Ingeniería de Requisitos. Para ello propone un sistema basado en patrones.

Patrón para

OBJ

Patrón para

RA

Patrón para

NA

Patrón para

ACT

Patrón para

RF

Patrón para

FR

Patrón para

PV

Patrón para

RNF

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

Page 22: BLOQUE I 3 Técnicas en Ingeniería Web

22

Técnicas WebEjemplo. NDT

Introducción

Técnicas

Captura

Definición

Validación

Comparativa

Ideas

NDT

MDA aplicado a la web

Page 23: BLOQUE I 3 Técnicas en Ingeniería Web

23

BLOQUE I

4 Ingeniería guiada por modelos

Diseño Centrado en el Usuario

Profesorado:

Dra. María José Escalona

Cuaresma

[email protected]

Dr. José Mariano González

Romano

[email protected]

Master Oficial en Ingeniería y Tecnología del Software

http://www.lsi.us.es/docencia/master-oficial.php

Departamento de Lenguajes y Sistemas Informáticos

Universidad de Sevilla

Curso 2007/08

Page 24: BLOQUE I 3 Técnicas en Ingeniería Web

24

Ingeniería Guiada por modelosIntroducción

La Ingeniería Guiada por modelos es un nuevo paradigma que da

más importancia a los conceptos que a la forma de representarlo.

La idea es detectar los conceptos y representarlos de manera

abstracta.

Tras esto se definen las relaciones entre estos conceptos.

Basándose en los conceptos se pueden definir transformaciones.

Concepto

1Concepto

2

Introducción

Definición

Estructura

básica

Conceptos

Transformaciones

Ventajas

Page 25: BLOQUE I 3 Técnicas en Ingeniería Web

25

MDADefinición

MDA is an approach to system development, which

increases the power of models in that work. It is model

driven because it provides a means for using models to

direct the course of understanding, design, construction,

deployment, operation, maintenance and modification.

No hay que mezclar los conceptos. MDA no es lo mismo que MDE

Model Driven Archietecture (MDA) es la estandarización de la

OMG como platarforma para soportar MDD.

MDA se basa en separar la especificación de los detalles de

implementación.

MDA ofrece una aproximación que consiste en paso a paso ir

consiguiendo modelos basado en transformaciones.

Introducción

Definición

Estructura

básica

Conceptos

Transformaciones

Ventajas

Page 26: BLOQUE I 3 Técnicas en Ingeniería Web

26

MDAEstructura básica

Introducción

Definición

Estructura

básica

Conceptos

Transformaciones

Ventajas

MDA contempla cuatro modelos:

Platform

Specific

Models (PSM)

``Big Picture´´

Content

Model

Platform IndependentDesign Models (PIM)

Business Models

(CIM)

Navigation

Model

Process

Model

Presentation

Model

Requirements

Models

Code

CIM to PIM

Transformation

PIM to PIM

Transformation

PIM to PSM

Transformation

PSM to Code Transformation

Model for

J2EE

Model for

.NET…

Platform

Specific

Models (PSM)

``Big Picture´´

Content

Model

Platform IndependentDesign Models (PIM)

Business Models

(CIM)

Navigation

Model

Process

Model

Presentation

Model

Requirements

Models

Code

CIM to PIM

Transformation

PIM to PIM

Transformation

PIM to PSM

Transformation

PSM to Code Transformation

Model for

J2EE

Model for

.NET…

CIM: Computation independent model

PIM: Platform independent model

PSM: Platform specific model

Code

[Koch, Zhang, Escalona 2006]

Page 27: BLOQUE I 3 Técnicas en Ingeniería Web

27

MDE Definiendo los conceptos. Ej. WebRE

[Escalona & Koch, 2006]

WebRE Behavior

WebUser

isRegistered: boolean

Navigation WebProcess

WebRE Structure

Node Content

WebUI

Browse Search UserTransaction

1..*

1..*

1

+target1

1

+source 1

*

+transactions1..*

1..*1..*

*

+parameters1..*

+page 1..*

1..*

+location

* +content

1..*

1..*

1..*

WebRE Behavior

WebUser

isRegistered: boolean

Navigation WebProcess

WebRE Structure

Node Content

WebUI

Browse Search UserTransaction

1..*

1..*

1

+target1

1

+source 1

*

+transactions1..*

1..*1..*

*

+parameters1..*

+page 1..*

1..*

+location

* +content

1..*

1..*

1..*

Primero se definen los conceptosIntroducción

Definición

Estructura

básica

Conceptos

Transformaciones

Ventajas

Page 28: BLOQUE I 3 Técnicas en Ingeniería Web

28

MDE Definiendo los conceptos. Ej. WebRE

[Escalona & Koch, 2006]

Esto ya es un avance porque permite UNIFICAR conceptos.

Así, WebRE permite representar conceptos de 4 aproximaciones:

NDT, UWE, W2000, UID de OOHDM.

WebRE Concept NDT OOHDM UWE W2000

B

e

h

a

vi

o

r

WebUser Actor Actor Actor Actor

Navitation Visualization

prototype

Use case Navigation use case Browse use case

WebProcess Use case Use case Use case Use case

Browse Visualization

prototype

Single choice Activity

Search Phrase Optional data entry Activity

UserTransaction Functional

requirement

Application processing Activity

St

r

u

ct

u

r

e

Node Visualization

prototype

Content Storage requirement Data entry Class

WebUI Interaction

Introducción

Definición

Estructura

básica

Conceptos

Transformaciones

Ventajas

Page 29: BLOQUE I 3 Técnicas en Ingeniería Web

29

MDE Definiendo los conceptos. Ej. WebRE

[Escalona & Koch, 2006]

Veamos un mismo ejemplo:

WebUser

AddTo

ShoppingCart

ListContent

ShoppingCart

Login

Checkout Register

SearchCD«extend»

«extend»

«extend»

WebUser

AddTo

ShoppingCart

ListContent

ShoppingCart

Login

Checkout Register

SearchCD«extend»

«extend»

«extend»

FR-01 Login

Description Authentication to allow access to the checkout process

Actors Use case actor

AC-01. WebUser

Normal sequence Step Action

1 The system asks for the userID and password and the

option to remember both userID and password

2 The user puts the userID and the password

3 The userID and the password are checked

4 The userID and the password is stored if the field

remember is true

5 Access to checkout is allowed

Exceptions Step Action

4 The user is not registered, so the user executes FR-02

4 The userID or the password are not valid, continue with

step 1

Introducción

Definición

Estructura

básica

Conceptos

Transformaciones

Ventajas

Page 30: BLOQUE I 3 Técnicas en Ingeniería Web

30

MDE Definiendo los conceptos. Ej. WebRE

[Escalona & Koch, 2006]

Veamos un mismo ejemplo:

WebUser

AddTo

ShoppingCart

ListContent

ShoppingCart

Login

Checkout Register

SearchCD«extend»

«extend»

«extend»

WebUser

AddTo

ShoppingCart

ListContent

ShoppingCart

Login

Checkout Register

SearchCD«extend»

«extend»

«extend»

Error Message

userID

password

remember

(access to checkout)

Error Message

userID

password

remember

(access to checkout)

Input FindUSer

userID

password

remember

ShowError Verify

Password

[correct][else]

[cancel]

[cancel]

[repeat]

[found][else]

[else]

[already logged in]

Input FindUSer

userID

password

remember

ShowError Verify

Password

[correct][else]

[cancel]

[cancel]

[repeat]

[found][else]

[else]

[already logged in]

Introducción

Definición

Estructura

básica

Conceptos

Transformaciones

Ventajas

Page 31: BLOQUE I 3 Técnicas en Ingeniería Web

31

MDE Definiendo los conceptos. Ej. WebRE

[Koch, Zhang, Escalona, 2006]

Primero se definen los conceptos

NavigationNode Link

isAutomatic: boolean

NavigationLinkNavigationClass

isRoot: boolean

AccessPrimitive NavigationAttribute

Index Query GuidedTour

Menu

ProcessClass ProcessLink

+source

1

+outLinks

*+target +inLinks

*

*

{subsets inLinks}

1..*

{subsets target}

*

{subsets ownedAttributes}

1

1

{ordered}

+accessedAttributes

1

0..1

*

1..*

{subsets target} *

{subsets inLinks}

1..*

NavigationNode Link

isAutomatic: boolean

NavigationLinkNavigationClass

isRoot: boolean

AccessPrimitive NavigationAttribute

Index Query GuidedTour

Menu

ProcessClass ProcessLink

+source

1

+outLinks

*+target +inLinks

*

*

{subsets inLinks}

1..*

{subsets target}

*

{subsets ownedAttributes}

1

1

{ordered}

+accessedAttributes

1

0..1

*

1..*

{subsets target} *

{subsets inLinks}

1..*

Introducción

Definición

Estructura

básica

Conceptos

Transformaciones

Ventajas

Page 32: BLOQUE I 3 Técnicas en Ingeniería Web

32

MDEDefiniendo transformaciones

[Koch, Zhang, Escalona 2006]

MOF

UWE MetamodelWebRE

MetamodelQVT Rules

WebRE ModelUWE Navigation

ModelTransformation

«instantiate» «instantiate»

«instantiate» «instantiate»«instantiate»

+source +target

«use» «use»

MOF

UWE MetamodelWebRE

MetamodelQVT Rules

WebRE ModelUWE Navigation

ModelTransformation

«instantiate» «instantiate»

«instantiate» «instantiate»«instantiate»

+source +target

«use» «use»

Luego se definen las transformacionesIntroducción

Definición

Estructura

básica

Conceptos

Transformaciones

Ventajas

Page 33: BLOQUE I 3 Técnicas en Ingeniería Web

33

MDEDefiniendo transformaciones

[Koch, Zhang, Escalona]

transformation Content2Class (webre:WebRE, uwe:UWE) {

top relation R1 {

checkonly domain webre c:Content { name = n };

enforce domain uwe cc: Class { name = n };

}

top relation R2 {

cn: String;

checkonly domain webre p: Property { namespace=c:

Content {}, name = cn};

enforce domain uwe p1:Property { namespace = cc: Class{};

name = cn}

when {R1 (c,cc); }

}

}

Luego se definen las transformacionesIntroducción

Definición

Estructura

básica

Conceptos

Transformaciones

Ventajas

Page 34: BLOQUE I 3 Técnicas en Ingeniería Web

34

MDDVentajas

La forma de “representar” los conceptos ya no es tan relevante.

Lo importante son los conceptos.

Las relaciones permiten “controlar” la consistencia de los

modelos.

Las transformaciones son una vía que se pueden traducir en

“procesos” de transformación.

Introducción

Definición

Estructura

básica

Conceptos

Transformaciones

Ventajas

Page 35: BLOQUE I 3 Técnicas en Ingeniería Web

35

BLOQUE I

Ingeniería Web

Diseño Centrado en el Usuario

Profesorado:

Dra. María José Escalona

Cuaresma

[email protected]

Dr. José Mariano González

Romano

[email protected]

Master Oficial en Ingeniería y Tecnología del Software

http://www.lsi.us.es/docencia/master-oficial.php

Departamento de Lenguajes y Sistemas Informáticos

Universidad de Sevilla

Curso 2007/08