Metodologias de

modelagem Web

Marcelo Brandão Theodoro Júnior

UWEUML-based Web Engineering, criado em 2000 por Nora Parchus de Koch

Trata-se de um conjunto de ferramentas de modelagem para sistemas web baseado na UML

Constituído por 4 fases e 5 diagramas (artefatos

Estudo de caso: sistema de submissão de artigos

UWE - Fases

Análise de requisitos

Projeto conceitual

Projeto de navegação

Apresentação

UWE - Artefatos

Modelo de casos de uso

Modelo conceitual

Modelo espacial de navegação

Modelo de navegação estrutural

Modelo de apresentação

UWE - Análise de RequisitosOs requisitos são levantados e modelados com diagramas de casos de uso.

UWE - Modelo ConceitualCriação de um diagrama de classes para representar a lógica de negócio da aplicação. Não se considera a interação do usuário com a interface.

UWE - Navegação EspacialIdentifica quais objetos serão visitados durante a navegação na aplicação

Classes de navegação: classes visitadas pelo usuário na navegação

Navegabilidade direta: associações entre as classes

Exemplo:

UWE - Navegação EstruturalDefine como a navegação é conduzida a partir dos elementos de acesso: indexes, guided tours, queries e menus

Index: acesso direto aos objetos das classes de navegação

Guided tour: acesso sequencial as classes de navegação

Queries: consultas a base de dados para carregamento do conteúdo da página

Menu: indíces para os demais elementos de acessoou outros menus

Index Guided Tour Queries Menus

UWE - Navegação EstruturalBase: modelo de navegação espacial

Substituir as associação de multiplicidade maior que 1 por associações unidirecionais

Substituir as associações bidirecionais com extremos de multiplicidade maior que 1 por duas associações unidirecionais

Guiar a navegação entre as classes de navegação pelos elementos de acesso

UWE - Navegação Estrutural

UWE - ApresentaçãoConjuto de views que representam o conteúdo e estrutura de cada página da aplicação e a forma de interação do usuário com cada uma delas.

Introdução dos elementos das páginas (HTML) para montagem de cada página.

Construção dos cenários para simulação das interações.

Esboço das interfaces do sistema.

UWE - Apresentação

Exemplo

WebML

Uma linguagem de modelagem de aplicações Web

Composta de 5 fases

Associa os conceitos propostos com uma notação gráfica e uma sintaxe XML.

WebML - Modelo EstruturalTrata-se de um esquema de baseado em entidades com atributos e relacionamentos.

Modela contéudo (dados) e a lógica da aplicação.

Gera um diagrama parecido com o de classes da UML.

Similar a fase de modelagem estrutural do UWE.

WebML - Modelo de composição

Identifica os componentes da interface e as páginas da aplicação.

Visa organizar a resposta (hipertexto) as requisições do cliente.

Possui 6 unidades que compõem o hipertexto

WebML - Modelo de composição1. Unidades de dados: componentes de informação unitários.

2. Dados compostos: várias instâncias das unidades de dados.

3. Indices: lista de instâncias de uma entidade ou unidade de dados.

4. Unidades navegáveis: comandos de navegação entre os dados. Por exemplo, paginação de uma busca.

5. Filtros: restrições de conteúdo.

6. Páginas: composição dos demais elementos. Trata-se da resposta a uma requisição.

WebML - Modelo de composição

Unidade de dadosDados compostos Indice

Unidade navegável Filtro Página

WebML - Modelo de navegaçãoTrata da interação do usuário com as páginas

Cria uma relação de navegação entre cada página

Esquema de navegaçãoSeleção de navegação

por REQUEST

WebML - Modelo de navegação

Exemplo: Esquema de navegação entre páginas

WebML - Modelo de apresentação

Levantamento e modelagem dos requisitos gráficos para renderização das páginas

Por exemplo: Combinação de cores, fontes, estilos

Projeto de interface visual

WebML - Modelo de personalizaçãoCustomização do conteúdo e da interface por usuário ou por tipo de requisição.

Ex: Sistema de “templates” ou “temas”

Ex: Personalização do posicionamento dos elementos da página

Ex: Recuperação de preferências e configurações (cookie ou sessão)

Conclusão

A modelagem de projetos de aplicação Web pode ser feita de várias formas, inclusive usando ferramentas comuns ao projeto Desktop, como mostra o UWE.

Porém existem modelos adaptados ao escopo da Web e ajudam o desenvolvedor a construir aplicações de melhor qualidade e mais fácil extensão.

BibliografiaEstudo de caso: UML-based Web Engineering. DC-UFSCar, MDS 2008-2. Manera, Aline; Gracioso, Caroline; Ferreira, Tatiane. Professora Rosângela Dellosso Penteado.

Koch, N.;Klaus, A.; Hennicker, R. “The Authoring Process of the UML-based Web Engineering Approach”.

UWE: http://uwe.pst.ifi.lmu.de/index.htmlVisitado em 27/04/2010

WebML: http://webml.org/Visitado em 27/04/2010

Ceri, S.; Fraternali, P.; Bangio, A. “Web Modeling Language: a modeling language for designing websites”.