material gratuito

Posts de cliente no Claude Design, sem refazer mil vezes

O passo a passo do vídeo, os 3 prompts pra copiar e, de bônus, as 5 ferramentas gratuitas pro Claude parar de entregar design genérico.

como usar

A ideia é simples: em vez de fazer uma arte, o cliente não gostar e você refazer de novo, você ensina a marca pro Claude uma vez, pede várias opções de uma vez e ajusta os detalhes na hora, com o cliente vendo.

Faz um projeto por cliente. Assim o contexto fica salvo e cada post novo já sai com a cara da marca.

passo a passo

Do zero até a arte aprovada

1Cria um projeto no Claude Design só pra esse cliente.
2Contextualiza o projeto: o que a empresa faz, pra quem vende, como ela fala. Usa o prompt 1 aqui embaixo.
3Leva a identidade visual: logo, cores, fontes e, se tiver, o manual da marca.
4Traz referências: prints de posts que o cliente gosta e o estilo que você está buscando.
5Pede de 3 a 6 artes diferentes pro mesmo post (prompt 2). Assim você confere se ele entendeu o que você quer antes de seguir.
6Manda as opções pro cliente escolher. Ele aprova uma, e não fica aquele vai e volta.
7Ajusta direto no canvas: cor do texto, espaçamento, tamanho da imagem, fonte. Você clica e muda, sem pedir pra IA trocar um detalhe.
8Mudança maior, tipo trocar o layout inteiro? Deixa um comentário no elemento ou usa o prompt 3 no chat, e o Claude edita.
prompt 1

O contexto da marca

Cola no começo do projeto e preenche o que está entre colchetes. Anexa junto logo, paleta e referências.

contexto da marca
Você vai criar os posts de Instagram de um cliente meu. Antes de criar qualquer coisa, entenda a marca.

EMPRESA: [nome e o que ela faz, em uma frase]
PÚBLICO: [pra quem ela vende]
TOM DE VOZ: [ex.: próximo e bem-humorado / sério e técnico]
CORES: [códigos das cores, ou use as da paleta anexa]
FONTES: [nomes das fontes]
LOGO: anexo.
REFERÊNCIAS: anexo prints de posts que o cliente gosta. Repare no que eles têm em comum (espaçamento, peso das fontes, uso de foto, quantidade de texto).
ESTILO QUE EU QUERO: [nomeie o estilo, ex.: editorial minimalista, brutalista, colagem, retrô anos 90]

Regras:
- Use só as cores e fontes da marca.
- Pouco texto por arte, com hierarquia clara.
- Formato: [1080x1350 pro feed / 1080x1920 pra story].

Antes de criar, me responda em poucas linhas o que você entendeu da marca e do estilo.

Dica: nomeia o estilo. "Bonito", "clean" e "sofisticado" não dizem nada pra IA; "editorial minimalista com muito respiro" diz.

prompt 2

As opções pro cliente

3 a 6 artes
Crie [4] artes diferentes para este post:

TEMA: [sobre o que é o post]
TEXTO DA ARTE: [título e, se tiver, uma frase de apoio]
OBJETIVO: [ex.: divulgar uma promoção / explicar um serviço]

Cada opção tem que ser bem diferente da outra: mude o layout, a posição do texto e o uso de imagem, mas mantenha a identidade da marca.

Coloque as opções lado a lado no canvas, numeradas, pra eu mandar pro cliente escolher.
prompt 3

Quando o cliente escolher

ajuste da escolhida
O cliente escolheu a opção [2]. Mantenha o layout dela e faça só estes ajustes:

- [ex.: trocar a foto pela anexa]
- [ex.: deixar o título maior]

Não mude cores, fontes nem o resto da composição.
pra ganhar tempo

Quando o cliente aprovar uma arte, pede pro Claude transformar ela em modelo: no próximo post você só troca o texto e a foto.

bônus

As 5 ferramentas gratuitas de design

As do outro vídeo, pra usar no Claude Code quando o assunto é site. Todas são de graça e de código aberto. O jeito de instalar está na página de cada uma.

TasteRegras de design pro Claude parar de entregar layout genérico de IA. github · site
ImpeccableMelhora o design do seu site com um sistema de design próprio e tem editor ao vivo no navegador. github · site
PlaywrightO Claude abre o seu site no navegador, navega entre as páginas, tira print e confere sozinho se o layout ficou bom. github · site
Awesome DesignSistemas de design inspirados em sites de verdade: tipografia, espaçamento, botões e layout. github · site
img2threejsVocê manda a foto de um objeto e o Claude recria em 3D interativo, só com código. github · exemplo
Copiado!