Cool Kitten – Framework Parallax Responsivo

Please log in or register to like posts.
News
Cool Kitten

Procuro sempre indicar ferramentas para ajudar no desenvolvimento de projetos online e como já falei muitas vezes acredito que utilizar frameworks é uma grande oportunidade para agilizar e até mesmo poupar algumas horas de produção.

E hoje chegou a hora de apresentar mais uma solução para auxiliar na criação de páginas responsivas e que utilizam o efeito Parallax. Mas… você sabe o que é isso?

O que é Parallax?

Cool Kitten
Air Jordan 2012

O conceito de Parallax é relativamente simples. Basicamente é uma técnica que consegue causar a ilusão de profundidade ao mover várias imagens e elementos em diferentes velocidades conforme o usuário faz a rolagem da página.

O fundo da página geralmente estará numa velocidade mais lenta que as demais camadas superiores causando o efeito Parallax. Um bom jeito de entender melhor o conceito é navegando na One Page Nike Air Jordan 2012.

Cool Kitten – Parallax Scrolling

Cool Kitten
Framework One Page Parallax

Cool Kitten é um framework HTML, CSS e JavaScript para criação de páginas Parallax. Além de utilizar o recurso de profundidade esta coleção de códigos também possibilita a criação de sites responsivos. Claro que em aparelhos como iPhone e Android esta técnica ainda precisa ser mais explorada e até mesmo aperfeiçoada, mesmo assim seu site será compatível com dispositivos touch.

O Cool Kitten trabalha com grids, o que irá ajudar na hora de produzir suas páginas, além de facilitar o modo como o conteúdo será visualizado nas mais diversas resoluções de tela.

Esta é a sua chance de começar a criar páginas Parallax poupando tempo de desenvolvimento front-end.

Download e Informações

Cool Kitten
Parallax Responsivo

O framework Cool Kitten pode ser baixado e utilizado livremente e o pacote completo possui até um arquivo PSD que poderá ser utilizado para trabalhar os grids de suas páginas.

Caso você esteja um pouco perdido por onde começar, faça o download do Cool Kitten e tente entender toda a estrutura do HTML de exemplo. Com certeza este deve ser o primeiro passo caso você nunca tenha trabalhado com One Page Parallax.

[ul type=”arrow-bold”] Site Oficial Cool Kitten [/ul] [ul type=”arrow-bold”] Download Cool Kitten [/ul]

Gostou? Curta e Compartilhe nosso conteúdo para continuarmos com o trabalho 🙂

Até!

Curta este artigo :)

Deixe uma resposta