Por esta altura já todos devem conhecer, por terem visitado ou ouvido falar, da “aplicação mistério” que a Clearleft está a desenvolver, a Silverback app.
Como da aplicação apenas se sabe que é destinada a web designers, resta-nos apreciar o efeito conseguido no site, com a sensação de profundidade transmitida. O efeito é ainda mais surpreendente se redimensionarem a janela do vosso browser lentamente e repararem nas folhas que se movem, separadamente.
O efeito, chamado parallax scrolling pode ser também apreciado no blog do podcast The Rissington Podcast, criado por John Oxton e Jon Hicks. Vão até ao final da página, redimensionem a janela do browser e observem o Spitfire.
Se quiserem saber como reproduzir o efeito, o designer Paul Annett explica o processo de criação no artigo How to recreate Silverback’s Parallax.
Logo no início do artigo o autor esclarece que o efeito não será visualizado por quem utilizar o Internet Explorer 6.0. Segundo ele, o trabalho para reproduzir o efeito com alguma fidelidade seria demasiado, tendo optado por apresentar a estes utilizadores uma versão mais simples do site.
O gorila presente no site foi criado pelo acima referido Jon Hicks, que explica o processo no post Recent Work: Silverback.
Visitem o site, leiam o artigo, vale a pena, pela forma criativa com que são utilizadas as CSS e as imagens.
3 comentários
David Rodrigues - 05/03/08 às 2:06 am
Este é o tipo de efeito que uma pessoa passa por ele e nem repara, embora sinta que está tudo bem feito… que há ali qualquer coisa que parece funcionar perfeitamente quando redimensionamos o browser, mas que sem sermos alertados para ele nem sequer pensamos no assunto.
Para além disso a descrição do efeito pelo Paul Annett está também excelente, simples concisa e clara.
André Luís - 05/03/08 às 9:15 am
Yeap. Quando vi o post do Jon a falar do gorila foi mesmo um momento “ah! Tinhas que ser tu!” LoL
Eu a primeira vez que fui ao site nem reparei no aspecto do redimensionamento… ainda assim, como as imagens carregam em alturas diferentes, vi as layers a cairem umas sobre as outras. Sweet.
Acho é que tanto o site como o tutorial abrem os horizontes dos designers para eles (nós?) explorarem o efeito das mais variadas formas… com ajuda de javascript seria teoricamente simples reproduzir o efeito sem que seja preciso redimensionar o browser…
Amazing work. Cada vez mais gosto mais do trabalho dos rockstars da Clear:left.
jucanabarragem - 17/03/08 às 12:15 am
Como ja te tinha dito anteriormente.. assim é que é trabalhar! He he he. A atenção foi dada a um pormenor que quase ninguem nota mas que pode fazer toda a diferença!
AbraçoPS: Gostei do preview ao comment em tempo real! Very nice!