Minha experiência com um projeto Web 2.0

Wallpapr, um buscador de imagens legais para papel de parede que eu fiz por motivos educacionais, teve uma repercussão inesperada, recebendo mais de uma centena de citações ao redor do mundo, posts em árabe, japonês, alemão, russo, italiano, inglês e até idiomas que eu desconheço. Mais de 170.000 consultas e mais de 30.000 visitas de IP’s únicos. Tudo isso em pouquíssimas horas e com receita de divulgação igual a zero.

Nessa onda repentina de fama internacional, belas mulheres, carrões e dólares queimados para acender charutos, aprendi um bocado e pude provar várias teorias pessoais. Pretendo agora passar um pouco da experiência adquirida para meus fiéis leitores.

Nova Web, Web2.0, evolução da web, chame como quiser, mas o fato é: o Wallpapr não seria possível naquela Web de 1999. Flickr API, Script.aculo.us e Getting Real não existiam, as ferramentas para o AJAX (JavaScript e XML assíncrono), já existiam, mas o conceito ainda não havia sido definido. Conteúdo gerado pelo usuário era possível, mas não era comum.

Somente esta Nova Web me permitiu juntar peças de terceiros e criar, em uma noite, uma ferramenta que levaria meses caso todas as peças fossem desenvolvidas por mim.

O início

Eu estava sem sono, deitado na cama, e decidi levantar pra brincar com AJAX e Flickr API. Sentei na frente do PC e não fazia idéia do que fazer, pensei em fazer uma ferramenta que fizesse busca de fotos de músicos, desisti ao procurar pelos meus artistas favoritos e não encontrar nada, somente artistas mainstream retornavam bons resultados, eu não quero contribuir para mais divulgação do mainstream.

Procurei por papéis de parede e achei um grupo de papéis de parede com mais de 9.000 imagens, é isso, pensei, vou fazer uma ferramenta que busque as fotos deste grupo, caso dê certo, eu adiciono outros grupos na busca mais tarde.

Getting Real

Como eu já disse, o Getting Real é o KISS (Keep It Simple, Stupid) aplicado ao desenvolvimento de software para a Web. Eu tinha uma idéia e as ferramentas para implementá-la. Sem gastar tempo com gráficos de defesa de idéia ou planilhas de prospecção de quantidade de usuários eu comecei, programando.

Eu não pretendia que a aplicação tivesse visitação superior a 10 ou 20 amigos da internet, logo, não me preocupei com compatibilidade com vários navegadores nem com acessibilidade total para navegadores de voz, afinal, que cego iria procurar por papéis de parede?

Eu simplesmente encarei meu objetivo primário: Fazer um sistema de busca de certos tipos de imagens usando a Flickr API.

Pedras no caminho

Quem já fez AJAX sabe que JavaScript não lê XML de um domínio externo, por motivos de segurança o navegador só permite leitura de XML que esteja no mesmo domínio que o script. O maior problema é que eu havia esquecido disso. Perdi horas tentando ler o XML do domínio flickr.com com meu JavaScript que estava em marcogomes.com. Quando lembrei do erro trivial resolvi fazer um túnel em PHP para requisitar o XML no Flickr e trazê-lo ao meu servidor. Algumas horas depois o túnel, que utiliza a classe phpFlickr para requisitar os XML’s no Flickr, estava pronto.

O maior problema estava resolvido, eu conseguia fazer requisições ao Flickr e receber os resultados no meu JavaScript, agora era desenvolver a lógica do sistema de busca e fazer a perfumaria da aplicação.

Não vou entrar em detalhes técnicos de baixo-nível, basta dizer que tomei muita taca pra carregar e ler o XML corretamente no JavaScript, é bem diferente de Flash, mas não é mais difícil, acho até que é mais fácil. O maior problema é a recursividade, se Flash é lento, JavaScript é muito mais, ler trocentos nós em um único ciclo é muito complexo e pode travar tudo com uma facilidade incrível.

Eu não me desanimei com estes e outros problemas, afinal, eu havia decidido não dormir pra isso: me preparar para resolver problemas comuns no desenvolvimento de uma aplicação rica que utiliza AJAX.

A interface

Com a lógica pronta, hora de dar cara à aplicação. Essa ordem é inversa à pregada pelo Getting Real, este diz que você deve começar definindo a aparência visual e o comportamento das telas antes de programar a lógica.

Como minha vontade era aprender, comecei programando, só depois partindo para o design. Eu precisava de um logo legal, um nome legal, um pouco de força de vontade gasta e surgiu o nome Wallpapr, o logo, com o Web2.0 Logo Creatr, foi fácil.

Um pouco de CSS, bom senso, dicas de amigos e cópia descarada de serviços Web2.0 me levou à interface que temos hoje, uma sátira-homenagem aos serviços mais responsa que fazem parte da minha vida. Fontes sem serifa com espaçamento menor, cores contrastantes do Flickr, amarelo 37signals na caixa de busca, bordas arredondadas do Spiffy Corners e pronto, temos um serviço bem estereotipado.

A parte mais sensível é a usabilidade, arquitetura da informação/design de interface é uma área que muito me encanta. Tentei manter a tela principal o mais simples possível, usando um linguagem e elementos de interação que podem se enquadrar na definição de interface humana, a aplicação praticamente conversa com o usuário com frases simples, porém sinceras, sem confundir o usuário com termos complexos e sem sentido pra ele.

Se o script está com um erro no navegador X, é melhor avisar ao usuário do que fingir que está tudo bem, se vez ou outra a aplicação entra em loop infinito e trava, nada mais humilde que avisar isso e pedir um pouco de paciência.

Caso o usuário não digite nada, simplesmente clique em um dos botões, a aplicação traz as imagens mais recentes de um grupo qualquer. Caso ele digite algo, a “chamada” dos botões se modifica para uma frase bastante amigável que traz a frase do usuário, não deixando dúvidas sobre o que acontecerá ao clicar em um dos botões. Caso não haja nenhum resultado para o termo escolhido, a aplicação pede desculpas pela incompetência, explicando que foi feita rapidamente e pedindo que o usuário a ajude sendo menos específico.

Na data de seu lançamento a aplicação não fazia absolutamente NADA que uma busca direta no grupo não fizesse. Mas eu não a havia feito pra ser útil pra terceiros, havia feito pra aprender, lembra? Agora ela busca em vários grupos, trazendo resultados mais completos que uma busca num único grupo, sendo uma aplicação realmente útil pra qualquer um que queira papéis de parede sobre certo tema.

Mais Getting Real

O núcleo da aplicação foi feito em uma noite, porém, ela foi tualizada nos dias posteriores.

Fiz uma to-do list para a aplicação e conforme eu ia resolvendo os problemas, ia atualizando a aplicação que estava na Web. Em certo momento eu sequer tinha uma versão de testes, fazia as alterações direto na versão de homologação, coisa bem amadora, mas eu não prometi estabilidade à ninguém.

Caso o layout não ficasse exatamente do jeito que eu queria em certo navegador, ou o script de busca trabalhasse um pouco mais lento que o esperado, eu não entrava em desespero, é melhor ter algo funcionando “não tão bem” do que retirar o serviço inteiro do ar. E no final das contas, a versão defeituosa só iria ficar no ar algumas horas, em breve eu resolveria o problema e colocaria a nova versão no ar.

Cada função JavaScript executa apenas uma ação simples, facilitando a manutenção do sistema como um todo e não engessando o fluxo dos dados. Quando eu precisei alterar o sistema de buscas para buscar não só em um, mas em vários grupos, não foi necessário alterar o script todo, apenas escrever umas novas funções e alterar o fluxo de execução da busca. Bem melhor que escrever tudo em 3 funções, como é normal vermos por aí.

No que deu?

Como já falei no início do texto, tive mais acessos do que imaginava, o que me gerou problemas de transferência. O CrisDias liberou mais banda pro meu site nos servers Vilago (que é o provedor com o melhor suporte do Universo inteiro), eu dediquei um tempinho do dia para responder às solicitações de usuários e buscar os comentários sobre o serviço na Web.

Sei que a aplicação não tem mais pra onde ir, não há muito mais o que incrementar no serviço e eu também não quero gastar muito tempo com algo que está funcionando perfeitamente, tenho medo da aplicação virar um paquiderme inutilizável.