Nos bastidores: Deixe nevar…

Diante de uma dessas raras nevascas que hoje se aproxima, creio ser um ótimo momento para publicar uma descrição de nossa demonstração do editor test drive “Let it Snow” (Deixe nevar).

Quando um navegador utiliza de maneira eficiente o hardware subjacente, as possibilidades são infinitas. No fim de ano, nós lançamos uma demonstração que ajuda a mostrar as vantagens de uma experiência de navegação com hardware acelerado e que prioriza toques e gestos no Internet Explorer 10. Esta postagem analisa mais de perto como a demonstração Let it Snow foi criada. Os padrões nessa demonstração são típicos das experiências com o HTML5, que vêm crescendo por toda a Web hoje, e dos Aplicativos com o estilo Metro. Vamos observar isso sob o aspecto funcional em vez do visual.

À medida que dispositivos móveis de baixo consumo de energia e que as experiências com toques e gestos se tornam mais populares, as expectativas sobre o desempenho dos navegadores crescem cada vez mais. O desempenho da navegação agora inclui a capacidade de um site da Web ser manipulado com facilidade pelos dedos, a velocidade com a qual o site responde ao toque e a eficiência com a qual um navegador consome a bateria. Com o Internet Explorer 10 e o Windows 8 estamos determinados a criar o navegador mais rápido do mundo para situações da vida real.

Criando o Let it Snow

	Cartão postal de fim de ano Começamos com um cartão postal que contém uma área designada às saudações de fim de ano. O cartão postal é gerado em um tempo de execução usando uma tela HTML5 e também muitas técnicas de desenho comuns, incluindo imagens de desenho, efeitos gradiente, manipulação de opacidade e distorção, entre outras.
	Animação da nevasca Depois, adicionamos muitos flocos de neve para criar uma nevasca. Fizemos isso usando uma segunda tela sobreposta ao cartão postal. Cada floco de neve é representado como um objeto em um conjunto de JavaScript que controla o estado do floco de neve como o local em que se encontra, velocidade e a imagem a ser utilizada. A tela é limpa a cada quadro e a cena é recriada a partir do modelo subjacente.
	Acúmulo dos flocos de neve Com o tempo, os flocos de neve se acumulam na placa. Usando técnicas de teste de colisão, determinamos quando o floco de neve estará sobre a placa e designamos aleatoriamente um alvo na placa. À medida que o floco de neve se aproxima do alvo, utilizamos os modos de composição da tela HTML5 para compor os flocos de neve na tela.
	Removendo a neve A neve pode ser removida do cartão postal usando o dedo ou o mouse. Rastreamos a ação do usuário com o novo MSPointer event que gera uma API única e consistente em diferentes modelos de cursores. Isso nos permite fornecer uma excelente experiência multitoque no Internet Explorer 10 executado no Windows 8. Utilizamos esses pontos capturados para apagar partes da tela, criando a ilusão de neve sendo removida.
	Cena completa Quando as camadas são combinadas, elas criam uma cena interativa de neve. Os padrões utilizados nessa demonstração representam técnicas frequentemente encontradas em jogos como Angry Birds ou Cut The Rope, incluindo animações baseadas em script, dados sofisticados da ação do usuário, física de jogos eletrônicos e muito mais.

Estamos contentes com as experiências interativas rápidas e fluidas que podem ser alcançadas no Internet Explorer 10 e no Windows 8 em uma plataforma HTML5 com hardware acelerado e habilitado para toque. Não há melhor maneira de experimentar esses benefícios do que em primeira mão com o Windows 8 Developer Preview.

—Bogdan Brinza‎, gerente de programas, Internet Explorer