Pular links da navegação e ir direto para o conteúdo

Publicado em 16 de Aug de 2009 às 19:53

Experimento com CSS 3D Transforms

A equipe de desenvolvedores do Webkit (motor por baixo dos browsers Safari, Safari Mobile e Google Chrome) anunciaram em julho que implementaram transformação 3D via CSS. Isso deixou os desenvolvedores malucos por CSS, como eu, ainda mais malucos. É uma pena que, por enquanto, só quem tem um Mac rodando Leopard ou um iPhone/iPod Touch pode desfrutar dessa maravilha. Se você tem o Leopard baixe o último WebKit nightly build.

Dei uma brincada e a coisa, pra mim que nunca trabalhei com 3D, foi mais fácil do que imaginei mas ainda preciso estudar mais sobre profundidade, câmera e tal…

A brincadeira não foi nada como o Snow Stack:

3D CSS Star Wars opening crawl (roll-up)

O resultado foi apenas uma homenagem a saga Star Wars. Não usei JavaScript, só CSS e HTML. Quem sabe depois não melhoro esse exemplo ou também faço alguma coisa realmente útil? Experimente selecionar o texto enquanto ele “vai embora”. :)

Screenshot do Webkit

Demo
Sorry Flash mas se a Microsoft/Internet Explorer ajudar, seus dias estão contados.

Update: Depois que publiquei o post, fui ler os comentários do post lá no blog do Webkit e descobri que um cara teve a mesma idéia que eu. O dele ficou mais legal, mas tem uns bugs estranhos :)

Você é Desenvolvedor ou Designer?
Leia o blog do VTEX Lab, núcleo de inovação para ecommerce da VTEX. Também escrevo por lá. :)

Tags:, , ,

  • Aquiles

    quem fala que o flash está com os dias contados não faz idéia da imensidão do que pode ser desenvolvido nele, principalmente com o action script 3 e várias bibliotecas 3ds disponiveis…CSS vai ter ki cumer muita farinha!!!

Sobre

Nascido em 1984 é Desenvolvedor Web autodidata desde 2002. Hoje especialista em Design da Informação pela UFPE é Designer na equipe de UX no VTEX Lab (núcleo de inovação para ecommerce), da VTEX.

Saiba mais