tutorial · 02 de agosto de 2026 · 6:33
Como criar sites animados com Claude Design
O autor apresenta duas formas de usar o Claude Design para criar sites com animação. A primeira usa templates gratuitos do motionsites.ai; a segunda grava a tela de sites premium e usa os frames como referência. Depois de pronto, as imagens e o vídeo podem ser gerados pelo Higgsfield via MCP.
O passo a passo
01Acesse o Claude Design pelo menu 'design'
Selecione o modelo Opus para garantir um bom resultado na geração.
02Método 1: copiando templates gratuitos
No motionsites.ai, filtre por gratuito, clique em copy e cole o prompt no Claude Design.
03Método 2: gravando sites premium
Grave a tela do site premium, tire prints dos frames e anexe como referência no Claude Design.
04Imagens e vídeo gerados automaticamente
Depois do site pronto, use o Higgsfield via MCP para trocar fotos e vídeo sem editar manualmente.
05Precisa da versão Pro
O Claude Design não é gratuito e exige pelo menos a versão Pro do Claude.
Nas palavras dele
“Entenda o vídeo em anexo à imagens, extraia a forma que foi feito. Faça igual em anexo que está no vídeo e as imagens como referência.”
ouvir em 4:10
“Você faz aí isso no máximo 5, 10 minutos, você já tá com isso pronto.”
ouvir em 5:50
“Lembrando que o Claude Design não é gratuito, você precisa ter pelo menos aí a versão Pro do Claude para você poder utilizar isso”
ouvir em 6:00
Perguntas
O Claude Design é gratuito?
Não. É preciso ter pelo menos a versão Pro do Claude para usar.
Quanto tempo leva para fazer um site assim?
O autor diz que dá para fazer em no máximo 5 a 10 minutos.
Como usar templates premium do motionsites.ai?
Grave a tela do site, tire prints dos frames e use como referência no Claude Design.
Quer ir além do vídeo?
Continue por aqui
Este resumo foi escrito a partir da transcrição do vídeo. As citações são literais. Para o conteúdo completo, assista no YouTube.