01 / ESTRUTURA
Estrutura
Entenda melhor como aquela página foi organizada e use isso para pensar a sua própria versão.
Extensão CODEBEN para Chrome
Pare de adivinhar como aquele site foi feito.
Capture o que está acessível na página, leve a referência para o seu fluxo e comece com algo real na mão.
Você encontrou uma estrutura boa.
Uma interação diferente.
Uma direção visual que queria entender.
Em vez de ficar só olhando, o CODEBEN Site Cloner reúne os arquivos acessíveis daquela página e organiza tudo para você estudar, analisar e usar como ponto de partida.
Quer testar primeiro? Me chama no Instagram. Eu libero uma chave válida por 1 hora a partir da primeira ativação.
CODEBEN / CAPTURA EM AÇÃO VÍDEO REAL
Veja a interface e o processo de captura01 / DEMO
REFERÊNCIA → CAPTURA → ANÁLISE → SEU PROJETOVeja o que você pode estudar
POSSIBILIDADES
Sai do “como fizeram isso?” para “agora eu consigo estudar”.
Tem site que você abre e já sabe que tem alguma coisa boa ali.
Às vezes é a estrutura. Às vezes é o movimento. Uma transição. Uma seção. Um fundo. Uma composição que simplesmente funciona.
O problema é que olhar de fora só te mostra o resultado.
Com a referência capturada, você passa a ter material real para investigar.
02 / MOVIMENTO
Movimento
Observe como ritmo, transições e comportamento ajudam a construir a experiência.
03 / EXPERIÊNCIAS VISUAIS
Experiências visuais
Estude referências mais elaboradas antes de tentar recriar tudo sozinho.
04 / SEÇÕES E FUNDOS
Seções e fundos
Veja como camadas, cores, elementos e composição trabalham juntos.
A referência não é o resultado. É a vantagem com que você começa.
Esse projeto é meu. A referência foi o começo — não o resultado final.
POR QUE EU USO
Porque estudar site só pelo lado de fora ficou limitado demais.
Tem página que eu abro e penso: “Tem alguma coisa muito boa acontecendo aqui.”
Só que print não mostra estrutura. Vídeo não mostra os arquivos. E tentar reconstruir tudo no olho pode levar horas.
Foi justamente por isso que comecei a trabalhar de outro jeito.
Quando encontro uma referência boa, eu capturo o que está acessível, levo para o meu fluxo e começo a entender de verdade o que está acontecendo.
Depois eu mudo. Refaço. Adapto. Troco identidade. Reorganizo. Levo para outro contexto.
A referência me dá vantagem. O resultado continua sendo meu.
O MÉTODO VEM DEPOIS DA CAPTURA
A extensão resolve uma parte do processo.
Na Imersão CODEBEN eu mostro o que faço depois: como parto da referência, conduzo a construção e vou refinando até aquilo ganhar identidade própria.
01 / COMO FUNCIONA
Encontrou. Capturou. Agora você consegue investigar.
Sem processo complicado.
Encontre uma referência
Abra no Chrome uma página que tenha alguma coisa que você gostaria de estudar melhor.
Capture
O Site Cloner reúne HTML, estilos, scripts e outros recursos que estejam acessíveis no navegador e organiza o material em um ZIP.
Leve para o seu fluxo
Abra no seu editor, analise os arquivos ou leve o material para as ferramentas de IA que você já usa. Daqui pra frente, é você quem conduz.
A extensão encurta a distância entre “gostei disso” e “agora consigo entender melhor como isso foi construído”.
02 / NA PRÁTICA
Melhor do que explicar é mostrar.
Aqui você consegue ver a extensão funcionando de verdade. Uma página aberta. A captura acontecendo. Os arquivos sendo organizados. Sem mockup. Sem demonstração inventada.
VÍDEO — SITE CLONER EM AÇÃO
Veja a captura acontecer.
O Site Cloner funcionando de verdade.
ASSISTIR DEMONSTRAÇÃOSites com movimento
Referências com animações, transições e scroll.
Páginas de venda
Estrutura, seções e organização visual.
Sites interativos
Projetos em que a referência ajuda a entender o caminho, mesmo quando partes mais avançadas ainda exigem adaptação.
Cada site funciona de um jeito. Recursos protegidos, conteúdos privados, integrações externas e experiências 3D podem exigir trabalho adicional.
03 / TESTE DE 1 HORA
Não precisa comprar para descobrir se serve pra você.
Quer abrir a extensão no seu próprio navegador antes?
Me chama no Instagram. Eu envio a extensão e libero uma chave temporária.
A contagem começa somente na primeira ativação.
Você abre. Explora. Faz suas próprias capturas. E decide com a ferramenta na mão.
LIBERAÇÃO MANUALPEDIR MEU TESTE @codebenads · liberação manual
04 / PLANOS
Escolha quanto tempo você quer usar.
A ferramenta é a mesma. O que muda é o período de acesso.
PARA TESTAR NO SEU FLUXO01 / 03
7 DIAS
Uma semana para explorar referências, fazer capturas e entender como a ferramenta entra no seu processo.
R$9,90
acesso por 7 dias
- CODEBEN Site Cloner
- Captura de página ou site
- Exportação em ZIP
- 1 dispositivo
PARA QUEM TEM PROJETO RODANDO02 / 03
1 MÊS
Mais tempo para usar referências diferentes e aplicar a ferramenta durante seus projetos.
R$29,90
acesso por 1 mês
- CODEBEN Site Cloner
- Captura de página ou site
- Exportação em ZIP
- 1 dispositivo
MAIS TEMPO. MELHOR CUSTO.03 / 03
3 MESES
Para quem sabe que vai continuar pesquisando referências e quer manter a ferramenta no fluxo por mais tempo.
R$59,90
acesso por 3 meses
- CODEBEN Site Cloner
- Captura de página ou site
- Exportação em ZIP
- 1 dispositivo
As condições de cobrança e renovação ficam visíveis no checkout antes da confirmação da compra.
ANTES DE COMEÇAR
Antes de
começar.
Como recebo a extensão depois da compra?
Assim que o pagamento for aprovado, a chave correspondente ao seu plano é enviada para o e-mail usado no checkout, junto com as instruções de instalação.
Como funciona o teste de 1 hora?
Você me chama no Instagram. Eu envio manualmente a extensão e uma chave temporária. A hora começa somente quando a chave é ativada pela primeira vez.
Preciso saber programar?
Não para fazer a captura. O nível técnico entra depois, dependendo do que você pretende fazer com os arquivos. Você pode analisar o material, abrir em um editor ou levar para um fluxo com IA.
O Site Cloner copia qualquer site perfeitamente?
Não. Ele captura aquilo que consegue acessar através do navegador e organiza esse material para análise e reconstrução. Conteúdos protegidos, dados privados, integrações externas, aplicações 3D e alguns comportamentos podem precisar ser recriados ou ajustados separadamente.
Isso substitui o trabalho de criação?
Não. A ferramenta te entrega material de referência. Direção, adaptação, refatoração e resultado final continuam fazendo parte do seu processo.
Posso usar em mais de um computador?
Cada licença funciona em 1 dispositivo por vez. Se trocar de computador, entre em contato para solicitar a liberação do dispositivo anterior.
CAPTURE. ESTUDE. ENTENDA. TRANSFORME.
Da próxima vez que você encontrar uma referência boa, não fique só olhando.
A referência não é o resultado.
É a vantagem com que você começa.