Livostin – Liberte-se rápidamente das alergias

Abr 27, 2010 by Paulo Afonso    2 Comments    Posted under: Flash

Liberte-se rapidamente das alergias.

Na web

Endereço: http://www.alergias.com.pt

Um site desenvolvido por uma equipa dedicada onde tive o prazer de trabalhar. O meu papel foi o de programador. Vou destacar alguns pontos do meu trabalho neste projecto:

Parallax

Foi simulado o conhecido parallax, dividindo em 11 camadas distintas os objectos.
Estas camadas reagem à posição do rato sendo actualizado constantemente a posição nos xx’s e ligeiramente nos yy’s semrpe que existe um movimento do rato.
Os objectos não sofrem a actualização directa e instantânea, existe um easeOut de forma quando o rato pára os objectos ainda se movem um pouco suavizando a paragem.
Para dar um ar mais orgânico, as principais flores rodam no espaço 3D conforme a proximidade e posição do rato.

Explosões

As explosões são processadas em runtime.
Num primeiro passo são geradas as partículas a partir de um png. Esta tarefa lê pixel por pixel um png, descartando os pixeis com transparência superior a 80% (para efeitos de optimização CPU).
Demora perto de 10 segundos a processar em background. O processamento foi reduzido ao mínimo para deixar as restantes animações fluírem com graciosidade.
Após criadas todas as partículas (aproximadamente 11.000) existe um timer aleatório que inicia a explosão em uma das flores também esta escolhida aleatoriamente.

Clicar no flash acima para ver a explosão (esta é uma versão de testes não optimizada).

Vapor

O Vapor do spray é gerado e processado em runtime usando essencialmente o perlin noise, blur e outros pormenores.

Dente de leão

Os pára-quedas são colocados em ovais criando o dente-de-leão.
Com a iteração do utilizador ou automaticamente são “disparados” e oportunamente, para que o dente-de-leão não fique totalmente “careca”, voltam a nascer.

Optimizações

Para optimização de CPU foi necessário assinalar as animações intensivas e consequentemente impedir que ocorressem em simultâneo.

A titulo de exemplo temos o caso mais visível: suspender o parallax quando ocorre uma explosão.
Claro que antes desta decisão houve um trabalho árduo de revisão em todas as animações de modo a ocuparem o menos processador possível.

Indexação (seo)

O site está optimizado para ser devidamente indexado, (http://www.google.pt/webhp?#q=site%3Aalergias.com.pt). Em resumo foi criada uma simulação de um site html para que os “web spiders” funcionassem. Infelizmente ainda existe muita dificuldade em indexar sites inteiramente em flash.

Vídeo de demonstração do site a funcionar

Um trabalho VIEW.
O designer do projecto é o Daniel Teixeira
Com direcção criativa de Carlos Guedes
Som por Jean Pierre Dos Santos
A programação ficou a meu cargo, Paulo Afonso.