Pular para o conteúdo
Skillpedia
Interfaces (UI/UX)48 mil · #4539

web-design-guidelines

Ajuda seu agente a verificar se os arquivos seguem as diretrizes de interface web. Isso garante que o design seja consistente e fácil de usar.

O que ela faz

Esta ferramenta verifica se seus arquivos de design seguem as regras oficiais de interface web. Ela garante que seu site ou aplicativo tenha uma aparência consistente e profissional.

Quando usar

  • ✓Ao criar um novo site ou aplicativo.
  • ✓Ao atualizar o design de um projeto existente.
  • ✓Para garantir a qualidade do código de interface.

Exemplo do que pedir para a IA

“Verifique meus arquivos de código em busca de problemas de design.”

Quer saber mais? Abra as seções abaixo.

Como usar

O jeito mais fácil: copie a mensagem abaixo e cole no Claude, ChatGPT, Cursor ou outra IA. Ela lê a skill e segue as instruções.

Link da skill

https://github.com/sickn33/agentic-awesome-skills/blob/main/plugins/agentic-awesome-skills-claude/skills/web-design-guidelines/SKILL.md

Mensagem pronta para colar

Use esta skill para me ajudar: https://github.com/sickn33/agentic-awesome-skills/blob/main/plugins/agentic-awesome-skills-claude/skills/web-design-guidelines/SKILL.md Leia o arquivo SKILL.md desse link e siga as instruções dele na minha tarefa.
Como funciona

A ferramenta busca as regras de design mais recentes na internet e as compara com os arquivos que você indicar. Ela aponta onde estão os problemas, se houver.

Instalação

Jeito mais fácil: copie o link da skill e cole no Claude, ChatGPT ou Cursor pedindo para seguir as instruções.

No terminal (Claude Code, Codex, Cursor), na pasta do projeto:

npx skills add sickn33/agentic-awesome-skills --skill web-design-guidelines

Ou baixe só o arquivo:

curl -L https://raw.githubusercontent.com/sickn33/agentic-awesome-skills/main/plugins/agentic-awesome-skills-claude/skills/web-design-guidelines/SKILL.md -o SKILL.md
Conteúdo técnico (SKILL.md)

Tradução do texto original do autor no GitHub. Os comandos e códigos estão como no original.

Diretrizes da Interface Web

Revise arquivos para conformidade com as Diretrizes da Interface Web.

Como Funciona

  1. Obtenha as diretrizes mais recentes do URL de origem abaixo
  2. Leia os arquivos especificados (ou solicite ao usuário arquivos/padrão)
  3. Verifique contra todas as regras nas diretrizes obtidas
  4. Apresente os achados no formato conciso file:line

Origem das Diretrizes

Obtenha 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 fornece um argumento de arquivo ou padrão:

  1. Obtenha as diretrizes do URL de origem acima
  2. Leia os arquivos especificados
  3. Aplique todas as regras das diretrizes obtidas
  4. Apresente os achados usando o formato especificado nas diretrizes

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

Quando Usar

Esta habilidade é aplicável para executar o fluxo de trabalho ou as ações descritas na visão geral.

Limitações

  • Use esta habilidade apenas quando a tarefa corresponder claramente ao escopo descrito acima.
  • Não trate a saída como um substituto para validação específica do ambiente, testes ou revisão especializada.
  • Pare e peça esclarecimentos se os inputs necessários, permissões, limites de segurança ou critérios de sucesso estiverem ausentes.
Perguntas frequentes

O que são 'Web Interface Guidelines'?

São um conjunto de regras e melhores práticas para criar interfaces de usuário na web, garantindo consistência e usabilidade.

O que significa 'terse `file:line` format'?

É um formato de relatório simples que indica o nome do arquivo e o número da linha onde um problema foi encontrado.

Posso usar isso para testar meu site inteiro?

Esta ferramenta é para verificar arquivos específicos de acordo com as regras. Ela não substitui testes completos ou revisão de especialistas.

Detalhes

Descrição original do autor

Review files for compliance with Web Interface Guidelines.

repo: sickn33/agentic-awesome-skills

Popularidade

Estrelas no GitHub
48 mil
Posição no ranking
#4539
Licença
MIT
Atualizada em
15/10/2026

Essa skill é útil?

0

Entre para votar.

Comentários

  • …

Mais skills deste repositório

Skills parecidas