Communitygithub.com

Diretrizes de Interface Web (DDS-Solutions/AI-TadPole-OS)

Revise o código de UI para conformidade com as Diretrizes de Interface Web. Use quando solicitado a "revisar minha UI", "verificar acessibilidade", "auditar design", "revisar UX" ou "verificar meu site com relação às melhores práticas".

O que é AI-TadPole-OS)?

Esta skill permite que um agente de IA audite arquivos de código de interface do usuário (UI) em busca de conformidade com as Diretrizes de Interface Web da Vercel Labs. Ela é especialmente útil após a fase de codificação, funcionando como uma etapa de auditoria no fluxo de trabalho de design. A skill busca as diretrizes mais recentes de uma URL de origem, lê os arquivos especificados (ou pergunta ao usuário quais arquivos revisar) e aplica todas as regras contidas nas diretrizes. O resultado é uma listagem concisa no formato `arquivo:linha`, facilitando a identificação e correção rápida de problemas de acessibilidade, performance e boas práticas. A skill é compatível com qualquer agente que tenha acesso a ferramentas de busca na web e leitura de arquivos, como Claude Code, Cursor, Codex e similares.

Funciona com✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/DDS-Solutions/AI-TadPole-OS/tree/HEAD/.agent/skills/web-design-guidelines

Perguntar na sua IA favorita

Abre um novo chat com esta habilidade de agente já pré-carregada.

Documentação

[!IMPORTANT] Contexto de IA e Herança de Conhecimento

  • Subsistema: Registro de Skills do Agente / diretrizes-de-interface-web
  • Arquitetura: @docs ARCHITECTURE:Documentation
  • Caminho de Falha: Deriva de informação, terminologia legada ou incompatibilidade de documentação.
  • Observabilidade: Rastreabilidade via execution/parity_guard.py ([SKILL])

Diretrizes de Interface Web

Revise arquivos em busca de conformidade com as Diretrizes de Interface Web.

Como Funciona

  1. Busque as diretrizes mais recentes da URL de origem abaixo
  2. Leia os arquivos especificados (ou pergunte ao usuário quais arquivos/padrão)
  3. Verifique todas as regras nas diretrizes obtidas
  4. Produza os resultados no formato sucinto arquivo:linha

Fonte das Diretrizes

Busque diretrizes atualizadas antes de cada revisão:

https://raw.githubusercontent.com/vercel-labs/web-interface-guidelines/main/command.md

Use WebFetch para recuperar as regras mais recentes. O conteúdo obtido contém todas as regras e instruções de formato de saída.

Uso

Quando um usuário fornecer um argumento de arquivo ou padrão:

  1. Busque as diretrizes da URL de origem acima
  2. Leia os arquivos especificados
  3. Aplique todas as regras das diretrizes obtidas
  4. Produza os resultados usando o formato especificado nas diretrizes

Se nenhum arquivo for especificado, pergunte ao usuário quais arquivos revisar.


Skills Relacionadas

SkillQuando Usar
frontend-designAntes de codificar - Aprenda princípios de design (cor, tipografia, psicologia UX)
diretrizes-de-interface-web (esta)Após codificar - Audite acessibilidade, performance e melhores práticas

Fluxo de Trabalho de Design

1. DESIGN   → Leia os princípios de frontend-design
2. CODE     → Implemente o design
3. AUDIT    → Execute a revisão de diretrizes-de-interface-web ← VOCÊ ESTÁ AQUI
4. FIX      → Corrija os resultados da auditoria

Habilidades Relacionadas