TidBits

Já ouvi dezenas e dezenas de programadores de interface dizendo que Flash vai morrer com o html5, do mesmo jeito que flash ía morrer quando jQuery se tornou popular. Entretanto, a intenção da W3C, é sim tanto Flash quanto Silverlight e Unity serem “desnecessários”. Segundo eles, um browser deve ser auto-suficiente e não é correto este cenário de hoje onde precisamos de algum plugin pra ter uma funcionalidade extra no navegador. Todas as funcionalidades deveriam estar incorporadas no browser. Com o HTML5, CSS3 e Javascript V8 podemos (ou poderemos) trabalhar com áudio, vídeo, webcam, aceleração por hardware, armazenamento offline, etc… talvez esse cenário de “flash morrer” vire realidade um dia daqui uns 10 anos, quem sabe? Porém, até isso acontecer, temos que evoluir muito em Javascript, MUITO! Frameworks 3D em javascript estão começando a aparecer. E com o “apoio” da apple ao HTML5 simplesmente bloqueando o flash nos Ipads / Iphones, parece que agora é o momento ideal para o “Programador HTML” se tornar uma profissional respeitado e bem pago no Brasil, assim como já é nos Estados Unidos e na Europa, ou será que vão “botar o estágiário que faz mail marketing” pra fazer uma aplicação 3D usando o Notepad++ ?

No post de hoje, não vou falar de código, só quero mostrar parte do que temos atualmente de mais avançado em html5 / javascript. Vou mostrar alguns cases de ambientes 3D programados em javascript com o auxilio de Canvas:

3DTim

Impressiona! Feito em canvas, a aplicação permite desenhar objetos 3D e manipular tanto o objeto quanto a câmera, visualizando o objeto criado em qualquer ângulo. Além de Canvas, o case explora outras propriedades de html5 como armazenamento offline e as novas propriedade / métodos de Javascript.

Canvas 3D

Usando canvas, a aplicação mostra uma espécie de exposição de fotos em 3D e roda bem. Na minha máquina com Firefox com 20 extensões, batia em média 28 frames por segundo. No chrome 8 / IE9 batia 44 frames por segundo, navegando e andando em 3D.

Wolfenstein 3D com DOM

O primeiro foi feito por programadores do Opera, é uma simulação do Wolfenstein 3D feito com Javascript manipulando objetos em DOM e em Canvas, eles fizeram um tutorial passo a passo de como desenvolveram o jogo. O game roda bem, porém como foi feito em DOM, o processamento dele é meio pesado. Manipular tantos objetos ao mesmo tempo é complicado. Se fosse feito em canvas rodaria muito melhor, em compensação roda (lento e sem o mapa) até em IE6!

Mandatory upgrade (Parallax 3D)

Outro case no dhteumeuleu, o que mais impressiona é que foi feito em abril de 2008! Quando html5 engatinhava, já tinha gente em jobs complexos usando canvas.

Wolfenstein 3D com 1kb de Javscript

Este foi um case para o JS1K, um concurso que desafiava criar coisas mais interessantes usando apenas 1kb de js. E conseguiram fazer um ambiente 3D em Javascript. É tosco, ok, mas tem 1kb!

Canvas 3D engine

Um experimento feito com uma lib para aplicações 3D em javascript chamado Clay3D, é simples a lib e fornece diversos métodos para criar e manipular objetos de diversas formas geométricas além de permitir rotacionar a câmera em qualquer ângulo / zoom.

Se alguém lembrar de algum case do tipo que eu não mostrei, deixe comentário. =)
[]s,