Sites do zero · Motion design

Sites que se mexem.

Criamos o seu site do zero, do primeiro rascunho ao site no ar, já com motion design. Cada rolagem vira cena e cada clique tem resposta.

60FPS
EASE-IN-OUT
Cena 1 de 3

O scroll é a timeline.

Cada pixel que você rola avança um quadro. Como dar play num vídeo, só que quem controla a velocidade é o visitante.

Cena 2 de 3

Keyframes em tudo.

Texto, 3D, cor e vídeo presos no mesmo relógio. Nada se mexe fora do tempo.

Cena 3 de 3

Liso no celular.

Transformações de GPU e WebGL leve, pensados para rodar a 60 quadros por segundo em qualquer tela.

Quadro 000 / 18000:00:00
Por que animar

Um site animado segura a atenção, explica o produto sem textão e faz a sua marca parecer do tamanho que ela quer ser.

Passa o mouse ou clica no fundo
Seis ideias

Mexe aqui.

Efeitos que usamos para contar a história de uma marca. Todos funcionando: passa o mouse, clica, arrasta.

Profundidade01

Parallax em camadas

Mexe o mouse aqui

Cada camada anda numa velocidade. O olho entende profundidade sem precisar de 3D pesado.

Tipografia02

Texto cinético

MEXE

Letras com peso, elasticidade e atraso. O título vira personagem. Clica nele.

Vídeo03

Vídeo quadro a quadro

Q 01

A bolinha quicando, exercício clássico de animação. No site, o scroll faz o papel desse controle.

3D04

Objetos que giram

H
O
U
S
★
★
Arrasta para girar

Produtos, logos e mascotes em 3D direto no navegador, girando com o dedo ou com a rolagem.

Forma05

Morph de formas

Formas que se transformam umas nas outras para guiar o olhar entre seções. Clica para acelerar.

Resposta06

Micro-interações

Botão magnético

Botões que puxam o cursor, cliques que esmagam e voltam. Detalhes que fazem o site parecer vivo.

Projetos-conceito

Cinco marcas.
Cinco movimentos.

Estudos de como animaríamos marcas diferentes. Passa o mouse ou toca em cada painel.

Exemplos de sites

Um site para cada negócio.

Landing de produto, restaurante, app, escritório, clínica. Criamos do zero no estilo da sua marca, sempre com movimento.

  • Landing de produto
  • Restaurante
  • App de finanças
  • Site institucional
  • Saúde

Marcas fictícias, criadas para mostrar estilos possíveis.

aura.com.brLanding de produto
Novo · Aura One

Silêncio que se ouve.

Pré-venda
40h bateriaCancelamento ativoÁudio 3D
brasaburger.comRestaurante
Smash na brasa

Fome de quê? De brasa.

Ver cardápio
ClássicoDuploVeggie
orbita.appApp de finanças
Conta digital

Seu dinheiro em órbita.

Baixar app
casaestudio.arq.brSite institucional

Arquitetura que respira.

ResidencialComercialInteriores
clinicavita.com.brSaúde
Clínica integrada

Cuidado no seu tempo.

Agendar consulta
CardiologiaNutriçãoPediatria
Processo

Do briefing ao play.

Do zero ao site no ar, tudo com a gente. Tratamos o projeto como uma animação: cada etapa é um keyframe na linha do tempo.

Etapa 1

Briefing

Entendemos o produto, o público e o que precisa ficar na cabeça de quem visita.

Etapa 2

Roteiro de scroll

Desenhamos a história quadro a quadro: o que aparece, quando e por quê.

Etapa 3

Design das cenas

Layout, tipografia e as peças em 3D ou vídeo de cada parte do site.

Etapa 4

Animação e código

GSAP, WebGL e vídeo sincronizados com a rolagem e testados no celular.

Etapa 5

No ar

Domínio, hospedagem, ajuste fino de performance e o site publicado.

Serviços

O que fazemos.

Site novo, do zero, ou animação para o site que você já tem.

Principal serviço

Seu site completo, do zero.

Você não precisa ter nada pronto. Nós cuidamos da estrutura, do texto junto com você, do design, do código, das animações e da publicação. Você recebe um site novo, rápido, que funciona no celular e que ninguém esquece.

  1. 0Nada pronto? Tudo bem.
  2. 1Estrutura e roteiro
  3. 2Design de cada tela
  4. 3Código e animação
  5. 4Site no ar

Landing page de lançamento

Uma página só, contada como trailer. Para produto novo, evento ou campanha. Criada do zero.

Do zeroScroll storytelling

Site institucional

Várias páginas para a sua empresa, com transições, tipografia em movimento e uma identidade que ninguém esquece.

Do zeroVárias páginas

Vitrine de produto em 3D

O produto gira, abre e mostra os detalhes enquanto a pessoa rola a página.

Three.jsWebGL

Animação para site que já existe

Já tem site e gosta dele? Também dá: entramos com animações e micro-interações sem refazer tudo.

GSAPMicro-interações
Dúvidas

Perguntas frequentes.

O que quase todo mundo pergunta antes de começar.

Landing page a partir de R$ 899 Entrega em cerca de 1 semana Pedir orçamento no WhatsApp

Uma landing page começa em R$ 899, com entrega em cerca de 1 semana. Sites com várias páginas, 3D ou vídeo no scroll são orçados conforme o projeto. Chama no WhatsApp que mandamos o valor certinho.

Sim, no primeiro ano. Nós contratamos, configuramos e deixamos o site no ar no seu endereço. Depois do primeiro ano, é só renovar.

Você não precisa mexer em nada. Quando quiser trocar um texto, uma foto ou um preço, é só pedir que nós fazemos a alteração, pelo plano de manutenção ou de forma avulsa.

O site já sai com a base pronta para o Google: título, descrição, velocidade e uma estrutura que os buscadores entendem. A posição nas buscas depende de tempo e da concorrência do seu ramo.

Sim. Todo site é pensado primeiro para o celular e testado em telas pequenas, com as animações ajustadas para rodar lisas.

Tem, e é opcional. No plano mensal cuidamos de ajustes, backup e suporte. Se preferir, fazemos alterações avulsas só quando você precisar.

Bora botar
seu site
pra mexer?

Abre a pasta e escolhe o tipo de projeto
Contato

Vamos tirar o seu site do zero.

Conta a ideia. Voltamos com um roteiro do site.

WhatsApp(45) 98827-0868
E-mailenzonhenrique@gmail.com
Projeto escolhidoAinda não escolhido
Bora conversar?