Aprenda a criar o efeito Parallax com CSS3, HTML5 e JS
Sem utilizar plugins, sem gerar dor de cabeça e dando algumas dicas especiais, vamos simular o efeito Parallax com algumas imagens.
Seja você amante de SuperMario ou de League of Legends, com certeza já percebeu um dos efeitos mais conhecidos dos jogos: o efeito Parallax. O Parallax nada mais é do que um efeito de imersão criado nos games e também no desenvolvimento web, que gera uma ilusão de profundidade de campo quando nossos olhos estão focadas em um ponto óptico, ou seja, usando várias layers sobrepostas se movendo em velocidades distintas, conseguimos enganar nossos olhos gerando um aspecto de profundidade, o que muitas vezes pode enriquecer a experiência de navegação e gerar resultados incríveis.
Hoje, iremos aprender justamente a criar este espetacular efeito. Sem utilizar plugins, sem gerar dor de cabeça e dando algumas dicas especiais, vamos simular o efeito Parallax com algumas imagens.
Está preparado para esta imersão? Se estiver, aperta o play que tem coisa boa na tela! 😉
Os arquivos podem ser baixados neste link.
Sites:
- League Of Legends – http://promo.na.leagueoflegends.com/e…
- Nintendo –http://www.nintendo.com.au/gamesites/…
Plugins:
É Designer Gráfico por formação, freelancer, autodidata e empreendedor. Atua como Designer Estratégico e desenvolve projetos envolvendo serviços de Design Thinking, Service Design, Growth Hacking, Marketing Digital e Web Design (UI/UX/Front-end). Com quase sete anos de carreira, já atendeu a grandes marcas nacionais e internacionais. Possui uma presença ativa no cenário digital, alimentando três projetos na web: o primeiro é a Ferreira Studios, um canal no Youtube do qual é fundador e que hoje conta com mais de 1,3 milhões de visualizações, onde compartilha reflexões, métodos e aulas sobre design, desenvolvimento web e edição de vídeo, em parceria com o grupo Grupo NZN (empresa curitibana dona de verticais como TecMundo, Baixaki, Minha Série, SuperDownloads, ClickJogos e Megacurioso). Os outros dois projetos são startups, sendo a primeira de serviços veterinários e a segunda de conciliação de pagamentos.
