Interação na Web
Limitações
Ferramentas
Introdução





Já sabemos do sucesso da internet através da Web como meio
de comunicação.
Tanto a quantidade de usuários como a quantidade de
informações que ela integra tendem a continuar crescendo
"assustadoramente" nos próximos anos.
No entanto, existe uma grande preocupação no que diz
respeito à qualidade da interação usuário/Web e
usuário/usuário através da Web .
Se não houver significativos avanços neste sentido, a Web
poderá se tornar um "gigantesco cemitério de informações" .
Esta seção introduz a questão, mostrando alguns resultados
do campo de IHC (Interação Homem-Computador), que
estuda a relação homem/máquina desde muito antes do
surgimento da Web.
(IHC)

A interação entre um usuário e um programa se
dá através da interface com o usuário (UI - User
Interface). Os pesquisadores de IHC determinam
a "qualidade" da interface (e, conseqüentemente,
da interação) através do conceito de
"usabilidade", definido como uma combinação dos
seguintes fatores :





facilidade de aprendizado,
alta velocidade para a execução de tarefas,
baixa taxa de erro no uso,
satisfação subjetiva do usuário e
retenção da forma de uso com o tempo.
Computador (IHC)



Uma diretriz básica para o desenvolvimento de interfaces é
realizar o projeto centrado no usuário.
O projetista deve procurar fazer sempre o que for melhor
para o usuário, mesmo que isso seja mais difícil para ele (o
projetista).
O estudo da IHC envolve profissionais de várias áreas
(engenharia de software, ciência comportamental,
lingüística, ergonomia, psicologia cognitiva, etc) e seus
resultados certamente serão de grande importância para a
"sobrevivência" da Web no futuro, pois mostrarão as
diretrizes a serem seguidas para garantir uma eficiente
interação com a Web.
. A Web como meio de
interação


A explosão de popularidade da Internet através da Web,
aliada às tecnologias que permitem maior dinamismo e
flexibilidade de interação com a Web (por exemplo, CGI,
ECMAScript e Java) têm levado muitos pesquisadores e
desenvolvedores a utilizarem-na como meio de interação
com as aplicações.
As grandes vantagens em se desenvolver aplicações
disponibilizadas via Web estão associadas à fácil
acessibilidade: as aplicações ficam disponíveis a uma, cada
vez mais ampla, gama de usuários da Web e elas podem
ser acessadas de praticamente qualquer lugar (de casa, do
trabalho, ou mesmo em trânsito, através da computação
móvel).
Limitações na Web




As tecnologias básicas da Web (HTTP e HTML) ainda
impõem algumas limitações no que diz respeito à interação
com as aplicações. Dentre estas limitações, destacam-se:
Falta de controle sobre a aparência da interface. A
linguagem HTML deixa este tipo de decisão a cargo dos
browsers, e browsers diferentes podem gerar ULS com
disposições diferentes.
Dificuldade na construção de interfaces com os usuários
independentes de plataforma.
O protocolo HTTP não suporta o conceito de sessão. Cada
acesso ao servidor é feito de maneira independente, não
guardando nenhuma informação sobre acessos anteriores.
Isto dificulta o desenvolvimento de aplicações que exigem a
manutenção de estado entre os sucessivos acessos ao
servidor (por exemplo, aplicações de comércio eletrônico,
que precisam guardar os dados do cliente e o que ele
coloca no "carrinho de compras").
Limitações na Web



Lentidão de realimentação (feedback). Geralmente, a
interface Web só muda de estado após a conexão com o
servidor e a realização do processamento necessário. Esse
processo demora bem mais do que o usuário está
acostumado em interfaces fora da Web.
A aplicação não tem como interromper a atividade do
browser para alguma comunicação assíncrona. A
comunicação na Web é sempre iniciada pelo cliente, não
havendo suporte para a comunicação iniciada pelo servidor,
em para a comunicação cliente/cliente ou servidor/servidor.
Isso dificulta a implementação de aplicações que exigem
comunicação ponto-a-ponto ou um papel mais ativo do
servidor.
A arquitetura não provê suporte direto para a replicação da
informação, o que é necessário para o trabalho
desconectado, para a rápida realimentação e para a
confiabilidade do sistema .
Limitações na Web



O HTTP não garante taxa de transmissão
mínima, tornando a Web pouco adequada
para meios contínuos, tais como áudio e
vídeo (importantes para interfaces mais
sofisticadas).
Apesar dessas limitações aparentemente
desanimadoras, novas tecnologias têm
surgido para superá-las.
Hoje em dia já é possível desenvolver
aplicações relativamente sofisticadas na
Web, utilizando ferramentas tais como
CGI, ECMAScript e Java.
Ferramentas
HTML (HyperText Markup Language)

A linguagem HTML, é uma das tecnologias que formam a
base de sustentação da Web.

Ela é basicamente um padrão para a apresentação de
hipertexto, com recursos razoáveis de estruturação do texto,
com inclusão de imagens e multimídia, além da criação de
âncoras que fazem a interligação entre documentos
relacionados.

No entanto, este conjunto é bastante limitado, restrito
basicamente a botões, checkboxes, listas de seleção, caixas
para entrada de texto e imagens mapeadas.

Além disso, não há como ter um controle maior sobre a
aparência da interface, pois isso fica a cargo dos browsers;
esse é o preço pago pela independência de plataforma.
Ferramentas

Há uma série de características dos browsers
que dificultam a implementação de interfaces
mais sofisticadas na Web:



O servidor só é contatado ao selecionar uma
âncora ou um botão do tipo "submit".
O servidor não recebe informações sobre as
atividades intermediárias de interação, tais como a
digitação de texto em um formulário, a seleção de
uma checkbox, etc. Isso impossibilita a criação de
interfaces com realimentação imediata.
Qualquer alteração na página exige que ela seja
inteiramente retransmitida. Não há como fazer
uma atualização incremental de apenas parte da
página.
Ferramentas




Os browsers armazenam as últimas páginas
visitadas em memória cache.
Isso permite que o usuário volte para páginas
anteriores.
No entanto, em aplicações interativas, estas
páginas armazenadas em cache podem
representar estados anteriores do diálogo com o
usuário.
A Web tem sido usada com sucesso para a
implementação de aplicações interativas pois
surgiram novas tecnologias para superar estas
limitações da HTML.
XML e DHTML






XML (Extensible Markup Language) é uma metalinguagem para a
criação de novas linguagens de marcação.
Uma linguagem de marcação define a maneira de descrever a
informação em uma certa classe de documentos.
A HTML, por exemplo, é uma linguagem de marcação que define a
estrutura de documentos hipertexto.
Na prática, a XML permite que seja definido um novo conjunto de
rótulos (tags), adequado à classe de documentos que se deseja
representar.
É importante ressaltar que a XML não é uma versão estendida da
HTML, mas sim uma versão simplificada da SGML (Standard
Generalized Markup Language), a "metalinguagem-mãe" para a
descrição de novas linguagens de marcação.
A XML pretende não só remover da Web a inflexibilidade da HTML,
mas também a complexidade da SGML, com a qual é muito difícil de se
trabalhar.
XML e DHTML




Existem muitas duvidas de que se as vantagens que o XML traz
compensam a dificuldade adicional de se criar novas sintaxes e browsers
capazes de entendê-las.
No entanto, sabe-se que o XML não resolve os problemas de interação da
HTML, pois ela só atua na estruturação, e não na apresentação dos
documentos, ou seja browsers diferentes continuarão a apresentar os
documentos de maneiras diferentes.
Existe uma proposta de extensão da HTML 4.0: a DHTML (Dynamic
HTML).
A DHTML pretende criar páginas muito mais interativas do que as atuais.
Com a DHTML é possível, por exemplo, alterar a cor de elementos da
interface quando o cursor passar sobre eles, permitir que os usuários
mudem a posição de imagens na página, e muitas outras coisas que só
eram possíveis por meio de applets Java.
XML e DHTML



Uma das idéias centrais da DHTML é a utilização de CSS
(cascading style sheets), cuja sintaxe define elementos cuja
posição, estilo e aparência podem ser alterados depois que a
página é carregada no cliente.
O uso de CSS implementa a tão esperada separação entre
conteúdo/estrutura e apresentação de uma página Web.
De maneira similar, a XML também propõe a utilização de style
sheets através da XSL (Extensible Stylesheet Language). No
entanto, a falta de acordo entre Microsoft e Netscape tem
dificultado a padronização destas tecnologias
CGI - Common Gateway
Interface
O CGI é um padrão
que permite que
programas externos
se comuniquem
com os servidores
de informação Web.


Na prática, ao invés de acessar um documento
HTML no servidor, o cliente aciona um programa do
servidor que realiza algum tipo de processamento e
retorna um HTML criado dinamicamente.
CGI (Common Gateway
Interface)




O CGI estabelece as regras para a troca de dados entre o servidor
Web e o programa externo. Desde que siga essas regras, o
programa pode ser escrito em qualquer linguagem de
programação que seja capaz de ler valores de variáveis de
ambiente e de escrever para a saída padrão
Programas CGI são muito utilizados em associação com
formulários HTML.
Desse modo, os dados do formulário preenchido pelo usuário são
enviados ao servidor e servem como parâmetros de entrada do
programa, que retorna uma página criada em função dos dados do
usuário.
É assim que funcionam as consultas às bases de dados via Web.
O usuário entra com as palavras-chave, que são enviadas ao
programa CGI. O programa então realiza a pesquisa e monta uma
página HTML com os resultados, página esta que é lida pelo
browser do usuário.
ECMAScript



O ECMAScript surgiu como complemento/alternativa
importante ao CGI, pois com ele é possível realizar algum
processamento do lado do cliente Web. Isso favoreceu o
desenvolvimento de UIs para aplicações na Web, pois
tornou possível dar ao usuário alguma realimentação sem
necessariamente se conectar ao servidor.
ECMAScript é uma tentativa de padronização de um
conjunto de tecnologias semelhantes de diferentes
fabricantes, cujas mais conhecidas são o JavaScript
(Netscape) e o JScript (Microsoft).
O ECMAScript é definido como "uma linguagem de
programação orientada a objetos para realizar
processamentos e manipular objetos computacionais dentro
de um ambiente hospedeiro. No caso da Web, o "ambiente
hospedeiro" é o browser, que deve ser capaz de reconhecer
o programa ECMAScript embutido em uma página HTML e
realizar o processamento por ele determinado.
ECMAScript




No caso de um campo que peça o número de cartão de
crédito, por exemplo, um script pode ser usado para verificar
se o usuário escreveu o número correto de dígitos, e se há
apenas caracteres numéricos escritos. Em caso de erro, a
realimentação é imediata, pois não há a necessidade de
contato com o servidor.
Uma importante utilidade do ECMAScript é a possibilidade de
fazer uma verificação no cliente antes de submeter um
formulário HTML ao servidor.
A combinação CGI/ECMAScript, apesar de representar um
significativo avanço, não resolve todos os problemas
relacionados à interação na Web. Isso porque o ECMAScript é
uma linguagem com funcionalidade limitada. Segundo sua
própria definição, ela foi criada para "manipular, customizar e
automatizar as facilidades de um sistema já existente
. Ela não possui, por exemplo, recursos para leitura de dados
externos e nem recursos para a criação de UIs. Estas limitações
são superadas pelos applets Java.
JAVA


Java é uma linguagem de programação de alto nível
desenvolvida pela Sun Microsystems, que se tornou muito
popular para a construção de páginas altamente interativas na
Web. Isso é feito através dos applets, que são programas Java
transmitidos junto com as páginas HTML e executados no
computador do cliente .
Independentemente dos applets, Java é uma linguagem de
programação orientada a objetos de propósito geral
(semelhante a C++) e projetada para ser simples. Todos os
recursos considerados desnecessários foram propositalmente
deixados de fora da linguagem, como por exemplo,
apontadores, estruturas, vetores multi-dimensionais e
conversão implícita de tipos.
Também não há necessidade
de gerenciamento de memória em Java, pois ela tem um
programa interno (o garbage collector) que automaticamente
libera partes ocupadas da memória que não terão mais uso.
BYTECODES



Outra característica essencial de Java é ser independente de
plataforma. O código-fonte de um programa Java é précompilado em bytecodes, que são conjuntos de instruções
semelhantes ao código de máquina, mas sem serem
específicos de qualquer plataforma.
As instruções em bytecodes são verificadas na máquina
local antes de serem executadas, garantindo a segurança
da linguagem.
Os bytecodes podem ser interpretados por Máquinas
Virtuais Java, instaladas em qualquer plataforma, sem
necessidade de recompilação do programa. Praticamente
todos os browsers já incorporam a JVM em sua
implementação. Há um esforço em andamento para
incorporar a JVM a diversos sistemas operacionais Microsoft, IBM, Apple, e HP, além da própria Sun.
APPLETS


Java pode ser usada tanto para o desenvolvimento de
programas independentes quanto para o de applets, que
são executados dentro de um "ambiente hospedeiro" (o
browser).
Os applets são tratados pelo browser como qualquer outro
tipo de objeto da página HTML, como uma imagem ou um
vídeo: ele é transmitido do servidor para o cliente, onde é
executado e visualizado dentro do browser.
No arquivo HTML, o applet é incluído por meio do rótulo
<APPLET>, como mostrado a seguir:

<APPLET code="MeuApplet.class" width=200 height=150>
<param name=NomedoParam value="ZZZ">
</APPLET>
APPLETS


Para ilustrar a utilização dos applets para a construção de
UIs, considere o código do applet UmBotao.class mostrado
a seguir. Este applet não tem parâmetros e possui apenas
um botão. Sempre que o botão é pressionado uma
mensagem é exibida na linha de status do browser. Na
primeira vez, uma mensagem pré-determinada - Botão foi
pressionado - é exibida. Na segunda vez, a string exibida
depende da definição da string ActionCommand associada
ao botão - por default, o rótulo do botão. As duas
mensagens se alternam cada vez que o botão é
pressionado.
// UmBotao.java
import java.awt.*;
import java.awt.event.*;
import java.applet.*;
public class UmBotao extends Applet {
APPLETS

/** Cria a UI. */
public void init() {
// define dimensões
setSize(100,100);
// coloca o botão
UmBotaoHandler boh = new UmBotaoHandler(this);
Button bPush = new Button("Enter");
add(bPush);
bPush.addActionListener(boh);
}
}
/** Classe "handler", para lidar com botões.*/
class UmBotaoHandler implements ActionListener {
Applet app;
int number = 0;
APPLETS
public UmBotaoHandler(Applet a) {
app = a;
}
/** Realiza a operação.*/
public void actionPerformed(ActionEvent e) {
if (number%2 == 0)
app.showStatus("Botao foi pressionado");
else
app.showStatus(e.getActionCommand());
++number;
}
}
LIMITAÇÕES DOS APPLETS



Apesar de oferecerem à Web a possibilidade de construir
UIs utilizando toda a funcionalidade de uma linguagem de
programação abrangente, os applets ainda têm uma série
de limitações (essas limitações variam um pouco, de acordo
com a implementação de cada browser):
Os applets podem ser extensos e levar muito tempo para
serem transmitidos até o cliente.
Por serem programas que vêm de um servidor remoto (nem
sempre confiável), os browsers precisam implementar uma
série de restrições de segurança que acabam criando
dificuldades para o desenvolvimento de aplicações
interativas:
LIMITAÇÕES DOS APPLETS
-Um applet não pode ler nem escrever arquivos no cliente.
-Não pode iniciar nenhum programa no cliente.
-Não pode ler certas propriedades do sistema.
-Não pode se conectar com outra máquina que não a sua
própria servidora.
-Qualquer janela janela aberta por um applet é diferente das
janelas abertas por outras aplicações (geralmente está
destacado na janela que ela foi aberta por ação de um
applet).
SERVLETS

Apesar do surgimento dos applets, que permitem executar
programas Web no cliente, o processamento de programas
no servidor (CGI) continuou muito popular por pelo menos
três motivos:
1. É totalmente independente do browser, uma vez que todo o
processamento é realizado no servidor.
2. Tarefas complexas podem ser executadas de maneira mais
eficiente no servidor (geralmente uma máquina mais
potente que o cliente).
3. É mais seguro, pois os programas são executados sob o
controle direto do administrador do servidor.
A Criação dos Servlets



A linguagem java por não poder ler valores de variáveis de
ambiente, não pode ser utilizada para desenvolver
programas CGI ,daí a criação dos servlets , que consiste em
uma API para programação de aplicações Java do lado do
servidor.
Os servlets foram propostos como uma alternativa ao CGI,
com as vantagens da familiaridade, portabilidade e
segurança da linguagem Java.
Na prática, os servlets fazem o mesmo que programas CGI:
recebem dados do cliente, realizam o processamento
necessário e retornam um arquivo HTML criado
dinamicamente. No entanto, a combinação applets/servlets
pode ir muito além disso, balanceando a carga de
processamento entre cliente e servidor, e permitindo melhor
desempenho das aplicações Web.
JAVA BEANS



Os Java Beans representam a implementação Java do
conceito de componentes de software. Os componentes de
software estão para a tecnologia de software assim como
os circuitos integrados estão para a eletrônica: são "caixaspretas" que encapsulam a funcionalidade e oferecem
serviços de acordo com uma especificação.
Os componentes de software são projetados para serem
reutilizados, permitindo a "montagem" de aplicações a partir
da "conexão" de vários componentes.
Praticamente todos os componentes de software são
classes de linguagens orientadas a objetos. O que os torna
componentes é o fato de seguirem uma especificação de
componentes de software.
JAVA BEANS
Java Beans, não é um produto, ou um ambiente de
desenvolvimento, mas um conjunto composto de um pacote de
funcionalidades (java.beans) e um documento (a especificação)
que descreve como utilizar os recursos do
pacote para a implementação de componentes de software (que
também são chamados de beans).



Os beans permitem maior dinamismo e flexibilidade, pois os
desenvolvedores podem definir componentes independentes que
podem ser utilizados e reutilizados em uma variedade de
combinações para comporem novos applets e aplicações
independentes.
Os beans podem ser widgets gráficos, funções não-visuais,
applets, e até mesmo aplicações completas, podendo ser
construídos por desenvolvedores diferentes e integrados de
forma confiável para a "montagem" de uma aplicação completa.
JAVA BEANS



A interação
entre os
componentes
se dá através
da geração de
eventos.
O modelo de eventos de Java Beans usa event listeners, que são
elementos que monitoram a ocorrência de um evento desejado e
controlam a troca de mensagens entre o bean gerador e o bean
interessado no evento.
A presença dos event listeners dá flexibilidade ao modelo, pois se
um bean enviasse um evento diretamente para o outro, estes
componentes ficariam "ligados" entre si, criando uma dependência
que tiraria sua capacidade de plug-and-play.
JAVA 2D



Como complemento ao Swing, a API Java 2D estende os
mecanismos da java.awt para a manipulação e visualização de
primitivas bidimensionais, textos, fontes, imagens e cores,
trazendo benefícios para a criação de UIs mais sofisticadas.
Com a API Java 2D é possível desenhar formas padrões
(retângulo, círculo, etc) e formas arbitrárias (curvas de Bezier),
realizar transformações espaciais sobre elas (rotações e
translações), preenchê-las com padrões complexos ( como
gradientes), e utilizar transparência na sobreposição de imagens.
Estes mesmos recursos também podem ser usados para
manipulação de textos.
A correspondente tridimensional da Java 2D é a Java 3D com
recursos para a criação e manipulação de geometrias
tridimensionais e ferramentas para a construção de estruturas
usadas na renderização destas geometrias.
JAVA 3D



A Java 3D tem funcionalidade similar à VRML , embora
também introduza alguns conceitos que normalmente não
são considerados como partes integrantes de um ambiente
gráfico tridimensional, como é o caso do som espacial.
Ao contrário da Java 2D, a Java 3D não faz parte das APIs
do núcleo da linguagem Java, precisando ser instalada
separadamente. Além disso, a Java 3D tem algum código
nativo em sua implementação, o que pode complicar o
desenvolvimento de UIs, especialmente quando se usa o
Swing, que é totalmente independente de plataforma.
Estas duas APIs (principalmente a Java 3D) representam
um esforço da plataforma Java em direção às chamadas
interfaces pós-WIMP.
Toolkit)



Existem duas tendências importantes na interação com a Web:
- aplicações colaborativas e
- interfaces pós-WIMP .
Como já comentado, a API Java 3D representa um esforço em
direção às interfaces pós-WIMP. O JSDT, por sua vez, é o
esforço da plataforma Java na direção do suporte às aplicações
colaborativas.
O JSDT implementa um serviço de envio de dados para vários
receptores, para uso no suporte à criação de aplicações
multimídia colaborativas altamente interativas.
JSDT (Java Shared Data
Toolkit)



Ele provê o conceito de sessão e permite comunicação
multiponto bidirecional (full-duplex) entre um número
arbitrário de entidades conectadas através de diferentes
tipos de redes.
Além disso, o JSDT provê um eficiente suporte para a
comunicação de mensagens multicast, a habilidade de
garantir o recebimento seqüencial de mensagens, e um
mecanismo de sincronização baseado na passagem de
token.
Os recursos implementados pelo JSDT são muito
importantes para o desenvolvimento de aplicações
colaborativas.
Download

Interface Com o Usuário Fatores Humanos em IHC