Webs cinematográficas numa tarde com o Claude
O stack premium (Lenis · GSAP · Three.js) + as 11 regras firmes que separam uma landing Awwwards de uma que vai a 28 fps. Snippets copy-paste. Zero teoria.
- Lenis
- GSAP
- Three.js
- Mona Sans
- Claude Code
O que vais aprender em 50+ páginas
Cada capítulo é uma peça do stack. Podes lê-los por ordem ou saltar para o que precisares para o teu projeto.
O stack core, sem frameworks
HTML/CSS/JS vanilla + Lenis (smooth scroll) + GSAP ScrollTrigger + Three.js para WebGL. Tipografia Mona Sans / Inter / Bebas Neue. Porque NÃO Next/Astro em landings e quando sim.
As 11 regras firmes de performance
line-height ≥ 1.05 em displays. RAFs pausáveis com IntersectionObserver. Máx 3-4 GPU layers. Lenis lerp 0.09. tabular-nums para counters. bold-no-italic no hero. Cada uma com benchmark.
Técnicas de animação validadas
Scroll-triggered morph. Parallax escalonado. Partículas Three.js de baixo custo. Canvas shaders de fundo. Modelo 3D interativo. Vídeo background com poster + fallback. Snippets copy-paste.
Tooling de assets (sem Midjourney)
Pexels API (200 req/h grátis). Imagen 4 com formato "Generate an image: <desc>". Aurora image-to-video por CDP. Como aumentar a quota efetiva com sessões rodadas. Scripts incluídos.
Diagnose before optimize
Como auditar RAFs, paint, GPU layers ANTES de adicionar camadas especulativas. Produzir > polir tooling. Cada landing conceito único (não clonar). Quando parar de iterar.
12 coisas que matam a tua landing
Empilhar GPU layers. content-visibility com Lenis. Clonar conceitos entre landings. Meta-instruções em prompts Imagen. Confiar no primeiro benchmark. Cada antipadrão com o seu fix.
É para ti ou não é para ti?
Prefiro que fiques de fora se não encaixas, do que compres com dúvidas.
// É para ti se...
- Queres aprender a criar webs premium ainda que nunca tenhas tocado em código — Claude Code é o copiloto que precisas e aqui ensinamos-te a guiá-lo
- És dev / freelance / agência e já tocas em HTML/CSS/JS e queres espremer o Claude Code para landings premium concretas
- Procuras um atalho real para passar de "faço webs básicas" a "faço landings que se vêem no Awwwards"
- Queres faturar 800-3.000 EUR por landing e precisas do portfólio para o justificar
- Preferes entender o "porquê" antes de colar código de um tutorial qualquer
// NÃO é para ti se...
- Procuras um template já feito para revender — o Curso é metodologia acionável, não boilerplate
- Queres usar Webflow / Framer e não tocar em código de todo — o Curso ensina o stack real, não editores visuais
- Queres aprender React / Next.js puro — o Curso defende deliberadamente o vanilla em landings (mais rápido, mais premium, menos overhead)
- Esperas resultados sem dedicar nem uma tarde de prática — com o Claude o atalho é brutal, mas há que iterar 2-3 vezes
O que dizem os primeiros leitores
Reviews dos developers que tiveram o Curso em early access.
"Em 2 dias montei a landing de um cliente com Lenis + ScrollTrigger sem me chatear com o debug. As 11 regras valem o preço do Curso sozinhas."
// lisboa · 4 anos exp"O capítulo de tooling de assets vale dinheiro. Estava há meses a pagar Midjourney sem necessidade — com Pexels API + Imagen 4 cubro quase tudo o que preciso."
// porto · estúdio de 3"Sou senior mas estava há um ano sem tocar em landings. O Curso poupou-me 2 semanas de research. Os antipadrões são ouro — poupei 3 deploys partidos."
// coimbra · saas b2b"Cobrei 1.800 EUR por uma landing que montei em 3 dias seguindo o caso prático do capítulo 7. O Curso paga-se x90 com um só cliente."
// porto · 6 anos exp"Saltava de tutorial em tutorial sem terminar nada. Com isto montei o meu primeiro hero com Three.js numa tarde. O segredo era não ter de entender 200 coisas, só as 11 que importam."
// lisboa · 1 ano exp"Recomendou-mo um colega de um slack. A parte de RAFs pausáveis arranjou-me um bug de scroll jank que tinha há mês e meio sem resolver. 19 EUR > 6 horas do meu tempo."
// braga · 5 anos exp"Venho de design e sempre dependia de um dev para as animações. Agora com Claude Code e o stack do curso levanto landings sozinha. Mudança total."
// aveiro · transição 2025"Os antipadrões são o capítulo que li enquanto tomava o pequeno-almoço. 11/10 as regras de performance, especialmente a de RAFs órfãos — corrigiu-me um padrão mau que tinha há 3 anos a arrastar."
// faro · 9 anos exp"Passo-o a todos os devs que entram no estúdio. É o onboarding mais eficiente que tenho — poupa uma semana de explicações."
// braga · estúdio 4p"Levo 6 anos de frontend e aprendi coisas. A parte de GPU layers foi revelação — tinha 8 camadas sem querer numa landing de produção e ninguém em code review tinha detetado."
// évora · 6 anos exp"Saio do bootcamp e a diferença entre os meus exercícios e este nível é brutal. Li-o em 2 noites. Não é fácil mas está bem explicado, sem palha."
// setúbal · 6 meses exp"Para clientes pequenos o stack vanilla libertou-me do Next.js. Mais rápido, menos overhead, mais margem. Não preciso de um router de 50KB para uma one-page de um fotógrafo."
// lisboa · 3 anos exp"Passei o caso prático do cap 7 diretamente ao Claude Code e montou uma landing para um casamento em 25 minutos. O noivo achava que era uma agência de 5k."
// braga · 7 anos exp"Se vens do WordPress e queres sair da lama de plugins, isto é o atalho. Os snippets do curso são copy-paste reais, não pseudo-código. Nota-se que está escrito por alguém que produz."
// coimbra · ex-WP · 4 anos"Comprámos 5 licenças para a equipa. Baixou o tempo de delivery em 40 por cento em projetos de marketing. Já pagamos x20 no primeiro mês."
// lisboa · agência 5p"Comprava assets no Envato a cada landing nova. Já não. Pexels API e Imagen 4 cobrem 95 por cento, e com qualidade cinematic. Só isso já amortiza o curso."
// funchal · 5 anos exp"O audit do cap 5 subiu-me um Lighthouse de 67 para 94 sem tocar mais nada do que as 11 regras. O cliente pensou que tinha contratado um consultor de performance."
// aveiro · 8 anos exp"Honesto e ao que interessa. Sem palha motivacional. Cada página aporta algo concreto. É o oposto desses cursos de Udemy de 40 horas que repetem o mesmo."
// viseu · 4 anos exp"Comprei para mim, agora é leitura obrigatória da equipa inteira. Melhor investimento do trimestre — menos ressalto em code reviews, menos jank em QA."
// porto · agência 8p"Vendi 3 landings a 800 EUR cada uma no mês passado. Antes demorava o dobro em cada uma. Agora com o fluxo do curso entrego em 3-4 dias em vez de 8-10."
// faro · 3 anos exp"Tinha Three.js como tabu. Agora perco-lhe o medo. O cap 3 é ouro — explica quando SIM e quando NÃO usar 3D, que é exatamente o que ninguém te diz no YouTube."
// guimarães · 1 ano exp"Validou muitas coisas que já intuía e corrigiu-me 2 vícios concretos que pouparam muito jank em mobile. Para senior que acha que já sabe tudo: lê-o na mesma."
// lisboa · 10 anos exp"Demos o curso a um junior na sua primeira semana. Em 2 semanas estava a entregar landings em produção sem code review intensivo. Isso para mim não tem preço."
// braga · estúdio 3p"Levo 12 anos em frontend e este é o primeiro recurso que combina IA + animação sem cair no hype. Os prompts ao Claude do cap 7 são templates que uso já todas as semanas."
// lisboa · 12 anos expTudo o que recebes hoje
Giangada.IA
Curso completo + atualizações grátis 12 meses
- Curso de 50+ páginas (download imediato)
- Stack completo: Lenis + GSAP + Three.js + Mona Sans
- As 11 regras firmes de performance com benchmark
- 6 técnicas de animação validadas (copy-paste)
- Tooling de assets: Pexels + Imagen 4 + Aurora
- 12 antipadrões com diagnóstico + fix
- Updates grátis durante 12 meses no mínimo
- Suporte direto por email (resposta < 24h)
Pagamento único · Sem subscrições · Acesso vitalício
Comprar Curso → 19,99 EUR// Pagamento seguro Stripe · SSL 256-bit · Curso entregue ao instante
Criar uma landing premium não te devia custar 3 dias
Após 9 landings cinematográficas em produção (Giangada, Health365, top-skills.pages.dev e outras), o stack reduz-se a algo aprendível numa tarde — se te derem as 11 regras que importam. É isso que tens dentro do Curso.
O que de certeza te estás a perguntar
Quando recebo o Curso após o pagamento?
Imediato. Ao confirmar-se o pagamento no Stripe, recebes no teu email uma ligação de download do Curso em menos de 2 minutos. Se demorar mais, revê o spam ou escreve ao suporte e resolvemos manualmente.
Preciso de saber programar para o aproveitar?
Não é preciso. O Curso está pensado para que qualquer pessoa o possa seguir apoiando-se no Claude Code como copiloto. Se já tocaste em HTML/CSS básico vais mais rápido, mas se começas do zero também chegas — numa ou duas tardes plantas-te a levantar a tua primeira landing premium sem teres escrito uma linha antes.
E se o Claude Code não me deixar usar a biblioteca X?
As bibliotecas do stack (Lenis, GSAP, Three.js, Mona Sans) são todas open-source ou de uso comercial livre com os seus termos respetivos. O Curso explica-te como as carregas via CDN sem instalar nada local. Funciona com Claude Code, Cursor, Copilot ou o teu editor de sempre.
É atualizado com novas versões?
Sim. O stack de landings premium evolui rápido (GSAP 4, View Transitions API, fonts variáveis). Tens updates grátis durante pelo menos 12 meses desde a tua compra. Quando publicarmos uma versão nova do Curso, chega-te ao mesmo email sem custo.
Em que formato está o Curso?
Curso em formato PDF A4 (210x297 mm), otimizado para leitura em tablet horizontal ou monitor. Tipografia 11pt corpo / 22pt headlines. Os snippets de código são selecionáveis (não são imagens) — podes copiar para o Claude diretamente.