Marco Gomes

E temos um novo hype na Internet: a Web 2.0, também conhecida como A Nova Web. Trata-se principalmente de usar a Web como plataforma para aplicações e não apenas como meio de entrega expressa de conteúdo. Ainda não é possível definir a Web 2.0 em algumas poucas palavras, porém, tentarei fazê-lo em alguns parágrafos.

Principais características da Web 2.0.

Usuários produzindo conteúdo

Cada pessoa pode produzir conteúdo e/ou alterar o serviço (com facilidade), saindo do modelo antigo de apenas consumidores de conteúdo, com isso, cada usuário consome conteúdo também feito por outros usuários como ele.

Exemplos: Wikipédia, blogs e comunidades de blogs, flickr, del.icio.us.

Quanto mais usuários melhor o serviço

Se usuários produzem e consomem conteúdo entre si, numa verdadeira comunidade, quanto mais usuários mais conteúdo a ser produzido/alterado/validado, com isso, a qualidade do serviço aumenta.

Exemplos: Wikipédia, blogs e comunidades de blogs, flickr, del.icio.us.

Aplicações ricas

Aplicações que fogem do padrão recebe informação > envia dados > recarega página comum na Velha Web. Com a Web 2.0 temos ambientes mais parecidos com o desktop, informações sendo enviadas e recebidas o tempo todo, sem reloads sucessivos da página e alto nível de interação entre o usuário e a aplicação. Para chegar-se a este resultado os caminhos têm sido AJAX e Flash.

Exemplos: meebo, flickrGraph, Netvibes, geobloggers

Valorização do conteúdo

O conteúdo é valorizado acima de qualquer outra coisa, mas não pense que esse deve ser apenas texto, isso depende do serviço e cada um tem seu conteúdo principal que pode ser texto, imagem, vídeo, dados sobre pessoas, áudio, mapas.

Ele é tão valorizado que é disponibilizado inclusive fora da interface “padrão” do site original, com isso você pode acessá-lo através de outros serviços e interfaces.

Exemplos: flickr API, Google Web API’s

Conteúdo acessível para aplicações externas

O conteúdo é acessível não só através do site do serviço, mas pode ser integrado a aplicações externas, dando poder para que programadores autônomos possam criar aplicações personalizadas e únicas. Para isso, usa-se atom, XML, RSS, API‘s e outras siglas interessantes.

Exemplos: flickrGraph, Web 2.0 API Reference.

Mashup

A definição da Wikipedia é excelente: Mashup é uma aplicação que combina conteúdo de mais de uma fonte em uma experiência intergrada. Ou seja, um serviço pegando conteúdo de múltiplas fontes e mostrando tudo junto.

Exemplos: Netvibes, geobloggers, Web 2.0 Mashup Matrix.

Nova maneira de tratar a informação (sai taxonomia, entra folksonomia)

Os dados deixam de ser indexados segundos categorias e subcategorias – taxsonomia, como a estrutura de pastas do seu computador – e passam a receber relacionamentos diretos com palavras-chave – folksonomia ou tagsonomia, como faz o cérebro humano-.

Sendo classificada dessa maneira, fica muito mais fácil descrever certa informação. Em uma estrutura por taxonomia se você tem uma pasta para trilhas sonoras e outra para a banda P.O.D. você só pode colocar a trilha sonora do Matrix Reloaded em uma das pastas (ou duplicar o arquivo). Em uma classificação por folksonomia você pode adicionar quantas tags achar necessária para descrever a música. Com isso a informação pode ser achada com muito mais facilidade.

Exemplos: del.icio.us/tag, Technorati.com/tags.

Importante: Essas são apenas algumas características dos serviços Web 2.0, e não basta atender a uma ou duas para estar inserido no hype, o julgamento é muito mais subjetivo e não pode ser feito apenas com um checklist.

Referências

E pra fechar usando muitos dos recursos acima descritos, você pode saber o que ando lendo sobre o tema acompanhando meu del.icio.us, principalmente as tags Web2.0, AJAX e cyberculture – no fim de cada uma das páginas tem um botão RSS, você pode assíná-los e ler no seu agregador favorito.

Para ver a peça entre no site da Brasil Telecom, clique no destaque principal com a imagem do Fábio Assunção, uma janela pop up será aberta, clique na chamada Ligue sua webcam[...]. Caso o computador não tenha o Flash Player mais recente aparecerá uma janela pedindo permissão para atualização.

Caso você tenha uma webcam ativada vai aparecer a imagem que ela estiver filmando e por cima o tracejado de uma mão fazendo um certo sinal, caso você faça este mesmo sinal com a sua mão uma animação será disparada.

É a primeira campanha online no mundo a utilizar reconhecimento de padrão e forma usando a imagem da webcam do usuário.

Totalmente programado por mim e pelo Leandro (Durang). Não pudemos sequer estudar soluções adotadas por terceiros já que na época da primeira versão (3 semanas atrás) nada disso existia. Semana passada publicaram um tutorial no site da Macromedia ensinando a fazer um programa que destaca um canal de cor – vermelho, azul ou verde – da imagem da câmera. Modéstia à parte, aquilo é bem menos do que fizemos.

Não foi nada fácil, eu até achava que seria impossível conseguir tanta precisão no reconhecimento de contornos e contrastes. Sorte minha que eu estava errado, tanto não era impossível que está pronto e é lindo!

Simplificando bastante o processo é o seguinte:

Definição manual de pontos de reconhecimento

Por dentro e por fora do tracejado da área a ser reconhecida são definidos dezenas de pontos, estes serão usados na comparação de cores.

A definição de pontos era feita dinamicamente – em tempo de execução do programa –, porém, muitos pontos do centro da área estavam sendo definidos, a cada ciclo o script tinha de lidar com inúmeros pontos desnecessários, fazendo a aplicação ficar excessivamente lenta.

Este foi o primeiro pulo do gato: definir os pontos manualmente. Com isso pudemos controlar exatamente onde estariam e quantos seriam os pontos de comparação, reduzindo drasticamente o processamento necessário em cada ciclo de comparação de cores.

Comparação de cores

Tomando dois pontos da imagem da webcam (um dentro do tracejado e outro fora) as cores, no formato RGB, são comparadas, caso a diferença de cor seja maior que 30* (a escala RGB vai de 0 a 255) o programa as reconhece como cores distintas.

Verificação de pontos contrastantes

O programa detecta se a porcentagem de pontos de cores diferentes dentro e fora da forma é superior a 90*.

Homogeneidade de cor no interior da área

As cores dos pontos no interior dá área são comparadas, o objetivo é certificar que o preenchimento é realmente algo de cor homogênea, diminuindo o risco de objetos aleatórios – como um quadro na parede ou uma pessoa de pé – dispararem a animação.

Este foi o segundo pulo do gato.

Verificação de moda de cor

Moda é o indivíduo de maior ocorrência em um conjunto, por exemplo, no conjunto [1, 2, 5, 2, 7] a moda é 2, já que é o número que mais se repete.

Fizemos uma função que, dados certos pontos, ela retorna a moda de cor, esta função foi extremamente importante no protótipo (o programa que provou ser possível reconhecer padrões usando Flash). Na versão final esta função acabou sendo subutilizada, sendo útil apenas no cálculo de homogeneirdade de cor no interior da área.

A maior parte dos processos acima descritos foram implementados no protótipo, sendo levemente modificados para a versão final que é infinitamente mais organizada.

O protótipo foi feito em Extreme Pair Programming: duas pessoas no mesmo computador, programando sem planejar nada antes. Eu e o Leandro simplesmente nos revezamos no teclado madrugada adentro, sem tirar um tempo antes para modelar classes nem nada disso. Verdadeiros programadores Klingon.

O projeto final está em um padrão de modelagem chamado MVC, usando este design pattern conseguimos maior facilidade na alteração do algoritmo e também invejável organização em um prazo bem apertado.

Prefiro não citar nomes aqui no meu site pessoal para evitar problemas profissionais, meus agradecimentos vão para toda a equipe de Atendimento da AgênciaClick que nos representa muito bem junto ao cliente, inclusive negociando prazos, e também à equipe de Criação que sempre inventa essas coisas impossíveis de se fazer e incentiva o pessoal da programação a tentar implementar, são sempre muito abertos à negociação também. Não fossem eles, nada disso existiria.

* variável que pode ser alterada para alterar a precisão do reconhecimento.

Vamos à um resumo do 10º Encontro Nacional de Webdesign. Antes de qualquer coisa, entre na página das palestras do site oficial e leia sobre os temas e palestrantes.

Palestra 1: Software Livre e PSL-Brasil, Diego Viégas – Coordenador Geral de Modernização e Informática – Ministério das Cidades

Como eu disse após a apresentação, não é exatamente fácil fazer uma palestra super excitante para falar de Software Livre e PSL-Brasil.

O maior problema, na minha opinião, foi que a projeção no telão se resumiu a texto puro e alguns gráficos. O Diego estava com um laptop rodando Debian e Gnome, deveria ter mostrado softwares ligados à Webdesign funcionando, deveria ter sido mais experimental e menos teórico.

Ele fez muito bem em não se mostrar extremista, destacando a crença da comunidade que o software proprietário não precisa desaparecer e que é possível que os dois modelos co-existam em harmonia.

A palestra foi bastante esclarecedora e cumpriu seu propósito, que era explicar afinal o que é o Software Livre.

Palestra 2: Propaganda Interativa – até onde vai a Internet?, Raphael Vasconcellos – AgênciaClick Brasília

O grande momento do dia, o Rafa arrebentou! E não estou falando isso porque ele é Diretor de Criação e Planejamento da AgênciaClick, ele sempre age como nosso amigo, não teria receio em apontar defeitos em sua apresentação.

No telão foram mostrados imagens, texto, animações e, principalmente, vídeos, muitos vídeos.

Foi discutido como pode ser feita propaganda (realmente) interativa na Web, foram mostrados cases de várias agências, nacionais e internacionais, foram mostrados também cases da AgênciaClick (óbvio).

Entre outros cases da AgênciaClick foram mostrados o do Stilo Connect e o da Brasil Telecom GSM que o Fábio Assunção ligava para o celular de um amigo/amiga.

Entre outros cases de outras agências foram mostrados Subservient Chicken e Super Bonder Reality Show.

A apresentação foi descontraída e informal, como uma conversa ao pé do monitor, com certeza a melhor do dia, valeu muito mais que o valor da inscrição.

Palestra 3: Web Standards, Everaldo Bechara – iLearn

Aí está um campo minado para fazer palestras… Tem como falar bem de código tag soup e layout baseado em tabelas? Não. Quem não conhece o assunto talvez tenha pensado: esse cara só fala bem de Web Standards e tableless, e só destrói o lindo método que eu faço meus sites a 7 anos! Que cara mais imparcial! É como eu já disse: Campo Minado!

Além da dificuldade natural do tema, o palestrante ainda dificultou, projetando texto puro e alguns poucos screenshots de páginas Web. Incrivelmente monótono.

Como foi discutido depois, faltaram comparações entre layouts e códigos de páginas tableless e não tableless, simulações de páginas Web Standard acessadas com dispositivos alternativos e instruções de montagem de páginas que seguem os padrões.

A palestra foi bastante focada em acessibilidade, tanto para portadores de necessidades especiais quanto para não portadores dessas necessidades. Mas não houve nenhum tipo de demonstração, apenas teoria (exatamente o contrário do aconselhável para o evento). Outros focos de atenção especial foram a economia do consumo da banda de transferência e universalidade dos formatos padrão, como XML e XHTML.

A palestra foi boa, pórém, poderia ter sido BEM melhor. Acho que faltou um pouco de informalidade e mais demonstrações de que os tais Padrões Web não são nada do mal.

Palestra 4: Flash, RIA, Workflow de projetos e dispositivos móveis, Vladimir Nunan – Macromedia

Já vi algumas palestras do Vladmir e com certeza esta foi muito abaixo do nível das anteriores, ele estava num dia ruim, com certeza.

Até agora alguns que assistiram a palestra devem estar meio confusos, entre outras incongruências, ele disse que o Flash é difícil e que HTML é ruim.

Tinha um papagaio de pirata ao lado dele que foi apelidado de Catatau, ele foi apontar no telão onde estava aparecendo uma informação em um certo aplicativo que deveria ter interface intuitiva, pra quê apontar onde está algo em uma interface intuitiva? Além disso ele parou a apresentação bem no meio, para mostrar certos jogos que ele tinha feito, mas sem explicar nada, só mostrando que é possível fazer joguinhos em Flash.

No último iSeminar a melhor apresentação foi a do Vladimir, dessa vez foi a única que não foi boa, totalmente confusa. Quem o viu pela primeira vez agora deve estar com uma imagem totalmente errônea da competência dele como profissional e construtor da Web, afinal, ele é super competente e eu sei disso, mas dessa vez bateu trave e saiu pela linha de fundo.

Palestra 5: Mesa redonda com os palestrantes

A mesa redonda foi bastante produtiva e instrutiva, poderia ter durado mais tempo.

As perguntas da platéia foram bastante pertinentes e o respeito mútuo dos participantes da mesa foi exemplar, eu achei que iria voar penas, que nada, foi algo totalmente respeitoso e exemplar, por isso eu achei que deveria ter durado mais.

Destaques para o reconhecimento da importância do Flash da parte do professor Everaldo Bechara (Web Standards) e do reconhecimento do poder do HTML por parte parte do Vladimir Nunam (Flash e RIA).

Diego Viégas (Software Livre) comentou sobre o péssimo momento político que o SL está passando no Brasil, com a saída do Sérgio Amadeu do ITI.

Foi interessante também a pergunta do mesmo Diego para o Rafa: O que você acha dos bloqueios que se pode fazer aos meios de propaganda convencional na Web, como banners e pop-ups?* O Rafa discorreu sobre a filosofia da AgênciaClick de que a propaganda na Web não é só banner e pop-up e o quanto é dificil colocar informação em um espaço tão pequeno quanto os 468 x 60 pixels do fullbanner. Quando o Diego estava achando que nao ia ouvir uma resposta coerente, o Rafa fechou com a declaração do dia: Eu vou achar é bom caso isso tudo seja 100% bloqueado algum dia, vai me obrigar a buscar outros meios de chegar ao usuário para vender o produto/serviço do meu cliente.*

O pessoal da área de Interface da AgênciaClick compareceu em peso e a Arquitetura da Informação, Engenharia e Design também estavam representados, fechamos uma fileira do auditório. Encontrei muita gente legal por lá, entre eles o Newton Vagner (que me impressionou pela juventude) e o grande Fabricio Art (que já deveria ter entrado no mercado de Web faz tempo!).

Parabéns a Artecom e a todos os parceiros pela realização do evento. Eles estão ajudando a tornar o desenvolvedor de Websites um profissional mais respeitado.

* Adaptado, recuperado da memória.

Vejam vocês, alguma empresa que listada na seção "Convertidos" do Tableless.com.br entrou em contato com a Atípico (responsável pelo domínio) e mandou retirarem o exemplo que fazia referência a seu site do ar.

Bem que o Diego (responsável pelo site) podia dizer qual empresa foi que enviou a carta pra nós irmos lá insultá-los das mais variadas formas, afinal, tratava-se de material usado exclusivamente para estudo e em nenhum momento as empresas citadas tinham sua imagem denegrida.

Esses casos de gente sendo presa acusada de nazismo e racismo na internet está deixando as pessoas muito abusadas, parece pobre, qualquer coisa é motivo de "ameaça de processo".

Algum tempo atrás uma pessoa me ameaçou de processo, um dia eu conto a história toda para vocês.

Criei um álbum de fotos. Clique na imagem para ver todas as fotos do álbum, em breve estarei adionando novas.

Este é o piercing que eu tenho na mão, ao contrário do que parece, não doeu (muito) para furar e não dói nem um pouquinho no dia-a-dia. Tem várias fotos dele no álbum, veja-as na página dois.