Anais do IHC'2001 - Departamento de Informática e Estatística - UFSC

Anais do IHC’2001 - IV Workshop sobre Fatores Humanos em Sistemas Computacionais 51
3. Especificação de Interfaces Web: Um Exemplo
Vários modelos para especificação de interfaces multimídia e baseada em hipertexto têm
sido propostos nos últimos anos, tais como XHMBS [14], OOHDM [19], HMD [5],
statecharts [9, 22] e redes de Petri [20]. Neste trabalho, optou-se pela notação
StateWebCharts [23], que é uma extensão de Statechart [7] concebida especificamente para
modelar interfaces Web. Entre outros recursos, esta notação representa visualmente os
limites da aplicação modelada, controle de ações sobre a interface (usuário ou sistema),
representação de distribuição cliente/servidor e composição visual da aplicação [23]. Estas
características não são consideradas nos modelos mencionados e, por considerá-las
importantes, optou-se por StateWebCharts.
Não é objetivo deste trabalho descrever toda a notação StateWebcharts, por isto, apenas os
conceitos importantes para a discussão sobre a avaliação de usabilidade serão apresentados.
Como exemplo, é apresentado uma modelagem parcial do site Web HIBAM: HIdrologia
da Bacia AMazônica. O objetivo do site, que ainda está em desenvolvimento, é
disponibilizar os resultados das pesquisas realizadas em cooperação Brasil-França neste
tema durante a última década.
Antes de especificar a navegação com StateWebCharts, foi construída uma descrição
hierárquica das informações do site, conforme figura 2. Observe que este modelo descreve
instâncias (e não classes) de informações contidas no site e que, devido ao grande número
de ramificações da árvore hierárquica, vários ramos não são detalhados. Os objetivos desta
representação hierárquica são: a) criar uma lista completa das informações que fazem parte
do site; e, b) organizar as informações em grupos de forma coerente ao domínio da
informação.
� Apresentação (home)
� Campanhas ( de 1994 – 2000)
� Amazonas_94
� Amazonas_94
� Estações visitadas
� Negro_95
� Madeira_95
� Solimoes_95
� Negro_96
� Purus_96
� Beni_96
� Branco_96
� Solimoes_97
� Encontro_97
� Xingu_97
� Humboldt LEGENDA:� Ramo mostrando subdivisões
� Estações �Ramo com subdivisões sem detalhes
� Metodologia �Ramo sem subdivisões
� Lista de pessoas para contatos
� Documentos publicados (artigos, relatórios, etc.)
� Links para outros projetos e sites
� FAQ
� Consulta a base de dados do HIBAM
Figura 2. Modelo hierárquico de informações HIBAM.
Os itens representados na figura 2 foram utilizados para construir a especificação da
navegação com StateWebCharts. A descrição hierárquica do site pode sugerir a criação de
documentos do site, porém, a transposição da hierarquia lógica para documentos físicos