Um agente de programação com IA só consegue seguir uma referência visual na medida em que as decisões aí estejam definidas. Se o projeto lhe pertence e já tem regras de marca aprovadas, pode reuni-las num ficheiro DESIGN.md que possa ser revisto e depois utilizar o Claude Code em duas pequenas edições que inspeciona pessoalmente. O resultado a entregar é a sua especificação aprovada. As duas edições verificam se ela foi útil naqueles materiais concretos; não estabelecem o resultado de uma edição posterior.

Este procedimento baseia-se em documentação. A BIG CHANGE analisou uma coleção de ficheiros de design fixada numa revisão e os manuais do Claude Code da Anthropic em 20 de outubro de 2026. Não executámos o Claude Code, nem editámos ou renderizámos os dois materiais, nem medimos custos ou qualidade de design.

A principal mudança

  • O que mudou: O proprietário pode criar uma especificação visual com versões a partir de decisões aprovadas e fornecer esse ficheiro exato ao Claude Code antes de uma edição delimitada.
  • Porque importa: Uma única fonte verificada disponibiliza as regras de cor, tipografia e disposição para comparação com duas revisões reais, cabendo ao proprietário decidir se aceita cada resultado.
  • O que observar: O ficheiro tem de ser lido na íntegra antes de cada edição. A sua presença no projeto, a menção de um caminho ou uma garantia do Claude não provam que tenha sido carregado ou seguido.

Antes de começar

Precisa de um projeto próprio, autorização para o editar, dois pequenos materiais existentes que possa renderizar e uma cópia de trabalho ou ponto de controlo de versões recuperável. Podem ser duas páginas ou uma página e uma apresentação, desde que conheça o processo real de edição e renderização de cada projeto. Escolha uma alteração visual limitada para cada material. Preserve os textos atuais, as ligações e as interações funcionais para comparação.

Reúna os valores de cor aprovados pelo proprietário e as respetivas funções, tipos de letra licenciados ou permitidos e alternativas, regras de utilização de logótipos e imagens, público-alvo, dimensões e requisitos de acessibilidade. Utilize o registo real de aprovação ou peça ao proprietário que resolva escolhas em falta. O sítio público de uma empresa ou a análise de design de outra pessoa não autoriza valores ou recursos para o seu projeto. Aprovar um recurso também não autoriza automaticamente o seu envio a um fornecedor de modelos.

Configure o Claude Code com uma conta ou fornecedor elegível e analise os termos de utilização de dados e as permissões das ferramentas da conta antes de expor código, textos ou recursos privados. Um projeto guardado localmente pode enviar conteúdo a um serviço de modelos. Verifique quem pode ver os materiais, que ferramentas podem ler ou alterar ficheiros e se pode enviar cada elemento. As orientações sobre custos dependem da conta e do fornecedor; este guia não pode atribuir um preço fixo à sua sessão.

A coleção Awesome DESIGN.md fixada numa revisão é uma inspiração opcional para as secções do ficheiro. Analisa sítios públicos; não é um manual de marca aprovado pelo proprietário. Pode escrever o ficheiro diretamente a partir das decisões aprovadas. Se copiar texto do repositório, preserve o aviso de direitos de autor e permissão MIT. Esse aviso não concede direitos sobre marcas, ficheiros de tipos de letra ou imagens de outro sítio.

Crie a referência aprovada pelo proprietário

  1. Crie brand-reference/DESIGN.md no projeto próprio. Preencha este esquema mínimo com o registo de aprovação. O texto entre parênteses retos indica informações que o proprietário deve fornecer; não sugere uma marca. Mantenha um elemento marcado como UNRESOLVED até o proprietário decidir. Não peça ao Claude que invente um valor para preencher uma lacuna.
Markdown
# Visual specification

Owner: [owner or approving role]
Approved version/date: [version and approval date, or UNRESOLVED]
Audience and artifact purpose: [owner-approved description]
Approval evidence: [internal record or location, without private data in a shared copy]

## Color roles and values
- Background: [approved value and color format, or UNRESOLVED]
- Text: [approved value and color format, or UNRESOLVED]
- Primary action: [approved value and color format, or UNRESOLVED]
- Link, border and status roles: [each approved value, or UNRESOLVED]

## Typography and scale
- Heading family and permitted fallback: [approved names, or UNRESOLVED]
- Body family and permitted fallback: [approved names, or UNRESOLVED]
- Heading/body sizes, weights and line heights: [approved scale, or UNRESOLVED]
- Font license or use restriction: [approved terms, or UNRESOLVED]

## Spacing and layout
- Spacing scale, content width and grid: [approved values, or UNRESOLVED]
- Target artifact dimensions: [approved sizes, or UNRESOLVED]

## Components and states
- Buttons, links, inputs and navigation: [approved appearance and behavior]
- Hover, focus, disabled and error states: [approved rules, or UNRESOLVED]

## Responsive and accessibility rules
- Desktop/phone behavior and breakpoints: [approved rules, or UNRESOLVED]
- Contrast, readable type, focus order and touch use: [approved requirements]

## Assets and forbidden substitutions
- Permitted logo/image assets and usage: [approved paths and permissions]
- Do not substitute: [owner-approved prohibited colors, fonts, marks or patterns]

## Owner approval and changes
- Approved by: [person or role and date, or UNRESOLVED]
- Version: [version]
- Changelog: [date, change, approver]
- Unresolved decisions: [list, or "none" after owner review]
  1. Confira cada linha preenchida com as decisões originais do proprietário, incluindo os direitos de utilização de tipos de letra e imagens. Resolva com ele conflitos entre estilos antigos do projeto e as regras atualmente aprovadas. Peça a aprovação deste ficheiro exato e registe a sua versão. Suspenda qualquer edição que dependa de um valor por resolver. Guarde o ficheiro aprovado e os dois materiais iniciais no controlo de versões ou noutra cópia recuperável.

Utilize o ficheiro em duas edições delimitadas

  1. No projeto próprio, inicie uma sessão do Claude Code com a conta e as permissões verificadas. Forneça os caminhos exatos de brand-reference/DESIGN.md e do primeiro material. Peça primeiro ao Claude que leia integralmente a referência e o material e pare antes de editar. Inspecione o resultado real de leitura do ficheiro ou da ferramenta para conferir o caminho e o conteúdo completo. Uma leitura recusada, um resultado truncado, a mera menção do caminho ou um resumo verbal não chegam. A Anthropic documenta os ficheiros de instruções do projeto como uma opção de configuração separada; não pressuponha que um DESIGN.md qualquer seja descoberto automaticamente nem dependa de uma referência @ se comportar da mesma maneira em todas as versões.
  2. Quando a leitura completa estiver visível, peça a única alteração visual escolhida para o primeiro material, utilizando apenas as regras aprovadas. Limite os ficheiros alterados; preserve textos, ligações, controlos e código não relacionado. Peça para ver as diferenças propostas e o método estabelecido de renderização do projeto. Inspecione cada ficheiro alterado antes de o aceitar. Rejeite cores, tipos de letra, recursos, dependências ou edições adicionais sem aprovação.
  3. Renderize o primeiro material com o processo real do projeto. Compare o resultado com o ficheiro aprovado e o material inicial em dimensões de computador e telemóvel adequadas ao projeto. Verifique valores dos tokens nos ficheiros alterados, contraste legível, hierarquia dos títulos e tipografia, cortes ou transbordo horizontal, foco visível, teclado e interações afetadas, e a preservação dos textos e ligações. Registe a versão da referência, a revisão do material, as verificações e as correções. Uma descrição de uma renderização não é o resultado renderizado.
  4. Para o segundo material, indique novamente o caminho exato e brand-reference/DESIGN.md. Solicite uma nova leitura completa antes da edição e inspecione o resultado da ferramenta. Depois peça uma alteração delimitada, reveja as diferenças, renderize com o processo próprio do segundo material e repita as mesmas verificações. Compare ambas as revisões com a mesma versão do ficheiro aprovado. Registe cada regra como seguida, incumprida ou dependente de uma revisão aprovada pelo proprietário; corrija desvios e verifique novamente os dois materiais se a referência mudar.

O trabalho termina com a especificação aprovada e versionada, duas revisões inspecionadas e renderizadas e um breve registo das regras cumpridas ou incumpridas. Preserve as revisões originais para poder reverter. Se uma leitura falhar, verifique o caminho exato, as permissões e o tamanho do ficheiro ou eventual truncagem antes de pedir uma edição. Se a especificação contrariar estilos do projeto ou acessibilidade, obtenha a decisão do proprietário e reduza o âmbito da alteração. Se um material não puder ser renderizado ou uma interação não puder ser verificada, deixe a edição por aceitar até a verificação ser possível. Futuras alterações de marca exigem uma nova revisão deliberada dos resultados anteriores.

Para outra tarefa que usa um ficheiro da comunidade como referência para uma página, consulte o nosso guia de DESIGN.md fixado numa revisão. O trabalho deste guia consiste primeiro em criar e aprovar a sua própria especificação.

Fontes e leituras adicionais

  • O README do Awesome DESIGN.md fixado numa revisão fornece secções de exemplo e descreve os ficheiros como análises de sítios públicos fornecidas no estado em que se encontram. As suas afirmações sobre qualidade não são um resultado testado aqui. A licença MIT rege o material copiado do repositório, não a identidade ou os recursos de terceiros.
  • O guia de iniciação da Anthropic abrange a configuração da conta e do projeto. Os seus processos comuns e o manual de memória do projeto descrevem processos de ficheiros e instruções; nenhum prova que este ficheiro independente foi lido integralmente na sessão do leitor.
  • Os manuais da Anthropic sobre permissões, utilização de dados e custos explicam controlos e condições próprias da conta. Não estabelecem uma edição observada, processamento exclusivamente local, uma fatura fixa ou melhoria de qualidade para este guia.