Conceitos de site · avaliação
Dezoito direções para o novo site da Arterra.
Seis lotes de conceitos completos e distintos. A Rodada 6 é a versão ENGENHARIA — tema claro com o herói focado no maquinário (uma esteira subindo 5 pavimentos de um jardim suspenso, alimentada por uma Bobcat na base). A Rodada 5 é a versão clara com fotos realistas geradas por IA; a Rodada 4 usa vídeo + imagens no verde-escuro; a Rodada 3 é 100% código, sem imagem. Clique em qualquer cartão para navegar. No fim, o site no ar.
Rodada 6 · engenharia · herói no maquinário
tema claro · herói maquinário · fotos IA
17 · engenharia cinema
A engenharia do verde
O layout cinematográfico claro com o herói focado na obra: uma esteira de carregamento subindo 5 pavimentos de um jardim suspenso, alimentada por uma Bobcat despejando terra na base. A narrativa abre pelo maquinário (içamento com Munck, Bobcat S70, esteira, mudas). CTA laranja, logo claro.
abrir conceito ↗
tema claro · herói maquinário · galeria
18 · engenharia galeria
Obra em altura
A galeria imersiva clara com o herói em ângulo dramático na esteira subindo a fachada verde, Bobcat alimentando a base. Abre pela engenharia/maquinário e segue para o acervo de obras. Logo claro, CTA laranja.
abrir conceito ↗
Rodada 5 · tema claro · fotos realistas geradas por IA
tema claro · fotos IA · sem vídeo
15 · cinema claro
Jardim à Luz
O layout cinematográfico em tema claro e arejado, com fotos realistas geradas por IA: jardins finalizados (comercial, residencial, industrial), seção "tipos de obra", vitrine de maquinário (içamento com Munck, Bobcat S70, esteira) e cada serviço com sua imagem real. CTA laranja, logo claro.
abrir conceito ↗
tema claro · fotos IA · galeria
16 · galeria clara
Atlas à Luz
A galeria imersiva em tema claro: pranchas de obras reais (geradas por IA) em grade editorial com molduras de museu e zoom suave, sobre fundo papel. Tipos de obra + engenharia/maquinário, logo claro, CTA laranja.
abrir conceito ↗
Rodada 4 · vídeo + imagens geradas por IA · dark-green
vídeo IA · scroll-scrub · dark-green
13 · cinema
Verde Noturno
A Arterra como um filme noturno: um vídeo cinematográfico verde-escuro gerado por IA, conduzido pelo scroll, com tipografia cinética e cenas em parallax. Nenhuma foto real — só mídia gerada e o logo.
abrir conceito ↗
WebGL · imagens IA · dark-green
14 · galeria
Atlas Vivo
Uma galeria imersiva: pranchas botânicas verde-escuras geradas por IA, com parallax de profundidade, distorção WebGL no hover e uma névoa generativa ao fundo. Legendas de museu, tudo gerado.
abrir conceito ↗
Rodada 3 · gerativo · sem fotos
WebGL · shader · sem fotos
11 · topografia
Curvas de nível
Um mapa topográfico vivo gerado por shader — curvas de nível que derivam como o relevo de um terreno, atravessadas pelo scroll. Zero imagens: só o logo e o verde-escuro.
abrir conceito ↗
Canvas · curl-noise · sem fotos
12 · tipográfico
Vento & tipografia
Editorial puro: tipografia gigante sobre um campo de fluxo (curl-noise) que deriva como vento/sementes. Monocromático, 100% código, nenhuma imagem.
abrir conceito ↗
Rodada 2 · animação moderna
WebGL · água
06 · espelho d'água
Espelho d'água
Um lago reflexivo em tempo real (WebGL): o título reflete e ondula na superfície, o cursor cria ripples, cáusticas dançam no fundo. Sereno e premium.
abrir conceito ↗
WebGL · 3D
07 · imersivo 3D
Imersivo 3D
Cena React Three Fiber com profundidade real: planos de projeto flutuando no espaço, partículas e luz reagindo ao scroll e ao cursor.
abrir conceito ↗
GSAP · Lenis
08 · cinemático
Cinemático
Coreografia de scroll de ponta: cenas fixadas, texto revelado linha a linha, carrossel horizontal, indicador de velocidade. Scroll suave e preciso.
abrir conceito ↗
shader · líquido
09 · líquido
Líquido
A redenção do orgânico, feito com shader: fotos que refratam como água, fundo de gradiente fluido, transições gooey. Lush e moderno — nada amador.
abrir conceito ↗
Motion · tipografia
10 · editorial cinético
Editorial cinético
Editorial de alta-costura: tipografia gigante, marquees, fotos com skew pela velocidade do scroll, micro-interações magnéticas. Sem WebGL — puro motion.
abrir conceito ↗
Rodada 1 · primeiras direções
01 · ultra-modernoO Jardim à NoiteCinema escuro e interativo: raízes em Canvas que crescem em direção ao cursor.abrir conceito ↗
02 · enraizadoBotânico & terrosoEditorial quente em creme e terracota, com raízes que se desenham no scroll.abrir conceito ↗
03 · limpoLimpo & simplesMinimalista, muito respiro, fotos respirando. A opção segura e de alta conversão.abrir conceito ↗
04 · vivoA árvore que cresceA página inteira é uma árvore crescendo, raízes se espalhando e chuva caindo (SVG/Canvas).abrir conceito ↗
05 · engenhariaEngenharia do verde em alturaMaquinário em torres: grua içando árvores ao 23º andar, Bobcat S70, esteiras, antes→depois.abrir conceito ↗
No ar · referência
no arwww.arterra.com.brO site atual, já publicado. Use como referência de comparação com os dez conceitos.abrir site no ar ↗