Estava lendo sobre geolocalização na internet quando vi que o HTML5 tem uma API pronta para isso. O que eu não esperava é que fosse tão prática de implementar. A brincadeira começa neste método:

navigator.geolocation.getCurrentPosition(sucesso, erro);

Em caso de sucesso, as informações são armazenadas em uma interface Position, que é enviada ao primeiro callback (o “sucesso”, no exemplo acima). Se houver falha, a interface error é enviada ao segundo callback (o “erro”).

Não se assuste, é simples! Segue abaixo um exemplo implementado para clarear a coisa! :)

Leia Mais »

A Adobe não perde tempo mesmo! Neste vídeo, a empresa mostra um preview do que estão trabalhando: trata-se de uma ferramenta de animação em HTML5 cujo codinome é “Edge” (bem apropriado para esta ferramenta).

A apresentação mostra várias semelhanças com a sua ferramenta de Flash, que pelo visto está perdendo o foco da empresa.

Eles já estão se preparando para o HTML5, e você? ;)

Vendo a animação de abertura do Spiderman de 1963,  Anthony Calzadilla resolveu refazê-la, em CSS3. Com a ajuda de um preloader em JQuery para trocar as cenas  e de uma tag de áudio em html5, ele conseguiu um resultado bem interessante.

Safari ou Chrome? Clique na imagem (ou aqui) para ver a animação. Caso você não tenha estes browsers instalados, é possível ver um vídeo da animação.

O artigo original, mostrando detalhes de como foi feito pode ser visto aqui.

Depois dessa até deu vontade de testar o CSS3! ;)

Neste post veremos uma função bem simples para transformar um vetor em um desenho escalável. Esta função foi a mesma que utilizei para desenhar o logo da home do meu site, e a primeira (e única!) experiência que fiz com canvas até o momento deste post. Este é uma primeira abordagem, pretendo postar mais coisas na sequência.

Leia Mais »

Oldschool Gamers, vocês lembram de como eram as cenas de animações nos games antigos? Lembram dos cenários dos Sonics do Mega Drive, como eram bem animados? Estamos falando na geração 8-bits, onde o Mega Drive tinha 512 cores, e as placas de vídeo, apenas 256.

Com recursos tão limitados, os programadores utilizavam uma técnica chamada color cicling, que consiste em alternar a paleta de cores em uma imagem estática, o que não pesava praticamente nada na memória.

Como hoje em dia falamos naturalmente em milhões de cores, este recurso havia sido deixado de lado. Eis que um dev implementou esta técnica utilizando HTML5 de uma maneira interessante, onde é possível ver as alterações na paleta de cores acontecendo em tempo de execução.

Veja a Demo e o Artigo, feitos por Joseph Huckaby e Mark Ferrari.

Levante a mão se você lembrou da transformação do Altered Beast! ;)

(valeu o link, @Mutly! >:D)