Skip to main content

Auditoria Diária do Design System

Agende o Devin para analisar PRs mescladas e sinalizar cores fixas no código e tokens ausentes.
AuthorCognition
CategoryAutomações
FeaturesAgendamentos, Integrações
1

Ensine o seu design system ao Devin

O verificador só é tão bom quanto as regras que ele aplica. Em vez de escrever entradas de Knowledge por conta própria, aponte o Advanced Devin para os arquivos-fonte do seu design system e deixe que ele gere o Knowledge.Abra o Advanced Devin e cole um prompt como este:Devin lê os arquivos-fonte, extrai as regras e cria entradas de Knowledge como estas:
  • Color tokens — “Todas as cores devem usar tokens de src/tokens/colors.ts. Nunca use valores hex brutos como #3B82F6. Use colors.primary.500 em vez disso.”
  • Spacing grid — “Todos os espaçamentos devem seguir nosso grid de 4px. Use tokens de espaçamento de src/tokens/spacing.ts (por exemplo, spacing.2 = 8px, spacing.4 = 16px). Nunca use valores em pixels codificados diretamente (hardcoded), como margin: 10px.”
  • Component library — “Sempre use componentes compartilhados de src/components/ui/ — incluindo <Button>, <Avatar>, <Modal> e <Card>. Não crie alternativas pontuais/ad hoc.”
Revise as entradas geradas em Settings > Knowledge e ajuste o texto ou os gatilhos necessários antes de seguir em frente.
2

Conecte o Linear para criar tickets

A verificação diária cria tickets no Linear para cada violação que encontrar, então conecte o Linear antes de configurar o agendamento.
  1. Vá para Settings > Integrations > Linear e clique em Connect
  2. Autorize o Devin e selecione as equipes às quais ele deverá ter acesso
  3. No Linear, crie um projeto chamado “Design Debt”
  4. Crie um rótulo chamado “design-fix” — você usará este rótulo para acionar correções automáticas na última etapa
Veja Integração com Linear para o guia completo de configuração.
3

Agendar verificação diária

Navegue até Settings > Schedules e clique em Create schedule. Configure da seguinte forma:
  • Name: Design system scanner
  • Schedule type: Recurring
  • Frequency: Daily at 9:00 AM (fuso horário da sua equipe)
  • Agent: Devin
  • Email notifications: Always (para que você veja os resultados todas as manhãs)
Cole isto como o prompt:Você também pode criar isso diretamente a partir do campo de entrada: digite seu prompt, clique no menu de três pontos (⋯) e selecione Schedule Devin. Consulte Scheduled Sessions para mais detalhes.Todas as manhãs, depois que a varredura for concluída, você encontrará tickets como estes no seu projeto Design Debt:
TicketArquivoViolaçãoCorreção sugerida
DD-101src/pages/Settings.tsx:42Cor fixa #3B82F6Substituir por colors.primary.500
DD-102src/components/UserCard.tsx:18Componente de avatar customizadoUsar <Avatar> de src/components/ui/
DD-103src/pages/Dashboard.tsx:95margin: 10pxUsar spacing.3 (12px, valor mais próximo da grade de 4px)
DD-104src/views/Profile.tsx:33Sem breakpoint para mobileAdicionar breakpoint md: para o layout em grid
4

Encerre o ciclo com PRs de correção automática

Depois que você confiar na saída do scanner, modifique o prompt para que o Devin corrija as violações na mesma execução — sem precisar de um gatilho separado. Adicione uma etapa de correção ao final do seu prompt de varredura:Agora o ciclo completo roda automaticamente: scan → ticket + PR de correção → review. Todas as manhãs, você encontra tanto os relatórios de violações quanto os PRs que as corrigem.Para gerar um resumo semanal de todas as violações encontradas, execute isto como etapa de acompanhamento: