Então você já ouviu todos os rumores sobre HTML5 que tomariam conta do Adobe Flash. Enquanto a maioria da comunidade web argumenta que é possível ou não, você deve estar vagando pelo que torna o HTML5 tão poderoso que até mesmo a gigante Apple quer usá-lo para substituir o Flash.
É por isso que este post existe, não vamos falar sobre o que o HTML5 pode fazer, mas mostrar demonstrações ao vivo de coisas mágicas que o HTML5 pode conseguir com outra linguagem como o JavaScript, então prepare-se para ser inspirado.
Nota: Como HTML5 não é totalmente suportado por certo navegador web como o Internet Explorer, você é fortemente recomendado a usar o navegador Firefox para ver todas as demos HTML5 abaixo.
Animação
O elemento canvas do HTML5 é o fator decisivo para que o HTML5 substitua certas animações em Flash. Ele permite que você construa uma renderização dinâmica, com script, de formas 2D e imagens bitmap com Javascript, que por outro meio é, animação controlável.
Audioburst Animation
Uma confortável e fantástica animação criada com a tela e tag de áudio do HTML5.
Ball Pool
Being showcased in the last Google I/O event, esta demo mostra como o HTML5 pode ser dinâmico.
Blob Sallad
>
Uma criatura com HTML5 que lhe agradaria.
Bomomo
Com o Bomomo, você pode observar diferentes movimentos atômicos simulados com HTML5.
Bola de Browser
Fica espantado com esta bola HTML5 ‘cross-browser’.
Bolhas
Diverta-se criando bolhas flutuantes sem fim com cores diferentes.
A Animação de desenhos animados em tela
Um desenho animado HTML5 simples e divertido que o ajuda a entender o que o elemento de tela do HTML5 pode fazer.
Coolclock
Um relógio analógico agradável e personalizável construído por HTML5 e JavaScript.
Flickr PS3 Slideshow
Veja as fotos do seu Flickr com slideshow estilo PS3 no navegador web.
Polaroid interativo
Uma demonstração interativa que funciona muito semelhante à interface multi touch.
JS Fireworks
Desfrute do momento do fogo de artifício com a sua gravidade e velocidade preferidas, alimentado por HTML5 e Javascript.
Caleidoscópio
Um caleidoscópio HTML5 muito bonito e futurista.
Partículas Líquidas
A animação de partículas sensíveis que reage com base no movimento do seu rato.
Mesmerizador
Outra demonstração HTML5 sensível e excepcional que mostra como os elementos próximos reagem com o movimento do seu mouse.
Nebula Nebulosa
Perde-se com esta maravilhosa nebulosa HTML5.
>
Parallax
Veja todas as formas 2D em perspectiva paralela.
>
Animação de partículas
Uma elegante animação de partículas HTML5 que pode formar na sua mensagem preferida.
>
>
Espalhe-se
Perca-se com esta interminável animação de dispersão.
Starfield
Uma animação HTML5 starfield muito legal que mudaria de direção e velocidade com base no movimento do seu mouse.
Video Destruction
Um clique para fazer “boom” um vídeo em reprodução.
Forma de onda
Observa como a onda de tela do HTML5 se move alterando sua amplitude, comprimento de onda, largura, etc.
3D Efeito
Imprimido pela animação em tela? Isso é mais o elemento de tela do HTML5 pode fazer, e é chamado de efeito 3D. O desenvolvedor pode confiar no elemento canvas, DOM e JavaScript para criar efeitos 3D, que mais tarde podem ser desenvolvidos em animação 3D ou jogo.
Canvas3D e Flickr
Dê uma experiência 3D totalmente nova com o photostream do Flickr.
Simulação de pano
Uma simulação de pano realista, baseada em HTML5.
Monstro em evolução
Observar um monstro evoluindo para uma criatura complicada, um de seus criadores é HTML5.
Google Giftbox
>
O motor de busca Giant Google é apresentado em 3D, vista jogável.
>
>
JS Touch
>
Um mostruário ‘3D em Tela 2D’ de alta qualidade e realista.
Apresentação de dados
Embora o elemento de tela HTML5 possa ser usado para criar animação e efeito 3D, ele também pode ser implementado para apresentar dados matemáticos.
Gnuplot
Gnuplot, uma aplicação de plotagem de dados em versão HTML5.
RGraph
RGraph fornece uma ampla gama de apresentação de dados como gráfico de barras, barra de progresso e gráfico de radar tradicional.
Aplicação Web
Ultimamente, usando todas as possibilidades combinadas por HTML5 e outras langauge, pode-se criar uma aplicação ou jogo interativo que seja próximo à aplicação Flash.
CanvasPaint
Testemunha que o irmão do Microsoft Paint entra no seu navegador web, e seu pai é HTML5.
CanvasMol
Uma aplicação científica que é construída para ajudá-lo a compreender a estrutura de certos elementos terrestres.
Cartoon Builder
Trace uma imagem de cartoon interessante com este construtor de cartoon mínimo e interactivo.
Drag Anything Here
Drag qualquer coisa que você possa arrastar na demonstração para mostrar detalhes.
Gartic Sketch
Uma aplicação HTML5 original que lhe permite fazer alguns desenhos básicos que podem ser salvos em diferentes formatos de imagem como jpeg ou png.
PhysicSketch
Desenhar o que quiser e ver como reagem com gravidade simulada.
Sketchpad
Uma poderosa aplicação de desenho HTML5 que lhe permite desenhar e editar a sua imagem de forma precisa.
Smalltalk
Um aplicativo web que confirma a posição geográfica da mensagem relacionada ao tempo adquirida no Twitter, formando assim um mapa de ‘tempo social’ baseado em telas, bastante trivial (como dito pelo autor), mas interessante.
Jogo
3Bored
Você nunca ficaria entediado se pudesse continuar evadindo centenas de balas HTML5 no próximo segundo.
Breakout
Rebound the ball to break all bricks.
Canvascape
Não é um jogo muito bom, mas demonstra como HTML5 pode ser usado para desenvolver o jogo de tiro em primeira pessoa do navegador.
>
Catch It
Quantas bolas você pode esquivar-se para obter o seu vencedor HTML5 quadrado?
>
>
Reação de Corrente
Chain a explosão para atingir o objetivo, não fique viciado.
>
Cubeout
Play Tetris em 3D, vista de cima para baixo.
>
etchaPhysics
Draw item para mover a bola para a estrela, não se esqueça da gravidade.
Quebra-cabeça
Click, rotate and drop puzzle pieces to solve this HTML5-based jigsaw puzzle.
Slide Puzzle
Slide to the victory, another HTML5 game that’s built to squeeze your mind juice.
Same Game
Remover determinado grupo para conseguir outro grupo emparelhado na mesma cor e você acabaria sendo premiado com uma vitória.
Tetris
Um dos jogos mais clássicos trazidos de volta à vida pelo HTML5.
Torus
Diga outro jogo Tetris na versão pseudo-3D.
Conclusão
Qual é a limitação do HTML5? Neste ponto não podemos decidir, mas com o impressionante vídeo abaixo podemos saber até onde o HTML5 foi empurrado:
Sim, é o Quake II no navegador web, então agora está muito claro que com HTML5, mais aplicação web inovadora nasceria para servir bilhões de usuários de internet. É rápido, está evoluindo, e está mudando a rede mundial. A questão é, como você usaria este HTML5 que muda o jogo?
Nós gostamos de ouvir a sua ideia!