Interação na Web

1. Limitações Ferramentas Interação na Web

2. 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.

3. Interação Homem-Computador (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.

4. Interação Homem-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.

5. . 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).

6. 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").

7. 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 .

8. 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.

9. 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.

10. 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.

11. 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.

12. 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.

13. 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.

14. 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

15. 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.

16. 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.

17. 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.

18. 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.

19. 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 garbagecollector) que automaticamente libera partes ocupadas da memória que não terão mais uso.

20. 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.

21. 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>

22. 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 {

23. 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;

24. 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;        }        }

25. 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:

26. 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).

27. 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: • É totalmente independente do browser, uma vez que todo o processamento é realizado no servidor. • Tarefas complexas podem ser executadas de maneira mais eficiente no servidor (geralmente uma máquina mais potente que o cliente). • É mais seguro, pois os programas são executados sob o controle direto do administrador do servidor.

28. 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.

29. 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 "caixas-pretas" 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.

30. 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.

31. 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.

32. 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.

33. 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.

34. JSDT (Java Shared Data 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.

35. 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.