Mostruário do site HTML5: 48 Demonstrações de Potencial de Matança de Flash

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!

Deixe uma resposta

O seu endereço de email não será publicado.